chore(TapClick): update TapClick to work w/ ionicBootstrap

src/components/tap-click/activator.ts

@@ -1,4 +1,4 @@
-import {rafFrames} from '../../util/dom';
+import {rafFrames, nativeTimeout} from '../../util/dom';
 
 
 export class Activator {
@@ -6,7 +6,7 @@ export class Activator {
   protected _queue: Array<HTMLElement> = [];
   protected _active: Array<HTMLElement> = [];
 
-  constructor(protected app, config, protected _zone) {
+  constructor(protected app, config) {
     this._css = config.get('activatedClass') || 'activated';
   }
 
@@ -20,7 +20,6 @@ export class Activator {
     // queue to have this element activated
     self._queue.push(activatableEle);
 
-    this._zone.runOutsideAngular(() => {
     rafFrames(2, function() {
       let activatableEle;
       for (let i = 0; i < self._queue.length; i++) {
@@ -32,17 +31,12 @@ export class Activator {
       }
       self._queue = [];
     });
-    });
   }
 
   upAction(ev: UIEvent, activatableEle: HTMLElement, pointerX: number, pointerY: number) {
     // the user was pressing down, then just let up
-    let self = this;
+    rafFrames(CLEAR_STATE_DEFERS, () => {
-    function activateUp() {
+      this.clearState();
-      self.clearState();
-    }
-    this._zone.runOutsideAngular(() => {
-      rafFrames(CLEAR_STATE_DEFERS, activateUp);
     });
   }
 
@@ -52,7 +46,7 @@ export class Activator {
       // the app is actively disabled, so don't bother deactivating anything.
       // this makes it easier on the GPU so it doesn't have to redraw any
       // buttons during a transition. This will retry in XX milliseconds.
-      setTimeout(() => {
+      nativeTimeout(() => {
         this.clearState();
       }, 600);
 

src/components/tap-click/ripple.ts

@@ -1,6 +1,5 @@
 import {Activator} from './activator';
 import {CSS, nativeRaf, rafFrames} from '../../util/dom';
-const win: any = window;
 
 
 /**
@@ -8,8 +7,8 @@ const win: any = window;
  */
 export class RippleActivator extends Activator {
 
-  constructor(app, config, zone) {
+  constructor(app, config) {
-    super(app, config, zone);
+    super(app, config);
   }
 
   downAction(ev, activatableEle, pointerX, pointerY) {
@@ -21,7 +20,6 @@ export class RippleActivator extends Activator {
     // queue to have this element activated
     self._queue.push(activatableEle);
 
-    this._zone.runOutsideAngular(function() {
     nativeRaf(function() {
       var i;
 
@@ -56,8 +54,6 @@ export class RippleActivator extends Activator {
       }
       self._queue = [];
     });
-
-    });
   }
 
   upAction(ev: UIEvent, activatableEle: HTMLElement, pointerX: number, pointerY: number) {

src/components/tap-click/tap-click.ts

@@ -23,15 +23,15 @@ export class TapClick {
   constructor(
     config: Config,
     private app: App,
-    private zone: NgZone
+    zone: NgZone
   ) {
     let self = this;
 
     if (config.get('activator') === 'ripple') {
-      self.activator = new RippleActivator(app, config, zone);
+      self.activator = new RippleActivator(app, config);
 
     } else if (config.get('activator') === 'highlight') {
-      self.activator = new Activator(app, config, zone);
+      self.activator = new Activator(app, config);
     }
 
     self.usePolyfill = (config.get('tapPolyfill') === true);
@@ -47,7 +47,6 @@ export class TapClick {
       addListener('mouseup', self.mouseUp.bind(self), true);
     });
 
-
     self.pointerMove = function(ev) {
       if ( hasPointerMoved(POINTER_MOVE_UNTIL_CANCEL, self.startCoord, pointerCoord(ev)) ) {
         self.pointerCancel(ev);

src/config/bootstrap.ts

@@ -48,6 +48,9 @@ export function ionicPostBootstrap(ngComponentRef: ComponentRef<any>): Component
   platform.setZone(ngComponentRef.injector.get(NgZone));
   platform.prepareReady();
 
+  // TODO: Use PLATFORM_INITIALIZER
+  ngComponentRef.injector.get(TapClick);
+
   // TODO: Use Renderer
   ngComponentRef.location.nativeElement.classList.add('app-init');