diff --git a/src/Umbraco.Web.UI.Client/src/app.dev.js b/src/Umbraco.Web.UI.Client/src/app.dev.js
index 9a957f8b97..5115239ba5 100644
--- a/src/Umbraco.Web.UI.Client/src/app.dev.js
+++ b/src/Umbraco.Web.UI.Client/src/app.dev.js
@@ -6,6 +6,7 @@ var app = angular.module('umbraco', [
 	'umbraco.httpbackend',
     'ngCookies',
     'ngMobile',
+    
     /*'ui.sortable',*/
     'blueimp.fileupload'
 ]);
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/umbtree.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/umbtree.directive.js
index a695370ff7..8879c12b3b 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/umbtree.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/umbtree.directive.js
@@ -30,7 +30,7 @@ angular.module("umbraco.directives")
          if(!hideheader){ 
            template +='<div>' + 
            '<h5><a href="#{{section}}" class="root-link">{{tree.name}}</a></h5>' +
-               '<a href class="umb-options" ng-hide="tree.root.isContainer || !tree.root.menuUrl" ng-click="options(this, tree.root, $event)"><i></i><i></i><i></i></a>' +
+               '<a href class="umb-options" ng-hide="tree.root.isContainer || !tree.root.menuUrl" ng-click="options(this, tree.root, $event)" ng-swipe-right="options(this, tree.root, $event)"><i></i><i></i><i></i></a>' +
            '</div>';
          }
          template += '<ul>' +
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js
index 0c18a8755d..fb9ee99cbd 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js
@@ -30,7 +30,7 @@ angular.module("umbraco.directives")
       node:'='
     },
 
-    template: '<li><div ng-style="setTreePadding(node)" ng-class="{\'loading\': node.loading}">' +
+    template: '<li ng-swipe-right="options(this, node, $event)"><div ng-style="setTreePadding(node)" ng-class="{\'loading\': node.loading}">' +
         '<ins ng-hide="node.hasChildren" style="background:none;width:18px;"></ins>' +        
         '<ins ng-show="node.hasChildren" ng-class="{\'icon-navigation-right\': !node.expanded, \'icon-navigation-down\': node.expanded}" ng-click="load(this, node)"></ins>' +
         '<i title="#{{node.routePath}}" class="{{node.cssClass}}" style="{{node.style}}"></i>' +
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/dialog.service.js b/src/Umbraco.Web.UI.Client/src/common/services/dialog.service.js
index 64cbfc3d33..3cac289133 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/dialog.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/dialog.service.js
@@ -81,16 +81,16 @@ angular.module('umbraco.services')
            var callback = options.callback;
 
            //Modal dom obj and unique id
-           var $modal = $('<div data-backdrop="false"></div>');
+           var $modal = $('<div ng-swipe-left="hide()" ng-swipe-right="hide()"  data-backdrop="false"></div>');
            var id = templateUrl.replace('.html', '').replace('.aspx', '').replace(/[\/|\.|:\&\?\=]/g, "-") + '-' + scope.$id;
            
-           if(options.inline){
+          if(options.inline){
               animationClass = "";
               modalClass = "";
-           }else{
-               $modal.addClass("modal");
-               $modal.addClass("hide");
-           }
+          }else{
+                $modal.addClass("modal");
+                $modal.addClass("hide");
+          }
 
            //set the id and add classes
            $modal
diff --git a/src/Umbraco.Web.UI.Client/src/index.html b/src/Umbraco.Web.UI.Client/src/index.html
index f1368c2847..7b1800850e 100644
--- a/src/Umbraco.Web.UI.Client/src/index.html
+++ b/src/Umbraco.Web.UI.Client/src/index.html
@@ -9,7 +9,7 @@
     <link rel="stylesheet" href="assets/css/umbraco.css" />
 </head>
 
