Dev: Move ontouchstart to root element

liriliri · Apr 11, 2017 · 6f58732 · 6f58732
1 parent 7b9e3bd
commit 6f58732
Show file tree

Hide file tree

Showing 11 changed files with 33 additions and 30 deletions.
diff --git a/src/Console/Console.hbs b/src/Console/Console.hbs
@@ -1,18 +1,18 @@
 <div class="eruda-control">
-    <span class="eruda-icon-ban clear-console" ontouchstart></span>
+    <span class="eruda-icon-ban clear-console"></span>
     <span class="eruda-filter filter eruda-active" data-filter="all">All</span>
     <span class="eruda-filter filter" data-filter="error">Error</span>
     <span class="eruda-filter filter" data-filter="warn">Warning</span>
     <span class="eruda-filter filter" data-filter="info">Info</span>
     <span class="eruda-filter filter" data-filter="log">Log</span>
     <span class="eruda-filter filter" data-filter="debug">Debug</span>
-    <span class="eruda-icon-info-circle help" ontouchstart></span>
+    <span class="eruda-icon-info-circle help"></span>
 </div>
 <ul class="eruda-logs"></ul>
 <div class="eruda-js-input">
     <div class="eruda-buttons">
-        <div class="eruda-button cancel" ontouchstart>Cancel</div>
-        <div class="eruda-button execute" ontouchstart>Execute</div>
+        <div class="eruda-button cancel">Cancel</div>
+        <div class="eruda-button execute">Execute</div>
     </div>
     <textarea placeholder="Type JavaScript here"></textarea>
 </div>
diff --git a/src/DevTools/NavBar.es6 b/src/DevTools/NavBar.es6
@@ -22,7 +22,7 @@ export default class NavBar extends util.Emitter
         let $bottomBar = this._$bottomBar;
 
         this._len++;
-        this._$ul.prepend(`<li class="${name}" ontouchstart>${name}</li>`);
+        this._$ul.prepend(`<li class="${name}">${name}</li>`);
         $bottomBar.css('left', util.pxToNum($bottomBar.css('left')) + ITEM_WIDTH);
         this._resetStyle();
     }

diff --git a/src/Elements/BottomBar.hbs b/src/Elements/BottomBar.hbs
@@ -1,14 +1,14 @@
 <div class="eruda-bottom-bar">
-    <div class="eruda-btn eruda-select" ontouchstart>
+    <div class="eruda-btn eruda-select">
         <span class="eruda-icon eruda-icon-hand-pointer-o"></span>
     </div>
-    <div class="eruda-btn eruda-refresh" ontouchstart>
+    <div class="eruda-btn eruda-refresh">
         <span class="eruda-icon eruda-icon-repeat"></span>
     </div>
-    <div class="eruda-btn eruda-highlight" ontouchstart>
+    <div class="eruda-btn eruda-highlight">
         <span class="eruda-icon eruda-icon-eye"></span>
     </div>
-    <div class="eruda-btn eruda-reset" ontouchstart>
+    <div class="eruda-btn eruda-reset">
         <span class="eruda-icon eruda-icon-rotate-left"></span>
     </div>
 </div>
