MCBBS Wiki欢迎您共同参与编辑!在参与编辑之前请先阅读Wiki方针。
如果在编辑的过程中遇到了什么问题,可以去讨论板提问。
为了您能够无阻碍地参与编辑 未验证/绑定过邮箱的用户,请尽快绑定/验证。
MCBBS Wiki GitHub群组已上线!
您可以在回声洞中发表吐槽!
服务器状态监控。点击进入
本站由MCBBS用户自行搭建,与MCBBS及东银河系漫游指南(北京)科技有限公司没有从属关系。点此了解 MCBBS Wiki 不是什么>>
MediaWiki:Gadget-VectorThemeLoader.js:修订间差异
跳到导航
跳到搜索
Salt lovely(留言 | 贡献) (新的主题切换功能) |
小 (// Edit via Wikiplus) |
||
(未显示2个用户的5个中间版本) | |||
第1行: | 第1行: | ||
"use strict"; |
"use strict"; |
||
(() => { |
|||
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }(); |
|||
(function () { |
|||
// src/utils/resource.ts |
// src/utils/resource.ts |
||
function addStyleUrl(url, key) { |
function addStyleUrl(url, key) { |
||
var style = void 0; |
|||
if (key && document.getElementById(key) instanceof HTMLLinkElement) { |
if (key && document.getElementById(key) instanceof HTMLLinkElement) { |
||
style = document.getElementById(key); |
style = document.getElementById(key); |
||
第10行: | 第13行: | ||
style.rel = "stylesheet"; |
style.rel = "stylesheet"; |
||
style.type = "text/css"; |
style.type = "text/css"; |
||
if (key) |
if (key) style.id = key; |
||
style.id = key; |
|||
} |
} |
||
if (style.href === url) |
if (style.href === url) return; |
||
return; |
|||
style.href = url; |
style.href = url; |
||
document.head.appendChild(style); |
document.head.appendChild(style); |
||
} |
} |
||
function addStyle(css) { |
function addStyle(css) { |
||
var style = document.createElement("style"); |
|||
style.textContent = css; |
style.textContent = css; |
||
document.head.appendChild(style); |
document.head.appendChild(style); |
||
} |
} |
||
function loadWikiStyle(page, key) { |
function loadWikiStyle(page, key) { |
||
addStyleUrl( |
addStyleUrl("https://mcbbs.wiki/index.php?title=" + page + "&action=raw&ctype=text/css", key); |
||
} |
} |
||
第32行: | 第33行: | ||
try { |
try { |
||
return JSON.parse(str); |
return JSON.parse(str); |
||
} catch (e) { |
} catch (e) {} |
||
} |
|||
} |
} |
||
return null; |
return null; |
||
第41行: | 第41行: | ||
} |
} |
||
function unsafeRead(key) { |
function unsafeRead(key) { |
||
var storage = localStorage.getItem(key); |
|||
return parse(storage); |
return parse(storage); |
||
} |
} |
||
function listen(listener |
function listen(listener) { |
||
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : { passive: true }; |
|||
window.addEventListener("storage", listener, options); |
window.addEventListener("storage", listener, options); |
||
return function () { |
|||
return () => window.removeEventListener("storage", listener, options); |
|||
return window.removeEventListener("storage", listener, options); |
|||
}; |
|||
} |
} |
||
function readAndListen(props) { |
function readAndListen(props) { |
||
var key = props.key, |
|||
const { |
|||
defaultValue = props.defaultValue, |
|||
key, |
|||
listener = props.listener, |
|||
_props$callOnChange = props.callOnChange, |
|||
listener, |
|||
callOnChange = true, |
callOnChange = _props$callOnChange === undefined ? true : _props$callOnChange, |
||
options = |
_props$options = props.options, |
||
options = _props$options === undefined ? { passive: true } : _props$options; |
|||
} = props; |
|||
let v = unsafeRead(key); |
|||
var v = unsafeRead(key); |
|||
if (defaultValue !== void 0 && v === null) { |
if (defaultValue !== void 0 && v === null) { |
||
write(key, defaultValue); |
write(key, defaultValue); |
||
v = defaultValue; |
v = defaultValue; |
||
} |
} |
||
var fn = function fn(ev) { |
|||
if (ev.key !== key || ev.storageArea !== localStorage) |
if (ev.key !== key || ev.storageArea !== localStorage) return; |
||
var newValue = parse(ev.newValue); |
|||
var oldValue = parse(ev.oldValue); |
|||
if (callOnChange && newValue === oldValue) return; |
|||
var encapsulatedEvent = { |
|||
if (callOnChange && newValue === oldValue) |
|||
key: key, |
|||
newValue: newValue, |
|||
const encapsulatedEvent = { |
|||
oldValue: oldValue, |
|||
newValue, |
|||
oldValue, |
|||
storageArea: ev.storageArea, |
storageArea: ev.storageArea, |
||
url: ev.url |
url: ev.url |
||
第77行: | 第80行: | ||
listener(encapsulatedEvent); |
listener(encapsulatedEvent); |
||
}; |
}; |
||
var off = listen(fn, options); |
|||
return [v, off]; |
return [v, off]; |
||
} |
} |
||
// src/utils/utils.ts |
// src/utils/utils.ts |
||
var i = document.createElement("textarea"); |
|||
i.setAttribute("style", "pointer-events:none;opacity:0;position:fixed;"); |
|||
function clickOutside(el, callback) { |
function clickOutside(el, callback) { |
||
var cb = function cb(ev) { |
|||
var target = ev.target; |
|||
if (!(target instanceof Element)) |
|||
return; |
if (!(target instanceof Element)) return; |
||
if (target === el) |
if (target === el) return; |
||
var obj = target.parentElement; |
|||
let obj = target.parentElement; |
|||
while (obj && obj !== el && obj.parentElement) { |
while (obj && obj !== el && obj.parentElement) { |
||
obj = obj.parentElement; |
obj = obj.parentElement; |
||
} |
} |
||
if (obj !== el) |
if (obj !== el) callback(); |
||
callback(); |
|||
}; |
}; |
||
window.addEventListener("click", cb, true); |
window.addEventListener("click", cb, true); |
||
return () |
return function () { |
||
return window.removeEventListener("click", cb); |
|||
}; |
|||
} |
} |
||
// widget/VectorThemeLoader/SwitchPanel.ts |
// widget/VectorThemeLoader/SwitchPanel.ts |
||
function createPanel(props |
function createPanel(props) { |
||
var className = props.className, |
|||
const { |
|||
_props$position = props.position, |
|||
className, |
|||
x = _props$position.x, |
|||
y = _props$position.y; |
|||
const panel = document.createElement("div"); |
|||
panel |
var panel = document.createElement("div"); |
||
panel.className = "salt-panel " + (className || ""); |
|||
panel.style.position = "absolute"; |
panel.style.position = "absolute"; |
||
for (const el of innerElements) |
|||
for (var _len = arguments.length, innerElements = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { |
|||
panel.appendChild(el); |
|||
innerElements[_key - 1] = arguments[_key]; |
|||
} |
|||
var _iteratorNormalCompletion = true; |
|||
var _didIteratorError = false; |
|||
var _iteratorError = undefined; |
|||
try { |
|||
for (var _iterator = innerElements[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { |
|||
var el = _step.value; |
|||
panel.appendChild(el); |
|||
} |
|||
} catch (err) { |
|||
_didIteratorError = true; |
|||
_iteratorError = err; |
|||
} finally { |
|||
try { |
|||
if (!_iteratorNormalCompletion && _iterator.return) { |
|||
_iterator.return(); |
|||
} |
|||
} finally { |
|||
if (_didIteratorError) { |
|||
throw _iteratorError; |
|||
} |
|||
} |
|||
} |
|||
document.body.appendChild(panel); |
document.body.appendChild(panel); |
||
var offsetWidth = panel.offsetWidth, |
|||
offsetHeight = panel.offsetHeight; |
|||
panel.style.left = `${Math.max(x - offsetWidth / 2, 0)}px`; |
|||
panel.style.top = `${y + 2}px`; |
|||
panel.style.left = Math.max(x - offsetWidth / 2, 0) + "px"; |
|||
const cancel = clickOutside(panel, () => { |
|||
panel.style.top = y + 2 + "px"; |
|||
console.log("awa"); |
|||
var cancel = clickOutside(panel, function () { |
|||
panel.remove(); |
panel.remove(); |
||
cancel(); |
cancel(); |
||
第126行: | 第157行: | ||
// widget/VectorThemeLoader/widget.t.scss |
// widget/VectorThemeLoader/widget.t.scss |
||
var widget_t_default = "\n.salt-panel.style-list {\n padding: 8px 12px;\n border-radius: 4px;\n background-color: var(--lightcolor, #f9f9f9);\n box-shadow: 1px 2px 5px 0 rgba(153, 153, 153, 0.4);\n font-size: 1rem;\n z-index: 9999;\n}\n.salt-panel.style-list, .salt-panel.style-list * {\n box-sizing: border-box;\n}\n.salt-panel.style-list .style-list-item {\n display: block;\n min-width: 196px;\n margin: 4px 0;\n list-style: none;\n overflow: hidden;\n}\n.salt-panel.style-list .style-list-item .theme-list {\n padding: 2px 4px;\n margin: 0;\n overflow: hidden;\n}\n.salt-panel.style-list .style-list-item .theme-list .theme-list-item {\n padding: 4px 8px;\n list-style: none;\n overflow: hidden;\n user-select: none;\n cursor: pointer;\n}\n.salt-panel.style-list .style-list-item .theme-list .theme-list-item:hover {\n background-color: rgba(153, 153, 153, 0.0666666667);\n}\n.salt-panel.style-list .style-list-item .theme-list .theme-list-item:active {\n background-color: rgba(153, 153, 153, 0.2);\n}\n.salt-panel.style-list .style-list-item .theme-list .theme-list-item .theme-list-item-img {\n display: inline-block;\n width: 1rem;\n height: 1rem;\n vertical-align: middle;\n margin-right: 4px;\n}\n.salt-panel.style-list .style-list-item .theme-list .theme-list-item .theme-list-item-name {\n display: inline;\n}"; |
|||
var widget_t_default = ` |
|||
.salt-panel.style-list { |
|||
padding: 8px 12px; |
|||
border-radius: 4px; |
|||
background-color: var(--lightcolor, #f9f9f9); |
|||
box-shadow: 1px 2px 5px 0 rgba(153, 153, 153, 0.4); |
|||
font-size: 1rem; |
|||
z-index: 9999; |
|||
} |
|||
.salt-panel.style-list, .salt-panel.style-list * { |
|||
box-sizing: border-box; |
|||
} |
|||
.salt-panel.style-list .style-list-item { |
|||
display: block; |
|||
min-width: 196px; |
|||
margin: 4px 0; |
|||
list-style: none; |
|||
overflow: hidden; |
|||
} |
|||
.salt-panel.style-list .style-list-item .theme-list { |
|||
padding: 2px 4px; |
|||
margin: 0; |
|||
overflow: hidden; |
|||
} |
|||
.salt-panel.style-list .style-list-item .theme-list .theme-list-item { |
|||
padding: 4px 8px; |
|||
list-style: none; |
|||
overflow: hidden; |
|||
user-select: none; |
|||
cursor: pointer; |
|||
} |
|||
.salt-panel.style-list .style-list-item .theme-list .theme-list-item:hover { |
|||
background-color: rgba(153, 153, 153, 0.0666666667); |
|||
} |
|||
.salt-panel.style-list .style-list-item .theme-list .theme-list-item:active { |
|||
background-color: rgba(153, 153, 153, 0.2); |
|||
} |
|||
.salt-panel.style-list .style-list-item .theme-list .theme-list-item .theme-list-item-img { |
|||
display: inline-block; |
|||
width: 1rem; |
|||
height: 1rem; |
|||
vertical-align: middle; |
|||
margin-right: 4px; |
|||
} |
|||
.salt-panel.style-list .style-list-item .theme-list .theme-list-item .theme-list-item-name { |
|||
display: inline; |
|||
}`; |
|||
// widget/VectorThemeLoader/widget.ts |
// widget/VectorThemeLoader/widget.ts |
||
//! https://github.com/mcbbs-wiki/mcbbs-wiki-widget-repo/tree/master/widget/VectorThemeLoader |
//! https://github.com/mcbbs-wiki/mcbbs-wiki-widget-repo/tree/master/widget/VectorThemeLoader |
||
addStyle(widget_t_default); |
addStyle(widget_t_default); |
||
var isLegacy = document.body.classList.contains("skin-vector-legacy"); |
|||
var themeMap = { |
|||
var themeMap = isLegacy ? { |
|||
book: { |
book: { |
||
name: "仿MCBBS书页风格", |
name: "仿MCBBS书页风格", |
||
common: "MediaWiki:Vector-Book.css", |
|||
default: { |
default: { |
||
name: "夏季主题", |
name: "夏季主题", |
||
第189行: | 第174行: | ||
nether: { name: "下界主题", css: "MediaWiki:Vector-Book-Nether.css" }, |
nether: { name: "下界主题", css: "MediaWiki:Vector-Book-Nether.css" }, |
||
winter: { name: "冬季主题", css: "MediaWiki:Vector-Book-Winter.css" } |
winter: { name: "冬季主题", css: "MediaWiki:Vector-Book-Winter.css" } |
||
}, |
|||
legacy: { |
|||
name: "", |
|||
common: "MediaWiki:Vector-Legacy-Book.css", |
|||
default: { name: "夏季主题", css: "MediaWiki:Vector-Book-Summer.css" }, |
|||
other: { |
|||
nether: { name: "下界主题", css: "MediaWiki:Vector-Book-Nether.css" }, |
|||
winter: { name: "冬季主题", css: "MediaWiki:Vector-Book-Winter.css" } |
|||
} |
|||
} |
} |
||
} |
|||
} : { |
|||
v4: { |
|||
name: "仿MCBBS v4风格", |
|||
default: { name: "默认风格", css: "MediaWiki:EEEEE.css" }, |
|||
other: {} |
|||
} |
} |
||
}; |
}; |
||
var defaultStyle = Object.keys(themeMap)[0]; |
|||
var isLegacy = document.body.classList.contains("skin-vector-legacy"); |
|||
var styleKey = "skin-vector-style"; |
var styleKey = isLegacy ? "mcbbs-wiki-skin-vector-legacy-style" : "mcbbs-wiki-skin-vector-style"; |
||
var themeKey = "skin-vector-theme"; |
var themeKey = isLegacy ? "mcbbs-wiki-skin-vector-legacy-theme" : "mcbbs-wiki-skin-vector-theme"; |
||
var loadThemeStyle = (style, theme) |
var loadThemeStyle = function loadThemeStyle(style, theme) { |
||
var styleMap = themeMap[style] || themeMap[defaultStyle]; |
|||
var currentCommonStyle = styleMap.common; |
|||
const styleMap = isLegacy ? _styleMap.legacy || _styleMap : _styleMap; |
|||
if (currentCommonStyle) loadWikiStyle(currentCommonStyle, "salt-wiki-style-common"); |
|||
var currentTheme = theme === "default" || !styleMap.other[theme] ? styleMap.default : styleMap.other[theme]; |
|||
loadWikiStyle(currentCommonStyle, "salt-wiki-style-common"); |
|||
const currentTheme = theme === "default" || !styleMap.other[theme] ? styleMap.default : styleMap.other[theme]; |
|||
loadWikiStyle(currentTheme.css, "salt-wiki-style-theme"); |
loadWikiStyle(currentTheme.css, "salt-wiki-style-theme"); |
||
}; |
}; |
||
var initTheme = () |
var initTheme = function initTheme() { |
||
var current = { style: defaultStyle, theme: "default" }; |
|||
const [style] = readAndListen({ |
|||
var _readAndListen = readAndListen({ |
|||
key: styleKey, |
key: styleKey, |
||
defaultValue: |
defaultValue: defaultStyle, |
||
listener: (ev) |
listener: function listener(ev) { |
||
if (ev.newValue) { |
if (ev.newValue) { |
||
current.style = ev.newValue; |
current.style = ev.newValue; |
||
第223行: | 第205行: | ||
} |
} |
||
} |
} |
||
}) |
}), |
||
_readAndListen2 = _slicedToArray(_readAndListen, 1), |
|||
const [theme] = readAndListen({ |
|||
style = _readAndListen2[0]; |
|||
var _readAndListen3 = readAndListen({ |
|||
key: themeKey, |
key: themeKey, |
||
defaultValue: "default", |
defaultValue: "default", |
||
listener: (ev) |
listener: function listener(ev) { |
||
if (ev.newValue) { |
if (ev.newValue) { |
||
current.theme = ev.newValue; |
current.theme = ev.newValue; |
||
第233行: | 第218行: | ||
} |
} |
||
} |
} |
||
}) |
}), |
||
_readAndListen4 = _slicedToArray(_readAndListen3, 1), |
|||
theme = _readAndListen4[0]; |
|||
current.style = style; |
current.style = style; |
||
current.theme = theme; |
current.theme = theme; |
||
var loadCurrentTheme = function loadCurrentTheme() { |
|||
var style2 = current.style, |
|||
theme2 = current.theme; |
|||
loadThemeStyle(style2, theme2); |
loadThemeStyle(style2, theme2); |
||
}; |
}; |
||
第243行: | 第233行: | ||
}; |
}; |
||
initTheme(); |
initTheme(); |
||
var handleSwitchBtn = (ev) |
var handleSwitchBtn = function handleSwitchBtn(ev) { |
||
var _$$offset = $(btn).offset(), |
|||
top = _$$offset.top, |
|||
console.log(ev); |
|||
left = _$$offset.left; |
|||
const createThemeSwitch = (style, themeCode, theme) => { |
|||
var innerElements = []; |
|||
var createThemeSwitch = function createThemeSwitch(style, themeCode, theme) { |
|||
const handleClick = () => { |
|||
var name = theme.name, |
|||
imgSrc = theme.img; |
|||
var handleClick = function handleClick() { |
|||
write(styleKey, style); |
write(styleKey, style); |
||
write(themeKey, themeCode); |
write(themeKey, themeCode); |
||
loadThemeStyle(style, themeCode); |
loadThemeStyle(style, themeCode); |
||
}; |
}; |
||
var li2 = document.createElement("li"); |
|||
li2.className = "theme-list-item"; |
li2.className = "theme-list-item"; |
||
li2.addEventListener("click", handleClick); |
li2.addEventListener("click", handleClick); |
||
if (imgSrc) { |
if (imgSrc) { |
||
var img = document.createElement("img"); |
|||
img.src = imgSrc; |
img.src = imgSrc; |
||
img.className = "theme-list-item-img"; |
img.className = "theme-list-item-img"; |
||
li2.appendChild(img); |
li2.appendChild(img); |
||
} |
} |
||
var div = document.createElement("div"); |
|||
div.textContent = name; |
div.textContent = name; |
||
div.className = "theme-list-item-name"; |
div.className = "theme-list-item-name"; |
||
第269行: | 第263行: | ||
return li2; |
return li2; |
||
}; |
}; |
||
for ( |
for (var style in themeMap) { |
||
var li2 = document.createElement("li"); |
|||
li2.className = "style-list-item"; |
li2.className = "style-list-item"; |
||
var title = document.createElement("div"); |
|||
title.className = "style-list-item-title"; |
title.className = "style-list-item-title"; |
||
title.textContent = themeMap[style].name; |
title.textContent = themeMap[style].name; |
||
var ul = document.createElement("ul"); |
|||
ul.className = "theme-list"; |
ul.className = "theme-list"; |
||
var themeList = []; |
|||
var defaultTheme = themeMap[style].default; |
|||
themeList.push(createThemeSwitch(style, "default", defaultTheme)); |
themeList.push(createThemeSwitch(style, "default", defaultTheme)); |
||
for ( |
for (var themeCode in themeMap[style].other) { |
||
themeList.push(createThemeSwitch(style, themeCode, themeMap[style].other[themeCode])); |
themeList.push(createThemeSwitch(style, themeCode, themeMap[style].other[themeCode])); |
||
} |
} |
||
var _iteratorNormalCompletion2 = true; |
|||
for (const el of themeList) |
|||
var _didIteratorError2 = false; |
|||
ul.appendChild(el); |
|||
var _iteratorError2 = undefined; |
|||
try { |
|||
for (var _iterator2 = themeList[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { |
|||
var el = _step2.value; |
|||
ul.appendChild(el); |
|||
} |
|||
} catch (err) { |
|||
_didIteratorError2 = true; |
|||
_iteratorError2 = err; |
|||
} finally { |
|||
try { |
|||
if (!_iteratorNormalCompletion2 && _iterator2.return) { |
|||
_iterator2.return(); |
|||
} |
|||
} finally { |
|||
if (_didIteratorError2) { |
|||
throw _iteratorError2; |
|||
} |
|||
} |
|||
} |
|||
li2.appendChild(title); |
li2.appendChild(title); |
||
li2.appendChild(ul); |
li2.appendChild(ul); |
||
innerElements.push(li2); |
innerElements.push(li2); |
||
} |
} |
||
createPanel({ |
createPanel.apply(undefined, [{ |
||
className: "style-list", |
className: "style-list", |
||
position: { x: left, y: top + btn.offsetHeight } |
position: { x: left, y: top + btn.offsetHeight } |
||
} |
}].concat(innerElements)); |
||
}; |
}; |
||
var headLogoutBtn = document.getElementById("pt-logout"); |
var headLogoutBtn = document.getElementById("pt-logout"); |
||
if (!headLogoutBtn) { |
|||
return; |
|||
} |
|||
var btn = document.createElement("a"); |
var btn = document.createElement("a"); |
||
btn.textContent = " |
btn.textContent = "主题"; |
||
btn.title = " |
btn.title = "主题"; |
||
btn.onclick = handleSwitchBtn; |
btn.onclick = handleSwitchBtn; |
||
var li = document.createElement("li"); |
var li = document.createElement("li"); |
||
li.className = "mw-list-item"; |
li.className = "mw-list-item"; |
||
li.appendChild(btn); |
li.appendChild(btn); |
||
console.log("headLogoutBtn.parentElement", headLogoutBtn.parentElement); |
|||
headLogoutBtn.parentElement.insertBefore(li, headLogoutBtn); |
headLogoutBtn.parentElement.insertBefore(li, headLogoutBtn); |
||
})(); |
})(); |
2022年11月11日 (五) 23:06的最新版本
"use strict";
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
(function () {
// src/utils/resource.ts
function addStyleUrl(url, key) {
var style = void 0;
if (key && document.getElementById(key) instanceof HTMLLinkElement) {
style = document.getElementById(key);
} else {
style = document.createElement("link");
style.rel = "stylesheet";
style.type = "text/css";
if (key) style.id = key;
}
if (style.href === url) return;
style.href = url;
document.head.appendChild(style);
}
function addStyle(css) {
var style = document.createElement("style");
style.textContent = css;
document.head.appendChild(style);
}
function loadWikiStyle(page, key) {
addStyleUrl("https://mcbbs.wiki/index.php?title=" + page + "&action=raw&ctype=text/css", key);
}
// src/utils/storage.ts
function parse(str) {
if (str) {
try {
return JSON.parse(str);
} catch (e) {}
}
return null;
}
function write(key, value) {
localStorage.setItem(key, JSON.stringify(value));
}
function unsafeRead(key) {
var storage = localStorage.getItem(key);
return parse(storage);
}
function listen(listener) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : { passive: true };
window.addEventListener("storage", listener, options);
return function () {
return window.removeEventListener("storage", listener, options);
};
}
function readAndListen(props) {
var key = props.key,
defaultValue = props.defaultValue,
listener = props.listener,
_props$callOnChange = props.callOnChange,
callOnChange = _props$callOnChange === undefined ? true : _props$callOnChange,
_props$options = props.options,
options = _props$options === undefined ? { passive: true } : _props$options;
var v = unsafeRead(key);
if (defaultValue !== void 0 && v === null) {
write(key, defaultValue);
v = defaultValue;
}
var fn = function fn(ev) {
if (ev.key !== key || ev.storageArea !== localStorage) return;
var newValue = parse(ev.newValue);
var oldValue = parse(ev.oldValue);
if (callOnChange && newValue === oldValue) return;
var encapsulatedEvent = {
key: key,
newValue: newValue,
oldValue: oldValue,
storageArea: ev.storageArea,
url: ev.url
};
listener(encapsulatedEvent);
};
var off = listen(fn, options);
return [v, off];
}
// src/utils/utils.ts
function clickOutside(el, callback) {
var cb = function cb(ev) {
var target = ev.target;
if (!(target instanceof Element)) return;
if (target === el) return;
var obj = target.parentElement;
while (obj && obj !== el && obj.parentElement) {
obj = obj.parentElement;
}
if (obj !== el) callback();
};
window.addEventListener("click", cb, true);
return function () {
return window.removeEventListener("click", cb);
};
}
// widget/VectorThemeLoader/SwitchPanel.ts
function createPanel(props) {
var className = props.className,
_props$position = props.position,
x = _props$position.x,
y = _props$position.y;
var panel = document.createElement("div");
panel.className = "salt-panel " + (className || "");
panel.style.position = "absolute";
for (var _len = arguments.length, innerElements = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
innerElements[_key - 1] = arguments[_key];
}
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try {
for (var _iterator = innerElements[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var el = _step.value;
panel.appendChild(el);
}
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator.return) {
_iterator.return();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
document.body.appendChild(panel);
var offsetWidth = panel.offsetWidth,
offsetHeight = panel.offsetHeight;
panel.style.left = Math.max(x - offsetWidth / 2, 0) + "px";
panel.style.top = y + 2 + "px";
var cancel = clickOutside(panel, function () {
panel.remove();
cancel();
});
return panel;
}
// widget/VectorThemeLoader/widget.t.scss
var widget_t_default = "\n.salt-panel.style-list {\n padding: 8px 12px;\n border-radius: 4px;\n background-color: var(--lightcolor, #f9f9f9);\n box-shadow: 1px 2px 5px 0 rgba(153, 153, 153, 0.4);\n font-size: 1rem;\n z-index: 9999;\n}\n.salt-panel.style-list, .salt-panel.style-list * {\n box-sizing: border-box;\n}\n.salt-panel.style-list .style-list-item {\n display: block;\n min-width: 196px;\n margin: 4px 0;\n list-style: none;\n overflow: hidden;\n}\n.salt-panel.style-list .style-list-item .theme-list {\n padding: 2px 4px;\n margin: 0;\n overflow: hidden;\n}\n.salt-panel.style-list .style-list-item .theme-list .theme-list-item {\n padding: 4px 8px;\n list-style: none;\n overflow: hidden;\n user-select: none;\n cursor: pointer;\n}\n.salt-panel.style-list .style-list-item .theme-list .theme-list-item:hover {\n background-color: rgba(153, 153, 153, 0.0666666667);\n}\n.salt-panel.style-list .style-list-item .theme-list .theme-list-item:active {\n background-color: rgba(153, 153, 153, 0.2);\n}\n.salt-panel.style-list .style-list-item .theme-list .theme-list-item .theme-list-item-img {\n display: inline-block;\n width: 1rem;\n height: 1rem;\n vertical-align: middle;\n margin-right: 4px;\n}\n.salt-panel.style-list .style-list-item .theme-list .theme-list-item .theme-list-item-name {\n display: inline;\n}";
// widget/VectorThemeLoader/widget.ts
//! https://github.com/mcbbs-wiki/mcbbs-wiki-widget-repo/tree/master/widget/VectorThemeLoader
addStyle(widget_t_default);
var isLegacy = document.body.classList.contains("skin-vector-legacy");
var themeMap = isLegacy ? {
book: {
name: "仿MCBBS书页风格",
default: {
name: "夏季主题",
css: "MediaWiki:Vector-Book-Summer.css",
img: "https://mcbbs.wiki/images/2/2f/艺术家与认证用户回帖图标.png"
},
other: {
nether: { name: "下界主题", css: "MediaWiki:Vector-Book-Nether.css" },
winter: { name: "冬季主题", css: "MediaWiki:Vector-Book-Winter.css" }
}
}
} : {
v4: {
name: "仿MCBBS v4风格",
default: { name: "默认风格", css: "MediaWiki:EEEEE.css" },
other: {}
}
};
var defaultStyle = Object.keys(themeMap)[0];
var styleKey = isLegacy ? "mcbbs-wiki-skin-vector-legacy-style" : "mcbbs-wiki-skin-vector-style";
var themeKey = isLegacy ? "mcbbs-wiki-skin-vector-legacy-theme" : "mcbbs-wiki-skin-vector-theme";
var loadThemeStyle = function loadThemeStyle(style, theme) {
var styleMap = themeMap[style] || themeMap[defaultStyle];
var currentCommonStyle = styleMap.common;
if (currentCommonStyle) loadWikiStyle(currentCommonStyle, "salt-wiki-style-common");
var currentTheme = theme === "default" || !styleMap.other[theme] ? styleMap.default : styleMap.other[theme];
loadWikiStyle(currentTheme.css, "salt-wiki-style-theme");
};
var initTheme = function initTheme() {
var current = { style: defaultStyle, theme: "default" };
var _readAndListen = readAndListen({
key: styleKey,
defaultValue: defaultStyle,
listener: function listener(ev) {
if (ev.newValue) {
current.style = ev.newValue;
loadCurrentTheme();
}
}
}),
_readAndListen2 = _slicedToArray(_readAndListen, 1),
style = _readAndListen2[0];
var _readAndListen3 = readAndListen({
key: themeKey,
defaultValue: "default",
listener: function listener(ev) {
if (ev.newValue) {
current.theme = ev.newValue;
loadCurrentTheme();
}
}
}),
_readAndListen4 = _slicedToArray(_readAndListen3, 1),
theme = _readAndListen4[0];
current.style = style;
current.theme = theme;
var loadCurrentTheme = function loadCurrentTheme() {
var style2 = current.style,
theme2 = current.theme;
loadThemeStyle(style2, theme2);
};
loadCurrentTheme();
};
initTheme();
var handleSwitchBtn = function handleSwitchBtn(ev) {
var _$$offset = $(btn).offset(),
top = _$$offset.top,
left = _$$offset.left;
var innerElements = [];
var createThemeSwitch = function createThemeSwitch(style, themeCode, theme) {
var name = theme.name,
imgSrc = theme.img;
var handleClick = function handleClick() {
write(styleKey, style);
write(themeKey, themeCode);
loadThemeStyle(style, themeCode);
};
var li2 = document.createElement("li");
li2.className = "theme-list-item";
li2.addEventListener("click", handleClick);
if (imgSrc) {
var img = document.createElement("img");
img.src = imgSrc;
img.className = "theme-list-item-img";
li2.appendChild(img);
}
var div = document.createElement("div");
div.textContent = name;
div.className = "theme-list-item-name";
li2.appendChild(div);
return li2;
};
for (var style in themeMap) {
var li2 = document.createElement("li");
li2.className = "style-list-item";
var title = document.createElement("div");
title.className = "style-list-item-title";
title.textContent = themeMap[style].name;
var ul = document.createElement("ul");
ul.className = "theme-list";
var themeList = [];
var defaultTheme = themeMap[style].default;
themeList.push(createThemeSwitch(style, "default", defaultTheme));
for (var themeCode in themeMap[style].other) {
themeList.push(createThemeSwitch(style, themeCode, themeMap[style].other[themeCode]));
}
var _iteratorNormalCompletion2 = true;
var _didIteratorError2 = false;
var _iteratorError2 = undefined;
try {
for (var _iterator2 = themeList[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
var el = _step2.value;
ul.appendChild(el);
}
} catch (err) {
_didIteratorError2 = true;
_iteratorError2 = err;
} finally {
try {
if (!_iteratorNormalCompletion2 && _iterator2.return) {
_iterator2.return();
}
} finally {
if (_didIteratorError2) {
throw _iteratorError2;
}
}
}
li2.appendChild(title);
li2.appendChild(ul);
innerElements.push(li2);
}
createPanel.apply(undefined, [{
className: "style-list",
position: { x: left, y: top + btn.offsetHeight }
}].concat(innerElements));
};
var headLogoutBtn = document.getElementById("pt-logout");
if (!headLogoutBtn) {
return;
}
var btn = document.createElement("a");
btn.textContent = "主题";
btn.title = "主题";
btn.onclick = handleSwitchBtn;
var li = document.createElement("li");
li.className = "mw-list-item";
li.appendChild(btn);
headLogoutBtn.parentElement.insertBefore(li, headLogoutBtn);
})();