Skip to content

Commit

Permalink
Rollup merge of #82732 - GuillaumeGomez:remove-theme-file, r=Nemo157
Browse files Browse the repository at this point in the history 
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`
  • Loading branch information
@JohnTitor
JohnTitor authored Mar 23, 2021
2 parents 9cae1fb + 524fdf0 commit a34cc6b
Show file tree
Hide file tree
Showing 4 changed files with 83 additions and 74 deletions.
1 change: 0 additions & 1 deletion src/librustdoc/html/layout.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,6 @@ crate fn render<T: Print, S: Print>(
</button>\
<div id=\"theme-choices\" role=\"menu\"></div>\
</div>\
<script src=\"{static_root_path}theme{suffix}.js\"></script>\
<nav class=\"sub\">\
<form class=\"search-form\">\
<div class=\"search-container\">\
Expand Down
61 changes: 5 additions & 56 deletions src/librustdoc/html/render/write_shared.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -130,65 +130,14 @@ pub(super) fn write_shared(

let mut themes: Vec<&String> = themes.iter().collect();
themes.sort();
// To avoid theme switch latencies as much as possible, we put everything theme related
// at the beginning of the html files into another js file.
let theme_js = format!(
r#"var themes = document.getElementById("theme-choices");
var themePicker = document.getElementById("theme-picker");
function showThemeButtonState() {{
themes.style.display = "block";
themePicker.style.borderBottomRightRadius = "0";
themePicker.style.borderBottomLeftRadius = "0";
}}
function hideThemeButtonState() {{
themes.style.display = "none";
themePicker.style.borderBottomRightRadius = "3px";
themePicker.style.borderBottomLeftRadius = "3px";
}}
function switchThemeButtonState() {{
if (themes.style.display === "block") {{
hideThemeButtonState();
}} else {{
showThemeButtonState();
}}
}};
function handleThemeButtonsBlur(e) {{
var active = document.activeElement;
var related = e.relatedTarget;
if (active.id !== "theme-picker" &&
(!active.parentNode || active.parentNode.id !== "theme-choices") &&
(!related ||
(related.id !== "theme-picker" &&
(!related.parentNode || related.parentNode.id !== "theme-choices")))) {{
hideThemeButtonState();
}}
}}
themePicker.onclick = switchThemeButtonState;
themePicker.onblur = handleThemeButtonsBlur;
{}.forEach(function(item) {{
var but = document.createElement("button");
but.textContent = item;
but.onclick = function(el) {{
switchTheme(currentTheme, mainTheme, item, true);
useSystemTheme(false);
}};
but.onblur = handleThemeButtonsBlur;
themes.appendChild(but);
}});"#,
serde_json::to_string(&themes).unwrap()
);

write_minify(&cx.shared.fs, cx.path("theme.js"), &theme_js, options.enable_minification)?;

write_minify(
&cx.shared.fs,
cx.path("main.js"),
static_files::MAIN_JS,
&static_files::MAIN_JS.replace(
"/* INSERT THEMES HERE */",
&format!(" = {}", serde_json::to_string(&themes).unwrap()),
),
options.enable_minification,
)?;
write_minify(
Expand Down
77 changes: 69 additions & 8 deletions src/librustdoc/html/static/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
// Local js definitions:
/* global addClass, getSettingValue, hasClass */
/* global onEach, onEachLazy, hasOwnProperty, removeClass, updateLocalStorage */
/* global hideThemeButtonState, showThemeButtonState */
/* global switchTheme, useSystemTheme */

if (!String.prototype.startsWith) {
String.prototype.startsWith = function(searchString, position) {
Expand Down Expand Up @@ -85,12 +85,15 @@ function getSearchElement() {
return document.getElementById("search");
}

var THEME_PICKER_ELEMENT_ID = "theme-picker";
var THEMES_ELEMENT_ID = "theme-choices";

function getThemesElement() {
return document.getElementById("theme-choices");
return document.getElementById(THEMES_ELEMENT_ID);
}

function getThemePickerElement() {
return document.getElementById("theme-picker");
return document.getElementById(THEME_PICKER_ELEMENT_ID);
}

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

function showThemeButtonState() {
var themePicker = getThemePickerElement();
var themeChoices = getThemesElement();

themeChoices.style.display = "block";
themePicker.style.borderBottomRightRadius = "0";
themePicker.style.borderBottomLeftRadius = "0";
}

function hideThemeButtonState() {
var themePicker = getThemePickerElement();
var themeChoices = getThemesElement();

themeChoices.style.display = "none";
themePicker.style.borderBottomRightRadius = "3px";
themePicker.style.borderBottomLeftRadius = "3px";
}

// Set up the theme picker list.
(function () {
var themeChoices = getThemesElement();
var themePicker = getThemePickerElement();
var availableThemes/* INSERT THEMES HERE */;

function switchThemeButtonState() {
if (themeChoices.style.display === "block") {
hideThemeButtonState();
} else {
showThemeButtonState();
}
}

function handleThemeButtonsBlur(e) {
var active = document.activeElement;
var related = e.relatedTarget;

if (active.id !== THEME_PICKER_ELEMENT_ID &&
(!active.parentNode || active.parentNode.id !== THEMES_ELEMENT_ID) &&
(!related ||
(related.id !== THEME_PICKER_ELEMENT_ID &&
(!related.parentNode || related.parentNode.id !== THEMES_ELEMENT_ID)))) {
hideThemeButtonState();
}
}

themePicker.onclick = switchThemeButtonState;
themePicker.onblur = handleThemeButtonsBlur;
availableThemes.forEach(function(item) {
var but = document.createElement("button");
but.textContent = item;
but.onclick = function() {
switchTheme(window.currentTheme, window.mainTheme, item, true);
useSystemTheme(false);
};
but.onblur = handleThemeButtonsBlur;
themeChoices.appendChild(but);
});
}());

(function() {
"use strict";

Expand Down Expand Up @@ -461,8 +523,7 @@ function defocusSearchBar() {
break;

default:
var themePicker = getThemePickerElement();
if (themePicker.parentNode.contains(ev.target)) {
if (getThemePickerElement().parentNode.contains(ev.target)) {
handleThemeKeyDown(ev);
}
}
Expand All @@ -475,7 +536,7 @@ function defocusSearchBar() {
switch (getVirtualKey(ev)) {
case "ArrowUp":
ev.preventDefault();
if (active.previousElementSibling && ev.target.id !== "theme-picker") {
if (active.previousElementSibling && ev.target.id !== THEME_PICKER_ELEMENT_ID) {
active.previousElementSibling.focus();
} else {
showThemeButtonState();
Expand All @@ -484,7 +545,7 @@ function defocusSearchBar() {
break;
case "ArrowDown":
ev.preventDefault();
if (active.nextElementSibling && ev.target.id !== "theme-picker") {
if (active.nextElementSibling && ev.target.id !== THEME_PICKER_ELEMENT_ID) {
active.nextElementSibling.focus();
} else {
showThemeButtonState();
Expand All @@ -494,7 +555,7 @@ function defocusSearchBar() {
case "Enter":
case "Return":
case "Space":
if (ev.target.id === "theme-picker" && themes.style.display === "none") {
if (ev.target.id === THEME_PICKER_ELEMENT_ID && themes.style.display === "none") {
ev.preventDefault();
showThemeButtonState();
themes.firstElementChild.focus();
Expand Down
18 changes: 9 additions & 9 deletions src/librustdoc/html/static/storage.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@
/* global resourcesSuffix */

var darkThemes = ["dark", "ayu"];
var currentTheme = document.getElementById("themeStyle");
var mainTheme = document.getElementById("mainThemeStyle");
window.currentTheme = document.getElementById("themeStyle");
window.mainTheme = document.getElementById("mainThemeStyle");

var settingsDataset = (function () {
var settingsElement = document.getElementById("default-settings");
Expand Down Expand Up @@ -137,7 +137,7 @@ function switchTheme(styleElem, mainStyleElem, newTheme, saveTheme) {
}
}

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

switchTheme(
currentTheme,
mainTheme,
window.currentTheme,
window.mainTheme,
JSON.parse(cssTheme) || "light",
true
);
Expand All @@ -180,10 +180,10 @@ var updateSystemTheme = (function() {

if (mql.matches) {
// prefers a dark theme
switchTheme(currentTheme, mainTheme, darkTheme, true);
switchTheme(window.currentTheme, window.mainTheme, darkTheme, true);
} else {
// prefers a light theme, or has no preference
switchTheme(currentTheme, mainTheme, lightTheme, true);
switchTheme(window.currentTheme, window.mainTheme, lightTheme, true);
}

// note: we save the theme so that it doesn't suddenly change when
Expand Down Expand Up @@ -212,8 +212,8 @@ if (getSettingValue("use-system-theme") !== "false" && window.matchMedia) {
updateSystemTheme();
} else {
switchTheme(
currentTheme,
mainTheme,
window.currentTheme,
window.mainTheme,
getSettingValue("theme") || "light",
false
);
Expand Down

0 comments on commit a34cc6b

Please sign in to comment.