diff --git a/src/Elements/Elements.hbs b/src/Elements/Elements.hbs
@@ -14,7 +14,7 @@
 {{#if children}}
     <ul class="eruda-children">
         {{#each children}}
-            <li class="eruda-child {{#if isCmt}}eruda-green{{/if}} {{#if isEl}}eruda-active-effect{{/if}}" data-idx="{{idx}}" ontouchstart>{{{text}}}</li>
+            <li class="eruda-child {{#if isCmt}}eruda-green{{/if}} {{#if isEl}}eruda-active-effect{{/if}}" data-idx="{{idx}}">{{{text}}}</li>
         {{/each}}
     </ul>
 {{/if}}
@@ -41,7 +41,7 @@
 </div>
 {{#if computedStyle}}
     <div class="eruda-computed-style eruda-section">
-        <h2 class="toggle-all-computed-style eruda-active-effect" ontouchstart>Computed Style</h2>
+        <h2 class="toggle-all-computed-style eruda-active-effect">Computed Style</h2>
         <div class="eruda-table-wrapper">
             <table>
                 <tbody>

diff --git a/src/EntryBtn/EntryBtn.hbs b/src/EntryBtn/EntryBtn.hbs
@@ -1,3 +1,3 @@
-<div class="eruda-entry-btn" ontouchstart>
+<div class="eruda-entry-btn">
     <span class="eruda-icon-cog"></span>
 </div>
diff --git a/src/Features/Features.hbs b/src/Features/Features.hbs
@@ -1,10 +1,10 @@
 <ul>
     {{#each features}}
         <li>
-            <a href="http://caniuse.com/#search={{@key}}" target="_blank" class="eruda-inner-wrapper {{#if this}}eruda-ok{{/if}}" ontouchstart>
+            <a href="http://caniuse.com/#search={{@key}}" target="_blank" class="eruda-inner-wrapper {{#if this}}eruda-ok{{/if}}">
                 {{@key}}
             </a>
         </li>
     {{/each}}
 </ul>
-<a class="eruda-html5test" target="_blank" href="http://html5test.com" ontouchstart>Go to HTML5 Test</a>
+<a class="eruda-html5test" target="_blank" href="http://html5test.com">Go to HTML5 Test</a>
diff --git a/src/Network/Network.hbs b/src/Network/Network.hbs
@@ -46,7 +46,7 @@
 {{#if displayReq}}
     <div class="eruda-title">
         XMLHttpRequest
-        <div class="eruda-btn eruda-clear-xhr" ontouchstart>
+        <div class="eruda-btn eruda-clear-xhr">
             <span class="eruda-icon-ban"></span>
         </div>
     </div>

diff --git a/src/Resources/Resources.hbs b/src/Resources/Resources.hbs
@@ -1,10 +1,10 @@
 <div class="eruda-section">
     <h2 class="eruda-title">
         Local Storage
-        <div class="eruda-btn refresh-local-storage" ontouchstart>
+        <div class="eruda-btn refresh-local-storage">
             <span class="eruda-icon-repeat"></span>
         </div>
-        <div class="eruda-btn eruda-clear-storage" data-type="local" ontouchstart>
+        <div class="eruda-btn eruda-clear-storage" data-type="local">
             <span class="eruda-icon-ban"></span>
         </div>
     </h2>
@@ -16,7 +16,7 @@
                         <td class="eruda-key">{{key}}</td>
                         <td class="eruda-storage-val" data-key="{{key}}" data-type="local">{{val}}</td>
                         <td class="eruda-control">
-                            <span class="eruda-icon-trash delete-storage" data-key="{{key}}" data-type="local" ontouchstart></span>
+                            <span class="eruda-icon-trash delete-storage" data-key="{{key}}" data-type="local"></span>
                         </td>
                     </tr>
                 {{/each}}
@@ -31,10 +31,10 @@
 <div class="eruda-section">
     <h2 class="eruda-title">
         Session Storage
-        <div class="eruda-btn refresh-session-storage" ontouchstart>
+        <div class="eruda-btn refresh-session-storage">
             <span class="eruda-icon-repeat"></span>
         </div>
-        <div class="eruda-btn eruda-clear-storage" data-type="session" ontouchstart>
+        <div class="eruda-btn eruda-clear-storage" data-type="session">
             <span class="eruda-icon-ban"></span>
         </div>
     </h2>
@@ -46,7 +46,7 @@
                     <td class="eruda-key">{{key}}</td>
                     <td class="eruda-storage-val" data-key="{{key}}" data-type="session">{{val}}</td>
                     <td class="eruda-control">
-                        <span class="eruda-icon-trash delete-storage" data-key="{{key}}" data-type="session" ontouchstart></span>
+                        <span class="eruda-icon-trash delete-storage" data-key="{{key}}" data-type="session"></span>
                     </td>
                 </tr>
             {{/each}}
@@ -61,10 +61,10 @@
 <div class="eruda-section">
     <h2 class="eruda-title {{cookieState}}">
         Cookie
-        <div class="eruda-btn refresh-cookie" ontouchstart>
+        <div class="eruda-btn refresh-cookie">
             <span class="eruda-icon-repeat"></span>
         </div>
-        <div class="eruda-btn eruda-clear-cookie" ontouchstart>
+        <div class="eruda-btn eruda-clear-cookie">
             <span class="eruda-icon-ban"></span>
         </div>
     </h2>
@@ -76,7 +76,7 @@
                         <td class="eruda-key">{{key}}</td>
                         <td>{{val}}</td>
                         <td class="eruda-control">
-                            <span class="eruda-icon-trash delete-cookie" data-key="{{key}}" ontouchstart></span>
+                            <span class="eruda-icon-trash delete-cookie" data-key="{{key}}"></span>
                         </td>
                     </tr>
                 {{/each}}
@@ -91,7 +91,7 @@
 <div class="eruda-section">
     <h2 class="eruda-title {{scriptState}}">
         Script
-        <div class="eruda-btn refresh-script" ontouchstart>
+        <div class="eruda-btn refresh-script">
             <span class="eruda-icon-repeat"></span>
         </div>
     </h2>
@@ -110,7 +110,7 @@
 <div class="eruda-section">
     <h2 class="eruda-title {{stylesheetState}}">
         Stylesheet
-        <div class="eruda-btn refresh-stylesheet" ontouchstart>
+        <div class="eruda-btn refresh-stylesheet">
             <span class="eruda-icon-repeat"></span>
         </div>
     </h2>
@@ -129,7 +129,7 @@
 <div class="eruda-section">
     <h2 class="eruda-title {{imageState}}">
         Image
-        <div class="eruda-btn refresh-image" ontouchstart>
+        <div class="eruda-btn refresh-image">
             <span class="eruda-icon-repeat"></span>
         </div>
     </h2>

diff --git a/src/Settings/select.hbs b/src/Settings/select.hbs
@@ -1,11 +1,11 @@
 <div class="eruda-select">
-    <div class="eruda-head" ontouchstart>
+    <div class="eruda-head">
         {{desc}}
         <span class="eruda-val">{{val}}</span>
     </div>
     <ul data-idx="{{idx}}">
        {{#each selections}}
-           <li ontouchstart>{{.}}</li>
+           <li>{{.}}</li>
        {{/each}}
     </ul>
 </div>
diff --git a/src/Snippets/Snippets.hbs b/src/Snippets/Snippets.hbs
@@ -4,6 +4,6 @@
         <div class="eruda-description">
             {{desc}}
         </div>
-        <div class="eruda-btn run" data-idx="{{@index}}" ontouchstart>Run</div>
+        <div class="eruda-btn run" data-idx="{{@index}}">Run</div>
     </div>
 {{/each}}
diff --git a/src/index.es6 b/src/index.es6
@@ -67,6 +67,9 @@ module.exports = {
             contentEditable: false
         });
 
+        // http://stackoverflow.com/questions/3885018/active-pseudo-class-doesnt-work-in-mobile-safari
+        el.setAttribute('ontouchstart', '');
+
         this._$el = util.$(el);
     },
     _initDevTools()