Skip to content

Commit a34cc6b

Browse files
JohnTitorJohnTitor
authored
Rollup merge of #82732 - GuillaumeGomez:remove-theme-file, r=Nemo157
Remove theme.js file Fixes #82616. The first commit moves the `theme.js` file into `main.js`, which requires to also run a small `.replace` on the `main.js` content. The second commit is just a small cleanup to centralize DOM ids. Since it removes a file from rustdoc output: cc `@rust-lang/docs-rs` cc `@jsha` r? `@jyn514`
2 parents 9cae1fb + 524fdf0 commit a34cc6b

File tree

4 files changed

+83
-74
lines changed

4 files changed

+83
-74
lines changed

‎src/librustdoc/html/layout.rs

-1
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,6 @@ crate fn render<T: Print, S: Print>(
8888
</button>\
8989
<div id=\"theme-choices\" role=\"menu\"></div>\
9090
</div>\
91-
<script src=\"{static_root_path}theme{suffix}.js\"></script>\
9291
<nav class=\"sub\">\
9392
<form class=\"search-form\">\
9493
<div class=\"search-container\">\

‎src/librustdoc/html/render/write_shared.rs

+5-56
Original file line numberDiff line numberDiff line change
@@ -130,65 +130,14 @@ pub(super) fn write_shared(
130130

131131
let mut themes: Vec<&String> = themes.iter().collect();
132132
themes.sort();
133-
// To avoid theme switch latencies as much as possible, we put everything theme related
134-
// at the beginning of the html files into another js file.
135-
let theme_js = format!(
136-
r#"var themes = document.getElementById("theme-choices");
137-
var themePicker = document.getElementById("theme-picker");
138-
139-
function showThemeButtonState() {{
140-
themes.style.display = "block";
141-
themePicker.style.borderBottomRightRadius = "0";
142-
themePicker.style.borderBottomLeftRadius = "0";
143-
}}
144-
145-
function hideThemeButtonState() {{
146-
themes.style.display = "none";
147-
themePicker.style.borderBottomRightRadius = "3px";
148-
themePicker.style.borderBottomLeftRadius = "3px";
149-
}}
150-
151-
function switchThemeButtonState() {{
152-
if (themes.style.display === "block") {{
153-
hideThemeButtonState();
154-
}} else {{
155-
showThemeButtonState();
156-
}}
157-
}};
158-
159-
function handleThemeButtonsBlur(e) {{
160-
var active = document.activeElement;
161-
var related = e.relatedTarget;
162-
163-
if (active.id !== "theme-picker" &&
164-
(!active.parentNode || active.parentNode.id !== "theme-choices") &&
165-
(!related ||
166-
(related.id !== "theme-picker" &&
167-
(!related.parentNode || related.parentNode.id !== "theme-choices")))) {{
168-
hideThemeButtonState();
169-
}}
170-
}}
171-
172-
themePicker.onclick = switchThemeButtonState;
173-
themePicker.onblur = handleThemeButtonsBlur;
174-
{}.forEach(function(item) {{
175-
var but = document.createElement("button");
176-
but.textContent = item;
177-
but.onclick = function(el) {{
178-
switchTheme(currentTheme, mainTheme, item, true);
179-
useSystemTheme(false);
180-
}};
181-
but.onblur = handleThemeButtonsBlur;
182-
themes.appendChild(but);
183-
}});"#,
184-
serde_json::to_string(&themes).unwrap()
185-
);
186-
187-
write_minify(&cx.shared.fs, cx.path("theme.js"), &theme_js, options.enable_minification)?;
133+
188134
write_minify(
189135
&cx.shared.fs,
190136
cx.path("main.js"),
191-
static_files::MAIN_JS,
137+
&static_files::MAIN_JS.replace(
138+
"/* INSERT THEMES HERE */",
139+
&format!(" = {}", serde_json::to_string(&themes).unwrap()),
140+
),
192141
options.enable_minification,
193142
)?;
194143
write_minify(

‎src/librustdoc/html/static/main.js

+69-8
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
// Local js definitions:
33
/* global addClass, getSettingValue, hasClass */
44
/* global onEach, onEachLazy, hasOwnProperty, removeClass, updateLocalStorage */
5-
/* global hideThemeButtonState, showThemeButtonState */
5+
/* global switchTheme, useSystemTheme */
66

77
if (!String.prototype.startsWith) {
88
String.prototype.startsWith = function(searchString, position) {
@@ -85,12 +85,15 @@ function getSearchElement() {
8585
return document.getElementById("search");
8686
}
8787

88+
var THEME_PICKER_ELEMENT_ID = "theme-picker";
89+
var THEMES_ELEMENT_ID = "theme-choices";
90+
8891
function getThemesElement() {
89-
return document.getElementById("theme-choices");
92+
return document.getElementById(THEMES_ELEMENT_ID);
9093
}
9194

9295
function getThemePickerElement() {
93-
return document.getElementById("theme-picker");
96+
return document.getElementById(THEME_PICKER_ELEMENT_ID);
9497
}
9598

9699
// Returns the current URL without any query parameter or hash.
@@ -108,6 +111,65 @@ function defocusSearchBar() {
108111
getSearchInput().blur();
109112
}
110113

114+
function showThemeButtonState() {
115+
var themePicker = getThemePickerElement();
116+
var themeChoices = getThemesElement();
117+
118+
themeChoices.style.display = "block";
119+
themePicker.style.borderBottomRightRadius = "0";
120+
themePicker.style.borderBottomLeftRadius = "0";
121+
}
122+
123+
function hideThemeButtonState() {
124+
var themePicker = getThemePickerElement();
125+
var themeChoices = getThemesElement();
126+
127+
themeChoices.style.display = "none";
128+
themePicker.style.borderBottomRightRadius = "3px";
129+
themePicker.style.borderBottomLeftRadius = "3px";
130+
}
131+
132+
// Set up the theme picker list.
133+
(function () {
134+
var themeChoices = getThemesElement();
135+
var themePicker = getThemePickerElement();
136+
var availableThemes/* INSERT THEMES HERE */;
137+
138+
function switchThemeButtonState() {
139+
if (themeChoices.style.display === "block") {
140+
hideThemeButtonState();
141+
} else {
142+
showThemeButtonState();
143+
}
144+
}
145+
146+
function handleThemeButtonsBlur(e) {
147+
var active = document.activeElement;
148+
var related = e.relatedTarget;
149+
150+
if (active.id !== THEME_PICKER_ELEMENT_ID &&
151+
(!active.parentNode || active.parentNode.id !== THEMES_ELEMENT_ID) &&
152+
(!related ||
153+
(related.id !== THEME_PICKER_ELEMENT_ID &&
154+
(!related.parentNode || related.parentNode.id !== THEMES_ELEMENT_ID)))) {
155+
hideThemeButtonState();
156+
}
157+
}
158+
159+
themePicker.onclick = switchThemeButtonState;
160+
themePicker.onblur = handleThemeButtonsBlur;
161+
availableThemes.forEach(function(item) {
162+
var but = document.createElement("button");
163+
but.textContent = item;
164+
but.onclick = function() {
165+
switchTheme(window.currentTheme, window.mainTheme, item, true);
166+
useSystemTheme(false);
167+
};
168+
but.onblur = handleThemeButtonsBlur;
169+
themeChoices.appendChild(but);
170+
});
171+
}());
172+
111173
(function() {
112174
"use strict";
113175

@@ -461,8 +523,7 @@ function defocusSearchBar() {
461523
break;
462524

463525
default:
464-
var themePicker = getThemePickerElement();
465-
if (themePicker.parentNode.contains(ev.target)) {
526+
if (getThemePickerElement().parentNode.contains(ev.target)) {
466527
handleThemeKeyDown(ev);
467528
}
468529
}
@@ -475,7 +536,7 @@ function defocusSearchBar() {
475536
switch (getVirtualKey(ev)) {
476537
case "ArrowUp":
477538
ev.preventDefault();
478-
if (active.previousElementSibling && ev.target.id !== "theme-picker") {
539+
if (active.previousElementSibling && ev.target.id !== THEME_PICKER_ELEMENT_ID) {
479540
active.previousElementSibling.focus();
480541
} else {
481542
showThemeButtonState();
@@ -484,7 +545,7 @@ function defocusSearchBar() {
484545
break;
485546
case "ArrowDown":
486547
ev.preventDefault();
487-
if (active.nextElementSibling && ev.target.id !== "theme-picker") {
548+
if (active.nextElementSibling && ev.target.id !== THEME_PICKER_ELEMENT_ID) {
488549
active.nextElementSibling.focus();
489550
} else {
490551
showThemeButtonState();
@@ -494,7 +555,7 @@ function defocusSearchBar() {
494555
case "Enter":
495556
case "Return":
496557
case "Space":
497-
if (ev.target.id === "theme-picker" && themes.style.display === "none") {
558+
if (ev.target.id === THEME_PICKER_ELEMENT_ID && themes.style.display === "none") {
498559
ev.preventDefault();
499560
showThemeButtonState();
500561
themes.firstElementChild.focus();

‎src/librustdoc/html/static/storage.js

+9-9
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
/* global resourcesSuffix */
33

44
var darkThemes = ["dark", "ayu"];
5-
var currentTheme = document.getElementById("themeStyle");
6-
var mainTheme = document.getElementById("mainThemeStyle");
5+
window.currentTheme = document.getElementById("themeStyle");
6+
window.mainTheme = document.getElementById("mainThemeStyle");
77

88
var settingsDataset = (function () {
99
var settingsElement = document.getElementById("default-settings");
@@ -137,7 +137,7 @@ function switchTheme(styleElem, mainStyleElem, newTheme, saveTheme) {
137137
}
138138
}
139139

140-
// This function is called from "theme.js", generated in `html/render/mod.rs`.
140+
// This function is called from "main.js".
141141
// eslint-disable-next-line no-unused-vars
142142
function useSystemTheme(value) {
143143
if (value === undefined) {
@@ -161,8 +161,8 @@ var updateSystemTheme = (function() {
161161
.getPropertyValue('content');
162162

163163
switchTheme(
164-
currentTheme,
165-
mainTheme,
164+
window.currentTheme,
165+
window.mainTheme,
166166
JSON.parse(cssTheme) || "light",
167167
true
168168
);
@@ -180,10 +180,10 @@ var updateSystemTheme = (function() {
180180

181181
if (mql.matches) {
182182
// prefers a dark theme
183-
switchTheme(currentTheme, mainTheme, darkTheme, true);
183+
switchTheme(window.currentTheme, window.mainTheme, darkTheme, true);
184184
} else {
185185
// prefers a light theme, or has no preference
186-
switchTheme(currentTheme, mainTheme, lightTheme, true);
186+
switchTheme(window.currentTheme, window.mainTheme, lightTheme, true);
187187
}
188188

189189
// note: we save the theme so that it doesn't suddenly change when
@@ -212,8 +212,8 @@ if (getSettingValue("use-system-theme") !== "false" && window.matchMedia) {
212212
updateSystemTheme();
213213
} else {
214214
switchTheme(
215-
currentTheme,
216-
mainTheme,
215+
window.currentTheme,
216+
window.mainTheme,
217217
getSettingValue("theme") || "light",
218218
false
219219
);

0 commit comments

Comments
 (0)