diff --git a/src/plugins/scalar-loading-script.js b/src/plugins/scalar-loading-script.js index 88137c8fb2a18324b13cb109cab7a7c70cbf8aa1..a29a3e84b609e71512900bccbd5b2662b9f02321 100644 --- a/src/plugins/scalar-loading-script.js +++ b/src/plugins/scalar-loading-script.js @@ -1,72 +1,121 @@ -(function() { - // 检查是否在API文档页面 - if (window.location.pathname.includes('/docs/openapi/')) { - // 创建加载指示器 - const loadingIndicator = document.createElement('div'); - loadingIndicator.className = 'scalar-loading-indicator'; - loadingIndicator.id = 'scalar-loading-indicator'; - - const spinner = document.createElement('div'); - spinner.className = 'scalar-loading-spinner'; - - const text = document.createElement('div'); - text.className = 'scalar-loading-text'; - text.textContent = '正在加载中...'; - - loadingIndicator.appendChild(spinner); - loadingIndicator.appendChild(text); - - // 添加到body - document.body.appendChild(loadingIndicator); - - // 监控页面加载完成 - window.addEventListener('load', function() { - // 监听Scalar容器加载完成 - const checkScalarLoaded = setInterval(function() { - // 针对不同的页面检查不同的选择器 - const selectors = [ - '.scalar-api-reference', // v1 API页面 - '[data-scalar-api-reference]' // 备用选择器 - ]; - - let isLoaded = false; - - for (const selector of selectors) { - const container = document.querySelector(selector); - if (container && (container.children.length > 0 || container.shadowRoot)) { - isLoaded = true; - break; - } - } - - if (isLoaded) { - // 内容已加载,淡出加载指示器 - loadingIndicator.style.opacity = '0'; - - // 动画结束后移除元素 - setTimeout(() => { - document.body.removeChild(loadingIndicator); - }, 300); - - clearInterval(checkScalarLoaded); +(function () { + try { + // 检查是否在API文档页面 + if (window.location.pathname.includes('/docs/openapi/')) { + // 创建加载指示器 + const loadingIndicator = document.createElement('div'); + loadingIndicator.className = 'scalar-loading-indicator'; + loadingIndicator.id = 'scalar-loading-indicator'; + + const spinner = document.createElement('div'); + spinner.className = 'scalar-loading-spinner'; + + const text = document.createElement('div'); + text.className = 'scalar-loading-text'; + text.textContent = '正在加载中...'; + + loadingIndicator.appendChild(spinner); + loadingIndicator.appendChild(text); + + // 添加到body + document.body.appendChild(loadingIndicator); + + // 监听暗黑模式切换, 给 document.body 加上类名,适配 scalar 的 variables 样式 + function updateScalarThemeClass() { + const theme = + document.documentElement.getAttribute('data-theme') || + document.body.getAttribute('data-theme'); + + // 移除所有主题类 + document.body.classList.remove('light-mode', 'dark-mode'); + + // 根据当前主题添加相应类 + if (theme === 'dark') { + document.body.classList.add('dark-mode'); + } else if (theme === 'light') { + document.body.classList.add('light-mode'); } - }, 100); - - // 超时处理(20秒后仍未加载完成) - setTimeout(function() { - if (document.getElementById('scalar-loading-indicator')) { - loadingIndicator.style.opacity = '0'; - - // 动画结束后移除元素 - setTimeout(() => { - if (document.getElementById('scalar-loading-indicator')) { - document.body.removeChild(loadingIndicator); + } + + // 监控页面加载完成 + window.addEventListener('load', function () { + setTimeout(() => { + updateScalarThemeClass(); + }, 1000); + + // 监听Scalar容器加载完成 + const checkScalarLoaded = setInterval(function () { + // 针对不同的页面检查不同的选择器 + const selectors = [ + '.scalar-api-reference', // v1 API页面 + '[data-scalar-api-reference]', // 备用选择器 + ]; + + let isLoaded = false; + + for (const selector of selectors) { + const container = document.querySelector(selector); + if ( + container && + (container.children.length > 0 || container.shadowRoot) + ) { + isLoaded = true; + break; } - }, 300); - - clearInterval(checkScalarLoaded); - } - }, 20000); - }); + } + + if (isLoaded) { + // 内容已加载,淡出加载指示器 + loadingIndicator.style.opacity = '0'; + + // 动画结束后移除元素 + setTimeout(() => { + document.body.removeChild(loadingIndicator); + }, 300); + + document.title = `接口文档 | 模力方舟(Gitee AI)` + + clearInterval(checkScalarLoaded); + } + }, 100); + + // 超时处理(20秒后仍未加载完成) + setTimeout(function () { + if (document.getElementById('scalar-loading-indicator')) { + loadingIndicator.style.opacity = '0'; + + // 动画结束后移除元素 + setTimeout(() => { + if (document.getElementById('scalar-loading-indicator')) { + document.body.removeChild(loadingIndicator); + } + }, 300); + + clearInterval(checkScalarLoaded); + } + }, 20000); + }); + + const themeObserver = new MutationObserver(function (mutations) { + mutations.forEach(function (mutation) { + if ( + mutation.type === 'attributes' && + mutation.attributeName === 'data-theme' + ) { + updateScalarThemeClass(); + } + }); + }); + themeObserver.observe(document.documentElement, { + attributes: true, + attributeFilter: ['data-theme'], + }); + themeObserver.observe(document.body, { + attributes: true, + attributeFilter: ['data-theme'], + }); + } + } catch (e) { + console.log(e); } -})(); \ No newline at end of file +})(); diff --git a/src/plugins/scalar-loading-styles.css b/src/plugins/scalar-loading-styles.css index 05e5eab4d2ef273815f8aeee29f97346c0fb650d..93b5ac4705ef8ade2ae58f09da148dad939907ac 100644 --- a/src/plugins/scalar-loading-styles.css +++ b/src/plugins/scalar-loading-styles.css @@ -36,6 +36,14 @@ ul > li > ul > li .sidebar-heading-link-title { margin: 10px 0; } +.scalar-api-reference table { + overflow: unset; +} + +.scalar-app .markdown pre { + margin-top: 10px; +} + /* Scalar API Reference 加载效果 */ .scalar-loading-indicator { position: fixed;