Compare commits
2 Commits
4a05e2724a
...
0567e35562
| Author | SHA1 | Date |
|---|---|---|
PJ568
|
0567e35562 | 8 months ago |
|
PJ568
|
8b09880f19 | 8 months ago |
@ -1,31 +0,0 @@
|
|||||||
#loading {
|
|
||||||
position: fixed;
|
|
||||||
background-color: #212121;
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 1000000
|
|
||||||
}
|
|
||||||
|
|
||||||
#Calc-loading_bg{
|
|
||||||
background-color: rgba(0,0,0,0.7);
|
|
||||||
}
|
|
||||||
|
|
||||||
.Calc-loader {
|
|
||||||
line-height: 50px;
|
|
||||||
text-align: center;
|
|
||||||
position: absolute;
|
|
||||||
top: 50%;
|
|
||||||
left: 50%;
|
|
||||||
-webkit-transform: translate(-50%, -50%);
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
font-family: helvetica, arial, sans-serif;
|
|
||||||
text-transform: uppercase;
|
|
||||||
font-weight: 900;
|
|
||||||
color: #0277BD;
|
|
||||||
letter-spacing: 0.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 980px){.Clac-loader{width:80%}}
|
|
||||||
@media screen and (min-width: 980px){.Clac-loader{width:25rem}}
|
|
||||||
@ -1,4 +1,63 @@
|
|||||||
html {
|
html {
|
||||||
color: #DDD;
|
color: #DDD;
|
||||||
background-color: #111;
|
background-color: #111;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#translate>.translateSelectLanguage {
|
||||||
|
cursor: pointer;
|
||||||
|
position: absolute;
|
||||||
|
padding: 0.3rem;
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
padding-right: 0.5rem;
|
||||||
|
color: #DDD;
|
||||||
|
background-color: #795548;
|
||||||
|
border: 2px solid #8D6E63;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 980px) {
|
||||||
|
#translate>.translateSelectLanguage {
|
||||||
|
left: 1rem;
|
||||||
|
top: 1rem;
|
||||||
|
font-size: .8rem;
|
||||||
|
width: 6rem
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: 980px) {
|
||||||
|
#translate>.translateSelectLanguage {
|
||||||
|
left: 2rem;
|
||||||
|
top: 2rem;
|
||||||
|
font-size: 1rem
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 加载进度条 */
|
||||||
|
.loading-bar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 99999;
|
||||||
|
opacity: 0;
|
||||||
|
transition: opacity .4s linear;
|
||||||
|
|
||||||
|
.progress {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 0;
|
||||||
|
height: 4px;
|
||||||
|
background-color: #007bff;
|
||||||
|
box-shadow: 0 0 10px rgba(119, 182, 255, .7);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.loading {
|
||||||
|
opacity: 1;
|
||||||
|
transition: none;
|
||||||
|
|
||||||
|
.progress {
|
||||||
|
transition: width .4s ease;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 加载进度条结束 */
|
||||||
@ -1,12 +0,0 @@
|
|||||||
#translate>.translateSelectLanguage {
|
|
||||||
cursor:pointer;
|
|
||||||
position:absolute;
|
|
||||||
padding:0.3rem;
|
|
||||||
padding-left:0.5rem;
|
|
||||||
padding-right:0.5rem;
|
|
||||||
color: #DDD;
|
|
||||||
background-color: #795548;
|
|
||||||
border:2px solid #8D6E63;
|
|
||||||
}
|
|
||||||
@media screen and (max-width: 980px){#translate>.translateSelectLanguage {left:1rem;top:1rem;font-size:.8rem;width:6rem}}
|
|
||||||
@media screen and (min-width: 980px){#translate>.translateSelectLanguage {left:2rem;top:2rem;font-size:1rem}}
|
|
||||||
@ -1,56 +0,0 @@
|
|||||||
// 获取用户使用的语种。
|
|
||||||
var lang = translate.language.getCurrent();
|
|
||||||
var giscus_lang = "zh-CN";
|
|
||||||
switch (lang) {
|
|
||||||
case "chinese_traditional":
|
|
||||||
giscus_lang = "zh-TW";
|
|
||||||
break;
|
|
||||||
case "english":
|
|
||||||
giscus_lang = "en";
|
|
||||||
break;
|
|
||||||
case "spanish":
|
|
||||||
giscus_lang = "es";
|
|
||||||
break;
|
|
||||||
case "japanese":
|
|
||||||
giscus_lang = "ja";
|
|
||||||
break;
|
|
||||||
case "korean":
|
|
||||||
giscus_lang = "ko";
|
|
||||||
break;
|
|
||||||
case "french":
|
|
||||||
giscus_lang = "fr";
|
|
||||||
break;
|
|
||||||
case "arabic":
|
|
||||||
giscus_lang = "ar";
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
giscus_lang = "zh-CN";
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
|
|
||||||
var giscus = function () {
|
|
||||||
const script = document.createElement("script");
|
|
||||||
script.type = "text/javascript";
|
|
||||||
script.src = "https://giscus.app/client.js";
|
|
||||||
|
|
||||||
|
|
||||||
script.setAttribute("data-repo", "PJ-568/568_Calc");
|
|
||||||
script.setAttribute("data-repo-id", "R_kgDOKgTh_A");
|
|
||||||
script.setAttribute("data-category", "Announcements");
|
|
||||||
script.setAttribute("data-category-id", "DIC_kwDOKgTh_M4CaKUO");
|
|
||||||
|
|
||||||
script.setAttribute("data-mapping", "title");
|
|
||||||
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", "transparent_dark");
|
|
||||||
script.setAttribute("data-lang", giscus_lang);
|
|
||||||
script.setAttribute("data-loading", "lazy");
|
|
||||||
|
|
||||||
script.crossOrigin = "anonymous";
|
|
||||||
script.async = true;
|
|
||||||
document.getElementById("giscus-container").appendChild(script);
|
|
||||||
};
|
|
||||||
|
|
||||||
window.addEventListener('load', giscus);
|
|
||||||
@ -1,26 +0,0 @@
|
|||||||
function includeHTML() {
|
|
||||||
var elements = document.getElementsByTagName("include");
|
|
||||||
for (var i = 0; i < elements.length; i++) {
|
|
||||||
var element = elements[i];
|
|
||||||
var file = element.getAttribute("src");
|
|
||||||
if (file) {
|
|
||||||
var xhttp = new XMLHttpRequest();
|
|
||||||
xhttp.onreadystatechange = function() {
|
|
||||||
if (this.readyState === 4 && this.status === 200) {
|
|
||||||
element.innerHTML = this.responseText;
|
|
||||||
// 执行加载的JavaScript代码
|
|
||||||
var scripts = element.getElementsByTagName("script");
|
|
||||||
for (var j = 0; j < scripts.length; j++) {
|
|
||||||
var script = document.createElement("script");
|
|
||||||
script.innerHTML = scripts[j].innerHTML;
|
|
||||||
document.body.appendChild(script);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
xhttp.open("GET", file, true);
|
|
||||||
xhttp.send();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
document.addEventListener("DOMContentLoaded", includeHTML);
|
|
||||||
@ -1,43 +0,0 @@
|
|||||||
// const sleep = (delay) => new Promise((resolve) => setTimeout(resolve, delay))
|
|
||||||
|
|
||||||
document.onreadystatechange=function () {
|
|
||||||
if (document.readyState=="complete"){
|
|
||||||
loadingFade();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function startLoading() {
|
|
||||||
const position = document.getElementById('loading');
|
|
||||||
var loadingBackground=document.getElementById('Calc-loading_bg');
|
|
||||||
position.style.display = 'block';
|
|
||||||
loadingBackground.style.opacity=1;
|
|
||||||
setTimeout(() => loadingFade(), 30000)
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadingFade() {
|
|
||||||
var opacity=1;
|
|
||||||
const position = document.getElementById('loading');
|
|
||||||
var loadingBackground=document.getElementById('Calc-loading_bg');
|
|
||||||
var time=setInterval(function () {
|
|
||||||
if (opacity<=0){
|
|
||||||
clearInterval(time);
|
|
||||||
position.style.display = 'none';
|
|
||||||
try{
|
|
||||||
translate.listener.start();
|
|
||||||
translate.language.setLocal('chinese_simplified');
|
|
||||||
translate.setAutoDiscriminateLocalLanguage();
|
|
||||||
translate.language.setUrlParamControl();
|
|
||||||
translate.ignore.class.push('notTranslate');
|
|
||||||
}
|
|
||||||
catch(e){console.log(e);}
|
|
||||||
translate.setUseVersion2();
|
|
||||||
translate.nomenclature.append('chinese_simplified','english',`
|
|
||||||
568_Calc=568_Calc
|
|
||||||
`);
|
|
||||||
translate.execute();
|
|
||||||
}
|
|
||||||
|
|
||||||
loadingBackground.style.opacity=opacity;
|
|
||||||
opacity-=0.4;
|
|
||||||
},100);
|
|
||||||
}
|
|
||||||
@ -0,0 +1,214 @@
|
|||||||
|
(function () {
|
||||||
|
// giscus 评论系统
|
||||||
|
//// 获取用户使用的语种并转换为 giscus 可识别的标记
|
||||||
|
const getCurrentLanguage = function () {
|
||||||
|
var lang = translate.language.getCurrent();
|
||||||
|
var giscus_lang = "zh-CN";
|
||||||
|
switch (lang) {
|
||||||
|
case "chinese_traditional":
|
||||||
|
giscus_lang = "zh-TW";
|
||||||
|
break;
|
||||||
|
case "english":
|
||||||
|
giscus_lang = "en";
|
||||||
|
break;
|
||||||
|
case "spanish":
|
||||||
|
giscus_lang = "es";
|
||||||
|
break;
|
||||||
|
case "japanese":
|
||||||
|
giscus_lang = "ja";
|
||||||
|
break;
|
||||||
|
case "korean":
|
||||||
|
giscus_lang = "ko";
|
||||||
|
break;
|
||||||
|
case "french":
|
||||||
|
giscus_lang = "fr";
|
||||||
|
break;
|
||||||
|
case "arabic":
|
||||||
|
giscus_lang = "ar";
|
||||||
|
break;
|
||||||
|
case "catalan":
|
||||||
|
giscus_lang = "ca";
|
||||||
|
break;
|
||||||
|
case "danish":
|
||||||
|
giscus_lang = "da";
|
||||||
|
break;
|
||||||
|
case "deutsch":
|
||||||
|
giscus_lang = "de";
|
||||||
|
break;
|
||||||
|
case "persian":
|
||||||
|
giscus_lang = "fa";
|
||||||
|
break;
|
||||||
|
case "greek":
|
||||||
|
giscus_lang = "gr";
|
||||||
|
break;
|
||||||
|
case "serbian":
|
||||||
|
giscus_lang = "hbs";
|
||||||
|
break;
|
||||||
|
case "hebrew":
|
||||||
|
giscus_lang = "he";
|
||||||
|
break;
|
||||||
|
case "hungarian":
|
||||||
|
giscus_lang = "hu";
|
||||||
|
break;
|
||||||
|
case "italian":
|
||||||
|
giscus_lang = "it";
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
giscus_lang = "zh-CN";
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
return giscus_lang;
|
||||||
|
}
|
||||||
|
|
||||||
|
var SetupGiscus = function (giscus_lang) {
|
||||||
|
if (document.getElementById("giscus-container") != null) {
|
||||||
|
const script = document.createElement("script");
|
||||||
|
script.type = "text/javascript";
|
||||||
|
script.src = "https://giscus.app/client.js";
|
||||||
|
|
||||||
|
script.setAttribute("data-repo", "PJ-568/568_Calc");
|
||||||
|
script.setAttribute("data-repo-id", "R_kgDOKgTh_A");
|
||||||
|
script.setAttribute("data-category", "Announcements");
|
||||||
|
script.setAttribute("data-category-id", "DIC_kwDOKgTh_M4CaKUO");
|
||||||
|
|
||||||
|
script.setAttribute("data-mapping", "title");
|
||||||
|
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", "transparent_dark");
|
||||||
|
script.setAttribute("data-lang", giscus_lang);
|
||||||
|
|
||||||
|
script.crossOrigin = "anonymous";
|
||||||
|
script.async = true;
|
||||||
|
|
||||||
|
document.getElementById("giscus-container").appendChild(script);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function includeHTML() {
|
||||||
|
var elements = document.getElementsByTagName("include");
|
||||||
|
for (var i = 0; i < elements.length; i++) {
|
||||||
|
var element = elements[i];
|
||||||
|
var file = element.getAttribute("src");
|
||||||
|
if (file) {
|
||||||
|
var xhttp = new XMLHttpRequest();
|
||||||
|
xhttp.onreadystatechange = function () {
|
||||||
|
if (this.readyState === 4 && this.status === 200) {
|
||||||
|
element.innerHTML = this.responseText;
|
||||||
|
// 执行加载的JavaScript代码
|
||||||
|
var scripts = element.getElementsByTagName("script");
|
||||||
|
for (var j = 0; j < scripts.length; j++) {
|
||||||
|
var script = document.createElement("script");
|
||||||
|
script.innerHTML = scripts[j].innerHTML;
|
||||||
|
document.body.appendChild(script);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
xhttp.open("GET", file, true);
|
||||||
|
xhttp.send();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// translate-js 翻译系统
|
||||||
|
function initTranslate() {
|
||||||
|
try {
|
||||||
|
translate.service.use('client.edge');
|
||||||
|
translate.listener.start();
|
||||||
|
translate.language.setLocal('chinese_simplified');
|
||||||
|
translate.setAutoDiscriminateLocalLanguage();
|
||||||
|
translate.language.setUrlParamControl();
|
||||||
|
translate.ignore.class.push('notTranslate');
|
||||||
|
translate.execute();
|
||||||
|
}
|
||||||
|
catch (e) {
|
||||||
|
console.log('翻译系统出错：' + e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
var loadingBar = document.querySelector(".loading-bar");
|
||||||
|
var progress = document.querySelector(".loading-bar .progress");
|
||||||
|
var timer = null;
|
||||||
|
|
||||||
|
function initAni() {
|
||||||
|
loadingBar = document.querySelector(".loading-bar");
|
||||||
|
progress = document.querySelector(".loading-bar .progress");
|
||||||
|
}
|
||||||
|
|
||||||
|
function endLoad() {
|
||||||
|
clearInterval(timer);
|
||||||
|
progress.style.width = "100%";
|
||||||
|
loadingBar.classList.remove("loading");
|
||||||
|
|
||||||
|
setTimeout(function () {
|
||||||
|
progress.style.width = 0;
|
||||||
|
}, 400);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// PJAX 集成
|
||||||
|
let pjax;
|
||||||
|
//// 初始化 PJAX
|
||||||
|
function initPjax() {
|
||||||
|
try {
|
||||||
|
const Pjax = window.Pjax || function () { };
|
||||||
|
pjax = new Pjax({
|
||||||
|
selectors: [
|
||||||
|
'head title',
|
||||||
|
'.container',
|
||||||
|
'[data-pjax]',
|
||||||
|
'.pjax-reload'
|
||||||
|
]
|
||||||
|
})
|
||||||
|
}
|
||||||
|
catch (e) {
|
||||||
|
console.log('PJAX 出错：' + e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 初始化
|
||||||
|
function initialize() {
|
||||||
|
initPjax(); //// 初始化 PJAX
|
||||||
|
includeHTML(); //// 引入
|
||||||
|
initTranslate(); //// 初始化页面翻译
|
||||||
|
initAni(); //// 初始化加载动画
|
||||||
|
SetupGiscus(getCurrentLanguage()); //// 初始化评论系统
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 触发器
|
||||||
|
//// 网页加载完毕后触发
|
||||||
|
window.addEventListener('DOMContentLoaded', () => initialize());
|
||||||
|
//// 翻译执行完成后触发
|
||||||
|
translate.listener.renderTaskFinish = function () {
|
||||||
|
SetupGiscus(getCurrentLanguage());
|
||||||
|
}
|
||||||
|
//// Pjax 开始时执行的函数
|
||||||
|
document.addEventListener("pjax:send", function () {
|
||||||
|
var loadingBarWidth = 20;
|
||||||
|
var MAX_LOADING_WIDTH = 95;
|
||||||
|
|
||||||
|
loadingBar.classList.add("loading");
|
||||||
|
progress.style.width = loadingBarWidth + "%";
|
||||||
|
|
||||||
|
clearInterval(timer);
|
||||||
|
timer = setInterval(function () {
|
||||||
|
loadingBarWidth += 3;
|
||||||
|
|
||||||
|
if (loadingBarWidth > MAX_LOADING_WIDTH) {
|
||||||
|
loadingBarWidth = MAX_LOADING_WIDTH;
|
||||||
|
}
|
||||||
|
|
||||||
|
progress.style.width = loadingBarWidth + "%";
|
||||||
|
}, 500);
|
||||||
|
});
|
||||||
|
//// 监听 Pjax 完成后，重新加载的函数
|
||||||
|
document.addEventListener("pjax:complete", function () {
|
||||||
|
SetupGiscus(getCurrentLanguage());
|
||||||
|
includeHTML();
|
||||||
|
endLoad();
|
||||||
|
})
|
||||||
|
})();
|
||||||
Loading…
Reference in new issue