diff --git a/ionic/components.ts b/ionic/components.ts index ab4f4320c9..4cfba11d25 100644 --- a/ionic/components.ts +++ b/ionic/components.ts @@ -11,7 +11,7 @@ export * from 'ionic/components/icon/icon' export * from 'ionic/components/item/item' export * from 'ionic/components/item/item-group' export * from 'ionic/components/menu/menu' -export * from 'ionic/components/menu/extensions/types' +export * from 'ionic/components/menu/menu-types' export * from 'ionic/components/menu/menu-toggle' export * from 'ionic/components/text-input/text-input' export * from 'ionic/components/text-input/label' diff --git a/ionic/components/app/app.ts b/ionic/components/app/app.ts index 4264836db7..ddca7dfbf1 100644 --- a/ionic/components/app/app.ts +++ b/ionic/components/app/app.ts @@ -263,7 +263,7 @@ export function ionicBootstrap(rootComponentType, config) { config = new IonicConfig(config); } - let platform = new IonicPlatform(window); + let platform = new IonicPlatform(); // create the base IonicApp let app = initApp(window, document, config, platform); diff --git a/ionic/components/menu/extensions/gestures.ts b/ionic/components/menu/menu-gestures.ts similarity index 98% rename from ionic/components/menu/extensions/gestures.ts rename to ionic/components/menu/menu-gestures.ts index f6db5728fd..0fc00ea562 100644 --- a/ionic/components/menu/extensions/gestures.ts +++ b/ionic/components/menu/menu-gestures.ts @@ -1,4 +1,4 @@ -import {Menu} from '../menu'; +import {Menu} from './menu'; import {SlideEdgeGesture} from 'ionic/gestures/slide-edge-gesture'; diff --git a/ionic/components/menu/extensions/types.scss b/ionic/components/menu/menu-types.scss similarity index 79% rename from ionic/components/menu/extensions/types.scss rename to ionic/components/menu/menu-types.scss index d16eebf8ed..16ba915a8d 100644 --- a/ionic/components/menu/extensions/types.scss +++ b/ionic/components/menu/menu-types.scss @@ -4,12 +4,8 @@ // The content slides over to reveal the menu underneath. // The menu itself, which is under the content, does not move. -ion-menu[type=reveal] { - transform: translate3d(-9999px, 0px, 0px); - - &.show-menu { - transform: translate3d(0px, 0px, 0px); - } +ion-menu[type=reveal].show-menu { + transform: translate3d(0px, 0px, 0px); } .menu-content-reveal { @@ -26,7 +22,6 @@ ion-menu[type=reveal] { ion-menu[type=overlay] { z-index: $z-index-menu-overlay; box-shadow: $menu-shadow; - transform: translate3d(-9999px, 0px, 0px); backdrop { display: block; diff --git a/ionic/components/menu/extensions/types.ts b/ionic/components/menu/menu-types.ts similarity index 99% rename from ionic/components/menu/extensions/types.ts rename to ionic/components/menu/menu-types.ts index e2baee20d3..175f1216a9 100644 --- a/ionic/components/menu/extensions/types.ts +++ b/ionic/components/menu/menu-types.ts @@ -1,4 +1,4 @@ -import {Menu} from '../menu'; +import {Menu} from './menu'; import {Animation} from 'ionic/animations/animation'; diff --git a/ionic/components/menu/menu.scss b/ionic/components/menu/menu.scss index 7ba53d2fce..43e3821b2b 100644 --- a/ionic/components/menu/menu.scss +++ b/ionic/components/menu/menu.scss @@ -22,6 +22,8 @@ ion-menu { flex-direction: column; background: $menu-background; + + transform: translate3d(-9999px, 0px, 0px); } ion-menu[side=right] { diff --git a/ionic/components/menu/menu.ts b/ionic/components/menu/menu.ts index e9070a3cc9..296e74a8e8 100644 --- a/ionic/components/menu/menu.ts +++ b/ionic/components/menu/menu.ts @@ -4,7 +4,7 @@ import {Ion} from '../ion'; import {IonicApp} from '../app/app'; import {IonicConfig} from '../../config/config'; import {IonicComponent} from '../../config/annotations'; -import * as gestures from './extensions/gestures'; +import * as gestures from './menu-gestures'; /** diff --git a/ionic/gestures/drag-gesture.ts b/ionic/gestures/drag-gesture.ts index 6c18c09398..71770a1038 100644 --- a/ionic/gestures/drag-gesture.ts +++ b/ionic/gestures/drag-gesture.ts @@ -1,16 +1,13 @@ import {Gesture} from 'ionic/gestures/gesture'; import * as util from 'ionic/util'; -//import Hammer from 'hammer'; -/* - * BUG(ajoslin): HammerJS 2.x does not have an alternative to HammerJS 1.x's - * dragLockToAxis, so a vertical and horizontal gesture can happen at the same time. - */ + export class DragGesture extends Gesture { constructor(element, opts = {}) { util.defaults(opts, {}); super(element, opts); } + listen() { super.listen(); this.on('panstart', ev => { @@ -33,6 +30,7 @@ export class DragGesture extends Gesture { // ev.stopPropagation() }); } + onDrag() {} onDragStart() {} onDragEnd() {} diff --git a/ionic/gestures/slide-edge-gesture.ts b/ionic/gestures/slide-edge-gesture.ts index b61e1e68e0..24967d2ed7 100644 --- a/ionic/gestures/slide-edge-gesture.ts +++ b/ionic/gestures/slide-edge-gesture.ts @@ -1,9 +1,11 @@ import {SlideGesture} from 'ionic/gestures/slide-gesture'; -import * as util from 'ionic/util'; +import {defaults} from '../util/util'; +import {windowDimensions} from '../util/dom'; + export class SlideEdgeGesture extends SlideGesture { constructor(element: Element, opts: Object = {}) { - util.defaults(opts, { + defaults(opts, { edge: 'left', threshold: 50 }); @@ -22,8 +24,8 @@ export class SlideEdgeGesture extends SlideGesture { return { left: 0, top: 0, - width: window.innerWidth, - height: window.innerHeight + width: windowDimensions().width, + height: windowDimensions().height }; } diff --git a/ionic/ionic.core.scss b/ionic/ionic.core.scss index 7eecc8d944..ea70f63915 100644 --- a/ionic/ionic.core.scss +++ b/ionic/ionic.core.scss @@ -34,7 +34,7 @@ "components/list/list", "components/card/card", "components/menu/menu", - "components/menu/extensions/types", + "components/menu/menu-types", "components/modal/modal", "components/nav-bar/nav-bar", "components/popup/popup", diff --git a/ionic/platform/platform.ts b/ionic/platform/platform.ts index a343470288..f98af170bb 100644 --- a/ionic/platform/platform.ts +++ b/ionic/platform/platform.ts @@ -7,8 +7,7 @@ import * as dom from '../util/dom'; */ export class IonicPlatform { - constructor(window) { - this._window = window; + constructor() { this._settings = {}; this._platforms = []; this._versions = {}; @@ -131,19 +130,11 @@ export class IonicPlatform { } width() { - if (!this._w) { - this._w = this._window.innerWidth; - this._h = this._window.innerHeight; - } - return this._w; + return dom.windowDimensions().width; } height() { - if (!this._h) { - this._w = this._window.innerWidth; - this._h = this._window.innerHeight; - } - return this._h; + return dom.windowDimensions().height; } isPortrait() { @@ -159,7 +150,6 @@ export class IonicPlatform { clearTimeout(self._resizeTimer); self._resizeTimer = setTimeout(() => { - this._w = this._h = 0; dom.flushDimensionCache(); for (let i = 0; i < self._onResizes.length; i++) { diff --git a/ionic/util/dom.ts b/ionic/util/dom.ts index 4ce41ca355..b762beddd3 100644 --- a/ionic/util/dom.ts +++ b/ionic/util/dom.ts @@ -228,7 +228,7 @@ export function closest(el, selector) { export function getDimensions(ele) { if (!ele.ionicId) { ele.ionicId = ++ionicElementIds; - if (ele.ionicId % 200) { + if (ele.ionicId % 100 === 0) { // periodically flush dimensions flushDimensionCache(); } @@ -245,6 +245,16 @@ export function getDimensions(ele) { return dimensions; } +export function windowDimensions() { + if (!elementDimensions.win) { + elementDimensions.win = { + width: window.innerWidth, + height: window.innerHeight + }; + } + return elementDimensions.win; +} + export function flushDimensionCache() { elementDimensions = {}; }