Skip to content

Commit

Permalink
Rollup merge of rust-lang#85117 - jsha:bubble-bubble-toil-and-trouble…
Browse files Browse the repository at this point in the history 
…, r=GuillaumeGomez

Move global click handlers to per-element ones.

In rustdoc's main.js, we had an onclick handler for the whole document that would dispatch to handlers for various elements. This change attaches the handlers to the elements that trigger them, instead. This simplifies the code and avoids reimplementing the browser's bubbling functionality.

As part of this change, change from a class to an id for help button.

Move the handlers and associated code for highlighting source lines into source-script.js (and factor out a shared regex).

Demo at https://hoffman-andrews.com/rust/bubble-bubble-toil-and-trouble/std/string/struct.String.html

Note: this conflicts with / depends on rust-lang#85074. Once that's merged I'll rebase this and resolve conflicts.

Part of rust-lang#83332. Thanks to `@Manishearth` for the [suggestion to not reimplement bubbling](rust-lang#83332 (comment)).

r? `@GuillaumeGomez`
  • Loading branch information
@GuillaumeGomez
GuillaumeGomez committed May 12, 2021
2 parents 9461780 + 0945451 commit 90f6fe8
Show file tree
Hide file tree
Showing 8 changed files with 138 additions and 128 deletions.
2 changes: 1 addition & 1 deletion src/librustdoc/html/layout.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -105,7 +105,7 @@ crate fn render<T: Print, S: Print>(
placeholder=\"Click or press ‘S’ to search, ‘?’ for more options…\" \
type=\"search\">\
</div>\
<button type=\"button\" class=\"help-button\">?</button>
<button type=\"button\" id=\"help-button\">?</button>
<a id=\"settings-menu\" href=\"{root_path}settings.html\">\
<img src=\"{static_root_path}wheel{suffix}.svg\" \
width=\"18\" height=\"18\" \
Expand Down
1 change: 1 addition & 0 deletions src/librustdoc/html/markdown.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1347,6 +1347,7 @@ fn init_id_map() -> FxHashMap<String, usize> {
map.insert("theme-picker".to_owned(), 1);
map.insert("theme-choices".to_owned(), 1);
map.insert("settings-menu".to_owned(), 1);
map.insert("help-button".to_owned(), 1);
map.insert("main".to_owned(), 1);
map.insert("search".to_owned(), 1);
map.insert("crate-search".to_owned(), 1);
Expand Down
146 changes: 29 additions & 117 deletions src/librustdoc/html/static/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -381,56 +381,9 @@ function hideThemeButtonState() {
}
}

function highlightSourceLines(match, ev) {
if (typeof match === "undefined") {
// If we're in mobile mode, we should hide the sidebar in any case.
hideSidebar();
match = window.location.hash.match(/^#?(\d+)(?:-(\d+))?$/);
}
if (!match) {
return;
}
var from = parseInt(match[1], 10);
var to = from;
if (typeof match[2] !== "undefined") {
to = parseInt(match[2], 10);
}
if (to < from) {
var tmp = to;
to = from;
from = tmp;
}
var elem = document.getElementById(from);
if (!elem) {
return;
}
if (!ev) {
var x = document.getElementById(from);
if (x) {
x.scrollIntoView();
}
}
onEachLazy(document.getElementsByClassName("line-numbers"), function(e) {
onEachLazy(e.getElementsByTagName("span"), function(i_e) {
removeClass(i_e, "line-highlighted");
});
});
for (var i = from; i <= to; ++i) {
elem = document.getElementById(i);
if (!elem) {
break;
}
addClass(elem, "line-highlighted");
}
}

function onHashChange(ev) {
// If we're in mobile mode, we should hide the sidebar in any case.
hideSidebar();
var match = window.location.hash.match(/^#?(\d+)(?:-(\d+))?$/);
if (match) {
return highlightSourceLines(match, ev);
}
handleHashes(ev);
}

Expand Down Expand Up @@ -585,78 +538,9 @@ function hideThemeButtonState() {
}
}

function findParentElement(elem, tagName) {
do {
if (elem && elem.tagName === tagName) {
return elem;
}
elem = elem.parentNode;
} while (elem);
return null;
}

document.addEventListener("keypress", handleShortcut);
document.addEventListener("keydown", handleShortcut);

var handleSourceHighlight = (function() {
var prev_line_id = 0;

var set_fragment = function(name) {
var x = window.scrollX,
y = window.scrollY;
if (searchState.browserSupportsHistoryApi()) {
history.replaceState(null, null, "#" + name);
highlightSourceLines();
} else {
location.replace("#" + name);
}
// Prevent jumps when selecting one or many lines
window.scrollTo(x, y);
};

return function(ev) {
var cur_line_id = parseInt(ev.target.id, 10);
ev.preventDefault();

if (ev.shiftKey && prev_line_id) {
// Swap selection if needed
if (prev_line_id > cur_line_id) {
var tmp = prev_line_id;
prev_line_id = cur_line_id;
cur_line_id = tmp;
}

set_fragment(prev_line_id + "-" + cur_line_id);
} else {
prev_line_id = cur_line_id;

set_fragment(cur_line_id);
}
};
}());

document.addEventListener("click", function(ev) {
var helpElem = getHelpElement(false);
if (hasClass(ev.target, "help-button")) {
displayHelp(true, ev);
} else if (ev.target.tagName === "SPAN" && hasClass(ev.target.parentNode, "line-numbers")) {
handleSourceHighlight(ev);
} else if (helpElem && hasClass(helpElem, "hidden") === false) {
var is_inside_help_popup = ev.target !== helpElem && helpElem.contains(ev.target);
if (is_inside_help_popup === false) {
addClass(helpElem, "hidden");
removeClass(document.body, "blur");
}
} else {
// Making a collapsed element visible on onhashchange seems
// too late
var a = findParentElement(ev.target, "A");
if (a && a.hash) {
expandSection(a.hash.replace(/^#/, ""));
}
}
});

(function() {
var x = document.getElementsByClassName("version-selector");
if (x.length > 0) {
Expand Down Expand Up @@ -1121,6 +1005,27 @@ function hideThemeButtonState() {
});
}());

function handleClick(id, f) {
var elem = document.getElementById(id);
if (elem) {
elem.addEventListener("click", f);
}
}
handleClick("help-button", function(ev) {
displayHelp(true, ev);
});

onEachLazy(document.getElementsByTagName("a"), function(el) {
// For clicks on internal links (<A> tags with a hash property), we expand the section we're
// jumping to *before* jumping there. We can't do this in onHashChange, because it changes
// the height of the document so we wind up scrolled to the wrong place.
if (el.hash) {
el.addEventListener("click", function() {
expandSection(el.hash.slice(1));
});
}
});

onEachLazy(document.getElementsByClassName("notable-traits"), function(e) {
e.onclick = function() {
this.getElementsByClassName('notable-traits-tooltiptext')[0]
Expand Down Expand Up @@ -1165,6 +1070,13 @@ function hideThemeButtonState() {
addClass(popup, "hidden");
popup.id = "help";

popup.addEventListener("click", function(ev) {
if (ev.target === popup) {
// Clicked the blurred zone outside the help popup; dismiss help.
displayHelp(false, ev);
}
});

var book_info = document.createElement("span");
book_info.innerHTML = "You can find more information in \
<a href=\"https://doc.rust-lang.org/rustdoc/\">the rustdoc book</a>.";
Expand Down Expand Up @@ -1223,7 +1135,7 @@ function hideThemeButtonState() {
}

onHashChange(null);
window.onhashchange = onHashChange;
window.addEventListener("hashchange", onHashChange);
searchState.setup();
}());

Expand Down
8 changes: 4 additions & 4 deletions src/librustdoc/html/static/rustdoc.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1289,7 +1289,7 @@ h4 > .notable-traits {
outline: none;
}

#settings-menu, .help-button {
#settings-menu, #help-button {
position: absolute;
top: 10px;
}
Expand All @@ -1299,7 +1299,7 @@ h4 > .notable-traits {
outline: none;
}

#theme-picker, #settings-menu, .help-button, #copy-path {
#theme-picker, #settings-menu, #help-button, #copy-path {
padding: 4px;
width: 27px;
height: 29px;
Expand All @@ -1308,7 +1308,7 @@ h4 > .notable-traits {
cursor: pointer;
}

.help-button {
#help-button {
right: 30px;
font-family: "Fira Sans", Arial, sans-serif;
text-align: center;
Expand Down Expand Up @@ -1593,7 +1593,7 @@ h4 > .notable-traits {
}

/* We don't display the help button on mobile devices. */
.help-button {
#help-button {
display: none;
}
.search-container > div {
Expand Down
97 changes: 97 additions & 0 deletions src/librustdoc/html/static/source-script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@

// Local js definitions:
/* global addClass, getCurrentValue, hasClass, removeClass, updateLocalStorage */
(function() {

function getCurrentFilePath() {
var parts = window.location.pathname.split("/");
Expand Down Expand Up @@ -149,3 +150,99 @@ function createSourceSidebar() {
selected_elem.focus();
}
}

var lineNumbersRegex = /^#?(\d+)(?:-(\d+))?$/;

function highlightSourceLines(match, ev) {
if (typeof match === "undefined") {
match = window.location.hash.match(lineNumbersRegex);
}
if (!match) {
return;
}
var from = parseInt(match[1], 10);
var to = from;
if (typeof match[2] !== "undefined") {
to = parseInt(match[2], 10);
}
if (to < from) {
var tmp = to;
to = from;
from = tmp;
}
var elem = document.getElementById(from);
if (!elem) {
return;
}
if (!ev) {
var x = document.getElementById(from);
if (x) {
x.scrollIntoView();
}
}
onEachLazy(document.getElementsByClassName("line-numbers"), function(e) {
onEachLazy(e.getElementsByTagName("span"), function(i_e) {
removeClass(i_e, "line-highlighted");
});
});
for (var i = from; i <= to; ++i) {
elem = document.getElementById(i);
if (!elem) {
break;
}
addClass(elem, "line-highlighted");
}
}

var handleSourceHighlight = (function() {
var prev_line_id = 0;

var set_fragment = function(name) {
var x = window.scrollX,
y = window.scrollY;
if (searchState.browserSupportsHistoryApi()) {
history.replaceState(null, null, "#" + name);
highlightSourceLines();
} else {
location.replace("#" + name);
}
// Prevent jumps when selecting one or many lines
window.scrollTo(x, y);
};

return function(ev) {
var cur_line_id = parseInt(ev.target.id, 10);
ev.preventDefault();

if (ev.shiftKey && prev_line_id) {
// Swap selection if needed
if (prev_line_id > cur_line_id) {
var tmp = prev_line_id;
prev_line_id = cur_line_id;
cur_line_id = tmp;
}

set_fragment(prev_line_id + "-" + cur_line_id);
} else {
prev_line_id = cur_line_id;

set_fragment(cur_line_id);
}
};
}());

window.addEventListener("hashchange", function() {
var match = window.location.hash.match(lineNumbersRegex);
if (match) {
return highlightSourceLines(match, ev);
}
});

onEachLazy(document.getElementsByClassName("line-numbers"), function(el) {
el.addEventListener("click", handleSourceHighlight);
});

highlightSourceLines();

window.createSourceSidebar = createSourceSidebar;
})();
4 changes: 2 additions & 2 deletions src/librustdoc/html/static/themes/ayu.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -503,7 +503,7 @@ kbd {
box-shadow-color: #c6cbd1;
}

#theme-picker, #settings-menu, .help-button, #copy-path {
#theme-picker, #settings-menu, #help-button, #copy-path {
border-color: #5c6773;
background-color: #0f1419;
color: #fff;
Expand All @@ -515,7 +515,7 @@ kbd {

#theme-picker:hover, #theme-picker:focus,
#settings-menu:hover, #settings-menu:focus,
.help-button:hover, .help-button:focus,
#help-button:hover, #help-button:focus,
#copy-path:hover, #copy-path:focus {
border-color: #e0e0e0;
}
Expand Down
4 changes: 2 additions & 2 deletions src/librustdoc/html/static/themes/dark.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -393,15 +393,15 @@ kbd {
box-shadow-color: #c6cbd1;
}

#theme-picker, #settings-menu, .help-button, #copy-path {
#theme-picker, #settings-menu, #help-button, #copy-path {
border-color: #e0e0e0;
background: #f0f0f0;
color: #000;
}

#theme-picker:hover, #theme-picker:focus,
#settings-menu:hover, #settings-menu:focus,
.help-button:hover, .help-button:focus,
#help-button:hover, #help-button:focus,
#copy-path:hover, #copy-path:focus {
border-color: #ffb900;
}
Expand Down
Loading

0 comments on commit 90f6fe8

Please sign in to comment.