1
Fork 0

Move JS into a standalone file

This commit is contained in:
Will Crichton 2021-10-01 13:05:35 -07:00
parent df5e3a6e40
commit 25323ec306
7 changed files with 124 additions and 115 deletions

View file

@ -22,6 +22,8 @@ crate struct Layout {
/// If false, the `select` element to have search filtering by crates on rendered docs
/// won't be generated.
crate generate_search_filter: bool,
/// If true, then scrape-examples.js will be included in the output HTML file
crate scrape_examples_extension: bool,
}
#[derive(Serialize)]

View file

@ -417,6 +417,7 @@ impl<'tcx> FormatRenderer<'tcx> for Context<'tcx> {
krate: krate.name.to_string(),
css_file_extension: extension_css,
generate_search_filter,
scrape_examples_extension: call_locations.len() > 0,
};
let mut issue_tracker_base_url = None;
let mut include_sources = true;

View file

@ -303,6 +303,10 @@ pub(super) fn write_shared(
)?;
}
if cx.shared.layout.scrape_examples_extension {
write_minify("scrape-examples.js", static_files::SCRAPE_EXAMPLES_JS, cx, options)?;
}
if let Some(ref css) = cx.shared.layout.css_file_extension {
let buffer = try_err!(fs::read_to_string(css), css);
// This varies based on the invocation, so it can't go through the write_minify wrapper.

View file

@ -979,121 +979,6 @@ function hideThemeButtonState() {
onHashChange(null);
window.addEventListener("hashchange", onHashChange);
searchState.setup();
/////// --scrape-examples interactions
// Scroll code block to put the given code location in the middle of the viewer
function scrollToLoc(elt, loc) {
var wrapper = elt.querySelector(".code-wrapper");
var halfHeight = wrapper.offsetHeight / 2;
var lines = elt.querySelector('.line-numbers');
var offsetMid = (lines.children[loc[0]].offsetTop
+ lines.children[loc[1]].offsetTop) / 2;
var scrollOffset = offsetMid - halfHeight;
lines.scrollTo(0, scrollOffset);
elt.querySelector(".rust").scrollTo(0, scrollOffset);
}
function updateScrapedExample(example) {
var locs = JSON.parse(example.attributes.getNamedItem("data-locs").textContent);
var offset = parseInt(example.attributes.getNamedItem("data-offset").textContent);
var locIndex = 0;
var highlights = example.querySelectorAll('.highlight');
var link = example.querySelector('.scraped-example-title a');
addClass(highlights[0], 'focus');
if (locs.length > 1) {
// Toggle through list of examples in a given file
var onChangeLoc = function(f) {
removeClass(highlights[locIndex], 'focus');
f();
scrollToLoc(example, locs[locIndex]);
addClass(highlights[locIndex], 'focus');
var curLoc = locs[locIndex];
var minLine = curLoc[0] + offset + 1;
var maxLine = curLoc[1] + offset + 1;
var text;
var anchor;
if (minLine == maxLine) {
text = 'line ' + minLine.toString();
anchor = minLine.toString();
} else {
var range = minLine.toString() + '-' + maxLine.toString();
text = 'lines ' + range;
anchor = range;
}
var url = new URL(link.href);
url.hash = anchor;
link.href = url.toString();
link.innerHTML = text;
};
example.querySelector('.prev')
.addEventListener('click', function() {
onChangeLoc(function() {
locIndex = (locIndex - 1 + locs.length) % locs.length;
});
});
example.querySelector('.next')
.addEventListener('click', function() {
onChangeLoc(function() { locIndex = (locIndex + 1) % locs.length; });
});
} else {
// Remove buttons if there's only one example in the file
example.querySelector('.prev').remove();
example.querySelector('.next').remove();
}
var codeEl = example.querySelector('.rust');
var codeOverflows = codeEl.scrollHeight > codeEl.clientHeight;
var expandButton = example.querySelector('.expand');
if (codeOverflows) {
// If file is larger than default height, give option to expand the viewer
expandButton.addEventListener('click', function () {
if (hasClass(example, "expanded")) {
removeClass(example, "expanded");
scrollToLoc(example, locs[0]);
} else {
addClass(example, "expanded");
}
});
} else {
// Otherwise remove expansion buttons
addClass(example, 'expanded');
expandButton.remove();
}
// Start with the first example in view
scrollToLoc(example, locs[0]);
}
function updateScrapedExamples() {
var firstExamples = document.querySelectorAll('.scraped-example-list > .scraped-example');
onEach(firstExamples, updateScrapedExample);
onEach(document.querySelectorAll('.more-examples-toggle'), function(toggle) {
// Allow users to click the left border of the <details> section to close it,
// since the section can be large and finding the [+] button is annoying.
toggle.querySelector('.toggle-line').addEventListener('click', function() {
toggle.open = false;
});
var moreExamples = toggle.querySelectorAll('.scraped-example');
toggle.querySelector('summary').addEventListener('click', function() {
// Wrapping in setTimeout ensures the update happens after the elements are actually
// visible. This is necessary since updateScrapedExample calls scrollToLoc which
// depends on offsetHeight, a property that requires an element to be visible to
// compute correctly.
setTimeout(function() { onEach(moreExamples, updateScrapedExample); });
}, {once: true});
});
}
updateScrapedExamples();
}());
(function () {

View file

@ -0,0 +1,110 @@
(function () {
// Scroll code block to put the given code location in the middle of the viewer
function scrollToLoc(elt, loc) {
var wrapper = elt.querySelector(".code-wrapper");
var halfHeight = wrapper.offsetHeight / 2;
var lines = elt.querySelector('.line-numbers');
var offsetMid = (lines.children[loc[0]].offsetTop
+ lines.children[loc[1]].offsetTop) / 2;
var scrollOffset = offsetMid - halfHeight;
lines.scrollTo(0, scrollOffset);
elt.querySelector(".rust").scrollTo(0, scrollOffset);
}
function updateScrapedExample(example) {
var locs = JSON.parse(example.attributes.getNamedItem("data-locs").textContent);
var offset = parseInt(example.attributes.getNamedItem("data-offset").textContent);
var locIndex = 0;
var highlights = example.querySelectorAll('.highlight');
var link = example.querySelector('.scraped-example-title a');
addClass(highlights[0], 'focus');
if (locs.length > 1) {
// Toggle through list of examples in a given file
var onChangeLoc = function(f) {
removeClass(highlights[locIndex], 'focus');
f();
scrollToLoc(example, locs[locIndex]);
addClass(highlights[locIndex], 'focus');
var curLoc = locs[locIndex];
var minLine = curLoc[0] + offset + 1;
var maxLine = curLoc[1] + offset + 1;
var text;
var anchor;
if (minLine == maxLine) {
text = 'line ' + minLine.toString();
anchor = minLine.toString();
} else {
var range = minLine.toString() + '-' + maxLine.toString();
text = 'lines ' + range;
anchor = range;
}
var url = new URL(link.href);
url.hash = anchor;
link.href = url.toString();
link.innerHTML = text;
};
example.querySelector('.prev')
.addEventListener('click', function() {
onChangeLoc(function() {
locIndex = (locIndex - 1 + locs.length) % locs.length;
});
});
example.querySelector('.next')
.addEventListener('click', function() {
onChangeLoc(function() { locIndex = (locIndex + 1) % locs.length; });
});
} else {
// Remove buttons if there's only one example in the file
example.querySelector('.prev').remove();
example.querySelector('.next').remove();
}
var codeEl = example.querySelector('.rust');
var codeOverflows = codeEl.scrollHeight > codeEl.clientHeight;
var expandButton = example.querySelector('.expand');
if (codeOverflows) {
// If file is larger than default height, give option to expand the viewer
expandButton.addEventListener('click', function () {
if (hasClass(example, "expanded")) {
removeClass(example, "expanded");
scrollToLoc(example, locs[0]);
} else {
addClass(example, "expanded");
}
});
} else {
// Otherwise remove expansion buttons
addClass(example, 'expanded');
expandButton.remove();
}
// Start with the first example in view
scrollToLoc(example, locs[0]);
}
var firstExamples = document.querySelectorAll('.scraped-example-list > .scraped-example');
onEach(firstExamples, updateScrapedExample);
onEach(document.querySelectorAll('.more-examples-toggle'), function(toggle) {
// Allow users to click the left border of the <details> section to close it,
// since the section can be large and finding the [+] button is annoying.
toggle.querySelector('.toggle-line').addEventListener('click', function() {
toggle.open = false;
});
var moreExamples = toggle.querySelectorAll('.scraped-example');
toggle.querySelector('summary').addEventListener('click', function() {
// Wrapping in setTimeout ensures the update happens after the elements are actually
// visible. This is necessary since updateScrapedExample calls scrollToLoc which
// depends on offsetHeight, a property that requires an element to be visible to
// compute correctly.
setTimeout(function() { onEach(moreExamples, updateScrapedExample); });
}, {once: true});
});
})();

View file

@ -35,6 +35,10 @@ crate static SETTINGS_JS: &str = include_str!("static/js/settings.js");
/// Storage, used to store documentation settings.
crate static STORAGE_JS: &str = include_str!("static/js/storage.js");
/// The file contents of `scraped-examples.js`, which contains functionality related to the
/// --scrape-examples flag that inserts automatically-found examples of usages of items.
crate static SCRAPE_EXAMPLES_JS: &str = include_str!("static/js/scrape-examples.js");
/// The file contents of `brush.svg`, the icon used for the theme-switch button.
crate static BRUSH_SVG: &[u8] = include_bytes!("static/images/brush.svg");

View file

@ -109,6 +109,9 @@
data-search-js="{{static_root_path | safe}}search{{page.resource_suffix}}.js"> {#- -#}
</div>
<script src="{{static_root_path | safe}}main{{page.resource_suffix}}.js"></script> {#- -#}
{%- if layout.scrape_examples_extension -%}
<script src="{{static_root_path | safe}}scrape-examples{{page.resource_suffix}}.js"></script> {#- -#}
{%- endif -%}
{%- for script in page.static_extra_scripts -%}
<script src="{{static_root_path | safe}}{{script}}.js"></script> {#- -#}
{% endfor %}