482 lines
372 KiB
JavaScript
482 lines
372 KiB
JavaScript
|
/******/ (function() { // webpackBootstrap
|
||
|
|
/******/ var __webpack_modules__ = ({
|
||
|
|
|
||
|
|
/***/ "./node_modules/circletype/dist/circletype.min.js":
|
||
|
|
/*!********************************************************!*\
|
||
|
|
!*** ./node_modules/circletype/dist/circletype.min.js ***!
|
||
|
|
\********************************************************/
|
||
|
|
/***/ (function(module) {
|
||
|
|
|
||
|
|
/*!
|
||
|
|
* circletype 2.3.0
|
||
|
|
* A JavaScript library that lets you curve type on the web.
|
||
|
|
* Copyright © 2014-2018 Peter Hrynkow
|
||
|
|
* Licensed MIT
|
||
|
|
* https://github.com/peterhry/CircleType#readme
|
||
|
|
*/
|
||
|
|
!function(t,e){ true?module.exports=e():0}("undefined"!=typeof self?self:this,function(){return function(t){function e(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return t[r].call(i.exports,i,i.exports,e),i.l=!0,i.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=29)}([function(t,e,n){var r=n(24)("wks"),i=n(12),o=n(1).Symbol,u="function"==typeof o;(t.exports=function(t){return r[t]||(r[t]=u&&o[t]||(u?o:i)("Symbol."+t))}).store=r},function(t,e){var n=t.exports="undefined"!=typeof window&&window.Math==Math?window:"undefined"!=typeof self&&self.Math==Math?self:Function("return this")();"number"==typeof __g&&(__g=n)},function(t,e){var n=t.exports={version:"2.5.6"};"number"==typeof __e&&(__e=n)},function(t,e,n){var r=n(4),i=n(11);t.exports=n(6)?function(t,e,n){return r.f(t,e,i(1,n))}:function(t,e,n){return t[e]=n,t}},function(t,e,n){var r=n(5),i=n(34),o=n(35),u=Object.defineProperty;e.f=n(6)?Object.defineProperty:function(t,e,n){if(r(t),e=o(e,!0),r(n),i)try{return u(t,e,n)}catch(t){}if("get"in n||"set"in n)throw TypeError("Accessors not supported!");return"value"in n&&(t[e]=n.value),t}},function(t,e,n){var r=n(10);t.exports=function(t){if(!r(t))throw TypeError(t+" is not an object!");return t}},function(t,e,n){t.exports=!n(17)(function(){return 7!=Object.defineProperty({},"a",{get:function(){return 7}}).a})},function(t,e){var n={}.hasOwnProperty;t.exports=function(t,e){return n.call(t,e)}},function(t,e){var n=Math.ceil,r=Math.floor;t.exports=function(t){return isNaN(t=+t)?0:(t>0?r:n)(t)}},function(t,e){t.exports=function(t){if(void 0==t)throw TypeError("Can't call method on "+t);return t}},function(t,e){t.exports=function(t){return"object"==typeof t?null!==t:"function"==typeof t}},function(t,e){t.exports=function(t,e){return{enumerable:!(1&t),configurable:!(2&t),writable:!(4&t),value:e}}},function(t,e){var n=0,r=Math.random();t.exports=function(t){return"Symbol(".concat(void 0===t?"":t,")_",(++n+r).toString(36))}},function(t,e){t.exports={}},function(t,e,n){var r=n(24)("keys"),i=n(12);t.exports=function(t){return r[t]||(r[t]=i(t))}},function(t,e){t.exports=!1},function(t,e,n){var r=n(1),i=n(2),o=n(3),u=n(19),c=n(20),f=function(t,e,n){var a,s,l,p,h=t&f.F,d=t&f.G,v=t&f.S,y=t&f.P,_=t&f.B,m=d?r:v?r[e]||(r[e]={}):(r[e]||{}).prototype,g=d?i:i[e]||(i[e]={}),x=g.prototype||(g.prototype={});d&&(n=e);for(a in n)s=!h&&m&&void 0!==m[a],l=(s?m:n)[a],p=_&&s?c(l,r):y&&"function"==typeof l?c(Function.call,l):l,m&&u(m,a,l,t&f.U),g[a]!=l&&o(g,a,p),y&&x[a]!=l&&(x[a]=l)};r.core=i,f.F=1,f.G=2,f.S=4,f.P=8,f.B=16,f.W=32,f.U=64,f.R=128,t.exports=f},function(t,e){t.exports=function(t){try{return!!t()}catch(t){return!0}}},function(t,e,n){var r=n(10),i=n(1).document,o=r(i)&&r(i.createElement);t.exports=function(t){return o?i.createElement(t):{}}},function(t,e,n){var r=n(1),i=n(3),o=n(7),u=n(12)("src"),c=Function.toString,f=(""+c).split("toString");n(2).inspectSource=function(t){return c.call(t)},(t.exports=function(t,e,n,c){var a="function"==typeof n;a&&(o(n,"name")||i(n,"name",e)),t[e]!==n&&(a&&(o(n,u)||i(n,u,t[e]?""+t[e]:f.join(String(e)))),t===r?t[e]=n:c?t[e]?t[e]=n:i(t,e,n):(delete t[e],i(t,e,n)))})(Function.prototype,"toString",function(){return"function"==typeof this&&this[u]||c.call(this)})},function(t,e,n){var r=n(36);t.exports=function(t,e,n){if(r(t),void 0===e)return t;switch(n){case 1:return function(n){return t.call(e,n)};case 2:return function(n,r){return t.call(e,n,r)};case 3:return function(n,r,i){return t.call(e,n,r,i)}}return function(){return t.apply(e,arguments)}}},function(t,e,n){var r=n(42),i=n(9);t.exports=function(t){return r(i(t))}},function(t,e){var n={}.toString;t.exports=function(t){return n.call(t).slice(8,-1)}},function(t,e,n){var r=n(8),i=Math.min;t.exports=function(t){return t>0?i(r(t),9007199254740991):0}},function(t,e,n){var r=n(
|
||
|
|
|
||
|
|
/***/ }),
|
||
|
|
|
||
|
|
/***/ "./node_modules/plyr/dist/plyr.min.js":
|
||
|
|
/*!********************************************!*\
|
||
|
|
!*** ./node_modules/plyr/dist/plyr.min.js ***!
|
||
|
|
\********************************************/
|
||
|
|
/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
|
||
|
|
|
||
|
|
"object"==typeof navigator&&function(e,t){ true?module.exports=t():0}(this,(function(){"use strict";function e(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function t(e,t){for(var i=0;i<t.length;i++){var s=t[i];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,s.key,s)}}function i(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function s(e,t){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);t&&(s=s.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),i.push.apply(i,s)}return i}function n(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?s(Object(n),!0).forEach((function(t){i(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):s(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var a={addCSS:!0,thumbWidth:15,watch:!0};function l(e,t){return function(){return Array.from(document.querySelectorAll(t)).includes(this)}.call(e,t)}var o=function(e){return null!=e?e.constructor:null},r=function(e,t){return!!(e&&t&&e instanceof t)},c=function(e){return null==e},h=function(e){return o(e)===Object},u=function(e){return o(e)===String},d=function(e){return Array.isArray(e)},m=function(e){return r(e,NodeList)},p=u,g=d,f=m,b=function(e){return r(e,Element)},y=function(e){return r(e,Event)},v=function(e){return c(e)||(u(e)||d(e)||m(e))&&!e.length||h(e)&&!Object.keys(e).length};function w(e,t){if(1>t){var i=function(e){var t="".concat(e).match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);return t?Math.max(0,(t[1]?t[1].length:0)-(t[2]?+t[2]:0)):0}(t);return parseFloat(e.toFixed(i))}return Math.round(e/t)*t}var T=function(){function e(t,i){(function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")})(this,e),b(t)?this.element=t:p(t)&&(this.element=document.querySelector(t)),b(this.element)&&v(this.element.rangeTouch)&&(this.config=n({},a,{},i),this.init())}return function(e,i,s){i&&t(e.prototype,i),s&&t(e,s)}(e,[{key:"init",value:function(){e.enabled&&(this.config.addCSS&&(this.element.style.userSelect="none",this.element.style.webKitUserSelect="none",this.element.style.touchAction="manipulation"),this.listeners(!0),this.element.rangeTouch=this)}},{key:"destroy",value:function(){e.enabled&&(this.config.addCSS&&(this.element.style.userSelect="",this.element.style.webKitUserSelect="",this.element.style.touchAction=""),this.listeners(!1),this.element.rangeTouch=null)}},{key:"listeners",value:function(e){var t=this,i=e?"addEventListener":"removeEventListener";["touchstart","touchmove","touchend"].forEach((function(e){t.element[i](e,(function(e){return t.set(e)}),!1)}))}},{key:"get",value:function(t){if(!e.enabled||!y(t))return null;var i,s=t.target,n=t.changedTouches[0],a=parseFloat(s.getAttribute("min"))||0,l=parseFloat(s.getAttribute("max"))||100,o=parseFloat(s.getAttribute("step"))||1,r=s.getBoundingClientRect(),c=100/r.width*(this.config.thumbWidth/2)/100;return 0>(i=100/r.width*(n.clientX-r.left))?i=0:100<i&&(i=100),50>i?i-=(100-2*i)*c:50<i&&(i+=2*(i-50)*c),a+w(i/100*(l-a),o)}},{key:"set",value:function(t){e.enabled&&y(t)&&!t.target.disabled&&(t.preventDefault(),t.target.value=this.get(t),function(e,t){if(e&&t){var i=new Event(t,{bubbles:!0});e.dispatchEvent(i)}}(t.target,"touchend"===t.type?"change":"input"))}}],[{key:"setup",value:function(t){var i=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{},s=null;if(v(t)||p(t)?s=Array.from(document.querySelectorAll(p(t)?t:'input[type="range"]')):b(t)?s=[t]:f(t)?s=Array.from(t):g(t)&&(s=t.filter(b)),v(s))return null;var o=n({},a,{},i);if(p(t)&&o.watch){var r=new MutationObserver((function(i){Array.from(i).forEach((function(i){Array.from(i.addedNodes).forEach((function(i){b(i)&&l(i,t)&&new e(i,o)}))}))}));r.observe(document.body,{childList:!0,subtree:!0})}return s.map((function(
|
||
|
|
//# sourceMappingURL=plyr.min.js.map
|
||
|
|
|
||
|
|
|
||
|
|
/***/ })
|
||
|
|
|
||
|
|
/******/ });
|
||
|
|
/************************************************************************/
|
||
|
|
/******/ // The module cache
|
||
|
|
/******/ var __webpack_module_cache__ = {};
|
||
|
|
/******/
|
||
|
|
/******/ // The require function
|
||
|
|
/******/ function __webpack_require__(moduleId) {
|
||
|
|
/******/ // Check if module is in cache
|
||
|
|
/******/ var cachedModule = __webpack_module_cache__[moduleId];
|
||
|
|
/******/ if (cachedModule !== undefined) {
|
||
|
|
/******/ return cachedModule.exports;
|
||
|
|
/******/ }
|
||
|
|
/******/ // Create a new module (and put it into the cache)
|
||
|
|
/******/ var module = __webpack_module_cache__[moduleId] = {
|
||
|
|
/******/ // no module.id needed
|
||
|
|
/******/ // no module.loaded needed
|
||
|
|
/******/ exports: {}
|
||
|
|
/******/ };
|
||
|
|
/******/
|
||
|
|
/******/ // Execute the module function
|
||
|
|
/******/ __webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);
|
||
|
|
/******/
|
||
|
|
/******/ // Return the exports of the module
|
||
|
|
/******/ return module.exports;
|
||
|
|
/******/ }
|
||
|
|
/******/
|
||
|
|
/************************************************************************/
|
||
|
|
/******/ /* webpack/runtime/compat get default export */
|
||
|
|
/******/ !function() {
|
||
|
|
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
||
|
|
/******/ __webpack_require__.n = function(module) {
|
||
|
|
/******/ var getter = module && module.__esModule ?
|
||
|
|
/******/ function() { return module['default']; } :
|
||
|
|
/******/ function() { return module; };
|
||
|
|
/******/ __webpack_require__.d(getter, { a: getter });
|
||
|
|
/******/ return getter;
|
||
|
|
/******/ };
|
||
|
|
/******/ }();
|
||
|
|
/******/
|
||
|
|
/******/ /* webpack/runtime/define property getters */
|
||
|
|
/******/ !function() {
|
||
|
|
/******/ // define getter functions for harmony exports
|
||
|
|
/******/ __webpack_require__.d = function(exports, definition) {
|
||
|
|
/******/ for(var key in definition) {
|
||
|
|
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
||
|
|
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
||
|
|
/******/ }
|
||
|
|
/******/ }
|
||
|
|
/******/ };
|
||
|
|
/******/ }();
|
||
|
|
/******/
|
||
|
|
/******/ /* webpack/runtime/global */
|
||
|
|
/******/ !function() {
|
||
|
|
/******/ __webpack_require__.g = (function() {
|
||
|
|
/******/ if (typeof globalThis === 'object') return globalThis;
|
||
|
|
/******/ try {
|
||
|
|
/******/ return this || new Function('return this')();
|
||
|
|
/******/ } catch (e) {
|
||
|
|
/******/ if (typeof window === 'object') return window;
|
||
|
|
/******/ }
|
||
|
|
/******/ })();
|
||
|
|
/******/ }();
|
||
|
|
/******/
|
||
|
|
/******/ /* webpack/runtime/hasOwnProperty shorthand */
|
||
|
|
/******/ !function() {
|
||
|
|
/******/ __webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
|
||
|
|
/******/ }();
|
||
|
|
/******/
|
||
|
|
/******/ /* webpack/runtime/make namespace object */
|
||
|
|
/******/ !function() {
|
||
|
|
/******/ // define __esModule on exports
|
||
|
|
/******/ __webpack_require__.r = function(exports) {
|
||
|
|
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
|
||
|
|
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
||
|
|
/******/ }
|
||
|
|
/******/ Object.defineProperty(exports, '__esModule', { value: true });
|
||
|
|
/******/ };
|
||
|
|
/******/ }();
|
||
|
|
/******/
|
||
|
|
/************************************************************************/
|
||
|
|
var __webpack_exports__ = {};
|
||
|
|
// This entry need to be wrapped in an IIFE because it need to be in strict mode.
|
||
|
|
!function() {
|
||
|
|
"use strict";
|
||
|
|
/*!**************************!*\
|
||
|
|
!*** ./assets/js/app.js ***!
|
||
|
|
\**************************/
|
||
|
|
__webpack_require__.r(__webpack_exports__);
|
||
|
|
/* harmony import */ var plyr__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! plyr */ "./node_modules/plyr/dist/plyr.min.js");
|
||
|
|
/* harmony import */ var plyr__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(plyr__WEBPACK_IMPORTED_MODULE_0__);
|
||
|
|
/* harmony import */ var circletype__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! circletype */ "./node_modules/circletype/dist/circletype.min.js");
|
||
|
|
/* harmony import */ var circletype__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(circletype__WEBPACK_IMPORTED_MODULE_1__);
|
||
|
|
|
||
|
|
// ----------------------------------------------------------------------------
|
||
|
|
// DATA
|
||
|
|
// ----------------------------------------------------------------------------
|
||
|
|
|
||
|
|
const root = document.documentElement; // HOME NAVIGATION DISPLAY //
|
||
|
|
|
||
|
|
const navEl = document.querySelector('.home__nav');
|
||
|
|
const navLinks = document.querySelectorAll('.home__nav-link');
|
||
|
|
const navImage = document.querySelector('.home__nav-image');
|
||
|
|
const circleTypes = []; // VIDEO PLAYERS //
|
||
|
|
|
||
|
|
const galleryVideos = document.querySelectorAll('.gallery__video');
|
||
|
|
let videoPlayers = []; // HEADER BAR ANIMATION //
|
||
|
|
|
||
|
|
const headerBar = document.querySelector('.header-bar');
|
||
|
|
const headerLogo = document.querySelector('.header-bar__logo');
|
||
|
|
let scrollOffset = 0; // NAVIGATION MENU ANIMATION //
|
||
|
|
|
||
|
|
const headerNavBtn = document.querySelector('.header-bar__nav-button');
|
||
|
|
const headerNavMenu = document.querySelector('.header-bar__nav-menu');
|
||
|
|
const headerNavMenuListEls = document.querySelectorAll('.header-bar__nav-menu li');
|
||
|
|
const headerNavOverlay = document.querySelector('.header-bar__nav-overlay');
|
||
|
|
const touchPosition = {
|
||
|
|
initialX: null,
|
||
|
|
initialY: null
|
||
|
|
}; // ----------------------------------------------------------------------------
|
||
|
|
// UTILS
|
||
|
|
// ----------------------------------------------------------------------------
|
||
|
|
// Convert rem to pixels by getting font-size CSS property
|
||
|
|
|
||
|
|
function convertRemToPixels(rem) {
|
||
|
|
let fontSize = parseFloat(window.getComputedStyle(document.body).getPropertyValue('font-size'));
|
||
|
|
return rem * fontSize;
|
||
|
|
} // ----------------------------------------------------------------------------
|
||
|
|
// LOGIC
|
||
|
|
// ----------------------------------------------------------------------------
|
||
|
|
// HOME NAVIGATION DISPLAY //
|
||
|
|
// Calculate navigation grid inner width
|
||
|
|
|
||
|
|
|
||
|
|
function calculateNavGridInnerWidth() {
|
||
|
|
if (root && navImage) {
|
||
|
|
let navGridGapProperty = window.getComputedStyle(root).getPropertyValue('--home-nav-gap');
|
||
|
|
let navGridGap = parseFloat(navGridGapProperty.slice(0, -3));
|
||
|
|
return navImage.getBoundingClientRect().width + convertRemToPixels(navGridGap) * 2;
|
||
|
|
}
|
||
|
|
} // Calculate navigation grid inner diagonal
|
||
|
|
|
||
|
|
|
||
|
|
function calculateNavGridInnerDiagonal() {
|
||
|
|
return calculateNavGridInnerWidth() * Math.sqrt(2);
|
||
|
|
} // Create new instance of CircleType for each navigation link, set radius and direction
|
||
|
|
|
||
|
|
|
||
|
|
function curveNavLinks() {
|
||
|
|
if (navLinks.length !== 0 && circleTypes) {
|
||
|
|
for (let i = 0; i < navLinks.length - 2; i++) {
|
||
|
|
circleTypes[i] = new (circletype__WEBPACK_IMPORTED_MODULE_1___default())(navLinks[i]);
|
||
|
|
circleTypes[i].radius(calculateNavGridInnerWidth() / 2);
|
||
|
|
}
|
||
|
|
|
||
|
|
for (let i = navLinks.length - 2; i < navLinks.length; i++) {
|
||
|
|
circleTypes[i] = new (circletype__WEBPACK_IMPORTED_MODULE_1___default())(navLinks[i]);
|
||
|
|
circleTypes[i].dir(-1);
|
||
|
|
circleTypes[i].radius(calculateNavGridInnerWidth() / 2);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} // Set --home-nav-item-translation CSS property
|
||
|
|
|
||
|
|
|
||
|
|
function setNavItemTranslationProperty() {
|
||
|
|
let navItemTranslation = (calculateNavGridInnerDiagonal() - calculateNavGridInnerWidth()) / 2;
|
||
|
|
|
||
|
|
if (root) {
|
||
|
|
root.style.setProperty('--home-nav-item-translation', navItemTranslation + 'px');
|
||
|
|
}
|
||
|
|
} // Set navigation grid display depending on number of links
|
||
|
|
|
||
|
|
|
||
|
|
function setNavGridDisplay() {
|
||
|
|
if (navEl && navLinks.length !== 0) {
|
||
|
|
if (navLinks.length === 2) {
|
||
|
|
navEl.classList.add('home__nav--2-items');
|
||
|
|
} else if (navLinks.length === 3) {
|
||
|
|
navEl.classList.add('home__nav--3-items');
|
||
|
|
} else if (navLinks.length === 4) {
|
||
|
|
navEl.classList.add('home__nav--4-items');
|
||
|
|
}
|
||
|
|
|
||
|
|
for (let i = 0; i < navLinks.length; i++) {
|
||
|
|
navLinks[i].classList.add('home__nav-link--visible');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} // Edit navigation links radius and translation on window resize event
|
||
|
|
|
||
|
|
|
||
|
|
function editNavLinksOnResize() {
|
||
|
|
window.addEventListener('resize', function (e) {
|
||
|
|
if (navLinks.length !== 0 && circleTypes) {
|
||
|
|
for (let i = 0; i < navLinks.length; i++) {
|
||
|
|
circleTypes[i].radius(calculateNavGridInnerWidth() / 2);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
setNavItemTranslationProperty();
|
||
|
|
});
|
||
|
|
} // Add wave up animation to a single letter and remove it on animationend event
|
||
|
|
|
||
|
|
|
||
|
|
function waveNavLetterUp(navLetter) {
|
||
|
|
navLetter.classList.add('home__nav-letter--wave-up');
|
||
|
|
navLetter.addEventListener('animationend', function (e) {
|
||
|
|
navLetter.classList.remove('home__nav-letter--wave-up');
|
||
|
|
});
|
||
|
|
} // Add wave down animation to a single letter and remove it on animationend event
|
||
|
|
|
||
|
|
|
||
|
|
function waveNavLetterDown(navLetter) {
|
||
|
|
navLetter.classList.add('home__nav-letter--wave-down');
|
||
|
|
navLetter.addEventListener('animationend', function (e) {
|
||
|
|
navLetter.classList.remove('home__nav-letter--wave-down');
|
||
|
|
});
|
||
|
|
} // Add wave up animation to every letters of a single link with a slight delay
|
||
|
|
|
||
|
|
|
||
|
|
function waveNavLinkUp(navLink) {
|
||
|
|
let navLinkLetters = navLink.querySelectorAll('span');
|
||
|
|
let animationDelay = 0;
|
||
|
|
|
||
|
|
for (let i = 0; i < navLinkLetters.length; i++) {
|
||
|
|
setTimeout(waveNavLetterUp, animationDelay, navLinkLetters[i]);
|
||
|
|
animationDelay += 50;
|
||
|
|
}
|
||
|
|
} // Add wave down animation to every letters of a single link with a slight delay
|
||
|
|
|
||
|
|
|
||
|
|
function waveNavLinkDown(navLink) {
|
||
|
|
let navLinkLetters = navLink.querySelectorAll('span');
|
||
|
|
let animationDelay = 0;
|
||
|
|
|
||
|
|
for (let i = 0; i < navLinkLetters.length; i++) {
|
||
|
|
setTimeout(waveNavLetterDown, animationDelay, navLinkLetters[i]);
|
||
|
|
animationDelay += 50;
|
||
|
|
}
|
||
|
|
} // Add wave (up or down) animation to every letters of each link on mouseover event
|
||
|
|
|
||
|
|
|
||
|
|
function waveNavLinksOnHover() {
|
||
|
|
if (navLinks.length !== 0) {
|
||
|
|
for (let i = 0; i < navLinks.length - 2; i++) {
|
||
|
|
navLinks[i].addEventListener('mouseover', function (e) {
|
||
|
|
waveNavLinkUp(navLinks[i]);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
for (let i = navLinks.length - 2; i < navLinks.length; i++) {
|
||
|
|
navLinks[i].addEventListener('mouseover', function (e) {
|
||
|
|
waveNavLinkDown(navLinks[i]);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} // VIDEO PLAYERS //
|
||
|
|
// Set up Plyr video players
|
||
|
|
|
||
|
|
|
||
|
|
function setUpVideoPlayers() {
|
||
|
|
if (galleryVideos.length !== 0) {
|
||
|
|
videoPlayers = plyr__WEBPACK_IMPORTED_MODULE_0___default().setup(galleryVideos, {
|
||
|
|
controls: ['play-large', 'play', 'progress', 'current-time', 'duration', 'mute', 'volume', 'fullscreen'],
|
||
|
|
i18n: {
|
||
|
|
play: 'Lire',
|
||
|
|
pause: 'Mettre sur pause',
|
||
|
|
seek: 'Parcourir la piste audio',
|
||
|
|
currentTime: 'Temps écoulé depuis le début de la piste audio',
|
||
|
|
duration: 'Durée de la piste audio',
|
||
|
|
volume: 'Ajuster le volume',
|
||
|
|
mute: 'Couper le son',
|
||
|
|
unmute: 'Activer le son',
|
||
|
|
enterFullscreen: 'Activer le mode plein écran',
|
||
|
|
exitFullscreen: 'Quitter le mode plein écran'
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
} // Toggle videos full screen mode on Plyr enterfullscreen and exitfullscreen media events
|
||
|
|
|
||
|
|
|
||
|
|
function toggleVideosFullScreen() {
|
||
|
|
if (videoPlayers.length !== 0) {
|
||
|
|
for (let i = 0; i < videoPlayers.length; i++) {
|
||
|
|
videoPlayers[i].on('enterfullscreen', function (e) {
|
||
|
|
galleryVideos[i].classList.add('gallery__video--full-screen');
|
||
|
|
});
|
||
|
|
videoPlayers[i].on('exitfullscreen', function (e) {
|
||
|
|
galleryVideos[i].classList.remove('gallery__video--full-screen');
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} // HEADER BAR ANIMATION //
|
||
|
|
// Toggle header bar depending on scroll offset
|
||
|
|
|
||
|
|
|
||
|
|
function toggleHeaderBar() {
|
||
|
|
if (headerBar && headerLogo) {
|
||
|
|
let headerBarHeight = headerBar.getBoundingClientRect().height;
|
||
|
|
|
||
|
|
if (window.pageYOffset > headerBarHeight) {
|
||
|
|
// Scroll down past header bar height
|
||
|
|
headerBar.classList.add('header-bar--fixed');
|
||
|
|
headerLogo.classList.add('header-bar__logo--small');
|
||
|
|
} else if (window.pageYOffset <= 0) {
|
||
|
|
headerBar.classList.remove('header-bar--fixed');
|
||
|
|
headerLogo.classList.remove('header-bar__logo--small');
|
||
|
|
headerBar.classList.remove('header-bar--visible');
|
||
|
|
}
|
||
|
|
|
||
|
|
if (headerBar.classList.contains('header-bar--fixed')) {
|
||
|
|
if (scrollOffset < window.pageYOffset) {
|
||
|
|
// Scroll down
|
||
|
|
headerBar.classList.remove('header-bar--visible');
|
||
|
|
} else if (scrollOffset > window.pageYOffset) {
|
||
|
|
// Scroll up
|
||
|
|
headerBar.classList.add('header-bar--visible');
|
||
|
|
}
|
||
|
|
|
||
|
|
scrollOffset = window.pageYOffset;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} // NAVIGATION MENU ANIMATION //
|
||
|
|
// Toggle header navigation
|
||
|
|
|
||
|
|
|
||
|
|
function toggleHeaderNav() {
|
||
|
|
if (headerNavBtn && headerNavMenu) {
|
||
|
|
headerNavBtn.classList.toggle('header-bar__nav-button--custom-focus');
|
||
|
|
headerNavMenu.classList.toggle('header-bar__nav-menu--visible');
|
||
|
|
headerNavOverlay.classList.toggle('header-bar__nav-overlay--visible');
|
||
|
|
document.body.classList.toggle('body--hidden-overflow-y');
|
||
|
|
}
|
||
|
|
} // Open header navigation
|
||
|
|
|
||
|
|
|
||
|
|
function openHeaderNav() {
|
||
|
|
if (headerNavBtn && headerNavMenu) {
|
||
|
|
headerNavBtn.classList.add('header-bar__nav-button--custom-focus');
|
||
|
|
headerNavMenu.classList.add('header-bar__nav-menu--visible');
|
||
|
|
headerNavOverlay.classList.add('header-bar__nav-overlay--visible');
|
||
|
|
document.body.classList.add('body--hidden-overflow-y');
|
||
|
|
}
|
||
|
|
} // Close header navigation
|
||
|
|
|
||
|
|
|
||
|
|
function closeHeaderNav() {
|
||
|
|
if (headerNavBtn && headerNavMenu) {
|
||
|
|
headerNavBtn.classList.remove('header-bar__nav-button--custom-focus');
|
||
|
|
headerNavMenu.classList.remove('header-bar__nav-menu--visible');
|
||
|
|
headerNavOverlay.classList.remove('header-bar__nav-overlay--visible');
|
||
|
|
document.body.classList.remove('body--hidden-overflow-y');
|
||
|
|
}
|
||
|
|
} // Toggle header navigation on button click event
|
||
|
|
|
||
|
|
|
||
|
|
function toggleHeaderNavOnClick() {
|
||
|
|
headerNavBtn.addEventListener('click', toggleHeaderNav);
|
||
|
|
} // Close header navigation on document click event
|
||
|
|
|
||
|
|
|
||
|
|
function closeHeaderNavOnClick() {
|
||
|
|
document.addEventListener('click', function (e) {
|
||
|
|
if (headerNavBtn.classList.contains('header-bar__nav-button--custom-focus') && headerNavMenu.classList.contains('header-bar__nav-menu--visible') && !headerNavBtn.contains(e.target) && !headerNavMenu.contains(e.target)) {
|
||
|
|
closeHeaderNav(e);
|
||
|
|
|
||
|
|
if (e.cancelable) {
|
||
|
|
e.preventDefault();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
} // Open header navigation on menu list focusin event
|
||
|
|
|
||
|
|
|
||
|
|
function openHeaderNavBeforeFocus() {
|
||
|
|
if (headerNavMenuListEls) {
|
||
|
|
for (let i = 0; i < headerNavMenuListEls.length; i++) {
|
||
|
|
headerNavMenuListEls[i].addEventListener('focusin', openHeaderNav);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} // Close header navigation on menu list focusout event
|
||
|
|
|
||
|
|
|
||
|
|
function closeHeaderNavAfterFocus() {
|
||
|
|
if (headerNavMenuListEls) {
|
||
|
|
for (let i = 0; i < headerNavMenuListEls.length; i++) {
|
||
|
|
headerNavMenuListEls[i].addEventListener('focusout', closeHeaderNav);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} // Close header navigation on touchstart and touchmove events (swipe right)
|
||
|
|
|
||
|
|
|
||
|
|
function closeHeaderNavOnSwipe() {
|
||
|
|
headerNavMenu.addEventListener('touchstart', function (e) {
|
||
|
|
if (headerNavBtn.classList.contains('header-bar__nav-button--custom-focus') && headerNavMenu.classList.contains('header-bar__nav-menu--visible') && touchPosition.initialX === null && touchPosition.initialY === null) {
|
||
|
|
touchPosition.initialX = event.touches[0].clientX;
|
||
|
|
touchPosition.initialY = event.touches[0].clientY;
|
||
|
|
}
|
||
|
|
}, {
|
||
|
|
passive: true
|
||
|
|
});
|
||
|
|
headerNavMenu.addEventListener('touchmove', function (e) {
|
||
|
|
if (headerNavBtn.classList.contains('header-bar__nav-button--custom-focus') && headerNavMenu.classList.contains('header-bar__nav-menu--visible') && touchPosition.initialX !== null && touchPosition.initialY !== null) {
|
||
|
|
touchPosition.currentX = event.touches[0].clientX;
|
||
|
|
touchPosition.currentY = event.touches[0].clientY;
|
||
|
|
touchPosition.diffX = touchPosition.initialX - touchPosition.currentX;
|
||
|
|
touchPosition.diffY = touchPosition.initialY - touchPosition.currentY;
|
||
|
|
|
||
|
|
if (Math.abs(touchPosition.diffX) > Math.abs(touchPosition.diffY)) {
|
||
|
|
if (touchPosition.diffX < 0) {
|
||
|
|
closeHeaderNav(e);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
touchPosition.initialX = null;
|
||
|
|
touchPosition.initialY = null;
|
||
|
|
}
|
||
|
|
}, {
|
||
|
|
passive: true
|
||
|
|
});
|
||
|
|
} // ----------------------------------------------------------------------------
|
||
|
|
// PROGRAM
|
||
|
|
// ----------------------------------------------------------------------------
|
||
|
|
// Enable CSS :active pseudo-class in Safari Mobile
|
||
|
|
|
||
|
|
|
||
|
|
document.addEventListener("touchstart", function () {}, false); // HOME NAVIGATION DISPLAY //
|
||
|
|
|
||
|
|
window.addEventListener('load', function () {
|
||
|
|
curveNavLinks();
|
||
|
|
setNavItemTranslationProperty();
|
||
|
|
setNavGridDisplay();
|
||
|
|
editNavLinksOnResize();
|
||
|
|
waveNavLinksOnHover();
|
||
|
|
}); // VIDEO PLAYERS //
|
||
|
|
|
||
|
|
setUpVideoPlayers();
|
||
|
|
toggleVideosFullScreen(); // HEADER BAR ANIMATION //
|
||
|
|
|
||
|
|
document.addEventListener('scroll', function () {
|
||
|
|
toggleHeaderBar();
|
||
|
|
}); // NAVIGATION MENU ANIMATION //
|
||
|
|
|
||
|
|
toggleHeaderNavOnClick();
|
||
|
|
closeHeaderNavOnClick();
|
||
|
|
openHeaderNavBeforeFocus();
|
||
|
|
closeHeaderNavAfterFocus();
|
||
|
|
closeHeaderNavOnSwipe();
|
||
|
|
}();
|
||
|
|
/******/ })()
|
||
|
|
;
|
||
|
|
//# sourceMappingURL=data:application/json;charset=utf-8;base64,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
|