Refactor guides javascripts

* Remove `$` prefix from all variables (`$` prefix means jQuery object)
* Old browsers doesn't support forEach. So use for instead of forEach.

2 files changed, 34 insertions, 26 deletions

diff --git a/guides/assets/javascripts/guides.js b/guides/assets/javascripts/guides.js
index 25c8b482b4..e39ac239cd 100644
--- a/guides/assets/javascripts/guides.js
+++ b/guides/assets/javascripts/guides.js
@@ -1,6 +1,7 @@
 (function() {
   "use strict";
-  window.syntaxhighlighterConfig = { autoLinks: false };
+
+  this.syntaxhighlighterConfig = { autoLinks: false };
 
   this.wrap = function(elem, wrapper) {
     elem.parentNode.insertBefore(wrapper, elem);
@@ -19,34 +20,34 @@
   }
 
   document.addEventListener("DOMContentLoaded", function() {
-    var $guidesMenu = document.getElementById("guidesMenu");
-    var $guides     = document.getElementById("guides");
+    var guidesMenu = document.getElementById("guidesMenu");
+    var guides     = document.getElementById("guides");
 
-    $guidesMenu.addEventListener("click", function(e) {
+    guidesMenu.addEventListener("click", function(e) {
       e.preventDefault();
-      $guides.classList.toggle("visible");
+      guides.classList.toggle("visible");
     });
 
-    var $guidesIndexItem   = document.querySelector("select.guides-index-item");
-    var currentGuidePath   = window.location.pathname;
-    $guidesIndexItem.value = currentGuidePath.substring(currentGuidePath.lastIndexOf("/") + 1);
+    var guidesIndexItem   = document.querySelector("select.guides-index-item");
+    var currentGuidePath  = window.location.pathname;
+    guidesIndexItem.value = currentGuidePath.substring(currentGuidePath.lastIndexOf("/") + 1);
 
-    $guidesIndexItem.addEventListener("change", function(e) {
+    guidesIndexItem.addEventListener("change", function(e) {
       window.location = e.target.value;
     });
 
-    var $moreInfoButton = document.querySelector(".more-info-button");
-    var $moreInfoLinks  = document.querySelector(".more-info-links");
+    var moreInfoButton = document.querySelector(".more-info-button");
+    var moreInfoLinks  = document.querySelector(".more-info-links");
 
-    $moreInfoButton.addEventListener("click", function(e) {
+    moreInfoButton.addEventListener("click", function(e) {
       e.preventDefault();
 
-      if ($moreInfoLinks.classList.contains("s-hidden")) {
-        wrap($moreInfoLinks, createElement("div", "more-info-container"));
-        $moreInfoLinks.classList.remove("s-hidden");
+      if (moreInfoLinks.classList.contains("s-hidden")) {
+        wrap(moreInfoLinks, createElement("div", "more-info-container"));
+        moreInfoLinks.classList.remove("s-hidden");
       } else {
-        $moreInfoLinks.classList.add("s-hidden");
-        unwrap($moreInfoLinks);
+        moreInfoLinks.classList.add("s-hidden");
+        unwrap(moreInfoLinks);
       }
     });
   });
diff --git a/guides/assets/javascripts/responsive-tables.js b/guides/assets/javascripts/responsive-tables.js
index 3c90ba758c..24906dddeb 100644
--- a/guides/assets/javascripts/responsive-tables.js
+++ b/guides/assets/javascripts/responsive-tables.js
@@ -1,18 +1,25 @@
 (function() {
   "use strict";
+
   var switched = false;
 
-  document.querySelectorAll(":not(.syntaxhighlighter)>table").forEach(function(element) {
+  // For old browsers
+  var each = function(node, callback) {
+    var array = Array.prototype.slice.call(node);
+    for(var i = 0; i < array.length; i++) callback(array[i]);
+  }
+
+  each(document.querySelectorAll(":not(.syntaxhighlighter)>table"), function(element) {
     element.classList.add("responsive");
   });
 
   var updateTables = function() {
     if (document.documentElement.clientWidth < 767 && !switched) {
       switched = true;
-      document.querySelectorAll("table.responsive").forEach(splitTable);
+      each(document.querySelectorAll("table.responsive"), splitTable);
     } else {
       switched = false;
-      document.querySelectorAll(".table-wrapper table.responsive").forEach(unsplitTable);
+      each(document.querySelectorAll(".table-wrapper table.responsive"), unsplitTable);
     }
   }
 
@@ -22,19 +29,19 @@
   var splitTable = function(original) {
     wrap(original, createElement("div", "table-wrapper"));
 
-    var $copy = original.cloneNode(true);
-    $copy.querySelectorAll("td:not(:first-child), th:not(:first-child)").forEach(function(element) {
+    var copy = original.cloneNode(true);
+    each(copy.querySelectorAll("td:not(:first-child), th:not(:first-child)"), function(element) {
       element.style.display = "none";
     });
-    $copy.classList.remove("responsive");
+    copy.classList.remove("responsive");
 
-    original.parentNode.append($copy);
-    wrap($copy, createElement("div", "pinned"))
+    original.parentNode.append(copy);
+    wrap(copy, createElement("div", "pinned"))
     wrap(original, createElement("div", "scrollable"));
   }
 
   var unsplitTable = function(original) {
-    document.querySelectorAll(".table-wrapper .pinned").forEach(function(element) {
+    each(document.querySelectorAll(".table-wrapper .pinned"), function(element) {
       element.parentNode.removeChild(element);
     });
     unwrap(original.parentNode);