amplify

2019-06-29 15:58:48 +10:00
parent b8fb2a5901
commit 9120a1e92f
3 changed files with 6 additions and 70 deletions
@@ -1,58 +0,0 @@
-const preact = require('preact');
-const { Component } = require('preact');
-
-const anime = require('animejs').default;
-
-class Amplify extends Component {
-    constructor() {
-        super();
-        this.id = Math.random();
-    }
-
-    render() {
-        const path = 'M0,100 C100,-200 100,400 200,100';
-
-        return (
-            <svg
-                class='skill-animation blue'
-                version="1.1"
-                id="amplify"
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 200 200">
-                <filter id="ampFilter">
-                    <feTurbulence type="turbulence" baseFrequency="0.4" numOctaves="2" result="turbulence" style="transform: scale(1);"></feTurbulence>
-                    <feDisplacementMap in2="turbulence" in="SourceGraphic" scale="2" xChannelSelector="R" yChannelSelector="G"></feDisplacementMap>
-                </filter>
-                <path filter='url("#ampFilter")' d={path} />
-            </svg>
-        );
-    }
-
-    componentDidMount() {
-        const altPath = 'M0,100 C100,400 100,-200 200,100';
-        anime({
-            targets: '#amplify path',
-            d: [{ value: altPath }],
-            stroke: ['#a52a2a', '#3498db'],
-            duration: 1000,
-            loop: true,
-            direction: 'alternate',
-            easing: 'easeInOutSine',
-        });
-
-        anime({
-            targets: ['#ampFilter feTurbulence', '#ampFilter feDisplacementMap'],
-            baseFrequency: 0.15,
-            scale: 4,
-            loop: true,
-            direction: 'alternate',
-            easing: 'easeInOutExpo',
-        });
-
-    }
-
-    componentWillUnmount() {
-    }
-}
-
-module.exports = Amplify;