aw-front-helpers 2.5.25 → 2.5.27

package/classes/credits.js

@@ -0,0 +1,76 @@
+import { gsap } from "gsap";
+import { SplitText } from "gsap/SplitText";
+
+export default class Credits {
+  constructor() {
+    gsap.registerPlugin(SplitText);
+    this._pattern = [
+      '\u0041\u0072\u0072\u006f\u0077\u0055\u0070',
+      '\u0041\u0072\u0072\u006f\u0077\u0055\u0070',
+      '\u0041\u0072\u0072\u006f\u0077\u0044\u006f\u0077\u006e',
+      '\u0041\u0072\u0072\u006f\u0077\u0044\u006f\u0077\u006e',
+      '\u0041\u0072\u0072\u006f\u0077\u004c\u0065\u0066\u0074',
+      '\u0041\u0072\u0072\u006f\u0077\u0052\u0069\u0067\u0068\u0074',
+      '\u0041\u0072\u0072\u006f\u0077\u004c\u0065\u0066\u0074',
+      '\u0041\u0072\u0072\u006f\u0077\u0052\u0069\u0067\u0068\u0074',
+      '\u0062',
+      '\u0061'
+    ].reverse();
+    this._current = 0;
+    this._createBounds();
+    this._addEvents();
+  }
+
+  _onKeyDown(pEvt) {
+    if (this._pattern.indexOf(pEvt.key) < 0 || pEvt.key !== this._pattern[this._current]) {
+      this._current = 0;
+      return;
+    }
+    this._current++;
+    if (this._pattern.length === this._current) {
+      this._current = 0;
+      this._launch()
+    }
+  }
+
+  _createBounds() {
+    ['_onKeyDown'].forEach(
+      fn => (this[fn] = this[fn].bind(this))
+    );
+  }
+
+  _launch() {
+    const wrapper = document.createElement('div');
+    const text = document.createElement('p');
+    document.body.appendChild(wrapper);
+    wrapper.appendChild(text);
+    text.innerHTML = `\u0059\u006f\u0061\u006e\u006e\u0020\u004c\u0065\u0020\u0050\u002e\u0020\u0066\u006f\u0072\u0020\u0041\u0057\u0020\u0053\u0074\u0075\u0064\u0069\u006f\u003c\u0062\u0072\u003e\u003c\u0073\u006d\u0061\u006c\u006c\u003e\u0063\u0072\u0065\u0064\u0069\u0074\u0073\u0040\u0074\u006f\u0075\u0074\u0061\u0063\u006c\u0069\u0063\u002e\u0063\u006f\u006d\u003c\u002f\u0073\u006d\u0061\u006c\u006c\u003e`;
+    const split = SplitText.create(text, { type: "words, chars" });
+    gsap.set(text, {
+      fontSize: '20px'
+    });
+    gsap.set(wrapper, {
+      backgroundColor: '#001e2e',
+      position: 'fixed',
+      top: 0,
+      bottom: 0,
+      left: 0,
+      right: 0,
+      opacity: 0,
+      display: 'flex',
+      color: '#fff',
+      alignItems: 'center',
+      justifyContent: 'center',
+      textAlign: 'center',
+      lineHeight: 1.1,
+      zIndex: 100
+    });
+    gsap.to(wrapper, { duration: 1, opacity: 1});
+    gsap.from(split.chars, { delay: .6, duration: .3, x: 5, autoAlpha: 0, stagger: .07 });
+    wrapper.addEventListener('click', () => { wrapper.remove() }, { once: true });
+  }
+
+  _addEvents() {
+    window.addEventListener('keydown', this._onKeyDown);
+  }
+}

package/index.js

@@ -2,6 +2,7 @@ import GParallax from './classes/globalParallax'
 import Nearby from './classes/nearby'
 import FormControl from './classes/formControl'
 import Sticky from './classes/sticky'
+import Credits from './classes/credits'
 import BootstraperMaps from './bootstraper/maps'
 import BootstraperYoutube from './bootstraper/youtube'
 import  * as utils from './utils'
@@ -11,6 +12,7 @@ export {
   Nearby,
   FormControl,
   Sticky,
+  Credits,
   BootstraperMaps,
   BootstraperYoutube,
   utils

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aw-front-helpers",
-  "version": "2.5.25",
+  "version": "2.5.27",
   "description": "Assets helpers for projects",
   "author": "Yoann Le Poupon",
   "license": "ISC",
@@ -14,6 +14,6 @@
     "es6-symbol": "^3.1.3",
     "exif-js": "^2.3.0",
     "debounce": "^1.2.1",
-    "gsap": "^3.12.3"
+    "gsap": "^3.13.0"
   }
 }