HongChuang/ultralytics-ascend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Update extra.js (#17040)

Browse source 
Signed-off-by: UltralyticsAssistant <web@ultralytics.com>
Co-authored-by: UltralyticsAssistant <web@ultralytics.com>
This commit is contained in:
Glenn Jocher 2024-10-20 03:12:23 +02:00 • committed by GitHub
parent e38228774f
commit 2c8f31c9c0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 175 additions and 126 deletions
Download patch file Download diff file Expand all files Collapse all files

135
docs/overrides/javascript/extra.js
View file

@ -1,71 +1,68 @@
// Function that applies light/dark theme based on the user's preference
const applyAutoTheme = () => {
// Determine the user's preferred color scheme
const prefersLight = window.matchMedia("(prefers-color-scheme: light)").matches;
const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
// Apply theme based on user preference
const applyTheme = (isDark) => {
document.body.setAttribute(
"data-md-color-scheme",
isDark ? "slate" : "default",
);
document.body.setAttribute(
"data-md-color-primary",
isDark ? "black" : "indigo",
);
};
// Apply the appropriate attributes based on the user's preference
if (prefersLight) {
document.body.setAttribute("data-md-color-scheme", "default");
document.body.setAttribute("data-md-color-primary", "indigo");
} else if (prefersDark) {
document.body.setAttribute("data-md-color-scheme", "slate");
document.body.setAttribute("data-md-color-primary", "black");
// Check and apply auto theme
const checkAutoTheme = () => {
const supportedLangCodes = [
"en",
"zh",
"ko",
"ja",
"ru",
"de",
"fr",
"es",
"pt",
"it",
"tr",
"vi",
"ar",
];
const langCode = window.location.pathname.split("/")[1];
const localStorageKey = `${supportedLangCodes.includes(langCode) ? `/${langCode}` : ""}/.__palette`;
const palette = JSON.parse(localStorage.getItem(localStorageKey) || "{}");
if (palette.index === 0) {
applyTheme(window.matchMedia("(prefers-color-scheme: dark)").matches);
}
};
// Function that checks and applies light/dark theme based on the user's preference (if auto theme is enabled)
function checkAutoTheme() {
// Array of supported language codes -> each language has its own palette (stored in local storage)
const supportedLangCodes = ["en", "zh", "ko", "ja", "ru", "de", "fr", "es", "pt", "it", "tr", "vi", "nl"];
// Get the URL path
const path = window.location.pathname;
// Extract the language code from the URL (assuming it's in the format /xx/...)
const langCode = path.split("/")[1];
// Check if the extracted language code is in the supported languages
const isValidLangCode = supportedLangCodes.includes(langCode);
// Construct the local storage key based on the language code if valid, otherwise default to the root key
const localStorageKey = isValidLangCode ? `/${langCode}/.__palette` : "/.__palette";
// Retrieve the palette from local storage using the constructed key
const palette = localStorage.getItem(localStorageKey);
if (palette) {
// Check if the palette's index is 0 (auto theme)
const paletteObj = JSON.parse(palette);
if (paletteObj && paletteObj.index === 0) {
applyAutoTheme();
}
}
}
// Event listeners for theme changes
const mediaQueryList = window.matchMedia("(prefers-color-scheme: dark)");
mediaQueryList.addListener(checkAutoTheme);
// Run function when the script loads
// Initial theme check
checkAutoTheme();
// Re-run the function when the user's preference changes (when the user changes their system theme)
window.matchMedia("(prefers-color-scheme: light)").addEventListener("change", checkAutoTheme);
window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", checkAutoTheme);
// Re-run the function when the palette changes (e.g. user switched from dark theme to auto theme)
// ! We can't use window.addEventListener("storage", checkAutoTheme) because it will NOT be triggered on the current tab
// ! So we have to use the following workaround:
// Get the palette input for auto theme
var autoThemeInput = document.getElementById("__palette_1");
if (autoThemeInput) {
// Add a click event listener to the input
autoThemeInput.addEventListener("click", function () {
// Check if the auto theme is selected
if (autoThemeInput.checked) {
// Re-run the function after a short delay (to ensure that the palette has been updated)
setTimeout(applyAutoTheme);
}
// Auto theme input listener
document.addEventListener("DOMContentLoaded", () => {
const autoThemeInput = document.getElementById("__palette_1");
autoThemeInput?.addEventListener("click", () => {
if (autoThemeInput.checked) setTimeout(checkAutoTheme);
});
}
});
// Add iframe navigation
window.onhashchange = function() {
window.parent.postMessage({
type: 'navigation',
hash: window.location.pathname + window.location.search + window.location.hash
}, '*');
// Iframe navigation
window.onhashchange = () => {
window.parent.postMessage(
{
type: "navigation",
hash:
window.location.pathname +
window.location.search +
window.location.hash,
},
"*",
);
};
// Add Inkeep button
@ -112,35 +109,35 @@ document.addEventListener("DOMContentLoaded", () => {
},
aiChatSettings: {
chatSubjectName: "Ultralytics",
botAvatarSrcUrl: "https://storage.googleapis.com/organization-image-assets/ultralytics-botAvatarSrcUrl-1727908259285.png",
botAvatarDarkSrcUrl: "https://storage.googleapis.com/organization-image-assets/ultralytics-botAvatarDarkSrcUrl-1727908258478.png",
botAvatarSrcUrl:
"https://storage.googleapis.com/organization-image-assets/ultralytics-botAvatarSrcUrl-1729379860806.svg",
quickQuestions: [
"What's new in Ultralytics YOLO11?",
"How can I get started with Ultralytics HUB?",
"How does Ultralytics Enterprise Licensing work?"
"How does Ultralytics Enterprise Licensing work?",
],
getHelpCallToActions: [
{
name: "Ask on Ultralytics GitHub",
url: "https://github.com/ultralytics/ultralytics",
icon: {
builtIn: "FaGithub"
}
builtIn: "FaGithub",
},
},
{
name: "Ask on Ultralytics Discourse",
url: "https://community.ultralytics.com/",
icon: {
builtIn: "FaDiscourse"
}
builtIn: "FaDiscourse",
},
},
{
name: "Ask on Ultralytics Discord",
url: "https://discord.com/invite/ultralytics",
icon: {
builtIn: "FaDiscord"
}
}
builtIn: "FaDiscord",
},
},
],
},
},

63
docs/overrides/javascript/giscus.js Normal file
View file

@ -0,0 +1,63 @@
// Giscus functionality
function loadGiscus() {
const script = document.createElement("script");
script.src = "https://giscus.app/client.js";
script.setAttribute("data-repo", "ultralytics/ultralytics");
script.setAttribute("data-repo-id", "R_kgDOH-jzvQ");
script.setAttribute("data-category", "Docs");
script.setAttribute("data-category-id", "DIC_kwDOH-jzvc4CWLkL");
script.setAttribute("data-mapping", "pathname");
script.setAttribute("data-strict", "1");
script.setAttribute("data-reactions-enabled", "1");
script.setAttribute("data-emit-metadata", "0");
script.setAttribute("data-input-position", "top");
script.setAttribute("data-theme", "preferred_color_scheme");
script.setAttribute("data-lang", "en");
script.setAttribute("data-loading", "lazy");
script.setAttribute("crossorigin", "anonymous");
script.setAttribute("async", "");
const giscusContainer = document.getElementById("giscus-container");
if (giscusContainer) {
giscusContainer.appendChild(script);
// Synchronize Giscus theme with palette
var palette = __md_get("__palette");
if (palette && typeof palette.color === "object") {
var theme = palette.color.scheme === "slate" ? "dark" : "light";
script.setAttribute("data-theme", theme);
}
// Register event handlers for theme changes
var ref = document.querySelector("[data-md-component=palette]");
if (ref) {
ref.addEventListener("change", function () {
var palette = __md_get("__palette");
if (palette && typeof palette.color === "object") {
var theme = palette.color.scheme === "slate" ? "dark" : "light";
// Instruct Giscus to change theme
var frame = document.querySelector(".giscus-frame");
if (frame) {
frame.contentWindow.postMessage(
{ giscus: { setConfig: { theme } } },
"https://giscus.app",
);
}
}
});
}
}
}
// MkDocs specific: Load Giscus when the page content is fully loaded
document.addEventListener("DOMContentLoaded", function () {
var observer = new MutationObserver(function (mutations) {
if (document.getElementById("giscus-container")) {
loadGiscus();
observer.disconnect();
}
});
observer.observe(document.body, { childList: true, subtree: true });
});