forked from pydata/pydata-sphinx-theme
-
Notifications
You must be signed in to change notification settings - Fork 0
/
version-switcher.html
88 lines (83 loc) · 3.98 KB
/
version-switcher.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<div class="dropdown" id="version_switcher">
<button type="button" class="btn btn-primary btn-sm navbar-btn dropdown-toggle" id="version_switcher_button" data-toggle="dropdown">
{{ theme_switcher.get('version_match') }} <!-- this text may get changed later by javascript -->
<span class="caret"></span>
</button>
<div id="version_switcher_menu" class="dropdown-menu list-group-flush py-0" aria-labelledby="version_switcher_button">
<!-- dropdown will be populated by javascript on page load -->
</div>
</div>
<!-- NOTE: this JS must live here (not in our global JS file) because it relies
on being processed by Jinja before it is run (specifically for replacing
variables {{ pagename }} and {{ theme_switcher }}.
-->
<script type="text/javascript">
// Construct the target URL from the JSON components
function buildURL(entry) {
var template = "{{ theme_switcher.get('url_template') }}"; // supplied by jinja
template = template.replace("{version}", entry.version);
return template;
}
// Check if corresponding page path exists in other version of docs
// and, if so, go there instead of the homepage of the other docs version
function checkPageExistsAndRedirect(event) {
const currentFilePath = "{{ pagename }}.html",
tryUrl = event.target.getAttribute("href");
let otherDocsHomepage = tryUrl.replace(currentFilePath, "");
$.ajax({
type: 'HEAD',
url: tryUrl,
// if the page exists, go there
success: function() {
location.href = tryUrl;
}
}).fail(function() {
location.href = otherDocsHomepage;
});
// this prevents the browser from following the href of the clicked node
// (which is fine because this function takes care of redirecting)
return false;
}
// Populate the version switcher from the JSON config file
(function () {
$.getJSON("{{ theme_switcher.get('json_url') }}", function(data, textStatus, jqXHR) {
const currentFilePath = "{{ pagename }}.html";
// create links to the corresponding page in the other docs versions
$.each(data, function(index, entry) {
// if no custom name specified (e.g., "latest"), use version string
if (!("name" in entry)) {
entry.name = entry.version;
}
// create the node
const node = document.createElement("a");
node.setAttribute("class", "list-group-item list-group-item-action py-1");
node.textContent = `${entry.name}`;
// get the base URL for that doc version, add the current page's
// path to it, and set as `href`
if (!("url" in entry)) {
entry.url = buildURL(entry);
}
node.setAttribute("href", `${entry.url}${currentFilePath}`);
// on click, AJAX calls will check if the linked page exists before
// trying to redirect, and if not, will redirect to the homepage
// for that version of the docs.
node.onclick = checkPageExistsAndRedirect;
// Add dataset values for the version and name in case people want
// to apply CSS styling based on this information.
node.dataset["versionName"] = entry.name;
node.dataset["version"] = entry.version;
$("#version_switcher_menu").append(node);
// replace dropdown button text with the preferred display name of
// this version, rather than using sphinx's {{ version }} variable.
// also highlight the dropdown entry for the currently-viewed
// version's entry
if (entry.version == "{{ theme_switcher.get('version_match') }}") {
node.classList.add("active");
let btn = document.getElementById("version_switcher_button");
btn.innerText = btn.dataset["activeVersionName"] = entry.name;
btn.dataset["activeVersion"] = entry.version;
}
});
});
})();
</script>