From ade97e81b79cee6b1f79534d377076b3c1d538cc Mon Sep 17 00:00:00 2001
From: Max Lynch <ihasmax@gmail.com>
Date: Sun, 30 Aug 2015 22:17:46 -0500
Subject: [PATCH] fix(aside): tap on content. Fixes #78

---
 ionic/components/aside/aside-toggle.ts       |  1 +
 ionic/components/aside/aside.scss            |  2 ++
 ionic/components/aside/aside.ts              | 29 ++++++++++++++++++--
 ionic/components/aside/test/basic/main.html  |  3 +-
 ionic/components/aside/test/basic/page1.html |  2 ++
 5 files changed, 33 insertions(+), 4 deletions(-)

diff --git a/ionic/components/aside/aside-toggle.ts b/ionic/components/aside/aside-toggle.ts
index 3b0d84fc30..80fc43d2a3 100644
--- a/ionic/components/aside/aside-toggle.ts
+++ b/ionic/components/aside/aside-toggle.ts
@@ -33,5 +33,6 @@ export class AsideToggle {
   */
   toggle(event) {
     this.aside && this.aside.toggle();
+    console.log('Aside toggle');
   }
 }
diff --git a/ionic/components/aside/aside.scss b/ionic/components/aside/aside.scss
index 070602ffc3..9c2a436444 100644
--- a/ionic/components/aside/aside.scss
+++ b/ionic/components/aside/aside.scss
@@ -121,10 +121,12 @@ $aside-shadow: -1px 0px 8px rgba(0, 0, 0, 0.2) !default;
   box-shadow: $aside-shadow;
   &.aside-open-left {
     transform: translate3d($aside-width,0,0);
+    pointer-events: none;
   }
 
   &.aside-open-right {
     transform: translate3d(-$aside-width,0,0);
+    pointer-events: none;
   }
 }
 
diff --git a/ionic/components/aside/aside.ts b/ionic/components/aside/aside.ts
index 3c741e6e03..fc0a2cf636 100644
--- a/ionic/components/aside/aside.ts
+++ b/ionic/components/aside/aside.ts
@@ -55,16 +55,24 @@ export class Aside extends Ion {
     this.opening = new EventEmitter('opening');
 
     //this.animation = new Animation(element.querySelector('backdrop'));
+    this.contentClickFn = (e) => {
+      console.log('Click', this.isOpen, this.isChanging);
+      if(!this.isOpen || this.isChanging) { return; }
+      this.close();
+    };
 
-    let finishChanging = util.debounce(() => {
+
+    this.finishChanging = util.debounce(() => {
+      console.log('Done changing');
       this.setChanging(false);
     });
 
     // TODO: Use Animation Class
     this.getNativeElement().addEventListener('transitionend', ev => {
+      console.log("Transition end");
       //this.setChanging(false)
       clearTimeout(this.setChangeTimeout);
-      this.setChangeTimeout = setInterval(finishChanging, 500);
+      this.setChangeTimeout = setInterval(this.finishChanging, 400);
     })
   }
 
@@ -82,10 +90,27 @@ export class Aside extends Ion {
     super.onInit();
     this.contentElement = (this.content instanceof Node) ? this.content : this.content.getNativeElement();
 
+    if(this.contentElement) {
+      this.contentElement.addEventListener('transitionend', ev => {
+        console.log("Transition end");
+        //this.setChanging(false)
+        clearTimeout(this.setChangeTimeout);
+        this.setChangeTimeout = setInterval(this.finishChanging, 400);
+      })
+      this.contentElement.addEventListener('click', this.contentClickFn);
+    } else {
+      console.error('Aside: must have a [content] element to listen for drag events on. Supply one like this:\n\n<ion-aside [content]="content"></ion-aside>\n\n<ion-content #content>');
+    }
+
+
     this.gestureDelegate = this.getDelegate('gesture');
     this.typeDelegate = this.getDelegate('type');
   }
 
+  onDestroy() {
+    this.contentElement.removeEventListener('click', this.contentClickFn);
+  }
+
   /**
    * TODO
    * @return {Element} The Aside's content element.
diff --git a/ionic/components/aside/test/basic/main.html b/ionic/components/aside/test/basic/main.html
index 97bb88ee22..5c5b70d069 100644
--- a/ionic/components/aside/test/basic/main.html
+++ b/ionic/components/aside/test/basic/main.html
@@ -1,4 +1,4 @@
-<ion-aside #aside [content]="content" id="menu" type="overlay">
+<ion-aside #aside [content]="content" id="menu" type="reveal">
 
   <ion-toolbar secondary>
     <ion-title>Left Menu</ion-title>
@@ -17,7 +17,6 @@
       </button>
 
     </ion-list>
-
   </ion-content>
 
 </ion-aside>
diff --git a/ionic/components/aside/test/basic/page1.html b/ionic/components/aside/test/basic/page1.html
index 07ef9721cc..ca39e5b495 100644
--- a/ionic/components/aside/test/basic/page1.html
+++ b/ionic/components/aside/test/basic/page1.html
@@ -21,4 +21,6 @@
     <button id="e2eContentToggleAside" aside-toggle>Toggle Aside</button>
   </p>
 
+    <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
+
 </ion-content>