refactor(all): cosmetic changes + app.resize as event emitter

src/components/action-sheet/action-sheet-component.ts

@@ -126,7 +126,7 @@ export class ActionSheetCmp {
   ionViewDidEnter() {
     this._plt.focusOutActiveElement();
 
-    let focusableEle = this._elementRef.nativeElement.querySelector('button');
+    const focusableEle = this._elementRef.nativeElement.querySelector('button');
     if (focusableEle) {
       focusableEle.focus();
     }
@@ -144,7 +144,7 @@ export class ActionSheetCmp {
   }
 
   click(button: any) {
-    if (! this.enabled ) {
+    if (!this.enabled) {
       return;
     }
 

src/components/action-sheet/action-sheet-transitions.ts

@@ -4,9 +4,9 @@ import { Transition } from '../../transitions/transition';
 
 export class ActionSheetSlideIn extends Transition {
   init() {
-    let ele = this.enteringView.pageRef().nativeElement;
+    const ele = this.enteringView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
 
     backdrop.fromTo('opacity', 0.01, 0.4);
     wrapper.fromTo('translateY', '100%', '0%');
@@ -18,9 +18,9 @@ export class ActionSheetSlideIn extends Transition {
 
 export class ActionSheetSlideOut extends Transition {
   init() {
-    let ele = this.leavingView.pageRef().nativeElement;
+    const ele = this.leavingView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
 
     backdrop.fromTo('opacity', 0.4, 0);
     wrapper.fromTo('translateY', '0%', '100%');
@@ -32,9 +32,9 @@ export class ActionSheetSlideOut extends Transition {
 
 export class ActionSheetMdSlideIn extends Transition {
   init() {
-    let ele = this.enteringView.pageRef().nativeElement;
+    const ele = this.enteringView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
 
     backdrop.fromTo('opacity', 0.01, 0.26);
     wrapper.fromTo('translateY', '100%', '0%');
@@ -46,9 +46,9 @@ export class ActionSheetMdSlideIn extends Transition {
 
 export class ActionSheetMdSlideOut extends Transition {
   init() {
-    let ele = this.leavingView.pageRef().nativeElement;
+    const ele = this.leavingView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
 
     backdrop.fromTo('opacity', 0.26, 0);
     wrapper.fromTo('translateY', '0%', '100%');
@@ -60,9 +60,9 @@ export class ActionSheetMdSlideOut extends Transition {
 
 export class ActionSheetWpSlideIn extends Transition {
   init() {
-    let ele = this.enteringView.pageRef().nativeElement;
+    const ele = this.enteringView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
 
     backdrop.fromTo('opacity', 0.01, 0.16);
     wrapper.fromTo('translateY', '100%', '0%');
@@ -74,9 +74,9 @@ export class ActionSheetWpSlideIn extends Transition {
 
 export class ActionSheetWpSlideOut extends Transition {
   init() {
-    let ele = this.leavingView.pageRef().nativeElement;
+    const ele = this.leavingView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.action-sheet-wrapper'));
 
     backdrop.fromTo('opacity', 0.1, 0);
     wrapper.fromTo('translateY', '0%', '100%');

src/components/alert/alert-transitions.ts

@@ -7,9 +7,9 @@ import { Transition } from '../../transitions/transition';
  */
 export class AlertPopIn extends Transition {
   init() {
-    let ele = this.enteringView.pageRef().nativeElement;
+    const ele = this.enteringView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
 
     wrapper.fromTo('opacity', 0.01, 1).fromTo('scale', 1.1, 1);
     backdrop.fromTo('opacity', 0.01, 0.3);
@@ -25,9 +25,9 @@ export class AlertPopIn extends Transition {
 
 export class AlertPopOut extends Transition {
   init() {
-    let ele = this.leavingView.pageRef().nativeElement;
+    const ele = this.leavingView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
 
     wrapper.fromTo('opacity', 0.99, 0).fromTo('scale', 1, 0.9);
     backdrop.fromTo('opacity', 0.3, 0);
@@ -43,9 +43,9 @@ export class AlertPopOut extends Transition {
 
 export class AlertMdPopIn extends Transition {
   init() {
-    let ele = this.enteringView.pageRef().nativeElement;
+    const ele = this.enteringView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
 
     wrapper.fromTo('opacity', 0.01, 1).fromTo('scale', 1.1, 1);
     backdrop.fromTo('opacity', 0.01, 0.5);
@@ -61,9 +61,9 @@ export class AlertMdPopIn extends Transition {
 
 export class AlertMdPopOut extends Transition {
   init() {
-    let ele = this.leavingView.pageRef().nativeElement;
+    const ele = this.leavingView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
 
     wrapper.fromTo('opacity', 0.99, 0).fromTo('scale', 1, 0.9);
     backdrop.fromTo('opacity', 0.5, 0);
@@ -79,9 +79,9 @@ export class AlertMdPopOut extends Transition {
 
 export class AlertWpPopIn extends Transition {
   init() {
-    let ele = this.enteringView.pageRef().nativeElement;
+    const ele = this.enteringView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
 
     wrapper.fromTo('opacity', 0.01, 1).fromTo('scale', 1.3, 1);
     backdrop.fromTo('opacity', 0.01, 0.5);
@@ -97,9 +97,9 @@ export class AlertWpPopIn extends Transition {
 
 export class AlertWpPopOut extends Transition {
   init() {
-    let ele = this.leavingView.pageRef().nativeElement;
+    const ele = this.leavingView.pageRef().nativeElement;
-    let backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
+    const backdrop = new Animation(this.plt, ele.querySelector('ion-backdrop'));
-    let wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
+    const wrapper = new Animation(this.plt, ele.querySelector('.alert-wrapper'));
 
     wrapper.fromTo('opacity', 0.99, 0).fromTo('scale', 1, 1.3);
     backdrop.fromTo('opacity', 0.5, 0);

src/components/app/app-root.ts

@@ -25,14 +25,11 @@ export const AppRootToken = new OpaqueToken('USERROOT');
 export class IonicApp extends Ion implements OnInit {
   private _stopScrollPlugin: any;
   private _tmr: number;
+
   @ViewChild('viewport', {read: ViewContainerRef}) _viewport: ViewContainerRef;
-
   @ViewChild('modalPortal', { read: OverlayPortal }) _modalPortal: OverlayPortal;
-
   @ViewChild('overlayPortal', { read: OverlayPortal }) _overlayPortal: OverlayPortal;
-
   @ViewChild('loadingPortal', { read: OverlayPortal }) _loadingPortal: OverlayPortal;
-
   @ViewChild('toastPortal', { read: OverlayPortal }) _toastPortal: OverlayPortal;
 
   constructor(
@@ -92,9 +89,6 @@ export class IonicApp extends Ion implements OnInit {
     this._plt.prepareReady();
   }
 
-  /**
-   * @private
-   */
   _getPortal(portal?: AppPortal): OverlayPortal {
     if (portal === AppPortal.LOADING) {
       return this._loadingPortal;
@@ -110,9 +104,6 @@ export class IonicApp extends Ion implements OnInit {
     return this._overlayPortal;
   }
 
-  /**
-   * @private
-   */
   _getActivePortal(): OverlayPortal {
     const defaultPortal = this._overlayPortal;
     const modalPortal = this._modalPortal;
@@ -139,12 +130,8 @@ export class IonicApp extends Ion implements OnInit {
     } else if (hasDefault) {
       return defaultPortal;
     }
-
   }
 
-  /**
-   * @private
-   */
   _disableScroll(shouldDisableScroll: boolean) {
     if (shouldDisableScroll) {
       this.stopScroll().then(() => {

src/components/menu/menu-controller.ts

@@ -1,7 +1,7 @@
 import { Menu } from './menu';
 import { MenuType } from './menu-types';
 import { Platform } from '../../platform/platform';
-import { removeArrayItem } from '../../util/util';
+import { removeArrayItem, assert } from '../../util/util';
 
 
 /**
@@ -296,14 +296,16 @@ export class MenuController {
   /**
    * @private
    */
-  register(menu: Menu) {
+  _register(menu: Menu) {
+    assert(this._menus.indexOf(menu) < 0, 'menu was already registered');
     this._menus.push(menu);
   }
 
   /**
    * @private
    */
-  unregister(menu: Menu) {
+  _unregister(menu: Menu) {
+    assert(this._menus.indexOf(menu) >= 0, 'menu is not registered');
     removeArrayItem(this._menus, menu);
   }
 

src/components/menu/menu-types.ts

@@ -54,20 +54,21 @@ export class MenuType {
     if (!this.isOpening && !shouldComplete) {
       isOpen = true;
     }
-
+    const ani = this.ani;
-    this.ani.onFinish(() => {
+    ani.onFinish(() => {
       this.isOpening = false;
       done(isOpen);
     }, true);
 
-    let factor = 1 - Math.min(Math.abs(velocity) / 4, 0.7);
+    const factor = 1 - Math.min(Math.abs(velocity) / 4, 0.7);
-    let dur = this.ani.getDuration() * factor;
+    const dur = ani.getDuration() * factor;
 
-    this.ani.progressEnd(shouldComplete, currentStepValue, dur);
+    ani.progressEnd(shouldComplete, currentStepValue, dur);
   }
 
   destroy() {
     this.ani && this.ani.destroy();
+    this.ani = null;
   }
 
 }

src/components/menu/menu.ts

@@ -359,7 +359,7 @@ export class Menu {
     this._cntEle.classList.add('menu-content-' + this.type);
 
     // register this menu with the app's menu controller
-    this._menuCtrl.register(this);
+    this._menuCtrl._register(this);
   }
 
   /**
@@ -656,7 +656,7 @@ export class Menu {
    * @private
    */
   ngOnDestroy() {
-    this._menuCtrl.unregister(this);
+    this._menuCtrl._unregister(this);
     this._events.destroy();
     this._gesture && this._gesture.destroy();
     this._type && this._type.destroy();

src/components/menu/test/menu.spec.ts

@@ -13,7 +13,7 @@ describe('MenuController', () => {
 
     it('should get the only menu', () => {
       let someMenu = mockMenu();
-      menuCtrl.register(someMenu);
+      menuCtrl._register(someMenu);
 
       let menu = menuCtrl.get();
       expect(menu).toEqual(someMenu);
@@ -21,7 +21,7 @@ describe('MenuController', () => {
 
     it('should get the only menu if menuId === ""', () => {
       let someMenu = mockMenu();
-      menuCtrl.register(someMenu);
+      menuCtrl._register(someMenu);
 
       let menu = menuCtrl.get('');
       expect(menu).toEqual(someMenu);
@@ -30,11 +30,11 @@ describe('MenuController', () => {
     it('should get the enabled menu when multiple menus', () => {
       let someMenu1 = mockMenu();
       someMenu1.enabled = false;
-      menuCtrl.register(someMenu1);
+      menuCtrl._register(someMenu1);
 
       let someMenu2 = mockMenu();
       someMenu2.enabled = true;
-      menuCtrl.register(someMenu2);
+      menuCtrl._register(someMenu2);
 
       let menu = menuCtrl.get();
       expect(menu).toEqual(someMenu2);
@@ -52,7 +52,7 @@ describe('MenuController', () => {
     it('should be null if no matching menus with id', () => {
       let someMenu = mockMenu();
       someMenu.id = 'whatever';
-      menuCtrl.register(someMenu);
+      menuCtrl._register(someMenu);
 
       let menu = menuCtrl.get('myMenu');
       expect(menu).toEqual(null);
@@ -61,7 +61,7 @@ describe('MenuController', () => {
     it('should get the menu by id with matching id', () => {
       let someMenu = mockMenu();
       someMenu.id = 'myMenu';
-      menuCtrl.register(someMenu);
+      menuCtrl._register(someMenu);
 
       let menu = menuCtrl.get('myMenu');
       expect(menu).toEqual(someMenu);
@@ -71,7 +71,7 @@ describe('MenuController', () => {
       let someMenu = mockMenu();
       someMenu.id = 'myMenu';
       someMenu.side = 'left';
-      menuCtrl.register(someMenu);
+      menuCtrl._register(someMenu);
 
       let menu = menuCtrl.get('myMenu');
       expect(menu).toEqual(someMenu);
@@ -80,11 +80,11 @@ describe('MenuController', () => {
     it('should get the menu by id with matching id when multiple menus', () => {
       let someMenu1 = mockMenu();
       someMenu1.id = 'myMenu1';
-      menuCtrl.register(someMenu1);
+      menuCtrl._register(someMenu1);
 
       let someMenu2 = mockMenu();
       someMenu2.id = 'myMenu2';
-      menuCtrl.register(someMenu2);
+      menuCtrl._register(someMenu2);
 
       let menu = menuCtrl.get('myMenu1');
       expect(menu).toEqual(someMenu1);
@@ -110,7 +110,7 @@ describe('MenuController', () => {
     it('should get the only left menu', () => {
       let someMenu = mockMenu();
       someMenu.side = 'left';
-      menuCtrl.register(someMenu);
+      menuCtrl._register(someMenu);
 
       let menu = menuCtrl.get('left');
       expect(menu).toEqual(someMenu);
@@ -120,12 +120,12 @@ describe('MenuController', () => {
       let someMenu1 = mockMenu();
       someMenu1.side = 'left';
       someMenu1.enabled = false;
-      menuCtrl.register(someMenu1);
+      menuCtrl._register(someMenu1);
 
       let someMenu2 = mockMenu();
       someMenu2.side = 'left';
       someMenu2.enabled = true;
-      menuCtrl.register(someMenu2);
+      menuCtrl._register(someMenu2);
 
       let menu = menuCtrl.get('left');
       expect(menu).toEqual(someMenu2);
@@ -135,12 +135,12 @@ describe('MenuController', () => {
       let someMenu1 = mockMenu();
       someMenu1.side = 'left';
       someMenu1.enabled = false;
-      menuCtrl.register(someMenu1);
+      menuCtrl._register(someMenu1);
 
       let someMenu2 = mockMenu();
       someMenu2.side = 'left';
       someMenu2.enabled = false;
-      menuCtrl.register(someMenu2);
+      menuCtrl._register(someMenu2);
 
       let menu = menuCtrl.get('left');
       expect(menu).toEqual(someMenu1);
@@ -149,7 +149,7 @@ describe('MenuController', () => {
     it('should get the only right menu', () => {
       let someMenu = mockMenu();
       someMenu.side = 'right';
-      menuCtrl.register(someMenu);
+      menuCtrl._register(someMenu);
 
       let menu = menuCtrl.get('right');
       expect(menu).toEqual(someMenu);
@@ -159,7 +159,7 @@ describe('MenuController', () => {
       let someMenu = mockMenu();
       someMenu.id = 'myMenu';
       someMenu.side = 'left';
-      menuCtrl.register(someMenu);
+      menuCtrl._register(someMenu);
 
       let menu = menuCtrl.get('left');
       expect(menu).toEqual(someMenu);
@@ -172,7 +172,7 @@ describe('MenuController', () => {
     it('should enable a menu', () => {
       let someMenu = mockMenu();
       someMenu.enabled = true;
-      menuCtrl.register(someMenu);
+      menuCtrl._register(someMenu);
       someMenu._menuCtrl = menuCtrl;
 
       let menu = menuCtrl.enable(true);
@@ -188,21 +188,21 @@ describe('MenuController', () => {
       someMenu1.side = 'left';
       someMenu1.id = 'menu1';
       someMenu1._menuCtrl = menuCtrl;
-      menuCtrl.register(someMenu1);
+      menuCtrl._register(someMenu1);
 
       let someMenu2 = mockMenu();
       someMenu2.enabled = false;
       someMenu2.side = 'left';
       someMenu2.id = 'menu2';
       someMenu2._menuCtrl = menuCtrl;
-      menuCtrl.register(someMenu2);
+      menuCtrl._register(someMenu2);
 
       let someMenu3 = mockMenu();
       someMenu3.enabled = true;
       someMenu3.side = 'right';
       someMenu3.id = 'menu2';
       someMenu3._menuCtrl = menuCtrl;
-      menuCtrl.register(someMenu3);
+      menuCtrl._register(someMenu3);
 
       menuCtrl.enable(true, 'menu1');
       expect(someMenu1.enabled).toEqual(true);
@@ -224,15 +224,15 @@ describe('MenuController', () => {
 
   it('should register a menu', () => {
     let menu = mockMenu();
-    menuCtrl.register(menu);
+    menuCtrl._register(menu);
     expect(menuCtrl.getMenus().length).toEqual(1);
 
     let menu2 = mockMenu();
-    menuCtrl.register(menu2);
+    menuCtrl._register(menu2);
     expect(menuCtrl.getMenus().length).toEqual(2);
 
-    menuCtrl.unregister(menu2);
+    menuCtrl._unregister(menu2);
-    menuCtrl.unregister(menu);
+    menuCtrl._unregister(menu);
 
     expect(menuCtrl.getMenus().length).toEqual(0);
   });

src/components/show-hide-when/show-hide-when.ts

@@ -9,6 +9,7 @@ import { Platform } from '../../platform/platform';
 export class DisplayWhen {
   isMatch: boolean = false;
   conditions: string[];
+  resizeObs: any;
 
   constructor(conditions: string, public _plt: Platform, public zone: NgZone) {
     if (!conditions) return;
@@ -26,12 +27,7 @@ export class DisplayWhen {
 
     if (this.orientation()) {
       // add window resize listener
-      _plt.onResize(() => {
+      this.resizeObs = _plt.resize.subscribe(this.orientation.bind(this));
-        zone.run(() => {
-          this.orientation();
-        });
-      });
-      return;
     }
 
   }
@@ -49,8 +45,13 @@ export class DisplayWhen {
         return true;
       }
     }
+    return false;
   }
 
+  ngOnDestroy() {
+    this.resizeObs && this.resizeObs.unsubscribe();
+    this.resizeObs = null;
+  }
 }
 
 /**
@@ -110,6 +111,8 @@ export class ShowWhen extends DisplayWhen {
     super(showWhen, plt, zone);
   }
 
+  // ngOnDestroy is implemente in DisplayWhen
+
 }
 
 /**
@@ -169,4 +172,6 @@ export class HideWhen extends DisplayWhen {
     super(hideWhen, plt, zone);
   }
 
+  // ngOnDestroy is implemente in DisplayWhen
+
 }

src/components/slides/swiper/swiper-events.ts

@@ -84,9 +84,7 @@ export function initEvents(s: Slides, plt: Platform): Function {
   }
 
   // onresize
-  unregs.push(plt.onResize(() => {
+  let resizeObs = plt.resize.subscribe(() => onResize(s, plt, false));
-    onResize(s, plt, false);
-  }));
 
   // Next, Prev, Index
   if (s.nextButton) {
@@ -115,7 +113,8 @@ export function initEvents(s: Slides, plt: Platform): Function {
   }
 
   // return a function that removes all of the added listeners
-  return function() {
+  return function () {
+    resizeObs.unsubscribe();
     unregs.forEach(unreg => {
       unreg();
     });

src/components/tabs/tabs.ts

@@ -177,6 +177,8 @@ export class Tabs extends Ion implements AfterViewInit {
   id: string;
   /** @internal */
   _selectHistory: string[] = [];
+  /** @internal */
+  _resizeObs: any;
 
   /**
    * @input {string} The color to use from your Sass `$colors` map.
@@ -284,6 +286,7 @@ export class Tabs extends Ion implements AfterViewInit {
   }
 
   ngOnDestroy() {
+    this._resizeObs && this._resizeObs.unsubscribe();
     this.parent.unregisterChildNav(this);
   }
 
@@ -296,7 +299,7 @@ export class Tabs extends Ion implements AfterViewInit {
     this._setConfig('tabsHighlight', this.tabsHighlight);
 
     if (this.tabsHighlight) {
-      this._plt.onResize(() => {
+      this._resizeObs = this._plt.resize.subscribe(() => {
         this._highlight.select(this.getSelected());
       });
     }
@@ -364,7 +367,7 @@ export class Tabs extends Ion implements AfterViewInit {
   /**
    * @private
    */
-  add(tab: Tab) {
+  add(tab: Tab): string {
     this._tabs.push(tab);
     return this.id + '-' + (++this._ids);
   }

src/platform/platform.ts

@@ -38,7 +38,6 @@ export class Platform {
   private _ua: string;
   private _qp = new QueryParams();
   private _nPlt: string;
-  private _onResizes: Array<Function> = [];
   private _readyPromise: Promise<any>;
   private _readyResolve: any;
   private _bbActions: BackButtonAction[] = [];
@@ -404,6 +403,13 @@ export class Platform {
    */
   resume: EventEmitter<Event> = new EventEmitter<Event>();
 
+  /**
+   * The resize event emits when the native platform pulls the application
+   * out from the background. This event would emit when a Cordova app comes
+   * out from the background, however, it would not fire on a standard web browser.
+   */
+  resize: EventEmitter<Event> = new EventEmitter<Event>();
+
   /**
    * The back button event is triggered when the user presses the native
    * platform's back button, also referred to as the "hardware" back button.
@@ -737,18 +743,6 @@ export class Platform {
     }
   }
 
-  /**
-   * @private
-   */
-  onResize(cb: Function): Function {
-    const self = this;
-    self._onResizes.push(cb);
-
-    return function() {
-      removeArrayItem(self._onResizes, cb);
-    };
-  }
-
   /**
    * @private
    */
@@ -812,14 +806,7 @@ export class Platform {
           if (this.hasFocusedTextInput() === false) {
             this._isPortrait = null;
           }
-
+          this.resize.emit();
-          for (let i = 0; i < this._onResizes.length; i++) {
-            try {
-              this._onResizes[i]();
-            } catch (e) {
-              console.error(e);
-            }
-          }
         }, 200);
       }, { passive: true, zone: true });
     }, 2000);