add swipeEnabled input to menu to set default swipeable of side menu. add swipeEnable() api to enable disable particular side menu swipeable

ionic/components/menu/menu.ts

@@ -96,7 +96,8 @@ import {MenuType} from './menu-types';
   host: {
     'role': 'navigation',
     '[attr.side]': 'side',
-    '[attr.type]': 'type'
+    '[attr.type]': 'type',
+    '[attr.swipeEnabled]': 'swipeEnabled'
   },
   template: '<ng-content></ng-content><div tappable disable-activated class="backdrop"></div>',
   directives: [forwardRef(() => MenuBackdrop)]
@@ -107,9 +108,10 @@ export class Menu extends Ion {
   private _gesture: Gesture;
   private _targetGesture: Gesture;
   private _type: MenuType;
-  
+
   isOpen: boolean = false;
   isEnabled: boolean = true;
+  isSwipeEnabled: boolean = true;
   backdrop: MenuBackdrop;
   onContentClick: EventListener;
 
@@ -117,8 +119,9 @@ export class Menu extends Ion {
   @Input() id: string;
   @Input() side: string;
   @Input() type: string;
+  @Input() swipeEnabled: string;
   @Input() maxEdgeStart;
-  
+
   @Output() opening: EventEmitter<any> = new EventEmitter();
 
   constructor(
@@ -150,6 +153,10 @@ export class Menu extends Ion {
     }
     self._renderer.setElementAttribute(self._elementRef, 'side', self.side);
 
+    if (self.swipeEnabled === 'false') {
+      self.isSwipeEnabled = false;
+    }
+
     if (!self.id) {
       // Auto register
       self.id = self.side + 'Menu';
@@ -244,7 +251,7 @@ export class Menu extends Ion {
    */
   setProgressStart() {
     // user started swiping the menu open/close
-    if (this._isPrevented() || !this.isEnabled) return;
+    if (this._isPrevented() || !this.isEnabled || !this.isSwipeEnabled) return;
 
     this._before();
 
@@ -256,7 +263,7 @@ export class Menu extends Ion {
    */
   setProgess(value) {
     // user actively dragging the menu
-    if (this.isEnabled) {
+    if (this.isEnabled && this.isSwipeEnabled) {
       this._prevent();
       this._getType().setProgess(value);
       this.opening.next(value);
@@ -268,7 +275,7 @@ export class Menu extends Ion {
    */
   setProgressEnd(shouldComplete) {
     // user has finished dragging the menu
-    if (this.isEnabled) {
+    if (this.isEnabled && this.isSwipeEnabled) {
       this._prevent();
       this._getType().setProgressEnd(shouldComplete).then(isOpen => {
         this._after(isOpen);
@@ -371,6 +378,16 @@ export class Menu extends Ion {
     return this;
   }
 
+  /**
+   * Used to enable or disable the ability to swipe open the menu.
+   * @param {boolean} shouldEnable  True if it should be swipe-able, false if not.
+   * @return {Menu}  Returns the instance of the menu, which is useful for chaining.
+   */
+  swipeEnable(shouldEnable) {
+    this.isSwipeEnabled = shouldEnable;
+    return this;
+  }
+
   /**
    * @private
    */

ionic/components/menu/test/disable-swipe/index.ts

@@ -0,0 +1,35 @@
+import {App, IonicApp, Page, NavController} from 'ionic/ionic';
+
+@Page({
+  templateUrl: 'page1.html'
+})
+class Page1 {
+  leftMenuSwipeEnabled: boolean = true;
+  rightMenuSwipeEnabled: boolean = false;
+
+  constructor(app: IonicApp) {
+    this.app = app;
+  }
+
+  toggleLeftMenuSwipeable() {
+    this.leftMenuSwipeEnabled = !this.leftMenuSwipeEnabled;
+
+    this.app.getComponent('leftMenu').swipeEnable(this.leftMenuSwipeEnabled);
+  }
+
+  toggleRightMenuSwipeable() {
+    this.rightMenuSwipeEnabled = !this.rightMenuSwipeEnabled;
+
+    this.app.getComponent('rightMenu').swipeEnable(this.rightMenuSwipeEnabled);
+  }
+}
+
+
+@App({
+  templateUrl: 'main.html'
+})
+class E2EApp {
+  constructor() {
+    this.rootView = Page1;
+  }
+}

ionic/components/menu/test/disable-swipe/main.html

@@ -0,0 +1,40 @@
+<ion-menu [content]="content" id="leftMenu" side="left">
+
+  <ion-toolbar secondary>
+    <ion-title>Left Menu</ion-title>
+  </ion-toolbar>
+
+  <ion-content>
+
+    <ion-list>
+
+      <button ion-item>
+        Left Item 1
+      </button>
+
+    </ion-list>
+  </ion-content>
+
+</ion-menu>
+
+
+<ion-menu [content]="content" id="rightMenu" side="right" swipeEnabled="false">
+
+  <ion-toolbar danger>
+    <ion-title>Right Menu</ion-title>
+  </ion-toolbar>
+
+  <ion-content>
+
+    <ion-list>
+
+      <button ion-item>
+        Right Item 1
+      </button>
+
+    </ion-list>
+  </ion-content>
+
+</ion-menu>
+
+<ion-nav id="nav" [root]="rootView" #content swipe-back-enabled="false"></ion-nav>

ionic/components/menu/test/disable-swipe/page1.html

@@ -0,0 +1,33 @@
+<ion-navbar *navbar>
+
+  <button menuToggle="leftMenu">
+    <ion-icon name="menu"></ion-icon>
+  </button>
+
+  <ion-title>
+    Main
+  </ion-title>
+
+  <button menuToggle="rightMenu" right secondary>
+    <ion-icon name="menu"></ion-icon>
+  </button>
+</ion-navbar>
+
+
+<ion-content padding>
+
+  <h3>Page 1</h3>
+
+  <p>Left Menu Swipe Enabled: {{ leftMenuSwipeEnabled }}</p>
+
+  <p>
+    <button (click)="toggleLeftMenuSwipeable()">Toggle Left Menu Swipeable</button>
+  </p>
+
+  <p>Right Menu Swipe Enabled: {{ rightMenuSwipeEnabled }}</p>
+
+  <p>
+    <button (click)="toggleRightMenuSwipeable()">Toggle Right Menu Swipeable</button>
+  </p>
+
+</ion-content>