-<body ng-controller="Umbraco.MainController" id="umbracoMainPageBody">
+<body ng-class="{touch:touchDevice}" ng-controller="Umbraco.MainController" id="umbracoMainPageBody">
     <div ng-hide="!authenticated" ng-cloak ng-animate="'fade'" id="mainwrapper" class="clearfix" ng-click="closeDialogs($event)">
         <umb-navigation></umb-navigation>
         
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/main.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/main.controller.js
index 66890f5b6e..d63b2f15fd 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/main.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/main.controller.js
@@ -9,11 +9,9 @@
  * 
  */
 function MainController($scope, $routeParams, $rootScope, $timeout, $http, $log, notificationsService, userService, navigationService, legacyJsLoader) {
-    //debugmode so I can easily turn on/off json output of property models:
-    //TODO: find a better way
-    $scope.$umbdebugmode = true;
 
-    //set default properties
+    //detect if the current device is touch-enabled
+    $scope.touchDevice = (true === ("ontouchstart" in window || window.DocumentTouch && document instanceof DocumentTouch));
     
     //the null is important because we do an explicit bool check on this in the view
     //the avatar is by default the umbraco logo    
diff --git a/src/Umbraco.Web.UI.Client/src/views/directives/umb-contextmenu.html b/src/Umbraco.Web.UI.Client/src/views/directives/umb-contextmenu.html
index 327458f24e..dc16d0ed1f 100644
--- a/src/Umbraco.Web.UI.Client/src/views/directives/umb-contextmenu.html
+++ b/src/Umbraco.Web.UI.Client/src/views/directives/umb-contextmenu.html
@@ -1,4 +1,5 @@
 <div id='contextMenu' class="umb-modalcolumn fill shadow umb-panel"
+    ng-swipe-left="nav.hideMenu()"
     ng-show="nav.ui.showContextMenu" ng-animate="'slide'">
 
     <div class='umb-panel-header'>
diff --git a/src/Umbraco.Web.UI.Client/src/views/directives/umb-navigation.html b/src/Umbraco.Web.UI.Client/src/views/directives/umb-navigation.html
index d4e4862ed7..4c2b800501 100644
--- a/src/Umbraco.Web.UI.Client/src/views/directives/umb-navigation.html
+++ b/src/Umbraco.Web.UI.Client/src/views/directives/umb-navigation.html
@@ -1,4 +1,5 @@
-<div id="leftcolumn" ng-controller="Umbraco.NavigationController" ng-mouseleave="nav.leaveTree()" ng-mouseenter="nav.enterTree()" >
+<div id="leftcolumn" ng-controller="Umbraco.NavigationController" 
+    ng-mouseleave="nav.leaveTree()" ng-mouseenter="nav.enterTree()" >
     <div id="applications" ng-class="{faded:nav.ui.stickyNavigation}">
         <ul class="sections">
             
@@ -32,7 +33,7 @@
             ng-show="nav.ui.showNavigation" 
             ng-animate="'slide'">
 
-        <div class="navigation-inner-container span6">
+        <div ng-swipe-left="nav.hideNavigation()" class="navigation-inner-container span6">
             <!-- the search -->
             <div id="search-form" ng-animate="'slide'">
                 <div class="umb-panel-header">
@@ -63,7 +64,6 @@
                     </li>
 
                 </ul>
-
             </div>
             
 
@@ -71,7 +71,6 @@
             <div id="tree" class="umb-panel fill" ng-animate="'slide'">
                 <umb-tree eventhandler="treeEventHandler" section="{{nav.ui.currentSection}}" ></umb-tree>
             </div>
-
         </div>
 
         <div class="offset6">
@@ -80,6 +79,7 @@
             
             <!-- Tree dialogs -->
             <div id="dialog" class='umb-modalcolumn fill shadow umb-panel'
+                ng-swipe-left="nav.hideDialog()"
                 ng-show="nav.ui.showContextMenuDialog" ng-animate="'slide'">
                 <div class='umb-panel-header'>
                     <h1>{{nav.ui.dialogTitle}}</h1>
