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

Use Turbolinks in Rails guides

This commit is contained in:
Yoshiyuki Hirano 2018-04-23 09:28:30 +09:00
parent c991ebbc91
commit e5d38a24dc
6 changed files with 54 additions and 32 deletions

View file

@ -19,7 +19,18 @@
return elem;
}
document.addEventListener("DOMContentLoaded", function() {
// For old browsers
this.each = function(node, callback) {
var array = Array.prototype.slice.call(node);
for(var i = 0; i < array.length; i++) callback(array[i]);
}
// Viewable on local
if (window.location.protocol === "file:") Turbolinks.supported = false;
document.addEventListener("turbolinks:load", function() {
window.SyntaxHighlighter.highlight({ "auto-links": false });
var guidesMenu = document.getElementById("guidesMenu");
var guides = document.getElementById("guides");
@ -28,12 +39,22 @@
guides.classList.toggle("visible");
});
each(document.querySelectorAll("#guides a"), function(element) {
element.addEventListener("click", function(e) {
guides.classList.toggle("visible");
});
});
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) {
window.location = e.target.value;
if (Turbolinks.supported) {
Turbolinks.visit(e.target.value);
} else {
window.location = e.target.value;
}
});
var moreInfoButton = document.querySelector(".more-info-button");

View file

@ -3,16 +3,6 @@
var switched = false;
// 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;
@ -23,7 +13,13 @@
}
}
document.addEventListener("DOMContentLoaded", updateTables);
document.addEventListener("turbolinks:load", function() {
each(document.querySelectorAll(":not(.syntaxhighlighter)>table"), function(element) {
element.classList.add("responsive");
});
updateTables();
});
window.addEventListener("resize", updateTables);
var splitTable = function(original) {

File diff suppressed because one or more lines are too long

View file

@ -11,3 +11,4 @@ Import advanced style sheet
@import url("reset.css");
@import url("main.css");
@import url("turbolinks.css");

View file

@ -0,0 +1,3 @@
.turbolinks-progress-bar {
background-color: #c52f24;
}

View file

@ -1,20 +1,19 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title><%= yield(:page_title) || 'Ruby on Rails Guides' %></title>
<link rel="stylesheet" type="text/css" href="stylesheets/style.css" />
<link rel="stylesheet" type="text/css" href="stylesheets/print.css" media="print" />
<link rel="stylesheet" type="text/css" href="stylesheets/syntaxhighlighter/shCore.css" />
<link rel="stylesheet" type="text/css" href="stylesheets/syntaxhighlighter/shThemeRailsGuides.css" />
<link rel="stylesheet" type="text/css" href="stylesheets/fixes.css" />
<link href="images/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title><%= yield(:page_title) || 'Ruby on Rails Guides' %></title>
<link rel="stylesheet" type="text/css" href="stylesheets/style.css" data-turbolinks-track="reload">
<link rel="stylesheet" type="text/css" href="stylesheets/print.css" media="print">
<link rel="stylesheet" type="text/css" href="stylesheets/syntaxhighlighter/shCore.css" data-turbolinks-track="reload">
<link rel="stylesheet" type="text/css" href="stylesheets/syntaxhighlighter/shThemeRailsGuides.css" data-turbolinks-track="reload">
<link rel="stylesheet" type="text/css" href="stylesheets/fixes.css" data-turbolinks-track="reload">
<link href="images/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<script src="javascripts/syntaxhighlighter.js" data-turbolinks-track="reload"></script>
<script src="javascripts/turbolinks.js" data-turbolinks-track="reload"></script>
<script src="javascripts/guides.js" data-turbolinks-track="reload"></script>
<script src="javascripts/responsive-tables.js" data-turbolinks-track="reload"></script>
</head>
<body class="guide">
<% if @edge %>
@ -122,9 +121,5 @@
<%= render 'license' %>
</div>
</div>
<script type="text/javascript" src="javascripts/syntaxhighlighter.js"></script>
<script type="text/javascript" src="javascripts/guides.js"></script>
<script type="text/javascript" src="javascripts/responsive-tables.js"></script>
</body>
</html>