Get rid of jQuery

julienrf · Feb 22, 2013 · fc0b04d · fc0b04d
1 parent 27a0c9c
commit fc0b04d
Show file tree

Hide file tree

Showing 7 changed files with 107 additions and 39 deletions.
diff --git a/app/assets/javascripts/anti-flood.js b/app/assets/javascripts/anti-flood.js
@@ -1,7 +1,11 @@
 define(function () {
-  $('form').on('submit', function (e) {
-    $(this).find('input[type=submit], button[type!=button]').each(function () {
-      this.disabled = true;
-    })
-  });
+  var form = document.querySelector('form');
+  if (form !== null) {
+    var buttons = form.querySelectorAll('input[type=submit], button:not([type=button])');
+    form.addEventListener('submit', function () {
+      for (var i = 0, l = buttons.length ; i < l ; i++) {
+        buttons.item(i).disabled = true;
+      }
+    });
+  }
 });
diff --git a/app/assets/javascripts/locale.js b/app/assets/javascripts/locale.js
@@ -1,5 +1,8 @@
 define(function () {
-  $('form.change-locale').change(function () {
-    $(this).submit();
-  });
+  var form = document.querySelector('form.change-locale');
+  if (form !== null) {
+    form.addEventListener('change', function () {
+      form.submit();
+    });
+  }
 });
diff --git a/app/assets/javascripts/notification.js b/app/assets/javascripts/notification.js
@@ -1,5 +1,15 @@
 define(function () {
-  $(document).on('click', '.notification .button', function () {
-    $(this).closest('.notification').remove();
+  document.addEventListener('click', function (e) {
+    if (e.target.classList.contains('button')) {
+      var notification = (function loop (el) {
+        var p = el.parentNode;
+        if (p === null) return null; else {
+          return p.classList.contains('notification') ? p : loop(p)
+        }
+      })(e.target);
+      if (notification !== null) {
+        notification.parentNode.removeChild(notification);
+      }
+    }
   });
 });
diff --git a/app/views/layout.scala.html b/app/views/layout.scala.html
@@ -7,7 +7,6 @@
         <title>@title</title>
         <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/style.min.css")">
         <link rel="shortcut icon" type="image/png" href="@routes.Assets.at("images/favicon.png")">
-        <script src="@routes.Assets.at("javascripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
         @moreHead
     </head>
     <body>

diff --git a/app/views/pollForm.scala.html b/app/views/pollForm.scala.html
@@ -53,28 +53,67 @@ <h1>@Messages("poll.create")</h1>
 
   <script type="text/javascript" charset="utf-8">
     (function() {
-      var alternatives = $('.alternatives'),
-          alternativeTmpl = $('.alternative-template');
-
-      $('form').on('click', '.button.remove-alternative', function (e) {
-        $(this).closest('.alternative').remove()
-        renumber()
-        return false
-      });
-
-      $('.add-alternative').on('click', function (e) {
-        var alternative = $(alternativeTmpl.html());
-        alternatives.append(alternative);
-        renumber();
-        alternative.find('input').focus();
-        return false
-      })
-
-      var renumber = function () {
-        alternatives.find('input').each(function (i) {
-          $(this).attr('name', $(this).attr('name').replace(/alternatives\[.+\]/g, 'alternatives[' + i + ']'))
-        })
+      var alternativeTmpl = function (i) {
+        var div = document.createElement('div');
+        div.className = 'alternative';
+        var inner = document.createElement('div');
+        inner.style.display = 'inline-block';
+        inner.style.width = '95%';
+        var input = document.createElement('input');
+        input.type = 'text';
+        input.name = 'alternatives[' + i + ']';
+        input.value = '';
+        input.className = 'required';
+        input.placeholder = @Html(play.api.libs.json.Json.toJson(Messages("poll.alternative")).toString);
+        var span = document.createElement('span');
+        span.className = 'button remove-alternative';
+        span.title = @Html(play.api.libs.json.Json.toJson(Messages("remove")).toString);
+        span.textContent = '×';
+        inner.appendChild(input);
+        div.appendChild(inner);
+        div.appendChild(span);
+        return div
       };
+
+      var form = document.querySelector('form');
+      if (form !== null) {
+        form.addEventListener('click', function (e) {
+          if (e.target.className === 'button remove-alternative') {
+            var a = (function loop (el) {
+              var p = el.parentNode;
+              if (p === null) return null; else {
+                return (p.className === 'alternative') ? p : loop(p)
+              }
+            })(e.target);
+            a.parentNode.removeChild(a);
+            renumber();
+          }
+        });
+      }
+
+      var alternatives = document.querySelector('.alternatives');
+      if (alternatives !== null) {
+
+        var addBtn = document.querySelector('.add-alternative');
+        if (addBtn !== null) {
+          addBtn.addEventListener('click', function () {
+            var alternative = alternativeTmpl(alternatives.querySelectorAll('.alternative').length);
+            alternatives.appendChild(alternative);
+            var input = alternative.querySelector('input');
+            if (input !== null) {
+              input.focus();
+            }
+          });
+        }
+
+        var renumber = function () {
+          var inputs = alternatives.querySelectorAll('input');
+          for (var i = 0, l = inputs.length ; i < l ; i++) {
+            var input = inputs.item(i);
+            input.name = input.name.replace(/alternatives\[.+\]/g, 'alternatives[' + i + ']');
+          }
+        }
+      }
     })();
   </script>
 }
diff --git a/app/views/vote.scala.html b/app/views/vote.scala.html
@@ -41,8 +41,25 @@ <h1>@poll.name</h1>
   }
 
   <script type="text/javascript">
-    $('form').on('change', '.alternative > input[type=range]', function () {
-      $(this).prev('.name').css('font-weight', (1 + this.value * (9 - 1) / 100) * 100);
-    });
+    (function () {
+      var form = document.querySelector('form');
+      if (form !== null) {
+        form.addEventListener('change', function (e) {
+          var inputs = form.querySelectorAll('.alternative > input[type=range]');
+          for (var i = 0, l = inputs.length ; i < l ; i++) {
+            if (inputs.item(i) === e.target) {
+              var n = (function loop(el) {
+                if (el === null) return null;
+                if (el.className === 'name') return el;
+                return loop(el.previousSibling)
+              })(e.target.previousSibling);
+              if (n !== null) {
+                n.style.fontWeight = (1 + e.target.value * (9 - 1) / 100) * 100;
+              }
+            }
+          }
+        });
+      }
+    })();
   </script>
 }
diff --git a/public/javascripts/jquery-1.7.1.min.js b/public/javascripts/jquery-1.7.1.min.js