MediaWiki:Common.js

来自个人维基
跳转至: 导航搜索

注意:保存之后,你必须清除浏览器缓存才能看到做出的更改。

  • 火狐(Firefox)/Safari:按住“Shift”,同时单击“刷新”,或按“Ctrl-F5”或“Ctrl-R”(Mac为“⌘-R”)
  • Google Chrome:按“Ctrl-Shift-R”(Mac为“⌘-Shift-R”)
  • Internet Explorer:按住“Ctrl”,同时单击“刷新”,或按“Ctrl-F5”
  • Opera:在“工具→首选项”中清除缓存
$( function () {
 
/* 缺省将内容 lang 设置成简体中文 */
if ( !document.getElementById( "lnnblog-setlang" ) ) {
	$( "mw-content-text" ).attr( "lang", "zh-cmn-Hans" );
	$( "firstHeading" ).attr( "lang", "zh-cmn-Hans" );
}
 
/* 评论框内联 CSS 修正 */
$( "#addComment" ).css( "width", "" ).css( "max-width", "500px" );
$( "#addComment textarea" ).css( "width", "100%" ).css( "box-sizing", "border-box" );
$( "#addComment form .greyTiny" ).css( "padding-left", "" );
$( "#addComment textarea+div" ).css( "text-align", "right" );
 
/* viewport meta? */
var wide = window.outerWidth > 720
var viewportMeta = $( '<meta name="viewport" content="width=' + (wide ? "device-width" : "700") + '">' )
$( "head" ).append(viewportMeta)
$( window ).on( "resize", function () {
	var wide_ = window.outerWidth > 720
	if (wide_ === wide) return
	wide = wide_
	viewportMeta.attr( "content", "width=" + (wide ? "device-width" : "700"))
} )
 
/* 为 Template:Hidebox 增加动画效果 */
$( "#bodyContent" ).on( "click", ".lnnblog-hidebox-heading", function ( event ) {
	event.preventDefault()
 
	/** 折叠框的 <summary> 元素。 */
	var $this = $( this )
	/** 折叠框的 <details> 元素。 */
	var $parent = $this.parent()
	/** 折叠框内容元素。 */
	var $body = $this.nextAll( ".lnnblog-hidebox-body" )
 
	var open = $parent.prop( "open" )
	/** 当前正在执行的动画动作(expand 或 shrink)。若不在执行动画则为空。 */
	var oldState = $parent.attr( "data-lnnblog-hidebox-state" )
	/** 现在要执行的动画动作。 */
	var state = !open || oldState === "shrink" ? "expand" : "shrink"
 
	// 计算当前的宽高
	// 取得的宽度是四舍五入过的;增加 0.5 以避免内容折行
	var currentWidth = $parent.width() + 0.5
	var currentHeight = $parent.height()
	// 打断可能正在进行的动画,然后计算一下动画目标状态的宽高
	$parent.stop( true, true ).prop( "open", state === "expand" )
	var targetWidth = $parent.width() + 0.5
	var targetHeight = $parent.height()
 
	// 锁定内容框宽度为完全展开状态的宽度,以避免内容折行
	if (state === "expand")
		$body.outerWidth( targetWidth )
	else if (oldState !== "expand") // 从完全展开状态折叠
		$body.outerWidth( currentWidth )
	// 如果不是从完全展开状态折叠,即在展开的半途中折叠,
	// 则内容框的宽度还没有清除,无需再次设置。
 
	$parent
		.attr( "data-lnnblog-hidebox-state", state )
		.width( currentWidth )
		.height( currentHeight )
		// 必须在 open 状态下才能显示出内容框,所以不管展开还是折叠都需要设置成 open
		.prop( "open", true )
		.animate( {
			width: targetWidth,
			height: targetHeight
		}, {
			duration: 250,
			done: function () {
				if (state === "shrink") $parent.prop( "open", false )
				// 清除手动设置的宽高
				$body.css( "width", "" )
				$parent
					.css( { width: "", height: "" } )
					.removeAttr( "data-lnnblog-hidebox-state" )
			}
		} )
} )
 
/* 重新定义编辑工具栏 */
if ( [ 'edit', 'submit' ].indexOf( mw.config.get( 'wgAction' ) ) !== -1 ) {
	var $newToolbar = $( '<div id="lnnblog-edittoolbar" lang="zh-cmn-Hans">' )
	var $group = null
 
	function addButton( label, title, before, after, sample ) {
		$group.append( $( "<button>" )
			.attr( "type", "button" )
			.attr( "class", "lnnblog-button-small" )
			.attr( "title", title )
			.append( $( "<tt>" ).text( label ) )
			.on( "mousedown", false ) // 防止焦点离开文本框
			.click( mw.toolbar.insertTags.bind(mw.toolbar, before, after || "", sample || "") ) )
	}
	function newGroup() {
		$group = $( '<div>' ).appendTo( $newToolbar )
	}
 
	newGroup()
	addButton( "[[]]",    "内链",               "[[", "]]" )
	addButton( "lelink",  "英文内链",           "{{lelink|", "}}" )
	addButton( "{{|}}",   "模板调用",           "{{|", "}}" )
	newGroup()
	addButton( "le",      "英文文本",           "{{le|", "}}" )
	addButton( "lj",      "逻辑语文本",         "{{lj|", "}}" )
	addButton( "lang",    "文本语言",           "{{lang|und|", "}}" )
	newGroup()
	addButton( "h2",      "二级标题",           "== ", " ==" )
	addButton( "h3",      "三级标题",           "=== ", " ===" )
	newGroup()
	addButton( "table",   "wikitable 表格",     "{|class=wikitable\n! ", "\n|-\n|\n|}" )
	addButton( "box",     "box 模板",           "{{box|heading=标题|1=\n", "\n}}" )
	addButton( "hidebox", "hidebox 模板",       "{{hidebox|标题|2=\n", "\n}}" )
	newGroup()
	addButton( "nw",      "nowiki 标签",        "<nowiki>", "</nowiki>" )
	addButton( "nw/",     "空 nowiki 标签",     "<nowiki/>" )
	addButton( "code",    "行内代码",           "{{code|", "}}" )
	addButton( "pre",     "pre 块",             "<pre>\n", "\n</pre>" )
	addButton( "syntax",  "代码高亮块",         "<syntaxhighlight lang=javascript>\n", "\n</syntaxhighlight>" )
	newGroup()
	addButton( "subst",   "模板替代",           "{{subst:", "}}" )
	addButton( "pn",      "当前页面名称",       mw.config.get( 'wgTitle' ) )
	addButton( "fpn",     "带名字空间的当前页面名称", mw.config.get( 'wgPageName' ) )
	newGroup()
	addButton( "cat",     "分类",               "[[分类:", /* <nowiki/> */ "]]" )
	addButton( "SORT",    "默认排序字",         "{{DEFAULTSORT:", "}}", mw.config.get( "wgTitle" ) )
	newGroup()
	addButton( "<!--",    "HTML 注释",          "<!--", "-->" )
	addButton( "ni",      "noinclude 标签",     "<noinclude>", "</noinclude>" )
	addButton( "ni/",     "空 noinclude 标签",  "<noinclude/>", "" )
	addButton( "io",      "includeonly 标签",   "<includeonly>", "</includeonly>" )
	addButton( "oi",      "onlyinclude 标签",   "<onlyinclude>", "</onlyinclude>" )
	newGroup()
	addButton( "html",    "原始 HTML 标签",     "<html>", "<\/html>" )
	addButton( "/html",   "反向原始 HTML 标签", "<\/html>", "<html>" )
	addButton( "bht",     "原始 HTML 块",       "{{MywikiParaHack|<html>", "<\/html>}}" )
	addButton( "script",  "script 标签",        "<script>\n", "\n<\/script>" )
	addButton( "style",   "style 标签",         "<style>\n", "\n</style>" )
 
	$( "#ydnedittoolbar" ).parent().replaceWith( $newToolbar )
}
 
/* 在侧栏添加“在‘真魂’分站查看”和“在分支站查看”链接 */
var title = mw.config.get( "wgTitle" )
var ns = mw.config.get( "wgCanonicalNamespace" )
var pagename = ns ? ns + ":" + title : title
var $item = $( '<li><a>在“真魂”分站查看</a></li>' )
$( "a", $item ).attr( "href", "https://notblog.vudrux.site/wiki/" + mw.util.wikiUrlencode( pagename ) )
var $item2 = $( '<li><a>在分支站查看</a></li>' )
$( "a", $item2 ).attr( "href", "https://dgck81lnn.miraheze.org/wiki/" + mw.util.wikiUrlencode( pagename ) )
$( "#p-tb ul" ).prepend( $item, $item2 )
 
/* sitenotice 中“前往‘真魂’分站查看本页面”添加链接 */
$migrationLink = $( "#lnnblog-sitenotice-migration-link" )
$migrationLink.replaceWith(
	$( "<a>" )
		.prop( "href", "https://notblog.vudrux.site/wiki/" + mw.util.wikiUrlencode( pagename ) )
		.append( $migrationLink.contents() )
)
 
/* 深色模式 */
!function () {
	var isOn = !!+(
		localStorage.getItem("lnnblog-darkmode") ||
		matchMedia("(prefers-color-scheme: dark)").matches
	)
	var broadcastChannel = new BroadcastChannel("gadget-dark-mode")
	function apply() {
		$(document.documentElement).toggleClass("client-darkmode", isOn)
		$('meta[name="theme-color"]').attr("content", isOn ? "#000000" : "#eaecf0")
		$("#pt-darkmode a").text(isOn ? "关闭暗色模式" : "暗色模式")
	}
	function save() {
		apply()
		if (isOn === prefersDark()) localStorage.removeItem("lnnblog-darkmode")
		else localStorage.setItem("lnnblog-darkmode", +isOn)
		broadcastChannel.postMessage(isOn)
	}
	function prefersDark() {
		return matchMedia("(prefers-color-scheme: dark)").matches
	}
 
	$.when($.ready, mw.loader.using(["mediawiki.util"])).then(function () {
		$(
			mw.util.addPortletLink(
				"p-personal",
				"#",
				isOn ? "关闭暗色模式" : "暗色模式",
				"pt-darkmode",
				"",
				"",
				"#pt-logout"
			)
		)
			.children()
			.on("click", function (e) {
				e.preventDefault()
				isOn = !isOn
				save()
			})
		broadcastChannel.onmessage = function (msg) {
			if (msg.data !== isOn) {
				isOn = msg.data
				apply()
			}
		}
		save()
		matchMedia("(prefers-color-scheme: dark)")
			.addEventListener("change", function () {
				isOn = prefersDark()
				save()
			})
	})
}();
 
} );