From 92ad160d56049b8f69ae575b6a105bd38a0b1f1e Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 18:11:54 +0200
Subject: [PATCH 01/25] Improvements

---
 ionic.contrib.drawer.js | 60 ++++++++++++++++++++---------------------
 1 file changed, 30 insertions(+), 30 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index b2f5815..b0bcff0 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -20,12 +20,17 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   // How far from edge before triggering
   var edgeX = 40;
 
-  var LEFT = 0;
-  var RIGHT = 1;
+  var SIDE_LEFT = 'left';
+  var SIDE_RIGHT = 'right';
+  var STATE_CLOSE = 'close';
+  var STATE_OPEN = 'open';
 
   var isTargetDrag = false;
 
   var width = $element[0].clientWidth;
+  
+  // Current State of Drawer
+  var drawerState = STATE_CLOSE;
 
   var enableAnimation = function() {
     $element.addClass('animate');
@@ -35,12 +40,12 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   };
 
   // Check if this is on target or not
-  var isTarget = function(el) {
-    while(el) {
-      if(el === $element[0]) {
+  var isTarget = function(targetEl) {
+    while(targetEl) {
+      if(targetEl === el]) {
         return true;
       }
-      el = el.parentNode;
+      targetEl = targetEl.parentNode;
     }
   };
 
@@ -79,11 +84,14 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     enableAnimation();
 
     ionic.requestAnimationFrame(function() {
+      var translateX = 0;
       if(newX < (-width / 2)) {
-        el.style.transform = el.style.webkitTransform = 'translate3d(' + -width + 'px, 0, 0)';
+        translateX = -width;
+        drawerState = STATE_CLOSE;
       } else {
-        el.style.transform = el.style.webkitTransform = 'translate3d(0px, 0, 0)';
+        drawerState = STATE_OPEN;
       }
+      el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + translateX + 'px, 0, 0)';
     });
   };
 
@@ -112,9 +120,8 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       console.log(lastX, offsetX, lastX - offsetX);
       newX = Math.min(0, (-width + (lastX - offsetX)));
       ionic.requestAnimationFrame(function() {
-        el.style.transform = el.style.webkitTransform = 'translate3d(' + newX + 'px, 0, 0)';
-      });
-
+        el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + newX + 'px, 0, 0)';
+      }); 
     }
 
     if(dragging) {
@@ -122,38 +129,31 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     }
   };
 
-  side = $attr.side == 'left' ? LEFT : RIGHT;
+  side = $attr.side === SIDE_LEFT ? SIDE_LEFT : SIDE_RIGHT;
   console.log(side);
 
-  $ionicGesture.on('drag', function(e) {
-    doDrag(e);
-  }, $document);
-  $ionicGesture.on('dragend', function(e) {
-    doEndDrag(e);
-  }, $document);
-
-
+  $ionicGesture.on('drag', doDrag, $document);
+  $ionicGesture.on('dragend', doEndDrag, $document);
+  
   this.close = function() {
+    var translateX = side === SIDE_LEFT ? '-100' : '100';
+    
     enableAnimation();
     ionic.requestAnimationFrame(function() {
-      if(side === LEFT) {
-        el.style.transform = el.style.webkitTransform = 'translate3d(-100%, 0, 0)';
-      } else {
-        el.style.transform = el.style.webkitTransform = 'translate3d(100%, 0, 0)';
-      }
+      el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + translateX + '%, 0, 0)';
     });
   };
 
   this.open = function() {
     enableAnimation();
     ionic.requestAnimationFrame(function() {
-      if(side === LEFT) {
-        el.style.transform = el.style.webkitTransform = 'translate3d(0%, 0, 0)';
-      } else {
-        el.style.transform = el.style.webkitTransform = 'translate3d(0%, 0, 0)';
-      }
+      el.style[ionic.CSS.TRANSFORM] = 'translate3d(0%, 0, 0)';
     });
   };
+  
+  this.isOpen = function() {
+    return (drawerState === STATE_OPEN);
+  };
 }])
 
 .directive('drawer', ['$rootScope', '$ionicGesture', function($rootScope, $ionicGesture) {

From 6007fcbab3e6c5b5023e513aad7a7c9a3617487f Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 18:15:16 +0200
Subject: [PATCH 02/25] Add toggleDrawer method

---
 ionic.contrib.drawer.js | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index b0bcff0..35b2c6f 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -162,14 +162,24 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     controller: 'drawerCtrl',
     link: function($scope, $element, $attr, ctrl) {
       $element.addClass($attr.side);
+      
       $scope.openDrawer = function() {
         console.log('open');
         ctrl.open();
       };
+      
       $scope.closeDrawer = function() {
         console.log('close');
         ctrl.close();
       };
+      
+      $scope.toggleDrawer = function() {
+        if (ctrl.isOpen()) {
+          ctrl.close();
+        } else {
+          ctrl.open();
+        }
+      };
     }
   }
 }]);

From 40541b71d3cc6e47b7ee9b9dc9417361e9749a9b Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 18:18:45 +0200
Subject: [PATCH 03/25] Fix drawerState update

---
 ionic.contrib.drawer.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index 35b2c6f..e7a0d03 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -139,6 +139,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     var translateX = side === SIDE_LEFT ? '-100' : '100';
     
     enableAnimation();
+    drawerState = STATE_CLOSE;
     ionic.requestAnimationFrame(function() {
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + translateX + '%, 0, 0)';
     });
