You've already forked comprehensive-rust
mirror of
https://github.com/google/comprehensive-rust.git
synced 2025-07-10 08:15:37 +02:00
Integrate GA4 code directly with book.js
(#470)
* Integrate GA4 code directly with `book.js` The main advantage of this is that it simplifies the setup since we can avoid the monkey-patching we did before. A secondary advantage is that it should make things a little faster since we avoid a request to the server on every page load. * Remove unreachable return * Watch all of `third_party` It just occurred to me that we want to refresh the page in `mdbook serve` when anything changes in `third_party`.
This commit is contained in:
@ -9,7 +9,7 @@ title = "Comprehensive Rust 🦀"
|
|||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[build]
|
[build]
|
||||||
extra-watch-dirs = ["po"]
|
extra-watch-dirs = ["po", "third_party"]
|
||||||
|
|
||||||
[preprocessor.gettext]
|
[preprocessor.gettext]
|
||||||
after = ["links"]
|
after = ["links"]
|
||||||
@ -28,7 +28,7 @@ class = "bob"
|
|||||||
|
|
||||||
[output.html]
|
[output.html]
|
||||||
curly-quotes = true
|
curly-quotes = true
|
||||||
additional-js = ["ga4.js", "speaker-notes.js"]
|
additional-js = ["speaker-notes.js"]
|
||||||
additional-css = ["svgbob.css", "speaker-notes.css", "language-picker.css"]
|
additional-css = ["svgbob.css", "speaker-notes.css", "language-picker.css"]
|
||||||
site-url = "/comprehensive-rust/"
|
site-url = "/comprehensive-rust/"
|
||||||
git-repository-url = "https://github.com/google/comprehensive-rust"
|
git-repository-url = "https://github.com/google/comprehensive-rust"
|
||||||
|
72
ga4.js
72
ga4.js
@ -1,72 +0,0 @@
|
|||||||
// Copyright 2022 Google LLC
|
|
||||||
//
|
|
||||||
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License.
|
|
||||||
// You may obtain a copy of the License at
|
|
||||||
//
|
|
||||||
// http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
|
|
||||||
// Look through all Playgrounds on the page to determine if the code snippet
|
|
||||||
// matches one of the. If the code is different from all Playgrounds, we
|
|
||||||
// conclude that the user modified the Playground before submitting it.
|
|
||||||
function isPlaygroundCodeModified(code) {
|
|
||||||
// It sounds expensive to look through every Playground, but there are
|
|
||||||
// normally at most two Playground instances on a page.
|
|
||||||
let playgrounds = Array.from(document.querySelectorAll(".playground"));
|
|
||||||
return playgrounds.every(playground => {
|
|
||||||
let code_block = playground.querySelector("code");
|
|
||||||
if (window.ace && code_block.classList.contains("editable")) {
|
|
||||||
let editor = window.ace.edit(code_block);
|
|
||||||
return code != editor.originalCode;
|
|
||||||
} else {
|
|
||||||
return code != code_block.textContent;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Monkey-patch the window.fetch function so we can track the Playground
|
|
||||||
// executions.
|
|
||||||
const playgroundUrl = 'https://play.rust-lang.org/evaluate.json';
|
|
||||||
const { fetch: originalFetch } = window;
|
|
||||||
window.fetch = async (...args) => {
|
|
||||||
let [resource, config ] = args;
|
|
||||||
if (resource != playgroundUrl) {
|
|
||||||
return originalFetch(resource, config);
|
|
||||||
}
|
|
||||||
|
|
||||||
const startTime = window.performance.now();
|
|
||||||
let endTime, errorMessage;
|
|
||||||
try {
|
|
||||||
// The fetch_with_timeout function from book.js defaults to a 15000 ms
|
|
||||||
// timeout. We use a slightly shorter timeout so that we can catch and log
|
|
||||||
// the error.
|
|
||||||
config.signal = AbortSignal.timeout(14500);
|
|
||||||
let response = await originalFetch(resource, config);
|
|
||||||
payload = await response.json();
|
|
||||||
errorMessage = (payload.error == null) ? null : 'compilation_error';
|
|
||||||
// Return object compatible with the unpackign done in book.js.
|
|
||||||
return {'json': () => payload};
|
|
||||||
} catch (error) {
|
|
||||||
// fetch seems to always return AbortError, despite the example on
|
|
||||||
// https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal/timeout.
|
|
||||||
if (error.name == 'AbortError' || error.name == 'TimeoutError') {
|
|
||||||
error = new Error('timeout');
|
|
||||||
}
|
|
||||||
errorMessage = error.message;
|
|
||||||
throw error;
|
|
||||||
} finally {
|
|
||||||
endTime = window.performance.now();
|
|
||||||
let code = JSON.parse(config.body).code;
|
|
||||||
gtag("event", "playground", {
|
|
||||||
"modified": isPlaygroundCodeModified(code),
|
|
||||||
"error": errorMessage,
|
|
||||||
"latency": (endTime - startTime) / 1000,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
29
third_party/mdbook/book.js
vendored
29
third_party/mdbook/book.js
vendored
@ -3,6 +3,16 @@
|
|||||||
// Fix back button cache problem
|
// Fix back button cache problem
|
||||||
window.onunload = function () { };
|
window.onunload = function () { };
|
||||||
|
|
||||||
|
function isPlaygroundModified(playground) {
|
||||||
|
let code_block = playground.querySelector("code");
|
||||||
|
if (window.ace && code_block.classList.contains("editable")) {
|
||||||
|
let editor = window.ace.edit(code_block);
|
||||||
|
return editor.getValue() != editor.originalCode;
|
||||||
|
} else {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Global variable, shared between modules
|
// Global variable, shared between modules
|
||||||
function playground_text(playground, hidden = true) {
|
function playground_text(playground, hidden = true) {
|
||||||
let code_block = playground.querySelector("code");
|
let code_block = playground.querySelector("code");
|
||||||
@ -129,6 +139,8 @@ function playground_text(playground, hidden = true) {
|
|||||||
|
|
||||||
result_block.innerText = "Running...";
|
result_block.innerText = "Running...";
|
||||||
|
|
||||||
|
const playgroundModified = isPlaygroundModified(code_block);
|
||||||
|
const startTime = window.performance.now();
|
||||||
fetch_with_timeout("https://play.rust-lang.org/evaluate.json", {
|
fetch_with_timeout("https://play.rust-lang.org/evaluate.json", {
|
||||||
headers: {
|
headers: {
|
||||||
'Content-Type': "application/json",
|
'Content-Type': "application/json",
|
||||||
@ -139,6 +151,13 @@ function playground_text(playground, hidden = true) {
|
|||||||
})
|
})
|
||||||
.then(response => response.json())
|
.then(response => response.json())
|
||||||
.then(response => {
|
.then(response => {
|
||||||
|
const endTime = window.performance.now();
|
||||||
|
gtag("event", "playground", {
|
||||||
|
"modified": playgroundModified,
|
||||||
|
"error": (response.error == null) ? null : 'compilation_error',
|
||||||
|
"latency": (endTime - startTime) / 1000,
|
||||||
|
});
|
||||||
|
|
||||||
if (response.result.trim() === '') {
|
if (response.result.trim() === '') {
|
||||||
result_block.innerText = "No output";
|
result_block.innerText = "No output";
|
||||||
result_block.classList.add("result-no-output");
|
result_block.classList.add("result-no-output");
|
||||||
@ -147,7 +166,15 @@ function playground_text(playground, hidden = true) {
|
|||||||
result_block.classList.remove("result-no-output");
|
result_block.classList.remove("result-no-output");
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch(error => result_block.innerText = "Playground Communication: " + error.message);
|
.catch(error => {
|
||||||
|
const endTime = window.performance.now();
|
||||||
|
gtag("event", "playground", {
|
||||||
|
"modified": playgroundModified,
|
||||||
|
"error": error.message,
|
||||||
|
"latency": (endTime - startTime) / 1000,
|
||||||
|
});
|
||||||
|
result_block.innerText = "Playground Communication: " + error.message
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Syntax highlighting Configuration
|
// Syntax highlighting Configuration
|
||||||
|
Reference in New Issue
Block a user