MediaWiki:Common.js:修订间差异
无编辑摘要 |
无编辑摘要 |
||
(未显示同一用户的4个中间版本) | |||
第95行: | 第95行: | ||
head.appendChild(script); | head.appendChild(script); | ||
} | } | ||
$(function InitCardSelect() { | |||
var self = {}; | |||
var selectOptions; //所有筛选按钮 | |||
var filters = {}; //当前筛选规则 | |||
var filterKeys = []; //所有筛选Key | |||
var showAll = true; //不筛选,显示全部 | |||
var tableRows; //所有要被筛选的行 | |||
var computedRows; //筛选后的行 | |||
var $sorter; //当前进行排序的表头 | |||
var sortDesent = false; //反向排序 | |||
function isNil(s) { | |||
return s === "" || s === undefined || s === null || s === false; | |||
} | |||
//点击筛选按钮时 | |||
function OnSelectOptionClick(e) { | |||
var $x = e.data; | |||
e.preventDefault(); | |||
var label = "[" + $.trim($x.text()) + "] 筛选"; | |||
console.time(label); | |||
//显示全部 | |||
if ($x.FilterKey == 0) { | |||
for (var i in selectOptions) { | |||
selectOptions[i].Select = false; | |||
selectOptions[i].removeClass("selected"); | |||
} | |||
filters = {}; | |||
showAll = true; | |||
//更新表格 | |||
self.FilterRows(); | |||
console.timeEnd(label); | |||
return; | |||
} | |||
showAll = false; | |||
var select = !$x.Select; | |||
$x.Select = select; | |||
//变更筛选状态 | |||
var key = $x.FilterKey; | |||
filters[key] = filters[key] || {}; | |||
var opt = $x.FilterOpt == "AND" ? "AND" : "OR"; | |||
filters[key][opt] = filters[key][opt] || []; | |||
if (select) { | |||
filters[key][opt].push($x.FilterValue); | |||
} else { | |||
filters[key][opt] = filters[key][opt].filter(function (x) { | |||
return x !== $x.FilterValue; | |||
}); | |||
if (filters[key][opt].length < 1) delete filters[key][opt]; | |||
} | |||
select ? $x.addClass("selected") : $x.removeClass("selected"); | |||
self.FilterRows(); | |||
console.timeEnd(label); | |||
} | |||
function OnHeaderSortClick(e) { | |||
var $x = e.data; | |||
e.preventDefault(); | |||
var label = "[" + $.trim($x.text()) + "] 排序"; | |||
console.time(label); | |||
if ($sorter !== $x) { | |||
//第一次:新的排序 | |||
$sorter = $x; | |||
sortDesent = false; | |||
} else if (!sortDesent) { | |||
//第二次:切换排序 | |||
sortDesent = true; | |||
} else { | |||
//第三次:不进行排序 | |||
$sorter = null; | |||
} | |||
self.SortRows(); | |||
console.timeEnd(label); | |||
} | |||
//初始化 | |||
self.Init = function () { | |||
selectOptions = $(".cardSelectOption") | |||
.toArray() | |||
.map(function (x) { | |||
var $x = $(x); | |||
var dataOption = $.trim($x.data("option")); | |||
var dataGroup = $.trim($x.data("group")); | |||
if (isNil(dataOption) || isNil(dataGroup)) return $x; | |||
var splt = dataOption.split("|"); | |||
$x.FilterKey = dataGroup; | |||
$x.FilterValue = $.trim(splt[1]); | |||
$x.FilterOpt = $.trim($x.data("opt") || "OR").toUpperCase(); | |||
if (filterKeys.indexOf(dataGroup) < 0) filterKeys.push(dataGroup); | |||
$x.click($x, OnSelectOptionClick); | |||
return $x; | |||
}); | |||
//$head = $('#CardSelectTabHeader'); | |||
tableRows = $("#CardSelectTr>tbody>tr,#CardSelectCard .trcard") | |||
.toArray() | |||
.map(function (x) { | |||
var $x = $(x); | |||
//if (x == $head[0]) continue; | |||
for (var i in filterKeys) { | |||
var key = filterKeys[i]; | |||
var val = $x.data("param" + key); | |||
if (val === undefined) continue; | |||
if (typeof val == "number") { | |||
val = val.toString(10); | |||
} | |||
var splt = val.split(","); | |||
for (var j in splt) { | |||
var s = $.trim(splt[j]); | |||
if (!isNil(s)) { | |||
$x.FilterData = $x.FilterData || {}; | |||
$x.FilterData[key] = $x.FilterData[key] || []; | |||
$x.FilterData[key].push(s); | |||
} | |||
} | |||
} | |||
return $x; | |||
}); | |||
//computedRows = tableRows.concat([]); | |||
$("#CardSelectTr>thead>tr>th").each(function (index, x) { | |||
var $x = $(x); | |||
$x.off("click").off("mousedown"); | |||
if ($x.hasClass("headerSort")) { | |||
$x.Index = index; | |||
//$x.SortKey = $x.data('group'); | |||
$x.click($x, OnHeaderSortClick); | |||
} | |||
}); | |||
}; | |||
//t1中包含t2中所有项 | |||
function includeAll(t1, t2) { | |||
for (var i in t2) { | |||
if (t1.indexOf(t2[i]) < 0) return false; | |||
} | |||
return true; | |||
} | |||
//t1中包含t2中的任一项 | |||
function includeAny(t1, t2) { | |||
if (t2.length == 0) return true; | |||
for (var i in t2) { | |||
if (t1.indexOf(t2[i]) > -1) return true; | |||
} | |||
return false; | |||
} | |||
//使用show/hide来显示表格行 | |||
self.FilterRows = function () { | |||
if (showAll) { | |||
filters = {}; | |||
} | |||
$("#CardSelectTr>tbody,#CardSelectCard").hide(); | |||
for (var idx in tableRows) { | |||
var $x = tableRows[idx]; | |||
var data = $x.FilterData; | |||
var hide = false; | |||
for (var key in filters) { | |||
hide = !data || !data[key]; | |||
if (!hide && filters[key]["AND"]) { | |||
hide = !includeAll(data[key], filters[key]["AND"]); | |||
} | |||
if (!hide && filters[key]["OR"]) { | |||
hide = !includeAny(data[key], filters[key]["OR"]); | |||
} | |||
if (hide) break; | |||
} | |||
if (!hide != !$x.Hide) { | |||
$x.Hide = hide; | |||
hide ? $x.hide() : $x.show(); | |||
} | |||
} | |||
$("#CardSelectTr .headerSort").removeClass("headerSortDown headerSortUp"); | |||
$("#CardSelectTr>tbody,#CardSelectCard").show(); | |||
$sorter = null; | |||
}; | |||
function grabSortData($tr, index) { | |||
$tr.SortData = $tr.SortData || []; | |||
if ($tr.SortData[index] !== undefined) return $tr.SortData[index]; | |||
var td = $tr.children("td")[index]; | |||
if (!td) { | |||
$tr.SortData[index] = -1; | |||
return -1; | |||
} | |||
var text = $.trim(td.textContent); | |||
$tr.SortData[index] = text; | |||
return text; | |||
} | |||
//对行排序,不显示的行会被移除 | |||
self.SortRows = function () { | |||
//var residues = []; | |||
if (!$sorter) { | |||
computedRows = tableRows.filter(function ($x) { | |||
return !$x.Hide; | |||
}); | |||
$("#CardSelectTr .headerSort").removeClass("headerSortDown headerSortUp"); | |||
} else if (!sortDesent) { | |||
var index = $sorter.Index; | |||
computedRows = tableRows.filter(function ($x) { | |||
return !$x.Hide; | |||
}); | |||
computedRows.sort(function compareFunction($x, $y) { | |||
var x = grabSortData($x, index); | |||
var y = grabSortData($y, index); | |||
var nx = +x; | |||
var ny = +y; | |||
return isNaN(nx) || isNaN(ny) | |||
? isNaN(nx) && isNaN(ny) | |||
? x < y | |||
? -1 | |||
: 1 | |||
: isNaN(nx) | |||
? 1 | |||
: -1 //字符串排后 | |||
: nx === ny | |||
? 0 | |||
: nx < ny | |||
? -1 | |||
: 1; //数值小的排前 | |||
//console.log (`${x} ~ ${y} => ${ret}`); | |||
//return ret; | |||
}); | |||
$("#CardSelectTr .headerSort").removeClass("headerSortDown headerSortUp"); | |||
$sorter.addClass("headerSortDown"); | |||
} else { | |||
computedRows.reverse(); | |||
$("#CardSelectTr .headerSort").removeClass("headerSortDown headerSortUp"); | |||
$sorter.addClass("headerSortUp"); | |||
} | |||
$("#CardSelectTr>tbody").hide().prepend(computedRows).show(); | |||
}; | |||
$(".cardSelectOption").off("click").off("mousedown"); | |||
if ($("#CardSelectTabHeader").parent().is("tbody")) { | |||
$("#CardSelectTr").prepend($("<thead/>").append($("#CardSelectTabHeader"))); | |||
} | |||
self.Init(); | |||
console.log("Common.js CardSelectTr Initialized."); | |||
return self; | |||
}); | |||
function fIsMobile() { | |||
return /Android|iPhone|iPad|iPod|BlackBerry|webOS|Windows Phone|SymbianOS|IEMobile|Opera Mini/i.test(navigator.userAgent); | |||
} | |||
$(".show-more").click(function () { | |||
var $description = $(this).find(".more-description"); | |||
if ($description.css("display") === "block") { | |||
$description.css("display", "none"); | |||
} else { | |||
$description.css("display", "block"); | |||
} | |||
}); |
2024年4月10日 (三) 19:30的最新版本
/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */
function templateResourceLoader() {
$('.resourceLoader').each(function() {
var $x = $(this);
var text = $.trim($x.text());
if (!text) return;
//加载模块
if ($x.data('isModule') == true)
return mw.loader.load(text);
//自动补充MediaWiki命名空间
var ns = text.match('^.*?:');
if (!ns) text = 'MediaWiki:' + text;
//加载CSS样式表
var mime = ($x.data('mime') || "text/javascript").toLowerCase();
if (mime == "text/css") {
if (text.slice(-4).toLowerCase() !== '.css') text = text + '.css';
//if ($x.data('debug') !== true) text = text + '&debug=false';
return mw.loader.load("//wiki.17173.com/hs/index.php?title="+text+"&action=raw&ctype=text/css", "text/css");
}
//加载JS脚本
if (ns && ns[0].toLowerCase() !== 'mediawiki:') {
return console.log('ResourceLoader: 不允许加载MediaWiki以外的js脚本');
}
if (text.slice(-3).toLowerCase() !== '.js') text = text + '.js';
//加载ES6模块
if ($x.data('isModuleEs6') == true)
return loadModuleES6("//wiki.17173.com/hs/index.php?title="+text+"&action=raw&ctype=text/javascript", function() {
console.log("ResourceLoader: 加载ES6模块 => " + text);
});
//加载React模块
if ($x.data('isModuleReact')) {
if ($x.data('isModuleReact')[0]) {
$.getScript("//wiki.17173.com/hs/index.php?title=MediaWiki:React.development.min.js&action=raw&ctype=text/javascript", function() {
$.getScript("//wiki.17173.com/hs/index.php?title=MediaWiki:React-dom.development.min.js&action=raw&ctype=text/javascript", function() {
console.log("ReactENV => React/ReactDOM Loaded! React is Available For This Page!");
console.log("%c React开发提示 %c 请务必在JS编辑界面右下角使用React同步器同步编译你的JSX代码,否则它将不起任何作用", "color: #fff; padding: 5px 0; background: blue;", "padding: 5px 5px 5px 0; background: #e5e5ff; color:blue");
$('.resourceLoader').each(function() {
var $xr = $(this);
var textr = $.trim($xr.text());
if (!textr) return;
//自动为React模块补充MediaWiki命名空间与-babel后缀
var nsr = textr.match('^.*?:');
if (!nsr) textr = 'MediaWiki:' + textr.slice(0, -3);
textr += '-babel.js';
if ($xr.data('isModuleReact') && $xr.data('isModuleReact')[1]) {
loadModuleES6("//wiki.17173.com/hs/index.php?title="+textr+"&action=raw&ctype=text/javascript", function() {
console.log("ResourceLoader: 加载React模块 => " + textr);
});
}
});
});
});
return;
}
}
//加载普通脚本
console.log('ResourceLoader: 加载JS => ' + text);
//if ($x.data('debug') !== true) text = text + '&debug=false';
return mw.loader.load("//wiki.17173.com/hs/index.php?title="+text+"&action=raw&ctype=text/javascript", "text/javascript");
});
}
if (document.readyState == 'loading') {
document.addEventListener('DOMContentLoaded', templateResourceLoader);
} else {
templateResourceLoader();
}
//加载ES6模块
function loadModuleES6(src, callback) {
var script = document.createElement('script'),
head = document.getElementsByTagName('head')[0];
script.type = 'module';
script.charset = 'UTF-8';
script.src = src;
if (script.addEventListener) {
script.addEventListener('load', function () {
callback();
}, false);
} else if (script.attachEvent) {
script.attachEvent('onreadystatechange', function () {
var target = window.event.srcElement;
if (target.readyState == 'loaded') {
callback();
}
});
}
head.appendChild(script);
}
$(function InitCardSelect() {
var self = {};
var selectOptions; //所有筛选按钮
var filters = {}; //当前筛选规则
var filterKeys = []; //所有筛选Key
var showAll = true; //不筛选,显示全部
var tableRows; //所有要被筛选的行
var computedRows; //筛选后的行
var $sorter; //当前进行排序的表头
var sortDesent = false; //反向排序
function isNil(s) {
return s === "" || s === undefined || s === null || s === false;
}
//点击筛选按钮时
function OnSelectOptionClick(e) {
var $x = e.data;
e.preventDefault();
var label = "[" + $.trim($x.text()) + "] 筛选";
console.time(label);
//显示全部
if ($x.FilterKey == 0) {
for (var i in selectOptions) {
selectOptions[i].Select = false;
selectOptions[i].removeClass("selected");
}
filters = {};
showAll = true;
//更新表格
self.FilterRows();
console.timeEnd(label);
return;
}
showAll = false;
var select = !$x.Select;
$x.Select = select;
//变更筛选状态
var key = $x.FilterKey;
filters[key] = filters[key] || {};
var opt = $x.FilterOpt == "AND" ? "AND" : "OR";
filters[key][opt] = filters[key][opt] || [];
if (select) {
filters[key][opt].push($x.FilterValue);
} else {
filters[key][opt] = filters[key][opt].filter(function (x) {
return x !== $x.FilterValue;
});
if (filters[key][opt].length < 1) delete filters[key][opt];
}
select ? $x.addClass("selected") : $x.removeClass("selected");
self.FilterRows();
console.timeEnd(label);
}
function OnHeaderSortClick(e) {
var $x = e.data;
e.preventDefault();
var label = "[" + $.trim($x.text()) + "] 排序";
console.time(label);
if ($sorter !== $x) {
//第一次:新的排序
$sorter = $x;
sortDesent = false;
} else if (!sortDesent) {
//第二次:切换排序
sortDesent = true;
} else {
//第三次:不进行排序
$sorter = null;
}
self.SortRows();
console.timeEnd(label);
}
//初始化
self.Init = function () {
selectOptions = $(".cardSelectOption")
.toArray()
.map(function (x) {
var $x = $(x);
var dataOption = $.trim($x.data("option"));
var dataGroup = $.trim($x.data("group"));
if (isNil(dataOption) || isNil(dataGroup)) return $x;
var splt = dataOption.split("|");
$x.FilterKey = dataGroup;
$x.FilterValue = $.trim(splt[1]);
$x.FilterOpt = $.trim($x.data("opt") || "OR").toUpperCase();
if (filterKeys.indexOf(dataGroup) < 0) filterKeys.push(dataGroup);
$x.click($x, OnSelectOptionClick);
return $x;
});
//$head = $('#CardSelectTabHeader');
tableRows = $("#CardSelectTr>tbody>tr,#CardSelectCard .trcard")
.toArray()
.map(function (x) {
var $x = $(x);
//if (x == $head[0]) continue;
for (var i in filterKeys) {
var key = filterKeys[i];
var val = $x.data("param" + key);
if (val === undefined) continue;
if (typeof val == "number") {
val = val.toString(10);
}
var splt = val.split(",");
for (var j in splt) {
var s = $.trim(splt[j]);
if (!isNil(s)) {
$x.FilterData = $x.FilterData || {};
$x.FilterData[key] = $x.FilterData[key] || [];
$x.FilterData[key].push(s);
}
}
}
return $x;
});
//computedRows = tableRows.concat([]);
$("#CardSelectTr>thead>tr>th").each(function (index, x) {
var $x = $(x);
$x.off("click").off("mousedown");
if ($x.hasClass("headerSort")) {
$x.Index = index;
//$x.SortKey = $x.data('group');
$x.click($x, OnHeaderSortClick);
}
});
};
//t1中包含t2中所有项
function includeAll(t1, t2) {
for (var i in t2) {
if (t1.indexOf(t2[i]) < 0) return false;
}
return true;
}
//t1中包含t2中的任一项
function includeAny(t1, t2) {
if (t2.length == 0) return true;
for (var i in t2) {
if (t1.indexOf(t2[i]) > -1) return true;
}
return false;
}
//使用show/hide来显示表格行
self.FilterRows = function () {
if (showAll) {
filters = {};
}
$("#CardSelectTr>tbody,#CardSelectCard").hide();
for (var idx in tableRows) {
var $x = tableRows[idx];
var data = $x.FilterData;
var hide = false;
for (var key in filters) {
hide = !data || !data[key];
if (!hide && filters[key]["AND"]) {
hide = !includeAll(data[key], filters[key]["AND"]);
}
if (!hide && filters[key]["OR"]) {
hide = !includeAny(data[key], filters[key]["OR"]);
}
if (hide) break;
}
if (!hide != !$x.Hide) {
$x.Hide = hide;
hide ? $x.hide() : $x.show();
}
}
$("#CardSelectTr .headerSort").removeClass("headerSortDown headerSortUp");
$("#CardSelectTr>tbody,#CardSelectCard").show();
$sorter = null;
};
function grabSortData($tr, index) {
$tr.SortData = $tr.SortData || [];
if ($tr.SortData[index] !== undefined) return $tr.SortData[index];
var td = $tr.children("td")[index];
if (!td) {
$tr.SortData[index] = -1;
return -1;
}
var text = $.trim(td.textContent);
$tr.SortData[index] = text;
return text;
}
//对行排序,不显示的行会被移除
self.SortRows = function () {
//var residues = [];
if (!$sorter) {
computedRows = tableRows.filter(function ($x) {
return !$x.Hide;
});
$("#CardSelectTr .headerSort").removeClass("headerSortDown headerSortUp");
} else if (!sortDesent) {
var index = $sorter.Index;
computedRows = tableRows.filter(function ($x) {
return !$x.Hide;
});
computedRows.sort(function compareFunction($x, $y) {
var x = grabSortData($x, index);
var y = grabSortData($y, index);
var nx = +x;
var ny = +y;
return isNaN(nx) || isNaN(ny)
? isNaN(nx) && isNaN(ny)
? x < y
? -1
: 1
: isNaN(nx)
? 1
: -1 //字符串排后
: nx === ny
? 0
: nx < ny
? -1
: 1; //数值小的排前
//console.log (`${x} ~ ${y} => ${ret}`);
//return ret;
});
$("#CardSelectTr .headerSort").removeClass("headerSortDown headerSortUp");
$sorter.addClass("headerSortDown");
} else {
computedRows.reverse();
$("#CardSelectTr .headerSort").removeClass("headerSortDown headerSortUp");
$sorter.addClass("headerSortUp");
}
$("#CardSelectTr>tbody").hide().prepend(computedRows).show();
};
$(".cardSelectOption").off("click").off("mousedown");
if ($("#CardSelectTabHeader").parent().is("tbody")) {
$("#CardSelectTr").prepend($("<thead/>").append($("#CardSelectTabHeader")));
}
self.Init();
console.log("Common.js CardSelectTr Initialized.");
return self;
});
function fIsMobile() {
return /Android|iPhone|iPad|iPod|BlackBerry|webOS|Windows Phone|SymbianOS|IEMobile|Opera Mini/i.test(navigator.userAgent);
}
$(".show-more").click(function () {
var $description = $(this).find(".more-description");
if ($description.css("display") === "block") {
$description.css("display", "none");
} else {
$description.css("display", "block");
}
});