@@ -146,6 +147,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
   this.open = function() {
     enableAnimation();
+    drawerState = STATE_OPEN;
     ionic.requestAnimationFrame(function() {
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(0%, 0, 0)';
     });

From c2288226d0a3aaec96067d6785694111404211cc Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 18:25:28 +0200
Subject: [PATCH 04/25] Cleanup code

---
 ionic.contrib.drawer.js | 37 +++++++++++++++++--------------------
 1 file changed, 17 insertions(+), 20 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index e7a0d03..a6e73c2 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -13,7 +13,6 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   var el = $element[0];
   var dragging = false;
   var startX, lastX, offsetX, newX;
-  var side;
 
   // How far to drag before triggering
   var thresholdX = 15;
@@ -27,7 +26,8 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
   var isTargetDrag = false;
 
-  var width = $element[0].clientWidth;
+  var side = $attr.side === SIDE_LEFT ? SIDE_LEFT : SIDE_RIGHT;
+  var width = el.clientWidth;
   
   // Current State of Drawer
   var drawerState = STATE_CLOSE;
@@ -35,14 +35,15 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   var enableAnimation = function() {
     $element.addClass('animate');
   };
+  
   var disableAnimation = function() {
     $element.removeClass('animate');
   };
 
   // Check if this is on target or not
   var isTarget = function(targetEl) {
-    while(targetEl) {
-      if(targetEl === el]) {
+    while (targetEl) {
+      if (targetEl === el]) {
         return true;
       }
       targetEl = targetEl.parentNode;
@@ -74,7 +75,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     offsetX = null;
     isTargetDrag = false;
 
-    if(!dragging) {
+    if (!dragging) {
       return;
     }
 
@@ -85,32 +86,33 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
     ionic.requestAnimationFrame(function() {
       var translateX = 0;
-      if(newX < (-width / 2)) {
+      
+      if (newX < (-width / 2)) {
         translateX = -width;
         drawerState = STATE_CLOSE;
       } else {
         drawerState = STATE_OPEN;
       }
+      
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + translateX + 'px, 0, 0)';
     });
   };
 
   var doDrag = function(e) {
-    if(e.defaultPrevented) {
+    if (e.defaultPrevented) {
       return;
     }
 
-    if(!lastX) {
+    if (!lastX) {
       startX = e.gesture.touches[0].pageX;
     }
 
     lastX = e.gesture.touches[0].pageX;
 
-    if(!dragging) {
-
+    if (!dragging) {
       // Dragged 15 pixels and finger is by edge
-      if(Math.abs(lastX - startX) > thresholdX) {
-        if(isTarget(e.target)) {
+      if (Math.abs(lastX - startX) > thresholdX) {
+        if (isTarget(e.target)) {
           startTargetDrag(e);
         } else if(startX < edgeX) {
           startDrag(e);
@@ -124,24 +126,19 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       }); 
     }
 
-    if(dragging) {
+    if (dragging) {
       e.gesture.srcEvent.preventDefault();
     }
   };
 
-  side = $attr.side === SIDE_LEFT ? SIDE_LEFT : SIDE_RIGHT;
-  console.log(side);
-
   $ionicGesture.on('drag', doDrag, $document);
   $ionicGesture.on('dragend', doEndDrag, $document);
   
   this.close = function() {
-    var translateX = side === SIDE_LEFT ? '-100' : '100';
-    
     enableAnimation();
     drawerState = STATE_CLOSE;
     ionic.requestAnimationFrame(function() {
-      el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + translateX + '%, 0, 0)';
+      el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + (side === SIDE_LEFT ? '-' : '') + '100%, 0, 0)';
     });
   };
 
@@ -149,7 +146,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     enableAnimation();
     drawerState = STATE_OPEN;
     ionic.requestAnimationFrame(function() {
-      el.style[ionic.CSS.TRANSFORM] = 'translate3d(0%, 0, 0)';
+      el.style[ionic.CSS.TRANSFORM] = 'translate3d(0, 0, 0)';
     });
   };
   

From 8f47a8617c7e5a68e4b2bdfc88c535f689223b96 Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 18:38:36 +0200
Subject: [PATCH 05/25] Add drawer overlay

---
 ionic.contrib.drawer.js | 39 +++++++++++++++++++++++++++++++++++++--
 1 file changed, 37 insertions(+), 2 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index a6e73c2..b585ccc 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -31,13 +31,32 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   
   // Current State of Drawer
   var drawerState = STATE_CLOSE;
+  
+  // Drawer overlay
+  var $overlay = angular.element('<div class="drawer-overlay" />');
+  var overlayEl = $overlay[0];
+  var overlayState = STATE_CLOSE;
+  
+  $element.parent().prepend(this.overlayElement);
+  
+  var toggleOverlay = function(state) {
+    if (overlayState !== state) {
+      ionic.requestAnimationFrame(function() {
+        var translateX = state === STATE_CLOSE ? '0' : '-100';
+        overlayEl.style[ionic.CSS.TRANSFORM] = 'translate3d(' + translateX + '%, 0, 0)';
+      });
+      overlayState = state;
+    }
+  };
 
   var enableAnimation = function() {
     $element.addClass('animate');
+    $overlay.addClass('animate');
   };
   
   var disableAnimation = function() {
     $element.removeClass('animate');
+    $overlay.removeClass('animate');
   };
 
   // Check if this is on target or not
@@ -86,14 +105,17 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
     ionic.requestAnimationFrame(function() {
       var translateX = 0;
+      var opacity = 0;
       
       if (newX < (-width / 2)) {
         translateX = -width;
         drawerState = STATE_CLOSE;
       } else {
+        opacity = 1;
         drawerState = STATE_OPEN;
       }
       
+      overlayEl.style.opacity = opacity;
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + translateX + 'px, 0, 0)';
     });
   };
@@ -121,7 +143,15 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     } else {
       console.log(lastX, offsetX, lastX - offsetX);
       newX = Math.min(0, (-width + (lastX - offsetX)));
+      
+      var opacity = 1 + (this.newX / this.width);
+      
+      if (opacity < 0) {
+        opacity = 0;
+      }
+      
       ionic.requestAnimationFrame(function() {
+        overlayEl.style.opacity = opacity;
         el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + newX + 'px, 0, 0)';
       }); 
     }
@@ -133,19 +163,24 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
   $ionicGesture.on('drag', doDrag, $document);
   $ionicGesture.on('dragend', doEndDrag, $document);
+  $overlay.on('click', this.close);
   
   this.close = function() {
-    enableAnimation();
     drawerState = STATE_CLOSE;
+    enableAnimation();
+    toggleOverlay(STATE_CLOSE);
     ionic.requestAnimationFrame(function() {
+      overlayEl.style.opacity = 0;
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + (side === SIDE_LEFT ? '-' : '') + '100%, 0, 0)';
     });
   };
 
   this.open = function() {
-    enableAnimation();
     drawerState = STATE_OPEN;
+    enableAnimation();
+    toggleOverlay(STATE_OPEN);
     ionic.requestAnimationFrame(function() {
+      overlayEl.style.opacity = 1;
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(0, 0, 0)';
     });
   };

From 235d3e43eac81f70ab72fc96eb496312928ffd02 Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 18:44:18 +0200
Subject: [PATCH 06/25] Add drawer-overlay styles

---
 ionic.contrib.drawer.css | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/ionic.contrib.drawer.css b/ionic.contrib.drawer.css
index 37a450c..1401a34 100644
--- a/ionic.contrib.drawer.css
+++ b/ionic.contrib.drawer.css
@@ -17,6 +17,7 @@ drawer.left {
   transform: translate3d(-100%, 0, 0);
   box-shadow: 1px 0px 10px rgba(0,0,0,0.3);
 }
+
 drawer.right {
   right: 0;
   top: 0;
@@ -24,3 +25,21 @@ drawer.right {
   transform: translate3d(100%, 0, 0);
   box-shadow: -1px 0px 10px rgba(0,0,0,0.3);
 }
+
+.drawer-overlay {
+  background-color: rgba(0, 0, 0, 0.6);
+  opacity: 0;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 99;
+  -webkit-transform: translate3d(-100%, 0, 0);
+  transform: translate3d(-100%, 0, 0);
+}
+
+.drawer-overlay.animate {
+  -webkit-transition: 0.4s opacity ease-in-out;
+  transition: 0.4s opacity ease-in-out;
+}

From fc231b8f243292a6655132956b81768fbdeb3e1f Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 18:48:19 +0200
Subject: [PATCH 07/25] Optimise drawer transition

---
 ionic.contrib.drawer.css | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ionic.contrib.drawer.css b/ionic.contrib.drawer.css
index 1401a34..635c2c4 100644
--- a/ionic.contrib.drawer.css
+++ b/ionic.contrib.drawer.css
@@ -8,8 +8,8 @@ drawer {
 }
 
 drawer.animate {
-  -webkit-transition: 0.4s all ease-in-out;
-  transition: 0.4s all ease-in-out;
+  -webkit-transition: -webkit-transform 0.4s ease-in-out;
+  transition: transform 0.4s ease-in-out;
 }
 
 drawer.left {

From 2c133c6c34ce25284ac369851a138bc86be4cb24 Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 18:50:38 +0200
Subject: [PATCH 08/25] Fix drag when drawer is opened

---
 ionic.contrib.drawer.js | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index b585ccc..1621827 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -144,6 +144,16 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       console.log(lastX, offsetX, lastX - offsetX);
       newX = Math.min(0, (-width + (lastX - offsetX)));
       
+      if (drawerState === STATE_OPEN) {
+        if (lastX > startX) {
+          return;
+        }
+      } else {
+        if (lastX < startX) {
+          return;
+        }
+      }
+      
       var opacity = 1 + (this.newX / this.width);
       
       if (opacity < 0) {

From fb73dd6cf9cccfa77af6dac8f756ad266fb6ad4d Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 18:56:57 +0200
Subject: [PATCH 09/25] HardwareBackButton support

---
 ionic.contrib.drawer.js | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index 1621827..bff37f5 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -9,7 +9,7 @@
  */
 angular.module('ionic.contrib.drawer', ['ionic'])
 
-.controller('drawerCtrl', ['$element', '$attrs', '$ionicGesture', '$document', function($element, $attr, $ionicGesture, $document) {
+.controller('drawerCtrl', ['$element', '$attrs', '$ionicGesture', '$document', '$ionicPlatform', function($element, $attr, $ionicGesture, $document, $ionicPlatform) {
   var el = $element[0];
   var dragging = false;
   var startX, lastX, offsetX, newX;
@@ -29,6 +29,9 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   var side = $attr.side === SIDE_LEFT ? SIDE_LEFT : SIDE_RIGHT;
   var width = el.clientWidth;
   
+  // Handle back button
+  var unregisterBackAction;
+  
   // Current State of Drawer
   var drawerState = STATE_CLOSE;
   
@@ -170,6 +173,10 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       e.gesture.srcEvent.preventDefault();
     }
   };
+  
+  var hardwareBackCallback = function() {
+    this.close();
+  }.bind(this);
 
   $ionicGesture.on('drag', doDrag, $document);
   $ionicGesture.on('dragend', doEndDrag, $document);
@@ -183,6 +190,10 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       overlayEl.style.opacity = 0;
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + (side === SIDE_LEFT ? '-' : '') + '100%, 0, 0)';
     });
+    
+    if (unregisterBackAction) {
+      unregisterBackAction();
+    }
   };
 
   this.open = function() {
@@ -193,6 +204,8 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       overlayEl.style.opacity = 1;
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(0, 0, 0)';
     });
+    
+    unregisterBackAction = $ionicPlatform.registerBackButtonAction(hardwareBackCallback, 100);
   };
   
   this.isOpen = function() {

From e6878e5801c1867f0f278a92e6cf5a27b9de44bd Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 19:00:23 +0200
Subject: [PATCH 10/25] remove semi-colon from "drawer" directive

---
 ionic.contrib.drawer.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index bff37f5..17b948a 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -239,7 +239,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       };
     }
   }
-}]);
+}])
 
 .directive('drawerClose', ['$rootScope', function($rootScope) {
   return {

From 55dd45a30d8e93de1dd34c959e2235194b90466c Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 20:11:02 +0200
Subject: [PATCH 11/25] Remove bracket from "isTarget" method

---
 ionic.contrib.drawer.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index 17b948a..68728e6 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -65,7 +65,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   // Check if this is on target or not
   var isTarget = function(targetEl) {
     while (targetEl) {
-      if (targetEl === el]) {
+      if (targetEl === el) {
         return true;
       }
       targetEl = targetEl.parentNode;

From abb17d84d1869b403f2d541978e95221b06f341f Mon Sep 17 00:00:00 2001
From: Vitaly Rotari <cky.adc@gmail.com>
Date: Thu, 19 Feb 2015 20:16:35 +0200
Subject: [PATCH 12/25] Improve dragging

---
 ionic.contrib.drawer.js | 46 +++++++++++++++++++++++++++--------------
 1 file changed, 30 insertions(+), 16 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index 68728e6..1622d8a 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -12,7 +12,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 .controller('drawerCtrl', ['$element', '$attrs', '$ionicGesture', '$document', '$ionicPlatform', function($element, $attr, $ionicGesture, $document, $ionicPlatform) {
   var el = $element[0];
   var dragging = false;
-  var startX, lastX, offsetX, newX;
+  var startX, lastX, offsetX, newX, startY, lastY, startDir;
 
   // How far to drag before triggering
   var thresholdX = 15;
@@ -92,9 +92,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   };
 
   var doEndDrag = function(e) {
-    startX = null;
-    lastX = null;
-    offsetX = null;
+    startX = lastX = offsetX = startY = lastY = startDir = null;
     isTargetDrag = false;
 
     if (!dragging) {
@@ -127,12 +125,38 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     if (e.defaultPrevented) {
       return;
     }
+    
+    var finger = e.gesture.touches[0];
+    var dir = e.gesture.direction;
 
     if (!lastX) {
-      startX = e.gesture.touches[0].pageX;
+      startX = finger.pageX;
+    }
+
+    if (!lastY) {
+      startY = finger.pageY;
+    }
+
+    if (!startDir) {
+      startDir = dir;
     }
 
-    lastX = e.gesture.touches[0].pageX;
+    lastX = finger.pageX;
+    lastY = finger.pageY;
+    
+    if (Math.abs(lastY - startY) > thresholdX && (startDir === 'down' || startDir === 'up')) {
+      return;
+    }
+    
+    if (drawerState === STATE_OPEN) {
+      if (dir === SIDE_RIGHT) {
+        return;
+      }
+    } else {
+      if (dir === SIDE_LEFT) {
+        return;
+      }
+    }
 
     if (!dragging) {
       // Dragged 15 pixels and finger is by edge
@@ -147,16 +171,6 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       console.log(lastX, offsetX, lastX - offsetX);
       newX = Math.min(0, (-width + (lastX - offsetX)));
       
-      if (drawerState === STATE_OPEN) {
-        if (lastX > startX) {
-          return;
-        }
-      } else {
-        if (lastX < startX) {
-          return;
-        }
-      }
-      
       var opacity = 1 + (this.newX / this.width);
       
       if (opacity < 0) {

From 34b485c8be9bc2303d2994f7100001afc248d39b Mon Sep 17 00:00:00 2001
From: Vitalie Rotari <cky.adc@gmail.com>
Date: Fri, 20 Feb 2015 10:09:01 +0200
Subject: [PATCH 13/25] Fix demo

---
 index.html | 11 +++--------
 1 file changed, 3 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index 0382143..c0c1271 100644
--- a/index.html
+++ b/index.html
@@ -4,15 +4,10 @@
     <meta charset="utf-8">
     <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
     <title>Ionic Seed App</title>
-
-    <!-- ionic css -->
-    <!--<link href="http://code.ionicframework.com/1.0.0-beta.13/css/ionic.css" rel="stylesheet">-->
-    <link href="../ionic/dist/css/ionic.css" rel="stylesheet">
+    <link href="http://code.ionicframework.com/1.0.0-beta.14/css/ionic.css" rel="stylesheet">
     <link rel="stylesheet" href="ionic.contrib.drawer.css">
-
     <!-- angularjs scripts -->
-    <script src="../ionic/dist/js/ionic.bundle.js"></script>
-
+    <script src="http://code.ionicframework.com/1.0.0-beta.14/js/ionic.bundle.js"></script>
     <script src="ionic.contrib.drawer.js"></script>
     <style>
       drawer {
@@ -41,7 +36,7 @@
     'starter' is the name of this angular module (js/app.js)
   -->
   <body ng-app="app">
-    <drawer side="left">
+    <drawer side="left" debug="true">
       <ion-content>
         <h2>Menu</h2>
         <button ng-click="closeDrawer()">Close</button>

From c55039fd824638e0c18e759d1c021bff7e0daece Mon Sep 17 00:00:00 2001
From: Vitalie Rotari <cky.adc@gmail.com>
Date: Fri, 20 Feb 2015 10:09:41 +0200
Subject: [PATCH 14/25] Drag improvements and debug mode

---
 ionic.contrib.drawer.js | 57 ++++++++++++++++++++++-------------------
 1 file changed, 31 insertions(+), 26 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index 1622d8a..3a9ee24 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -12,7 +12,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 .controller('drawerCtrl', ['$element', '$attrs', '$ionicGesture', '$document', '$ionicPlatform', function($element, $attr, $ionicGesture, $document, $ionicPlatform) {
   var el = $element[0];
   var dragging = false;
-  var startX, lastX, offsetX, newX, startY, lastY, startDir;
+  var startX, lastX, offsetX, newX, startDir;
 
   // How far to drag before triggering
   var thresholdX = 15;
@@ -26,6 +26,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
   var isTargetDrag = false;
 
+  var debug = $attr.debug || false;
   var side = $attr.side === SIDE_LEFT ? SIDE_LEFT : SIDE_RIGHT;
   var width = el.clientWidth;
   
@@ -41,6 +42,13 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   var overlayState = STATE_CLOSE;
   
   $element.parent().prepend(this.overlayElement);
+
+  var log = function() {
+    if (debug) {
+      var args = Array.prototype.slice.call(arguments, 0);
+      console.log.apply(console, args);
+    }
+  };
   
   var toggleOverlay = function(state) {
     if (overlayState !== state) {
@@ -77,8 +85,8 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
     dragging = true;
     offsetX = lastX - startX;
-    console.log('Starting drag');
-    console.log('Offset:', offsetX);
+    log('Starting drag');
+    log('Offset:', offsetX);
   };
 
   var startTargetDrag = function(e) {
@@ -87,12 +95,12 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     dragging = true;
     isTargetDrag = true;
     offsetX = lastX - startX;
-    console.log('Starting target drag');
-    console.log('Offset:', offsetX);
+    log('Starting target drag');
+    log('Offset:', offsetX);
   };
 
   var doEndDrag = function(e) {
-    startX = lastX = offsetX = startY = lastY = startDir = null;
+    startX = lastX = offsetX = startDir = null;
     isTargetDrag = false;
 
     if (!dragging) {
@@ -101,7 +109,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
     dragging = false;
 
-    console.log('End drag');
+    log('End drag');
     enableAnimation();
 
     ionic.requestAnimationFrame(function() {
@@ -133,34 +141,33 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       startX = finger.pageX;
     }
 
-    if (!lastY) {
-      startY = finger.pageY;
-    }
-
     if (!startDir) {
       startDir = dir;
     }
 
     lastX = finger.pageX;
-    lastY = finger.pageY;
+
+    log(dir);
     
-    if (Math.abs(lastY - startY) > thresholdX && (startDir === 'down' || startDir === 'up')) {
+    if (startDir === 'down' || startDir === 'up') {
       return;
     }
-    
-    if (drawerState === STATE_OPEN) {
-      if (dir === SIDE_RIGHT) {
-        return;
-      }
-    } else {
-      if (dir === SIDE_LEFT) {
-        return;
-      }
-    }
+
+    e.gesture.srcEvent.stopImmediatePropagation();
 
     if (!dragging) {
       // Dragged 15 pixels and finger is by edge
       if (Math.abs(lastX - startX) > thresholdX) {
+        if (drawerState === STATE_OPEN) {
+          if (dir === SIDE_RIGHT) {
+            return;
+          }
+        } else {
+          if (dir === SIDE_LEFT) {
+            return;
+          }
+        }
+
         if (isTarget(e.target)) {
           startTargetDrag(e);
         } else if(startX < edgeX) {
@@ -168,7 +175,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
         } 
       }
     } else {
-      console.log(lastX, offsetX, lastX - offsetX);
+      log(lastX, offsetX, lastX - offsetX);
       newX = Math.min(0, (-width + (lastX - offsetX)));
       
       var opacity = 1 + (this.newX / this.width);
@@ -235,12 +242,10 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       $element.addClass($attr.side);
       
       $scope.openDrawer = function() {
-        console.log('open');
         ctrl.open();
       };
       
       $scope.closeDrawer = function() {
-        console.log('close');
         ctrl.close();
       };
       

From 9f642399e8f9b3a8bf56310a7b1a09f373a0d24f Mon Sep 17 00:00:00 2001
From: Vitalie Rotari <cky.adc@gmail.com>
Date: Fri, 20 Feb 2015 10:32:12 +0200
Subject: [PATCH 15/25] Fix stopImmediatePropagation

---
 ionic.contrib.drawer.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index 3a9ee24..a2e4ae7 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -153,8 +153,6 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       return;
     }
 
-    e.gesture.srcEvent.stopImmediatePropagation();
-
     if (!dragging) {
       // Dragged 15 pixels and finger is by edge
       if (Math.abs(lastX - startX) > thresholdX) {
@@ -175,6 +173,8 @@ angular.module('ionic.contrib.drawer', ['ionic'])
         } 
       }
     } else {
+      e.gesture.srcEvent.stopImmediatePropagation();
+
       log(lastX, offsetX, lastX - offsetX);
       newX = Math.min(0, (-width + (lastX - offsetX)));
       

From f242bdbc8f1346f4916b51bf6fe076a2451dca67 Mon Sep 17 00:00:00 2001
From: Vitalie Rotari <cky.adc@gmail.com>
Date: Fri, 20 Feb 2015 11:39:17 +0200
Subject: [PATCH 16/25] Optimise "isClose" method

---
 ionic.contrib.drawer.js | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index a2e4ae7..fb6b0e8 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -80,6 +80,10 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     }
   };
 
+  var isOpen = function() {
+    return drawerState === STATE_OPEN;
+  };
+
   var startDrag = function(e) {
     disableAnimation();
 
@@ -229,9 +233,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     unregisterBackAction = $ionicPlatform.registerBackButtonAction(hardwareBackCallback, 100);
   };
   
-  this.isOpen = function() {
-    return (drawerState === STATE_OPEN);
-  };
+  this.isOpen = isOpen;
 }])
 
 .directive('drawer', ['$rootScope', '$ionicGesture', function($rootScope, $ionicGesture) {

From 12248c45a03d398fdc9f23fc77658b322fa71016 Mon Sep 17 00:00:00 2001
From: Vitalie Rotari <cky.adc@gmail.com>
Date: Fri, 20 Feb 2015 11:41:36 +0200
Subject: [PATCH 17/25] Add support for fast swipe

---
 ionic.contrib.drawer.js | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index fb6b0e8..dda9dea 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -160,7 +160,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     if (!dragging) {
       // Dragged 15 pixels and finger is by edge
       if (Math.abs(lastX - startX) > thresholdX) {
-        if (drawerState === STATE_OPEN) {
+        if (isOpen()) {
           if (dir === SIDE_RIGHT) {
             return;
           }
@@ -180,7 +180,22 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       e.gesture.srcEvent.stopImmediatePropagation();
 
       log(lastX, offsetX, lastX - offsetX);
+
+      if (e.gesture.deltaTime < 200) {
+        if (isOpen()) {
+          if (dir === SIDE_LEFT) {
+            return newX = -width;
+          }
+        } else {
+          if (dir === SIDE_RIGHT) {
+            return newX = 0;
+          }
+        }
+      }
+
       newX = Math.min(0, (-width + (lastX - offsetX)));
+
+      log('newX:', newX, 'With:', (-width / 2));
       
       var opacity = 1 + (this.newX / this.width);
       

From fe9fd336f027f0310757d4e6cf3c9f89e9c334ee Mon Sep 17 00:00:00 2001
From: Vitalie Rotari <cky.adc@gmail.com>
Date: Fri, 20 Feb 2015 11:44:28 +0200
Subject: [PATCH 18/25] Cleanup code, remove console.log spams (use Developers
 Tools for debug)

---
 ionic.contrib.drawer.js | 42 +++++++++++------------------------------
 1 file changed, 11 insertions(+), 31 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index dda9dea..1aa9a8d 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -26,7 +26,6 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
   var isTargetDrag = false;
 
-  var debug = $attr.debug || false;
   var side = $attr.side === SIDE_LEFT ? SIDE_LEFT : SIDE_RIGHT;
   var width = el.clientWidth;
   
@@ -42,13 +41,6 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   var overlayState = STATE_CLOSE;
   
   $element.parent().prepend(this.overlayElement);
-
-  var log = function() {
-    if (debug) {
-      var args = Array.prototype.slice.call(arguments, 0);
-      console.log.apply(console, args);
-    }
-  };
   
   var toggleOverlay = function(state) {
     if (overlayState !== state) {
@@ -86,11 +78,8 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
   var startDrag = function(e) {
     disableAnimation();
-
     dragging = true;
     offsetX = lastX - startX;
-    log('Starting drag');
-    log('Offset:', offsetX);
   };
 
   var startTargetDrag = function(e) {
@@ -99,8 +88,6 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     dragging = true;
     isTargetDrag = true;
     offsetX = lastX - startX;
-    log('Starting target drag');
-    log('Offset:', offsetX);
   };
 
   var doEndDrag = function(e) {
@@ -113,21 +100,20 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
     dragging = false;
 
-    log('End drag');
     enableAnimation();
 
+    var translateX = 0;
+    var opacity = 0;
+    
+    if (newX < (-width / 2)) {
+      translateX = -width;
+      drawerState = STATE_CLOSE;
+    } else {
+      opacity = 1;
+      drawerState = STATE_OPEN;
+    }
+
     ionic.requestAnimationFrame(function() {
-      var translateX = 0;
-      var opacity = 0;
-      
-      if (newX < (-width / 2)) {
-        translateX = -width;
-        drawerState = STATE_CLOSE;
-      } else {
-        opacity = 1;
-        drawerState = STATE_OPEN;
-      }
-      
       overlayEl.style.opacity = opacity;
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + translateX + 'px, 0, 0)';
     });
@@ -150,8 +136,6 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     }
 
     lastX = finger.pageX;
-
-    log(dir);
     
     if (startDir === 'down' || startDir === 'up') {
       return;
@@ -179,8 +163,6 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     } else {
       e.gesture.srcEvent.stopImmediatePropagation();
 
-      log(lastX, offsetX, lastX - offsetX);
-
       if (e.gesture.deltaTime < 200) {
         if (isOpen()) {
           if (dir === SIDE_LEFT) {
@@ -195,8 +177,6 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
       newX = Math.min(0, (-width + (lastX - offsetX)));
 
-      log('newX:', newX, 'With:', (-width / 2));
-      
       var opacity = 1 + (this.newX / this.width);
       
       if (opacity < 0) {

From 407479d12a39c484d00fa01da528af5f92ecc75c Mon Sep 17 00:00:00 2001
From: Vitalie Rotari <cky.adc@gmail.com>
Date: Fri, 20 Feb 2015 11:44:59 +0200
Subject: [PATCH 19/25] Remove debug attribute

---
 index.html | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/index.html b/index.html
index c0c1271..1df22ca 100644
--- a/index.html
+++ b/index.html
@@ -31,12 +31,11 @@
       }
     </style>
   </head>
-
   <!-- 
     'starter' is the name of this angular module (js/app.js)
   -->
   <body ng-app="app">
-    <drawer side="left" debug="true">
+    <drawer side="left">
       <ion-content>
         <h2>Menu</h2>
         <button ng-click="closeDrawer()">Close</button>

From 24814dd2350a3cb8dd891aefe3971fe8a65dba6f Mon Sep 17 00:00:00 2001
From: Vitalie Rotari <cky.adc@gmail.com>
Date: Fri, 20 Feb 2015 12:01:59 +0200
Subject: [PATCH 20/25] Fix drawer overlay

---
 ionic.contrib.drawer.js | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index 1aa9a8d..af35b0c 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -40,12 +40,12 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   var overlayEl = $overlay[0];
   var overlayState = STATE_CLOSE;
   
-  $element.parent().prepend(this.overlayElement);
+  $element.parent().prepend(overlayEl);
   
   var toggleOverlay = function(state) {
     if (overlayState !== state) {
       ionic.requestAnimationFrame(function() {
-        var translateX = state === STATE_CLOSE ? '0' : '-100';
+        var translateX = state === STATE_CLOSE ? '-100' : '0';
         overlayEl.style[ionic.CSS.TRANSFORM] = 'translate3d(' + translateX + '%, 0, 0)';
       });
       overlayState = state;
@@ -78,12 +78,15 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
   var startDrag = function(e) {
     disableAnimation();
+    toggleOverlay(STATE_OPEN);
+
     dragging = true;
     offsetX = lastX - startX;
   };
 
   var startTargetDrag = function(e) {
     disableAnimation();
+    toggleOverlay(STATE_OPEN);
 
     dragging = true;
     isTargetDrag = true;
@@ -113,6 +116,8 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       drawerState = STATE_OPEN;
     }
 
+    toggleOverlay(drawerState);
+
     ionic.requestAnimationFrame(function() {
       overlayEl.style.opacity = opacity;
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + translateX + 'px, 0, 0)';
@@ -177,7 +182,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
       newX = Math.min(0, (-width + (lastX - offsetX)));
 
-      var opacity = 1 + (this.newX / this.width);
+      var opacity = 1 + (newX / width);
       
       if (opacity < 0) {
         opacity = 0;
@@ -197,15 +202,12 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   var hardwareBackCallback = function() {
     this.close();
   }.bind(this);
-
-  $ionicGesture.on('drag', doDrag, $document);
-  $ionicGesture.on('dragend', doEndDrag, $document);
-  $overlay.on('click', this.close);
   
   this.close = function() {
     drawerState = STATE_CLOSE;
     enableAnimation();
     toggleOverlay(STATE_CLOSE);
+
     ionic.requestAnimationFrame(function() {
       overlayEl.style.opacity = 0;
       el.style[ionic.CSS.TRANSFORM] = 'translate3d(' + (side === SIDE_LEFT ? '-' : '') + '100%, 0, 0)';
@@ -229,6 +231,10 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   };
   
   this.isOpen = isOpen;
+
+  $ionicGesture.on('drag', doDrag, $document);
+  $ionicGesture.on('dragend', doEndDrag, $document);
+  $overlay.on('click', this.close);
 }])
 
 .directive('drawer', ['$rootScope', '$ionicGesture', function($rootScope, $ionicGesture) {

From 9d95d671b62ab565aec6e372df88d0ff7d87f7c5 Mon Sep 17 00:00:00 2001
From: bace135 <bryane@rocketship.com>
Date: Thu, 30 Apr 2015 21:24:16 -0700
Subject: [PATCH 21/25] update drawer to work on right side

---
 ionic.contrib.drawer.js | 109 +++++++++++++++++++++++++---------------
 1 file changed, 69 insertions(+), 40 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index af35b0c..80c42ae 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -12,7 +12,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 .controller('drawerCtrl', ['$element', '$attrs', '$ionicGesture', '$document', '$ionicPlatform', function($element, $attr, $ionicGesture, $document, $ionicPlatform) {
   var el = $element[0];
   var dragging = false;
-  var startX, lastX, offsetX, newX, startDir;
+  var startX, lastX, offsetX, newX;
 
   // How far to drag before triggering
   var thresholdX = 15;
@@ -28,6 +28,8 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
   var side = $attr.side === SIDE_LEFT ? SIDE_LEFT : SIDE_RIGHT;
   var width = el.clientWidth;
+  var docWidth = $document[0].body.clientWidth;
+  console.log(docWidth)
   
   // Handle back button
   var unregisterBackAction;
@@ -94,7 +96,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   };
 
   var doEndDrag = function(e) {
-    startX = lastX = offsetX = startDir = null;
+    startX = lastX = offsetX = null;
     isTargetDrag = false;
 
     if (!dragging) {
@@ -108,12 +110,22 @@ angular.module('ionic.contrib.drawer', ['ionic'])
     var translateX = 0;
     var opacity = 0;
     
-    if (newX < (-width / 2)) {
-      translateX = -width;
-      drawerState = STATE_CLOSE;
-    } else {
-      opacity = 1;
-      drawerState = STATE_OPEN;
+    if (side === SIDE_RIGHT){
+      if (newX > width / 2) {
+        translateX = width;
+        drawerState = STATE_CLOSE;
+      } else {
+        opacity = 1;
+        drawerState = STATE_OPEN;
+      }      
+    } else if (side === SIDE_LEFT){
+      if (newX < (-width / 2)) {
+        translateX = -width;
+        drawerState = STATE_CLOSE;
+      } else {
+        opacity = 1;
+        drawerState = STATE_OPEN;
+      }
     }
 
     toggleOverlay(drawerState);
@@ -136,53 +148,82 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       startX = finger.pageX;
     }
 
-    if (!startDir) {
-      startDir = dir;
-    }
-
     lastX = finger.pageX;
     
-    if (startDir === 'down' || startDir === 'up') {
+    if (dir === 'down' || dir === 'up') {
       return;
     }
 
     if (!dragging) {
+      //here at just the beginning of drag
       // Dragged 15 pixels and finger is by edge
       if (Math.abs(lastX - startX) > thresholdX) {
-        if (isOpen()) {
-          if (dir === SIDE_RIGHT) {
-            return;
+        if (side === SIDE_LEFT){
+          if (isOpen()) {
+            if (dir === SIDE_RIGHT) {
+              return;
+            }
+          } else {
+            if (dir === SIDE_LEFT) {
+              return;
+            }
           }
-        } else {
-          if (dir === SIDE_LEFT) {
-            return;
+        } else if (side === SIDE_RIGHT){
+          if (isOpen()) {
+            if (dir === SIDE_LEFT) {
+              return;
+            }
+          } else {
+            if (dir === SIDE_RIGHT) {
+              return;
+            }
           }
         }
 
         if (isTarget(e.target)) {
           startTargetDrag(e);
-        } else if(startX < edgeX) {
+        } else if(startX < edgeX || startX > docWidth-edgeX) {
           startDrag(e);
         } 
       }
     } else {
+      //here when we are dragging
       e.gesture.srcEvent.stopImmediatePropagation();
 
+      // if fast gesture
       if (e.gesture.deltaTime < 200) {
-        if (isOpen()) {
-          if (dir === SIDE_LEFT) {
-            return newX = -width;
+        if (side === SIDE_LEFT){
+          if (isOpen()) {
+            if (dir === SIDE_LEFT) {
+              return newX = -width;
+            }
+          } else {
+            if (dir === SIDE_RIGHT) {
+              return newX = 0;
+            }
           }
-        } else {
-          if (dir === SIDE_RIGHT) {
-            return newX = 0;
+        } else if (side === SIDE_RIGHT){
+          if (isOpen()) {
+            if (dir === SIDE_RIGHT) {
+              return newX = width;
+            }
+          } else {
+            if (dir === SIDE_LEFT) {
+              return newX = 0;
+            }
           }
         }
       }
 
-      newX = Math.min(0, (-width + (lastX - offsetX)));
+      if (side === SIDE_LEFT){
+        newX = Math.min(0, (-width + (lastX - offsetX)));
+        var opacity = 1 + (newX / width);
+      }
+      else if (side === SIDE_RIGHT){
+        newX = Math.max(0, (width - (docWidth - lastX + offsetX)));
+        var opacity = 1 - (newX / width);
+      }
 
-      var opacity = 1 + (newX / width);
       
       if (opacity < 0) {
         opacity = 0;
@@ -261,18 +302,6 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       };
     }
   }
-}])
-
-.directive('drawerClose', ['$rootScope', function($rootScope) {
-  return {
-    restrict: 'A',
-    link: function($scope, $element) {
-      $element.bind('click', function() {
-        var drawerCtrl = $element.inheritedData('$drawerController');
-        drawerCtrl.close();
-      });
-    }
-  }
 }]);
 
 })();

From 007337dcdb15e938d100c704458caa3e64ac0958 Mon Sep 17 00:00:00 2001
From: bace135 <bryane@rocketship.com>
Date: Thu, 30 Apr 2015 23:21:28 -0700
Subject: [PATCH 22/25] updated README.md

---
 README.md | 56 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 56 insertions(+)

diff --git a/README.md b/README.md
index e28bdb6..a18a9dc 100644
--- a/README.md
+++ b/README.md
@@ -2,3 +2,59 @@ ionic-contrib-drawer
 ====================
 
 A side menu drawer for Ionic apps
+
+#####Setting up:
+
+Clone the ionic-ion-drawer repo into the lib folder in your ionic project so it looks like:
+
+*yourProjectName/www/lib/ionic-ion-drawer*
+
+Add the ionic-contrib-drawer.js and ionic-contrib-drawer.css files to your index file
+
+    <link href="lib/ionic-ion-drawer/ionic.contrib.drawer.css" rel="stylesheet">
+    <script src="lib/ionic-ion-drawer/ionic.contrib.drawer.js"></script>
+    
+Add ionic.contrib.drawer to your Angular app:
+
+    angular.module('App', [
+      'ionic',
+      'ionic.contrib.drawer'
+    ])
+
+#####Usage:
+
+ Add the `<drawer>` directive to your ionic templates or index.html files.
+
+#####Example:
+
+    <ion-view>
+      <ion-content>
+        <div class="bar bar-header bar-dark">
+          <h1 class="title">Example</h1>
+        </div>
+      </ion-content>
+      <drawer side="right">
+        <ion-content>
+          <h2>Menu</h2>
+          <button ng-click="closeDrawer()">Close</button>
+          <ion-list>
+            <ion-item>Friends</ion-item>
+            <ion-item>Favorites</ion-item>
+            <ion-item>Search</ion-item>
+          </ion-list>
+        </ion-content>
+      </drawer>
+    </ion-view>
+
+
+
+Change the 'side' attribute of the `<drawer>` to either "right" or "left" to switch the side the drawer opens from.
+
+#####Credits:
+
+driftyco: https://github.com/driftyco (original build)
+
+vitalyrotari: https://github.com/vitalyrotari (bug fixes, improved performance, background fading 
+transition)
+
+brybott: https://github.com/brybott (right side functionality)

From ad58e77e00939fa24e7346a40a56f63358af6b83 Mon Sep 17 00:00:00 2001
From: bace135 <bryane@rocketship.com>
Date: Fri, 1 May 2015 22:50:41 -0700
Subject: [PATCH 23/25] fixed closing from wrong side of screen

---
 ionic.contrib.drawer.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index 80c42ae..8c3c975 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -182,7 +182,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
 
         if (isTarget(e.target)) {
           startTargetDrag(e);
-        } else if(startX < edgeX || startX > docWidth-edgeX) {
+        } else if((startX < edgeX && side === SIDE_LEFT) || (startX > docWidth-edgeX && side === SIDE_RIGHT)) {
           startDrag(e);
         } 
       }
@@ -218,8 +218,7 @@ angular.module('ionic.contrib.drawer', ['ionic'])
       if (side === SIDE_LEFT){
         newX = Math.min(0, (-width + (lastX - offsetX)));
         var opacity = 1 + (newX / width);
-      }
-      else if (side === SIDE_RIGHT){
+      } else if (side === SIDE_RIGHT){
         newX = Math.max(0, (width - (docWidth - lastX + offsetX)));
         var opacity = 1 - (newX / width);
       }

From 0145d63e928f1f815c7743a26e3ede09f3488b0e Mon Sep 17 00:00:00 2001
From: Henri Toivar <henri.toivar@gmail.com>
Date: Thu, 23 Jul 2015 11:27:59 +0300
Subject: [PATCH 24/25] Also drag menu when drag is started from the overlay
 and reaches target

---
 .gitignore              | 1 +
 ionic.contrib.drawer.js | 3 ++-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/.gitignore b/.gitignore
index 726c3ca..41b70a5 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,2 @@
 .*.sw*
+/.idea
diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index 8c3c975..782a65e 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -180,7 +180,8 @@ angular.module('ionic.contrib.drawer', ['ionic'])
           }
         }
 
-        if (isTarget(e.target)) {
+        // Menu is open and drag has reached target
+        if (e.gesture.center.pageX < width && isOpen()) {
           startTargetDrag(e);
         } else if((startX < edgeX && side === SIDE_LEFT) || (startX > docWidth-edgeX && side === SIDE_RIGHT)) {
           startDrag(e);

From 8c7d3f76d9b6aa831e354388c41c293cf7aa8736 Mon Sep 17 00:00:00 2001
From: Taras Ivasyshyn <ipswebcat@gmail.com>
Date: Mon, 5 Oct 2015 11:33:51 +0200
Subject: [PATCH 25/25] Update ionic.contrib.drawer.js

Scope isolation
---
 ionic.contrib.drawer.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/ionic.contrib.drawer.js b/ionic.contrib.drawer.js
index 8c3c975..cb5d03c 100644
--- a/ionic.contrib.drawer.js
+++ b/ionic.contrib.drawer.js
@@ -281,6 +281,9 @@ angular.module('ionic.contrib.drawer', ['ionic'])
   return {
     restrict: 'E',
     controller: 'drawerCtrl',
+    scope: {
+      side: '=side'
+    },
     link: function($scope, $element, $attr, ctrl) {
       $element.addClass($attr.side);