Files
2015-05-04 13:14:55 -05:00

115 lines
3.2 KiB
JavaScript

const nativeRaf = window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame;
const nativeCancelRaf = window.cancelAnimationFrame ||
window.webkitCancelAnimationFrame ||
window.webkitCancelRequestAnimationFrame;
export const raf = nativeRaf || function(callback) {
let timeCurrent = (new Date()).getTime(),
timeDelta;
/* Dynamically set delay on a per-tick basis to match 60fps. */
/* Technique by Erik Moller. MIT license: https://gist.github.com/paulirish/1579671 */
timeDelta = Math.max(0, 16 - (timeCurrent - timeLast));
timeLast = timeCurrent + timeDelta;
return setTimeout(function() { callback(timeCurrent + timeDelta); }, timeDelta);
}
export const rafCancel = nativeRaf ? nativeCancelRaf : function(id) {
return window.cancelTimeout(id);
}
export function rafPromise() {
return new Promise(resolve => raf(resolve));
}
export const isSVG = val => window.SVGElement && (val instanceof window.SVGElement);
// We only need to test for webkit in our supported browsers. Webkit is the only browser still
// using prefixes.
// Code adapted from angular-animate.js
export let css = {};
if (window.ontransitionend === undefined && window.onwebkittransitionend !== undefined) {
css.prefix = 'webkit';
css.transition = 'webkitTransition';
css.transform = 'webkitTransform';
css.transitionEnd = 'webkitTransitionEnd transitionend';
} else {
css.prefix = '';
css.transform = 'transform';
css.transition = 'transition';
css.transitionEnd = 'transitionend';
}
export function transitionEndPromise(el:Element) {
return new Promise(resolve => {
css.transitionEnd.split(' ').forEach(eventName => {
el.addEventListener(eventName, onTransitionEnd);
})
function onTransitionEnd(ev) {
// Don't allow bubbled transitionend events
if (ev.target !== el) {
return;
}
css.transitionEnd.split(' ').forEach(eventName => {
el.removeEventListener(css.transitionEnd, onTransitionEnd)
})
resolve(ev);
}
});
}
export function ready() {
return new Promise(resolve => {
if (document.readyState === 'complete' || document.readyState === 'interactive') {
setTimeout(resolve);
} else {
function completed() {
resolve();
document.removeEventListener('DOMContentLoaded', completed, false);
window.removeEventListener('load', completed, false);
}
document.addEventListener('DOMContentLoaded', completed, false);
window.addEventListener('load', completed, false);
}
})
}
export function windowLoad() {
return new Promise(resolve => {
if (document.readyState === 'complete') {
setTimeout(resolve);
} else {
function completed() {
resolve();
window.removeEventListener('load', completed, false);
}
window.addEventListener('load', completed, false);
}
});
}
export function hasAttribute(el: Element, attributeName) {
return el.hasAttribute(attributeName);
}
export function addClass(el: Element, className) {
el.classList.add(className);
}
export function addClasses(el: Element, ...classNames) {
for(let c of classNames) {
el.classList.add(c);
}
}