1
0
Fork 0
mirror of https://github.com/rails/rails.git synced 2022-11-09 12:12:34 -05:00

Refactor guides javascripts

* Remove `$` prefix from all variables (`$` prefix means jQuery object)
* Old browsers doesn't support forEach. So use for instead of forEach.
This commit is contained in:
Yoshiyuki Hirano 2018-04-23 04:02:38 +09:00
parent dc62d9f684
commit b261508002
2 changed files with 34 additions and 26 deletions

View file

@ -1,6 +1,7 @@
(function() { (function() {
"use strict"; "use strict";
window.syntaxhighlighterConfig = { autoLinks: false };
this.syntaxhighlighterConfig = { autoLinks: false };
this.wrap = function(elem, wrapper) { this.wrap = function(elem, wrapper) {
elem.parentNode.insertBefore(wrapper, elem); elem.parentNode.insertBefore(wrapper, elem);
@ -19,34 +20,34 @@
} }
document.addEventListener("DOMContentLoaded", function() { document.addEventListener("DOMContentLoaded", function() {
var $guidesMenu = document.getElementById("guidesMenu"); var guidesMenu = document.getElementById("guidesMenu");
var $guides = document.getElementById("guides"); var guides = document.getElementById("guides");
$guidesMenu.addEventListener("click", function(e) { guidesMenu.addEventListener("click", function(e) {
e.preventDefault(); e.preventDefault();
$guides.classList.toggle("visible"); guides.classList.toggle("visible");
}); });
var $guidesIndexItem = document.querySelector("select.guides-index-item"); var guidesIndexItem = document.querySelector("select.guides-index-item");
var currentGuidePath = window.location.pathname; var currentGuidePath = window.location.pathname;
$guidesIndexItem.value = currentGuidePath.substring(currentGuidePath.lastIndexOf("/") + 1); guidesIndexItem.value = currentGuidePath.substring(currentGuidePath.lastIndexOf("/") + 1);
$guidesIndexItem.addEventListener("change", function(e) { guidesIndexItem.addEventListener("change", function(e) {
window.location = e.target.value; window.location = e.target.value;
}); });
var $moreInfoButton = document.querySelector(".more-info-button"); var moreInfoButton = document.querySelector(".more-info-button");
var $moreInfoLinks = document.querySelector(".more-info-links"); var moreInfoLinks = document.querySelector(".more-info-links");
$moreInfoButton.addEventListener("click", function(e) { moreInfoButton.addEventListener("click", function(e) {
e.preventDefault(); e.preventDefault();
if ($moreInfoLinks.classList.contains("s-hidden")) { if (moreInfoLinks.classList.contains("s-hidden")) {
wrap($moreInfoLinks, createElement("div", "more-info-container")); wrap(moreInfoLinks, createElement("div", "more-info-container"));
$moreInfoLinks.classList.remove("s-hidden"); moreInfoLinks.classList.remove("s-hidden");
} else { } else {
$moreInfoLinks.classList.add("s-hidden"); moreInfoLinks.classList.add("s-hidden");
unwrap($moreInfoLinks); unwrap(moreInfoLinks);
} }
}); });
}); });

View file

@ -1,18 +1,25 @@
(function() { (function() {
"use strict"; "use strict";
var switched = false; 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"); element.classList.add("responsive");
}); });
var updateTables = function() { var updateTables = function() {
if (document.documentElement.clientWidth < 767 && !switched) { if (document.documentElement.clientWidth < 767 && !switched) {
switched = true; switched = true;
document.querySelectorAll("table.responsive").forEach(splitTable); each(document.querySelectorAll("table.responsive"), splitTable);
} else { } else {
switched = false; 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) { var splitTable = function(original) {
wrap(original, createElement("div", "table-wrapper")); wrap(original, createElement("div", "table-wrapper"));
var $copy = original.cloneNode(true); var copy = original.cloneNode(true);
$copy.querySelectorAll("td:not(:first-child), th:not(:first-child)").forEach(function(element) { each(copy.querySelectorAll("td:not(:first-child), th:not(:first-child)"), function(element) {
element.style.display = "none"; element.style.display = "none";
}); });
$copy.classList.remove("responsive"); copy.classList.remove("responsive");
original.parentNode.append($copy); original.parentNode.append(copy);
wrap($copy, createElement("div", "pinned")) wrap(copy, createElement("div", "pinned"))
wrap(original, createElement("div", "scrollable")); wrap(original, createElement("div", "scrollable"));
} }
var unsplitTable = function(original) { var unsplitTable = function(original) {
document.querySelectorAll(".table-wrapper .pinned").forEach(function(element) { each(document.querySelectorAll(".table-wrapper .pinned"), function(element) {
element.parentNode.removeChild(element); element.parentNode.removeChild(element);
}); });
unwrap(original.parentNode); unwrap(original.parentNode);