Side menu working for safari

This commit is contained in:
Max Lynch
2015-06-03 14:53:37 -05:00
parent 3838a6b71e
commit 87dc953776
2 changed files with 35 additions and 16 deletions

View File

@@ -1,4 +1,5 @@
import {Aside} from 'ionic/components/aside/aside';
import {CSS} from 'ionic/util/dom'
// TODO use setters instead of direct dom manipulation
const asideManipulator = {
@@ -9,7 +10,7 @@ const asideManipulator = {
this.aside.domElement.classList[open ? 'add' : 'remove']('open');
},
setTransform(t) {
this.aside.domElement.style.transform = t;
this.aside.domElement.style[CSS.transform] = t;
}
}
const contentManipulator = {
@@ -22,7 +23,7 @@ const contentManipulator = {
)
},
setTransform(t) {
this.aside.content.domElement.style.transform = t;
this.aside.content.domElement.style[CSS.transform] = t;
}
}

View File

@@ -31,21 +31,39 @@ export function rafPromise() {
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';
}
(function() {
// transform
var i, keys = ['webkitTransform', 'transform', '-webkit-transform', 'webkit-transform',
'-moz-transform', 'moz-transform', 'MozTransform', 'mozTransform', 'msTransform'];
for (i = 0; i < keys.length; i++) {
if (document.documentElement.style[keys[i]] !== undefined) {
CSS.transform = keys[i];
break;
}
}
// transition
keys = ['webkitTransition', 'mozTransition', 'msTransition', 'transition'];
for (i = 0; i < keys.length; i++) {
if (document.documentElement.style[keys[i]] !== undefined) {
CSS.transition = keys[i];
break;
}
}
// The only prefix we care about is webkit for transitions.
var isWebkit = CSS.transition.indexOf('webkit') > -1;
CSS.prefix = isWebkit ? '-webkit-' : '';
// transition duration
CSS.transitionDuration = (isWebkit ? '-webkit-' : '') + 'transition-duration';
// To be sure transitionend works everywhere, include *both* the webkit and non-webkit events
CSS.transitionEnd = (isWebkit ? 'webkitTransitionEnd ' : '') + 'transitionend';
})();
if (window.onanimationend === undefined && window.onwebkitanimationend !== undefined) {
CSS.animation = 'WebkitAnimation';