Skip to content

Instantly share code, notes, and snippets.

@julescarbon

julescarbon/plane-site.js

Created April 15, 2016 16:23
Show Gist options
  • Save julescarbon/2416462c06bdd3dc12190bac0e29c7be to your computer and use it in GitHub Desktop.
Save julescarbon/2416462c06bdd3dc12190bac0e29c7be to your computer and use it in GitHub Desktop.
Download ZIP
plane-site.js
Raw
plane-site.js
function _checkMQ() {
MQ = _deviceType();
var e = state.breakpoint;
"mobile" == MQ && (state.breakpoint = "mobile"), "desktop" == MQ && (state.breakpoint = "desktop"), state.breakpoint !== e && _breakpoint()
}
function _deviceType() {
return window.getComputedStyle(document.querySelector("body"), "::before").getPropertyValue("content").replace(/"/g, "").replace(/'/g, "")
}
function getElIndex(e) {
for (var t = 0; e = e.previousElementSibling; t++);
return t
}
function getElementFontSize(e) {
return parseFloat(getComputedStyle(e || document.documentElement).fontSize)
}
function convertEm(e, t) {
return e * getElementFontSize(t)
}
function whichTransitionEvent() {
var e, t = document.createElement("fakeelement"),
a = {
transition: "transitionend",
OTransition: "oTransitionEnd",
MozTransition: "transitionend",
WebkitTransition: "webkitTransitionEnd"
};
for (e in a)
if (void 0 !== t.style[e]) return a[e]
}
function getStyle(e, t) {
var a, r = e.ownerDocument.defaultView;
return r && r.getComputedStyle ? (t = t.replace(/([A-Z])/g, "-$1").toLowerCase(), r.getComputedStyle(e, null).getPropertyValue(t)) : e.currentStyle ? (t = t.replace(/\-(\w)/g, function(e, t) {
return t.toUpperCase()
}), a = e.currentStyle[t], /^\d+(em|pt|%|ex)?$/i.test(a) ? function(t) {
var a = e.style.left,
r = e.runtimeStyle.left;
return e.runtimeStyle.left = e.currentStyle.left, e.style.left = t || 0, t = e.style.pixelLeft + "px", e.style.left = a, e.runtimeStyle.left = r, t
}(a) : a) : void 0
}
function _find(e, t) {
var a, r = e[e.length - 1],
n = e.indexOf(t);
if (~n) return n;
if (t < e[0]) return -1;
for (a = 1; r > a; a++)
if (e[a] >= t) return [a - 1, a];
return -1
}
function framePosition(e) {
var t = increment * e;
return t
}
function scrollToCallback() {
document.body.classList.remove("scrolling")
}
function padToFour(e) {
return 9999 >= e && (e = ("000" + e).slice(-4)), e
}
function getQueryVariable(e, t) {
if (-1 === e.indexOf("?")) return !1;
for (var e = e.split("?"), a = e[1].split("&"), r = 0; r < a.length; r++) {
var n = a[r].split("=");
if (n[0] == t) return n[1]
}
return !1
}
function scrollTo(e, t, a) {
function r(e) {
document.documentElement.scrollTop = e, document.body.parentNode.scrollTop = e, document.body.scrollTop = e
}
function n() {
return document.documentElement.scrollTop || document.body.parentNode.scrollTop || document.body.scrollTop
}
document.body.classList.add("scrolling");
var s = n(),
o = e - s,
i = 0,
l = "undefined" == typeof l ? 40 : parseInt(l);
a = isTouch ? 500 : 2e3;
var c = function() {
i += l;
var e = Math.easeInOutQuad(i, s, o, a);
r(e), a > i ? requestAnimFrame(c) : t && "function" == typeof t && t()
};
c()
}
function iOSversion() {
if (/iP(hone|od|ad)/.test(navigator.platform)) {
var e = navigator.appVersion.match(/OS (\d+)_(\d+)_?(\d+)?/);
return [parseInt(e[1], 10), parseInt(e[2], 10), parseInt(e[3] || 0, 10)]
}
return !1
}
function setHeight(e) {
var t = e * increment;
spacer.style.height = t + "px", state.height.spacer = t
}
function ready() {
if (document.body.setAttribute("data-loaded", !0), state.height.window = window.innerHeight, animate(), 0 === document.body.scrollTop) {
var e = state.keyframes[2] - state.keyframes[1],
t = e / 2 + state.keyframes[1];
scrollTo(framePosition(t), scrollToCallback, playspeed)
}
}
function servicesLinksBottom() {
navRange = state.height.window - (6 * lineHeightPixels + servicesBookend.offsetHeight) - 3 * lineHeightPixels
}
function _resize() {
_checkMQ(), state.height.window = window.innerHeight, h6 = document.getElementsByTagName("h6")[0], lineHeightPixels = convertEm(1, h6) * lineHeightRatio, navRange = state.height.window - (6 * lineHeightPixels + servicesBookend.offsetHeight) - 3 * lineHeightPixels
}
function _breakpoint() {
if (!browserSupport) return document.body.setAttribute("data-loaded", !0), !1;
state.keyframes = [];
for (var e = 0; e < statements.length; e++) {
var t = parseInt(statements[e].getAttribute("data-keyframe"));
state.keyframes.push(t)
}
if (duration = parseInt(state.keyframes[state.keyframes.length - 1]), setHeight(duration), "desktop" === state.breakpoint) {
for (var e = 0; e < services.length; e++) {
var a = parseInt(services[e].getAttribute("data-keyframe"));
state.keyframes.push(a)
}
if (infoSpacer.length > 0) {
var r = parseInt(infoSpacer[0].getAttribute("data-keyframe"));
state.keyframes.push(r)
}
}
var n = state.keyframes[state.keyframes.length - 1] - state.keyframes[state.keyframes.length - 2];
duration = parseInt(state.keyframes[state.keyframes.length - 1]) + n, state.keyframes.push(duration), setHeight(duration), buffer = duration, "desktop" === state.breakpoint
}
function loadSVG(e) {
var t;
if ("function" != typeof e) throw new Error("Not a valid callback");
t = document.createElement("script"), t.onload = e, t.src = "wp-content/themes/planesite/library/js/svgs.js", document.head.appendChild(t)
}
function imageLoaded() {}
function animate() {
var e = (window.scrollY || window.pageYOffset) / state.height.spacer;
if (0 === (window.scrollY || window.pageYOffset) && (e = 0), state.frame = Math.round(e * buffer), state.scroll.lastY > (window.scrollY || window.pageYOffset) ? (state.scroll.direction = "up", servicesWrap.className = state.scroll.direction) : (state.scroll.direction = "down", servicesWrap.className = state.scroll.direction), state.frame >= 0 && state.frame <= buffer) {
"undefined" != typeof svgArray[state.frame] && (scrollbook.style.backgroundImage = "url(" + svgElArray[state.frame].src + ")");
var t = _find(state.keyframes, state.frame);
Array.isArray(t) ? tempframe = t[0] : -1 !== t && (tempframe = t), state.keyframe.current !== tempframe && (state.keyframe.current = tempframe, state.keyframe.next = state.keyframes[state.keyframe.current + 1] ? tempframe + 1 : null, state.content = contents[state.keyframe.current], state.content && (state.mode = state.content.getAttribute("data-mode"), state.content.setAttribute("data-state", "current"), state.zIndex = "up" === state.scroll.direction ? state.zIndex - 1 : state.zIndex + 1, renderKeyframe())), state.content && rAF(renderScroll)
}
lastDirection = state.scroll.direction, state.scroll.lastY = window.scrollY || window.pageYOffset
}
function renderKeyframe() {
"statements" === state.mode && (state.content.hasAttribute("data-bridge") ? "intro" === state.content.getAttribute("data-bridge") ? (document.body.classList.add("intro"), document.body.classList.remove("statements")) : "services" === state.content.getAttribute("data-bridge") && ("desktop" === state.breakpoint ? initServices() : document.body.classList.remove("statements")) : ("desktop" === state.breakpoint && resetServices(), document.body.classList.remove("intro"), document.body.classList.add("statements"))), "services" === state.mode && "desktop" === state.breakpoint && (document.body.classList.remove("statements"), document.body.classList.remove("info"), document.body.classList.add("services"), servicesLinksWrap.setAttribute("data-animation-state", "fadeIn"), state.rotation = parseInt(contents[state.keyframe.current].getAttribute("data-rotate"))), "info" === state.mode && (document.body.classList.remove("services"), document.body.classList.add("info"), centerSundial())
}
function renderScroll() {
if ("statements" === state.mode && (state.content.hasAttribute("data-bridge") && "services" === state.content.getAttribute("data-bridge") && "desktop" === state.breakpoint && statementsBridge(), processStatements()), "services" === state.mode && "desktop" === state.breakpoint)
if (state.content.hasAttribute("data-bridge") && "true" === state.content.getAttribute("data-bridge")) servicesBridge();
else {
if (isTouch) {
rangeCalc(.2);
servicesMenu(), sundialWrap.style[transform] = gpuAcceleration + "translateY(150%) translateX(-50%)"
} else servicesTransitions();
contents[state.keyframe.current].style.zIndex = state.zIndex
}
"info" === state.mode && "desktop" === state.breakpoint && state.content.hasAttribute("data-bridge") && "info" === state.content.getAttribute("data-bridge") && infoBridge()
}
function initServices() {
document.body.classList.add("services"), sundialWrap.setAttribute("data-animation-state", "on")
}
function resetServices() {
document.body.classList.remove("services"), sundialWrap.style.width = "200%", sundialWrap.style.opacity = 0, sundialWrap.setAttribute("data-animation-state", "off"), servicesLinksWrap.setAttribute("data-animation-state", "off")
}
function centerSundial() {
sundialWrap.style.width = "35%", sundialWrap.style.opacity = 1, sundialWrap.style[transform] = gpuAcceleration + "translateY(-50%) translateX(-50%)";
var e = services[0].getElementsByClassName("inner");
e[0].style[transform] = gpuAcceleration + "translateX(0) translateY(50%)", servicesLinks[3].className = "previous"
}
function rangeCalc(e) {
state.keyframe.bottomValue = state.keyframes[state.keyframe.current], state.keyframe.topValue = state.keyframes[state.keyframe.next];
var t = state.keyframe.topValue - state.keyframe.bottomValue,
e = t * (e ? e : .2);
return {
scrolled: (t - (state.keyframe.topValue - state.frame)) / t,
spacer: t * increment,
remaining: 1 - (t - (state.keyframe.topValue - state.frame)) / t,
bottomEdge: state.keyframe.bottomValue + e,
topEdge: state.keyframe.topValue - e,
edge: e
}
}
function processStatements() {
state.keyframe.bottomValue = state.keyframes[state.keyframe.current], state.keyframe.topValue = state.keyframes[state.keyframe.next], contentIn = statements[state.keyframe.current], contentOut = "down" === state.scroll.direction ? statements[state.keyframe.current - 1] : statements[state.keyframe.current + 1], contentOut && contentOut.setAttribute("data-animation-state", "fadeOut"), contentIn && contentIn.setAttribute("data-animation-state", "fadeIn"), statementsReset()
}
function statementsReset() {
for (var e = 0; e < statements.length; e++) {
var t = parseInt(statements[e].getAttribute("data-keyframe"));
t >= state.keyframe.bottomValue && t < state.keyframe.topValue || (t < state.keyframe.bottomValue ? statements[e].setAttribute("data-animation-state", "fadeOut") : t >= state.keyframe.topValue && statements[e].setAttribute("data-state", "fadeOut"))
}
}
function statementsBridge() {
var e = rangeCalc(.4),
t = (e.edge - (e.bottomEdge - state.frame)) / e.edge,
a = 1 - (e.edge - (e.bottomEdge - state.frame)) / e.edge;
services[0].style.zIndex = state.zIndex;
var r = services[0].getElementsByClassName("inner");
if (state.frame >= state.keyframe.bottomValue && state.frame <= e.bottomEdge) {
r[0].style.opacity = 0, r[0].style[transform] = gpuAcceleration + "translateY(-200%) translateX(0%)";
var n = 1 * t,
s = 100 * a;
30 > s && (s = 30), sundialWrap.style.opacity = n, sundialWrap.style.width = s + "%", sundialWrap.style[transform] = gpuAcceleration + "translateY(-50%) translateX(-50%)"
}
if (state.frame >= e.topEdge && state.frame <= state.keyframe.topValue) {
var n = 1 * t,
o = Math.round(200 * a);
50 > o && (o = 50), r[0].style.opacity = n, r[0].style[transform] = gpuAcceleration + "translateY(" + -o + "%) translateX(0%)";
var i = Math.round(150 * t);
i > 150 && (i = 150), sundialWrap.style[transform] = gpuAcceleration + "translateY(" + i + "%) translateX(-50%)", sundial.style[transform] = gpuAcceleration + "rotate(0deg)"
}
if (state.frame <= e.topEdge && state.frame >= state.keyframe.bottomValue) {
var l = 360 + Math.round(90 * t);
sundial.style[transform] = gpuAcceleration + "rotate(" + l + "deg)"
}
}
function servicesBridge() {
rangeCalc(.2);
state.content.setAttribute("data-state", "bridge"), servicesMenu()
}
function servicesTransitions() {
var e = rangeCalc(.2);
servicesMenu(), contents[state.keyframe.current].style.zIndex = state.zIndex;
var t = contents[state.keyframe.current].getElementsByClassName("shadow"),
a = contents[state.keyframe.current].getElementsByClassName("inner");
if (state.frame >= state.keyframe.bottomValue && state.frame <= e.bottomEdge) {
var r = (e.edge - (e.bottomEdge - state.frame)) / e.edge,
n = 1 - (e.edge - (e.bottomEdge - state.frame)) / e.edge,
s = state.rotation - 90,
o = s + Math.round(90 * r);
sundial.style[transform] = gpuAcceleration + "rotate(" + o + "deg)";
var i = Math.round(180 * r);
t[0].style[transform] = gpuAcceleration + "rotate(" + i + "deg)";
var l = Math.round(1 * r),
c = Math.round(-50 * n);
a[0].style.opacity = l, a[0].style[transform] = gpuAcceleration + "translateX(" + c + "%) translateY(-50%)"
} else a[0].style.opacity = 1, sundialWrap.style[transform] = gpuAcceleration + "translateY(150%) translateX(-50%)", state.content.setAttribute("data-state", "current"), sundial.style[transform] = gpuAcceleration + "rotate(" + state.rotation + "deg)"
}
function servicesMenu() {
for (var e = 0; e < servicesLinks.length; e++) {
var t = parseInt(servicesLinks[e].getAttribute("data-keyframe"));
t >= state.keyframe.bottomValue && t < state.keyframe.topValue ? (activeServiceLink = servicesLinks[e], isTouch ? state.content.setAttribute("data-state", "current") : state.content.setAttribute("data-state", "")) : t <= state.keyframe.bottomValue ? (servicesLinks[e].style.bottom = null, servicesLinks[e].className = "previous", services[e].setAttribute("data-state", "previous")) : t >= state.keyframe.topValue && (servicesLinks[e].style.bottom = null, servicesLinks[e].className = "upcoming", services[e].setAttribute("data-state", "upcoming"))
}
activeServiceLink && moveServiceLink(activeServiceLink)
}
function moveServiceLink(e) {
var t, a, r = state.keyframe.topValue - state.keyframe.bottomValue,
n = (state.frame - state.keyframe.bottomValue) / r,
s = navRange / state.height.window * 100,
o = n * s + "%",
i = getElIndex(e);
t = lineHeightRatio * (6 - i) + "em", a = lineHeightPixels * (3 + i);
var l = Math.round(e.offsetTop),
c = Math.round(a);
l >= c && (e.style.bottom = "calc(" + o + " + " + t + ")"), e.className = "current"
}
function infoBridge() {
var e = rangeCalc(.2),
t = services[services.length - 1].getElementsByClassName("inner"),
a = services[services.length - 1].getElementsByClassName("shadow"),
r = (e.edge - (e.bottomEdge - state.frame)) / e.edge,
n = 1 - (e.edge - (e.bottomEdge - state.frame)) / e.edge;
if (state.frame >= state.keyframe.bottomValue && state.frame <= e.bottomEdge) {
var s = 1 * n,
o = 50 + Math.round(200 * r);
services[services.length - 1].setAttribute("data-state", ""), a[0].style[transform] = gpuAcceleration + "rotate(180deg)", t[0].style.opacity = s, t[0].style[transform] = gpuAcceleration + "translateY(" + -o + "%) translateX(0%)";
var i = 80 + Math.round(-130 * r);
sundialWrap.style[transform] = gpuAcceleration + "translateY(" + i + "%) translateX(-50%)"
} else t[0].style.opacity = 0, t[0].style[transform] = gpuAcceleration + "translateY(-200%) translateX(0%)";
if (state.frame <= e.topEdge && state.frame >= state.keyframe.bottomValue) {
var l = 270 + Math.round(90 * r);
sundial.style[transform] = gpuAcceleration + "rotate(" + l + "deg)"
}
}! function(e, t, a) {
function r(e, t) {
return typeof e === t
}
function n() {
var e, t, a, n, s, o, i;
for (var l in b)
if (b.hasOwnProperty(l)) {
if (e = [], t = b[l], t.name && (e.push(t.name.toLowerCase()), t.options && t.options.aliases && t.options.aliases.length))
for (a = 0; a < t.options.aliases.length; a++) e.push(t.options.aliases[a].toLowerCase());
for (n = r(t.fn, "function") ? t.fn() : t.fn, s = 0; s < e.length; s++) o = e[s], i = o.split("."), 1 === i.length ? A[i[0]] = n : (!A[i[0]] || A[i[0]] instanceof Boolean || (A[i[0]] = new Boolean(A[i[0]])), A[i[0]][i[1]] = n), k.push((n ? "" : "no-") + i.join("-"))
}
}
function s(e) {
var t = S.className,
a = A._config.classPrefix || "";
if (T && (t = t.baseVal), A._config.enableJSClass) {
var r = new RegExp("(^|\\s)" + a + "no-js(\\s|$)");
t = t.replace(r, "$1" + a + "js$2")
}
A._config.enableClasses && (t += " " + a + e.join(" " + a), T ? S.className.baseVal = t : S.className = t)
}
function o() {
return "function" != typeof t.createElement ? t.createElement(arguments[0]) : T ? t.createElementNS.call(t, "http://www.w3.org/2000/svg", arguments[0]) : t.createElement.apply(t, arguments)
}
function i(e, t) {
if ("object" == typeof e)
for (var a in e) x(e, a) && i(a, e[a]);
else {
e = e.toLowerCase();
var r = e.split("."),
n = A[r[0]];
if (2 == r.length && (n = n[r[1]]), "undefined" != typeof n) return A;
t = "function" == typeof t ? t() : t, 1 == r.length ? A[r[0]] = t : (!A[r[0]] || A[r[0]] instanceof Boolean || (A[r[0]] = new Boolean(A[r[0]])), A[r[0]][r[1]] = t), s([(t && 0 != t ? "" : "no-") + r.join("-")]), A._trigger(e, t)
}
return A
}
function l() {
var e = t.body;
return e || (e = o(T ? "svg" : "body"), e.fake = !0), e
}
function c(e, a, r, n) {
var s, i, c, u, d = "modernizr",
f = o("div"),
m = l();
if (parseInt(r, 10))
for (; r--;) c = o("div"), c.id = n ? n[r] : d + (r + 1), f.appendChild(c);
return s = o("style"), s.type = "text/css", s.id = "s" + d, (m.fake ? m : f).appendChild(s), m.appendChild(f), s.styleSheet ? s.styleSheet.cssText = e : s.appendChild(t.createTextNode(e)), f.id = d, m.fake && (m.style.background = "", m.style.overflow = "hidden", u = S.style.overflow, S.style.overflow = "hidden", S.appendChild(m)), i = a(f, e), m.fake ? (m.parentNode.removeChild(m), S.style.overflow = u, S.offsetHeight) : f.parentNode.removeChild(f), !!i
}
function u(e, t) {
return !!~("" + e).indexOf(t)
}
function d(e) {
return e.replace(/([a-z])-([a-z])/g, function(e, t, a) {
return t + a.toUpperCase()
}).replace(/^-/, "")
}
function f(e, t) {
return function() {
return e.apply(t, arguments)
}
}
function m(e, t, a) {
var n;
for (var s in e)
if (e[s] in t) return a === !1 ? e[s] : (n = t[e[s]], r(n, "function") ? f(n, a || t) : n);
return !1
}
function p(e) {
return e.replace(/([A-Z])/g, function(e, t) {
return "-" + t.toLowerCase()
}).replace(/^ms-/, "-ms-")
}
function y(t, r) {
var n = t.length;
if ("CSS" in e && "supports" in e.CSS) {
for (; n--;)
if (e.CSS.supports(p(t[n]), r)) return !0;
return !1
}
if ("CSSSupportsRule" in e) {
for (var s = []; n--;) s.push("(" + p(t[n]) + ":" + r + ")");
return s = s.join(" or "), c("@supports (" + s + ") { #modernizr { position: absolute; } }", function(e) {
return "absolute" == getComputedStyle(e, null).position
})
}
return a
}
function g(e, t, n, s) {
function i() {
c && (delete q.style, delete q.modElem)
}
if (s = r(s, "undefined") ? !1 : s, !r(n, "undefined")) {
var l = y(e, n);
if (!r(l, "undefined")) return l
}
for (var c, f, m, p, g, v = ["modernizr", "tspan"]; !q.style;) c = !0, q.modElem = o(v.shift()), q.style = q.modElem.style;
for (m = e.length, f = 0; m > f; f++)
if (p = e[f], g = q.style[p], u(p, "-") && (p = d(p)), q.style[p] !== a) {
if (s || r(n, "undefined")) return i(), "pfx" == t ? p : !0;
try {
q.style[p] = n
} catch (h) {}
if (q.style[p] != g) return i(), "pfx" == t ? p : !0
}
return i(), !1
}
function v(e, t, a, n, s) {
var o = e.charAt(0).toUpperCase() + e.slice(1),
i = (e + " " + V.join(o + " ") + o).split(" ");
return r(t, "string") || r(t, "undefined") ? g(i, t, n, s) : (i = (e + " " + _.join(o + " ") + o).split(" "), m(i, t, a))
}
function h(e, t, r) {
return v(e, a, a, t, r)
}
var k = [],
b = [],
w = {
_version: "3.3.1",
_config: {
classPrefix: "",
enableClasses: !0,
enableJSClass: !0,
usePrefixes: !0
},
_q: [],
on: function(e, t) {
var a = this;
setTimeout(function() {
t(a[e])
}, 0)
},
addTest: function(e, t, a) {
b.push({
name: e,
fn: t,
options: a
})
},
addAsyncTest: function(e) {
b.push({
name: null,
fn: e
})
}
},
A = function() {};
A.prototype = w, A = new A;
var S = t.documentElement,
T = "svg" === S.nodeName.toLowerCase(),
E = w._config.usePrefixes ? " -webkit- -moz- -o- -ms- ".split(" ") : ["", ""];
w._prefixes = E, A.addTest("csscalc", function() {
var e = "width:",
t = "calc(10px);",
a = o("a");
return a.style.cssText = e + E.join(t + e), !!a.style.length
});
var C = "CSS" in e && "supports" in e.CSS,
L = "supportsCSS" in e;
A.addTest("supports", C || L);
var x;
! function() {
var e = {}.hasOwnProperty;
x = r(e, "undefined") || r(e.call, "undefined") ? function(e, t) {
return t in e && r(e.constructor.prototype[t], "undefined")
} : function(t, a) {
return e.call(t, a)
}
}(), w._l = {}, w.on = function(e, t) {
this._l[e] || (this._l[e] = []), this._l[e].push(t), A.hasOwnProperty(e) && setTimeout(function() {
A._trigger(e, A[e])
}, 0)
}, w._trigger = function(e, t) {
if (this._l[e]) {
var a = this._l[e];
setTimeout(function() {
var e, r;
for (e = 0; e < a.length; e++)(r = a[e])(t)
}, 0), delete this._l[e]
}
}, A._q.push(function() {
w.addTest = i
}), A.addTest("svgasimg", t.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#Image", "1.1"));
var I = w.testStyles = c;
A.addTest("touchevents", function() {
var a;
if ("ontouchstart" in e || e.DocumentTouch && t instanceof DocumentTouch) a = !0;
else {
var r = ["@media (", E.join("touch-enabled),("), "heartz", ")", "{#modernizr{top:9px;position:absolute}}"].join("");
I(r, function(e) {
a = 9 === e.offsetTop
})
}
return a
}), I("#modernizr { width: 50vw; }", function(t) {
var a = parseInt(e.innerWidth / 2, 10),
r = parseInt((e.getComputedStyle ? getComputedStyle(t, null) : t.currentStyle).width, 10);
A.addTest("cssvwunit", r == a)
});
var z = function() {
var t = e.matchMedia || e.msMatchMedia;
return t ? function(e) {
var a = t(e);
return a && a.matches || !1
} : function(t) {
var a = !1;
return c("@media " + t + " { #modernizr { position: absolute; } }", function(t) {
a = "absolute" == (e.getComputedStyle ? e.getComputedStyle(t, null) : t.currentStyle).position
}), a
}
}();
w.mq = z, A.addTest("mediaqueries", z("only all"));
var M = "Moz O ms Webkit",
V = w._config.usePrefixes ? M.split(" ") : [];
w._cssomPrefixes = V;
var _ = w._config.usePrefixes ? M.toLowerCase().split(" ") : [];
w._domPrefixes = _;
var B = {
elem: o("modernizr")
};
A._q.push(function() {
delete B.elem
});
var q = {
style: B.elem.style
};
A._q.unshift(function() {
delete q.style
}), w.testAllProps = v, w.testAllProps = h, A.addTest("cssanimations", h("animationName", "a", !0)), A.addTest("bgsizecover", h("backgroundSize", "cover")),
function() {
A.addTest("csscolumns", function() {
var e = !1,
t = h("columnCount");
try {
(e = !!t) && (e = new Boolean(e))
} catch (a) {}
return e
});
for (var e, t, a = ["Width", "Span", "Fill", "Gap", "Rule", "RuleColor", "RuleStyle", "RuleWidth", "BreakBefore", "BreakAfter", "BreakInside"], r = 0; r < a.length; r++) e = a[r].toLowerCase(), t = h("column" + a[r]), ("breakbefore" === e || "breakafter" === e || "breakinside" == e) && (t = t || h(a[r])), A.addTest("csscolumns." + e, t)
}(), A.addTest("flexbox", h("flexBasis", "1px", !0)), A.addTest("csstransforms", function() {
return -1 === navigator.userAgent.indexOf("Android 2.") && h("transform", "scale(1)", !0)
}), A.addTest("csstransforms3d", function() {
var e = !!h("perspective", "1px", !0),
t = A._config.usePrefixes;
if (e && (!t || "webkitPerspective" in S.style)) {
var a, r = "#modernizr{width:0;height:0}";
A.supports ? a = "@supports (perspective: 1px)" : (a = "@media (transform-3d)", t && (a += ",(-webkit-transform-3d)")), a += "{#modernizr{width:7px;height:18px;margin:0;padding:0;border:0}}", I(r + a, function(t) {
e = 7 === t.offsetWidth && 18 === t.offsetHeight
})
}
return e
}), A.addTest("csstransitions", h("transition", "all", !0)), n(), s(k), delete w.addTest, delete w.addAsyncTest;
for (var P = 0; P < A._q.length; P++) A._q[P]();
e.Modernizr = A
}(window, document),
function(e) {
function t(e) {
var t = (new Date).getTime(),
r = Math.max(0, 16 - (t - a)),
n = setTimeout(e, r);
return a = t, n
}
rAF = e.requestAnimationFrame || e.webkitRequestAnimationFrame || t;
var a = (new Date).getTime(),
r = e.cancelAnimationFrame || e.webkitCancelAnimationFrame || e.clearTimeout;
cAF = function(t) {
r.call(e, t)
}
}(window),
function() {
function e(e) {
for (var r = 0, n = t.length; n > r; r++) {
var s = t[r] ? t[r] + e.charAt(0).toUpperCase() + e.slice(1) : e;
if (null != a.style[s]) return s
}
}
var t = ["", "Webkit", "Moz", "ms", "O"],
a = document.createElement("div");
transform = e("transform"), gpuAcceleration = e("perspective") ? "translateZ(0) " : ""
}(), Math.linear = function(e, t, a, r) {
return e /= r, t + a * e
}, Math.easeInOutQuad = function(e, t, a, r) {
return e /= r / 2, 1 > e ? a / 2 * e * e + t : (e--, -a / 2 * (e * (e - 2) - 1) + t)
}, Math.easeInCubic = function(e, t, a, r) {
var n = (e /= r) * e * e;
return t + a * n
}, Math.inOutQuintic = function(e, t, a, r) {
var n = (e /= r) * e,
s = n * e;
return t + a * (6 * s * n + -15 * n * n + 10 * s)
};
var requestAnimFrame = function() {
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function(e) {
window.setTimeout(e, 1e3 / 60)
}
}(),
addClass = function(e, t) {
for (var a = 0, r = e.length; r > a; a++)
if (e[a].classList) e[a].classList.contains(t) && e[a].classList.add(t);
else {
for (var n = e[a].className.split(" "), s = 0, o = n.length; o > s; s++) n[s] === t && (n[s] = "");
n.push(" "), n.push(t), e[a].className = n.join("")
}
},
removeClass = function(e, t) {
for (var a = 0, r = e.length; r > a; a++)
if (e[a].classList) e[a].classList.remove(t);
else {
for (var n = e[a].className.split(" "), s = 0, o = n.length; o > s; s++) n[s] === t && (n[s] = "");
e[a].className = n.join("")
}
},
isTouch = !1;
Modernizr.touchevents && (isTouch = !0), ver = iOSversion();
var browserSupport = !0;
ver && ver[0] < 8 ? (browserSupport = !1, document.body.setAttribute("data-front-page", !1)) : Modernizr.csstransitions && Modernizr.csscalc && Modernizr.svgasimg && Modernizr.mediaqueries && Modernizr.cssvwunit && Modernizr.cssanimations && Modernizr.bgsizecover && Modernizr.csscolumns && Modernizr.flexbox && Modernizr.csstransforms && Modernizr.csstransforms3d;
var vb = !1,
w = window,
rAF = w.requestAnimationFrame,
increment = getQueryVariable(window.location.href, "rate") ? getQueryVariable(window.location.href, "rate") : 40,
playspeed = getQueryVariable(window.location.href, "speed") ? getQueryVariable(window.location.href, "speed") : 2e3;
increment = isTouch ? 10 : 20;
var state = {
breakpoint: "",
mode: null,
frame: null,
zIndex: 5e4,
svgIndex: 1,
rotation: 0,
keyframe: {
current: null,
next: null,
bottomValue: null,
topValue: null
},
keyframes: [],
scroll: {
lastY: null,
direction: null
},
height: {
window: window.innerHeight,
spacer: 0
}
},
lastDirection, navRange, color, spacer = document.getElementById("spacer"),
logo = document.querySelector(".logo a"),
contents = document.querySelectorAll("[data-mode]"),
content, contentIn, contentOut, statements = document.querySelectorAll("[data-mode='statements']"),
servicesWrap = document.getElementById("services"),
services = document.querySelectorAll("[data-mode='services']"),
servicesInner = document.querySelectorAll("[data-mode='services'] .inner"),
servicesShadow = document.querySelectorAll("[data-mode='services'] .shadow"),
infoSpacer = document.querySelectorAll("[data-mode='info']"),
infoWrap = document.getElementById("info"),
sundialWrap = document.querySelector(".sundial"),
sundial = document.querySelector(".sundial img"),
background = document.getElementById("background"),
wipeWrap = document.getElementById("wipe-wrap"),
wipe = document.getElementById("wipe"),
servicesLinksWrap = document.querySelector(".services-menu"),
servicesLinks = document.querySelectorAll(".services-menu a"),
activeServiceLink, servicesBookend = document.querySelector(".services-bookend"),
servicesLink = document.querySelector(".services-bookend a"),
infoBookend = document.querySelector(".info-bookend"),
infoLink = document.querySelector(".info-bookend a"),
buffer = 0,
duration = 0,
scrollbook = document.getElementById("scrollbook"),
preload = document.getElementById("preload"),
processing = !0,
finished = !1,
svgIndex = 0,
last, svgElArray = [],
i = 0,
loader, lineHeightRatio = 1.414,
h6 = document.getElementsByTagName("h6")[0],
lineHeightPixels = convertEm(1, h6) * lineHeightRatio;
window.addEventListener("resize", function() {
_resize()
}, !1);
var startTime, timer;
window.addEventListener("load", function() {
return browserSupport ? (startTime = (new Date).valueOf(), void loadSVG(function() {
last = svgArray.length;
for (var e = 1; last > e; e++) {
var t = new Image;
t.src = svgArray[e], svgElArray.push(t)
}
scrollTo(0, function() {
function e() {
if (startTime) {
var e = ((new Date).valueOf() - startTime) / 1e3;
3 >= e || (clearInterval(timer), ready())
}
}
timer = setInterval(e, 300)
}, playspeed)
})) : !1
}), window.addEventListener("DOMContentLoaded", function() {
if (document.body.hasAttribute("data-front-page") && "false" === document.body.getAttribute("data-front-page")) return !1;
_checkMQ(), servicesLinksBottom();
var e = document.querySelectorAll(".services-menu a");
[].forEach.call(e, function(e) {
e.addEventListener("click", function(t) {
t.stopPropagation(), t.preventDefault();
var a = parseInt(e.getAttribute("data-keyframe")),
r = _find(state.keyframes, a);
if (Array.isArray(r)) {
var n = state.keyframes[r[1]] - state.keyframes[r[0]],
s = n / 2 + state.keyframes[r[0]];
scrollTo(framePosition(s), scrollToCallback, playspeed)
}
}, !1)
});
var t = document.querySelectorAll("#info a");
[].forEach.call(t, function(e) {
e.addEventListener("click", function(e) {
e.stopPropagation()
}, !1)
}), logo.addEventListener("click", function(e) {
e.stopPropagation(), "desktop" === state.breakpoint && (e.preventDefault(), scrollTo(0, scrollToCallback, playspeed))
}, !1), document.body.addEventListener("click", function(e) {
if (e.preventDefault(), state.keyframes.length - 1 > state.keyframe.current + 1) {
var t = state.keyframes[state.keyframe.current + 2] - state.keyframes[state.keyframe.current + 1],
a = t / 2 + state.keyframes[state.keyframe.current + 1];
scrollTo(framePosition(a), scrollToCallback, playspeed)
} else {
var r = window.scrollY || window.pageYOffset;
r >= state.height.spacer || scrollTo(state.height.spacer, scrollToCallback, playspeed)
}
}), servicesLink.addEventListener("click", function(e) {
if (e.stopPropagation(), e.preventDefault(), "desktop" === state.breakpoint) {
var t = services[0].getAttribute("data-keyframe"),
a = _find(state.keyframes, t);
if (Array.isArray(a)) {
var r = state.keyframes[a[1]] - state.keyframes[a[0]],
n = r / 2 + state.keyframes[a[0]];
scrollTo(framePosition(n), scrollToCallback, playspeed)
}
} else scrollTo(state.height.spacer, scrollToCallback, playspeed)
}, !1), infoLink.addEventListener("click", function(e) {
e.stopPropagation(), e.preventDefault(), "desktop" === state.breakpoint ? scrollTo(state.height.spacer, scrollToCallback, playspeed) : scrollTo(infoWrap.offsetTop, scrollToCallback, playspeed)
}, !1)
}), window.addEventListener("scroll", function() {
return browserSupport ? void animate() : !1
}, !1);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment