diff --git a/src/js/controller/mail-list.js b/src/js/controller/mail-list.js
index 8afdb87..0e677b9 100644
--- a/src/js/controller/mail-list.js
+++ b/src/js/controller/mail-list.js
@@ -275,6 +275,29 @@ define(function(require) {
 
     var ngModule = angular.module('mail-list', []);
 
+    ngModule.directive('woTouch', function($parse) {
+        return function(scope, elm, attrs) {
+            var handler = $parse(attrs.woTouch);
+
+            elm.on('touchstart', function() {
+                elm.addClass('active');
+            });
+            elm.on('touchleave touchcancel touchmove', function() {
+                elm.removeClass('active');
+            });
+
+            elm.on('touchend click', function(event) {
+                event.preventDefault();
+                elm.removeClass('active');
+                scope.$apply(function() {
+                    handler(scope, {
+                        $event: event
+                    });
+                });
+            });
+        };
+    });
+
     ngModule.directive('listScroll', function() {
         return {
             link: function(scope, elm, attrs) {
diff --git a/src/tpl/about.html b/src/tpl/about.html
index caf7399..0b459cd 100644
--- a/src/tpl/about.html
+++ b/src/tpl/about.html
@@ -1,6 +1,6 @@
 <div class="lightbox-body" ng-controller="AboutCtrl">
   <header>
-    <button class="close" ng-click="state.about.toggle(false)" data-action="lightbox-close">&#xe007;</button>
+    <button class="close" wo-touch="state.about.toggle(false)" data-action="lightbox-close">&#xe007;</button>
   </header>
 
   <div class="content">
diff --git a/src/tpl/account.html b/src/tpl/account.html
index b535022..ca2d7ae 100644
--- a/src/tpl/account.html
+++ b/src/tpl/account.html
@@ -1,7 +1,7 @@
 <div class="lightbox-body" ng-controller="AccountCtrl">
   <header>
     <h2>Account</h2>
-    <button class="close" ng-click="state.account.toggle(false)" data-action="lightbox-close">&#xe007;</button>
+    <button class="close" wo-touch="state.account.toggle(false)" data-action="lightbox-close">&#xe007;</button>
   </header>
 
   <div class="content">
@@ -29,8 +29,8 @@
       </table>
 
       <div class="control">
-        <button ng-click="state.account.toggle(false); state.setPassphrase.toggle(true)" class="btn btn-alt">Set passphrase</button>
-        <button ng-click="exportKeyFile()" class="btn">Export keypair</button>
+        <button wo-touch="state.account.toggle(false); state.setPassphrase.toggle(true)" class="btn btn-alt">Set passphrase</button>
+        <button wo-touch="exportKeyFile()" class="btn">Export keypair</button>
       </div>
 
     </div><!-- /.view-account -->
diff --git a/src/tpl/add-account.html b/src/tpl/add-account.html
index 534a131..572a897 100644
--- a/src/tpl/add-account.html
+++ b/src/tpl/add-account.html
@@ -3,7 +3,7 @@
   <h1>Select email account</h1>
 
   <ul>
-    <li class="google enabled" popover="#google-info" ng-click="connectToGoogle()">
+    <li class="google enabled" popover="#google-info" wo-touch="connectToGoogle()">
       <div><img src="img/google_logo.png" alt="Google Mail"></div>
     </li>
     <li class="whiteout disabled" popover="#whiteout-info">
diff --git a/src/tpl/contacts.html b/src/tpl/contacts.html
index 4d0eb5c..bc46620 100644
--- a/src/tpl/contacts.html
+++ b/src/tpl/contacts.html
@@ -1,7 +1,7 @@
 <div class="lightbox-body" ng-controller="ContactsCtrl">
   <header>
     <h2>Contacts</h2>
-    <button class="close" ng-click="state.contacts.toggle(false)" data-action="lightbox-close">&#xe007;</button>
+    <button class="close" wo-touch="state.contacts.toggle(false)" data-action="lightbox-close">&#xe007;</button>
   </header>
 
   <div class="content">
@@ -31,7 +31,7 @@
               <td>{{key.userId}}</td>
               <td>{{key.created | date:'mediumDate'}}</td>
               <td>{{key.bitSize}} bit</td>
-              <td><button class="remove" ng-click="removeKey(key)">&#xe007;</button></td>
+              <td><button class="remove" wo-touch="removeKey(key)">&#xe007;</button></td>
             </tr>
           </table>
         </div><!--/.key-list-scroll-->
diff --git a/src/tpl/dialog.html b/src/tpl/dialog.html
index ae98177..c381f86 100644
--- a/src/tpl/dialog.html
+++ b/src/tpl/dialog.html
@@ -1,14 +1,14 @@
 <div class="lightbox-body" ng-controller="DialogCtrl">
   <header>
     <h2>{{state.dialog.title}}</h2>
-    <button class="close" ng-click="confirm(false)" data-action="lightbox-close">&#xe007;</button>
+    <button class="close" wo-touch="confirm(false)" data-action="lightbox-close">&#xe007;</button>
   </header>
 
   <div class="content">
     <p>{{state.dialog.message}}</p>
     <div class="control">
-      <button ng-click="confirm(false)" class="btn btn-alt" ng-show="state.dialog.showNegativeBtn">{{state.dialog.negativeBtnStr}}</button>
-      <button ng-click="confirm(true)" class="btn">{{state.dialog.positiveBtnStr}}</button>
+      <button wo-touch="confirm(false)" class="btn btn-alt" ng-show="state.dialog.showNegativeBtn">{{state.dialog.negativeBtnStr}}</button>
+      <button wo-touch="confirm(true)" class="btn">{{state.dialog.positiveBtnStr}}</button>
     </div>
   </div><!-- /.content -->
 </div><!-- /.lightbox-body -->
\ No newline at end of file
diff --git a/src/tpl/login-existing.html b/src/tpl/login-existing.html
index 9860d0e..3b4f1cf 100644
--- a/src/tpl/login-existing.html
+++ b/src/tpl/login-existing.html
@@ -13,7 +13,7 @@
       </div>
       <a href="https://whiteout.io/revocation.html" title="Click here to reset your account." target="_blank">Forgot your passphrase?</a>
       <div>
-        <button type="submit" ng-click="confirmPassphrase()" class="btn" data-icon="&#xe009;" ng-disabled="!buttonEnabled" tabindex="2">Unlock</button>
+        <button type="submit" wo-touch="confirmPassphrase()" class="btn" data-icon="&#xe009;" ng-disabled="!buttonEnabled" tabindex="2">Unlock</button>
       </div>
     </form>
   </div><!--/content-->
diff --git a/src/tpl/login-initial.html b/src/tpl/login-initial.html
index b21ec53..1e20114 100644
--- a/src/tpl/login-initial.html
+++ b/src/tpl/login-initial.html
@@ -6,7 +6,7 @@
   <div class="content" ng-switch on="state.ui">
 
     <div ng-switch-when="1">
-      <p><b>Generate PGP key.</b> You can set a passphrase to protect your key on disk. This must be entered everytime you start the app. For no passphrase just press continue.</p><p>Alternatively you can also <a href="#" ng-click="$event.preventDefault(); importKey()">import an existing PGP key</a>.</p>
+      <p><b>Generate PGP key.</b> You can set a passphrase to protect your key on disk. This must be entered everytime you start the app. For no passphrase just press continue.</p><p>Alternatively you can also <a href="#" wo-touch="$event.preventDefault(); importKey()">import an existing PGP key</a>.</p>
       <form>
         <div>
           <label class="input-error-message" ng-class="{'passphrase-label-ok': passphraseRating >= 2}">{{passphraseMsg}}</label><br>
@@ -21,7 +21,7 @@
         </div>
 
         <div>
-          <button type="submit" ng-click="confirmPassphrase()" class="btn" ng-disabled="(state.confirmation || state.passphrase) && state.confirmation !== state.passphrase" tabindex="3">Continue</button>
+          <button type="submit" wo-touch="confirmPassphrase()" class="btn" ng-disabled="(state.confirmation || state.passphrase) && state.confirmation !== state.passphrase" tabindex="3">Continue</button>
         </div>
       </form>
     </div>
diff --git a/src/tpl/login-new-device.html b/src/tpl/login-new-device.html
index 04ea3c4..8c2717f 100644
--- a/src/tpl/login-new-device.html
+++ b/src/tpl/login-new-device.html
@@ -16,7 +16,7 @@
         <span class="popover-info" data-icon-append="&#xe010;" popover="#passphrase-info"></span>
       </div>
       <a href="https://whiteout.io/revocation.html" title="Click here to reset your account." target="_blank">Lost your keyfile or passphrase?</a>
-      <div><button type="submit" ng-click="confirmPassphrase()" class="btn" ng-disabled="!key" tabindex="3">Import</button>
+      <div><button type="submit" wo-touch="confirmPassphrase()" class="btn" ng-disabled="!key" tabindex="3">Import</button>
     </form>
   </div>
 </div>
diff --git a/src/tpl/login-privatekey-download.html b/src/tpl/login-privatekey-download.html
index c543347..e481f1a 100644
--- a/src/tpl/login-privatekey-download.html
+++ b/src/tpl/login-privatekey-download.html
@@ -23,7 +23,7 @@
     </div>
 
     <div>
-      <button class="btn" ng-click="goForward()">Continue</button>
+      <button class="btn" wo-touch="goForward()">Continue</button>
     </div>
 
   </div><!--/content-->
diff --git a/src/tpl/mail-list.html b/src/tpl/mail-list.html
index 6c1be69..c5bb1b2 100644
--- a/src/tpl/mail-list.html
+++ b/src/tpl/mail-list.html
@@ -1,8 +1,8 @@
 <div class="view-mail-list" ng-controller="MailListCtrl">
   <!-- nav controll and section headline -->
-  <header data-icon="&#xe004;" ng-click="state.nav.toggle(true); $event.stopPropagation()">
+  <header data-icon="&#xe004;" wo-touch="state.nav.toggle(true); $event.stopPropagation()">
     <h2>{{state.nav.currentFolder.type}}</h2>
-    <button ng-click="state.writer.write(); $event.stopPropagation()" class="btn-icon" title="New mail"></button>
+    <button wo-touch="state.writer.write(); $event.stopPropagation()" class="btn-icon" title="New mail"></button>
   </header>
 
   <div class="search" data-icon="&#xe017;">
@@ -11,7 +11,9 @@
 
   <div class="list-wrapper" list-scroll="filteredMessages">
     <ul class="mail-list">
-      <li ng-class="{'mail-list-active': email === state.mailList.selected}" ng-click="select(email)" ng-repeat="email in (filteredMessages = (state.nav.currentFolder.messages | filter:searchText | orderBy:'uid':true | limitTo:100))">
+      <li ng-class="{'mail-list-active': email === state.mailList.selected}"
+        wo-touch="select(email)"
+        ng-repeat="email in (filteredMessages = (state.nav.currentFolder.messages | filter:searchText | orderBy:'uid':true | limitTo:100))">
         <h3>{{email.from[0].name || email.from[0].address}}</h3>
         <div class="encrypted" data-icon="{{email.encrypted && email.decrypted ? '&#xe012;' : email.encrypted ? '&#xe009;' : ''}}"></div>
         <div class="head">
diff --git a/src/tpl/navigation.html b/src/tpl/navigation.html
index 637474c..d83d54a 100644
--- a/src/tpl/navigation.html
+++ b/src/tpl/navigation.html
@@ -5,7 +5,7 @@
 
   <ul class="nav-primary">
     <li ng-repeat="folder in account.folders" ng-switch="folder.count !== undefined && folder.count > 0">
-      <a href="#" ng-click="openFolder(folder); $event.preventDefault()">
+      <a href="#" wo-touch="openFolder(folder); $event.preventDefault()">
         {{folder.type}}
         <span class="label-wrapper" ng-switch-when="true">
           <span class="label label-light">{{folder.count}}</span>
@@ -15,10 +15,10 @@
   </ul>
 
   <ul class="nav-secondary">
-    <li><a href="#" ng-click="state.account.toggle(true); $event.preventDefault()">Account</a></li>
-    <li><a href="#" ng-click="state.contacts.toggle(true); $event.preventDefault()">Contacts</a></li>
-    <li><a href="#" ng-click="state.privateKeyUpload.toggle(true); $event.preventDefault()">Key sync (experimental)</a></li>
-    <li><a href="#" ng-click="state.about.toggle(true); $event.preventDefault()">About</a></li>
+    <li><a href="#" wo-touch="state.account.toggle(true); $event.preventDefault()">Account</a></li>
+    <li><a href="#" wo-touch="state.contacts.toggle(true); $event.preventDefault()">Contacts</a></li>
+    <li><a href="#" wo-touch="state.privateKeyUpload.toggle(true); $event.preventDefault()">Key sync (experimental)</a></li>
+    <li><a href="#" wo-touch="state.about.toggle(true); $event.preventDefault()">About</a></li>
   </ul>
 
   <footer>
diff --git a/src/tpl/privatekey-upload.html b/src/tpl/privatekey-upload.html
index c0366de..0f3cae7 100644
--- a/src/tpl/privatekey-upload.html
+++ b/src/tpl/privatekey-upload.html
@@ -1,7 +1,7 @@
 <div class="lightbox-body" ng-controller="PrivateKeyUploadCtrl">
   <header>
     <h2>Setup Key Sync</h2>
-    <button class="close" ng-click="state.privateKeyUpload.toggle(false)" data-action="lightbox-close">&#xe007;</button>
+    <button class="close" wo-touch="state.privateKeyUpload.toggle(false)" data-action="lightbox-close">&#xe007;</button>
   </header>
 
   <div class="content">
@@ -37,8 +37,8 @@
       </div>
 
       <div class="control">
-        <button ng-show="step > 1 && step < 4" class="btn btn-alt" ng-click="goBack()">Go back</button>
-        <button ng-show="step < 4" class="btn" ng-click="goForward()">Continue</button>
+        <button ng-show="step > 1 && step < 4" class="btn btn-alt" wo-touch="goBack()">Go back</button>
+        <button ng-show="step < 4" class="btn" wo-touch="goForward()">Continue</button>
       </div>
 
     </div><!-- /.view-privatekey-upload -->
diff --git a/src/tpl/read.html b/src/tpl/read.html
index 3176424..98647d3 100644
--- a/src/tpl/read.html
+++ b/src/tpl/read.html
@@ -2,30 +2,30 @@
 
   <div class="headers">
     <div class="controls">
-      <button ng-click="state.mailList.remove(state.mailList.selected)" class="btn-icon" title="Delete mail">&#xe005;</button>
+      <button wo-touch="state.mailList.remove(state.mailList.selected)" class="btn-icon" title="Delete mail">&#xe005;</button>
       <button class="btn-icon" title="Reply to" reply-selection>&#xe002;</button>
-      <button ng-click="state.writer.write()" class="btn-icon" title="New mail">&#xe006;</button>
+      <button wo-touch="state.writer.write()" class="btn-icon" title="New mail">&#xe006;</button>
     </div><!--/.controls-->
 
-    <p class="subject" ng-click="state.read.toggle(false)" data-icon="&#xe016;">{{(state.mailList.selected.subject) ? state.mailList.selected.subject : 'No subject'}}</p>
+    <p class="subject" wo-touch="state.read.toggle(false)" data-icon="&#xe016;">{{(state.mailList.selected.subject) ? state.mailList.selected.subject : 'No subject'}}</p>
     <p class="date">{{state.mailList.selected.sentDate | date:'EEEE, MMM d, yyyy h:mm a'}}</p>
     <div class="mail-addresses">
       <p>
         <label>From:</label>
         <span ng-repeat="u in state.mailList.selected.from">
-          <span class="label" ng-class="{'label-primary': u.secure === false, 'label-primary-click': u.secure === false}" data-icon-append="{{(u.secure === false) ? '&#xe001;' : ''}}" ng-mouseover="getKeyId(u.address)" ng-click="invite(u)" popover="#fingerprint-info">{{u.name || u.address}}</span>
+          <span class="label" ng-class="{'label-primary': u.secure === false, 'label-primary-click': u.secure === false}" data-icon-append="{{(u.secure === false) ? '&#xe001;' : ''}}" ng-mouseover="getKeyId(u.address)" wo-touch="invite(u)" popover="#fingerprint-info">{{u.name || u.address}}</span>
         </span>
       </p>
       <p>
         <label>To:</label>
         <span ng-repeat="u in state.mailList.selected.to">
-          <span class="label" ng-class="{'label-primary': u.secure === false, 'label-primary-click': u.secure === false}" data-icon-append="{{(u.secure === false) ? '&#xe001;' : ''}}" ng-mouseover="getKeyId(u.address)" ng-click="invite(u)" popover="#fingerprint-info">{{u.name || u.address}}</span>
+          <span class="label" ng-class="{'label-primary': u.secure === false, 'label-primary-click': u.secure === false}" data-icon-append="{{(u.secure === false) ? '&#xe001;' : ''}}" ng-mouseover="getKeyId(u.address)" wo-touch="invite(u)" popover="#fingerprint-info">{{u.name || u.address}}</span>
         </span>
       </p>
       <p ng-show="state.mailList.selected.cc && state.mailList.selected.cc.length > 0">
         <label>Cc:</label>
         <span ng-repeat="u in state.mailList.selected.cc">
-          <span class="label" ng-class="{'label-primary': u.secure === false, 'label-primary-click': u.secure === false}" data-icon-append="{{(u.secure === false) ? '&#xe001;' : ''}}" ng-mouseover="getKeyId(u.address)" ng-click="invite(u)" popover="#fingerprint-info">{{u.name || u.address}}</span>
+          <span class="label" ng-class="{'label-primary': u.secure === false, 'label-primary-click': u.secure === false}" data-icon-append="{{(u.secure === false) ? '&#xe001;' : ''}}" ng-mouseover="getKeyId(u.address)" wo-touch="invite(u)" popover="#fingerprint-info">{{u.name || u.address}}</span>
         </span>
       </p>
     </div><!--/.mail-addresses-->
@@ -36,7 +36,7 @@
     <div class="attachments" ng-switch-when="true">
       <span class="attachment"
         ng-repeat="attachment in state.mailList.selected.attachments"
-        ng-click="download(attachment)">
+        wo-touch="download(attachment)">
         <span data-icon="&#xe003;"></span>
         {{attachment.filename}}
       </span><!--/.attachment-->
@@ -54,7 +54,7 @@
   </div><!--/.working-wrapper-->
 
   <div class="display-images">
-    <a ng-show="html && showImageButton" href='#' ng-click="displayImages(); $event.preventDefault()">Display images</a>
+    <a ng-show="html && showImageButton" href='#' wo-touch="displayImages(); $event.preventDefault()">Display images</a>
   </div>
 
   <!-- Render html body in sandboxed iframe -->
@@ -81,9 +81,9 @@
   <div class="reply-selection popover bottom">
     <div class="arrow"></div>
     <ul class="popover-content">
-      <li><button data-icon="&#xe014;" ng-click="state.writer.write(state.mailList.selected)">Reply</button></li>
-      <li><button data-icon="&#xe013;" ng-click="state.writer.write(state.mailList.selected, true)">Reply All</button></li>
-      <li><button data-icon="&#xe015;" ng-click="state.writer.write(state.mailList.selected, null, true)">Forward</button></li>
+      <li><button data-icon="&#xe014;" wo-touch="state.writer.write(state.mailList.selected)">Reply</button></li>
+      <li><button data-icon="&#xe013;" wo-touch="state.writer.write(state.mailList.selected, true)">Reply All</button></li>
+      <li><button data-icon="&#xe015;" wo-touch="state.writer.write(state.mailList.selected, null, true)">Forward</button></li>
     </ul>
   </div><!--/.reply-selection-->
 
diff --git a/src/tpl/set-passphrase.html b/src/tpl/set-passphrase.html
index e72d573..b98582d 100644
--- a/src/tpl/set-passphrase.html
+++ b/src/tpl/set-passphrase.html
@@ -1,7 +1,7 @@
 <div class="lightbox-body" ng-controller="SetPassphraseCtrl">
   <header>
     <h2>Set passphrase</h2>
-    <button class="close" ng-click="state.setPassphrase.toggle(false)" data-action="lightbox-close">&#xe007;</button>
+    <button class="close" wo-touch="state.setPassphrase.toggle(false)" data-action="lightbox-close">&#xe007;</button>
   </header>
 
   <div class="content">
@@ -25,7 +25,7 @@
       </table>
 
       <div class="control">
-        <button ng-click="setPassphrase()" class="btn" ng-disabled="(confirmation || newPassphrase) && confirmation !== newPassphrase" tabindex="4">Set passphrase</button>
+        <button wo-touch="setPassphrase()" class="btn" ng-disabled="(confirmation || newPassphrase) && confirmation !== newPassphrase" tabindex="4">Set passphrase</button>
       </div>
 
     </div><!-- /.view-set-passphrase -->
diff --git a/src/tpl/write.html b/src/tpl/write.html
index 699a105..9af7006 100644
--- a/src/tpl/write.html
+++ b/src/tpl/write.html
@@ -1,15 +1,15 @@
 <div class="lightbox-body" ng-controller="WriteCtrl">
   <header>
     <h2>{{writerTitle}}</h2>
-    <button class="close" ng-click="state.writer.close()" data-action="lightbox-close">&#xe007;</button>
+    <button class="close" wo-touch="state.writer.close()" data-action="lightbox-close">&#xe007;</button>
   </header>
   <div class="content">
 
     <div class="view-write">
       <div class="mail-addresses">
         <div class="mail-addresses-more">
-          <button ng-click="showCC = true;" ng-hide="showCC">Cc</button>
-          <button ng-click="showBCC = true;" ng-hide="showBCC">Bcc</button>
+          <button wo-touch="showCC = true;" ng-hide="showCC">Cc</button>
+          <button wo-touch="showBCC = true;" ng-hide="showBCC">Bcc</button>
         </div>
         <p field="to">
           <label>To:</label>
@@ -41,7 +41,7 @@
         <span ng-repeat="attachment in attachments" class="attachment">
           <span data-icon="&#xe003;"></span>
           {{attachment.filename}}
-          <span class="close" data-icon="&#xe000;" ng-click="remove(attachment)"></span>
+          <span class="close" data-icon="&#xe000;" wo-touch="remove(attachment)"></span>
         </span><!--/.attachment-->
       </div><!--/.attachments-box-->
 
@@ -54,7 +54,7 @@
       </div><!--/.body-->
 
       <div class="send-control">
-        <button ng-click="sendToOutbox()" class="btn" ng-class="{'btn-primary': sendBtnSecure === false}" ng-disabled="!okToSend" tabindex="4">{{sendBtnText || 'Send'}}</button>
+        <button wo-touch="sendToOutbox()" class="btn" ng-class="{'btn-primary': sendBtnSecure === false}" ng-disabled="!okToSend" tabindex="4">{{sendBtnText || 'Send'}}</button>
       </div>
     </div><!--/.write-view-->