◆少前百科是非盈利性、非官方的少女前线维基百科。 ◆如果您发现某些内容错误/空缺,请勇于修正/添加!参与进来其实很容易!点这里 加入少前百科。 ◆有任何意见、建议、纠错,欢迎在 GFwiki:反馈与建议 提出和讨论。编辑事务讨论QQ群:597764980,微博@GFwiki少前百科 ◆To foreigners,You can use twitter to contact us. |
“Widget:Tdollquery2”的版本间的差异
Mikumikuer(讨论 | 贡献) |
小 (人形头像使用相对路径) |
||
(未显示2个用户的41个中间版本) | |||
第1行: | 第1行: | ||
<includeonly><style type="text/css"> | <includeonly><style type="text/css"> | ||
+ | .skin-minerva #TDollQuery {font-size: 0.9em;margin: 15px 0 !important;} | ||
/* 紧凑模式 */ | /* 紧凑模式 */ | ||
table#Tdolltable.cardMode > tbody { | table#Tdolltable.cardMode > tbody { | ||
第7行: | 第8行: | ||
align-content: center; | align-content: center; | ||
justify-content: flex-start; | justify-content: flex-start; | ||
− | align-items: | + | align-items: stretch; |
background:transparent; | background:transparent; | ||
width:100%; | width:100%; | ||
第13行: | 第14行: | ||
table#Tdolltable.cardMode thead {display:none} | table#Tdolltable.cardMode thead {display:none} | ||
table#Tdolltable.cardMode > tbody > tr { | table#Tdolltable.cardMode > tbody > tr { | ||
− | flex: 1 1 | + | flex: 1 1 310px; |
grid-template-columns: 16.6% 16.6% 16.6% 16.6% 16.6% 1fr; | grid-template-columns: 16.6% 16.6% 16.6% 16.6% 16.6% 1fr; | ||
grid-template-rows: initial; | grid-template-rows: initial; | ||
第23行: | 第24行: | ||
margin: 2px; | margin: 2px; | ||
padding: 1px; | padding: 1px; | ||
− | border: | + | border: 2px double; |
− | min-width: | + | border-image: url(/images/vectorize_border/BORDER_BIG.svg); |
+ | border-image-slice: 10 fill; | ||
+ | border-image-width: 10px; | ||
+ | background-clip: content-box; | ||
+ | min-width:290px; | ||
} | } | ||
table#Tdolltable.cardMode > tbody > tr > td { | table#Tdolltable.cardMode > tbody > tr > td { | ||
− | |||
margin:1px; | margin:1px; | ||
border-width:0px !important; | border-width:0px !important; | ||
第68行: | 第72行: | ||
table#Tdolltable.cardMode > tbody > tr > td:nth-child(10) {grid-column: auto/span 1;} | table#Tdolltable.cardMode > tbody > tr > td:nth-child(10) {grid-column: auto/span 1;} | ||
table#Tdolltable.cardMode > tbody > tr > td:nth-child(10)::before {content:"护甲\A";white-space:pre;font-weight:bold;color:#f4c430} | table#Tdolltable.cardMode > tbody > tr > td:nth-child(10)::before {content:"护甲\A";white-space:pre;font-weight:bold;color:#f4c430} | ||
− | table#Tdolltable | + | table#Tdolltable > tbody > tr > td:nth-child(10):empty::after {content:"N/A"} |
table#Tdolltable.cardMode > tbody > tr > td:nth-child(11) {grid-column: auto/span 2;} | table#Tdolltable.cardMode > tbody > tr > td:nth-child(11) {grid-column: auto/span 2;} | ||
第76行: | 第80行: | ||
table#Tdolltable.cardMode > tbody > tr > td:nth-child(12) div {margin:4px} | table#Tdolltable.cardMode > tbody > tr > td:nth-child(12) div {margin:4px} | ||
− | table#Tdolltable.cardMode > tbody > tr > td:nth-child(13) {grid-column: auto/span 6;min-height: 4rem;} | + | table#Tdolltable.cardMode > tbody > tr > td:nth-child(13) {grid-column: auto/span 6;min-height: 4rem;background-image: linear-gradient(315deg,transparent 4px, rgba(119,119,119,0.33) 5px);background-color: transparent !important;} |
table#Tdolltable.cardMode > tbody > tr > td:nth-child(13)::before {content:"获得方式\A";white-space:pre;font-weight:bold;color:#f4c430} | table#Tdolltable.cardMode > tbody > tr > td:nth-child(13)::before {content:"获得方式\A";white-space:pre;font-weight:bold;color:#f4c430} | ||
第220行: | 第224行: | ||
overflow: hidden; | overflow: hidden; | ||
transition: all 0.1s ease-in; | transition: all 0.1s ease-in; | ||
− | grid-template-columns: 1fr 60px; | + | grid-template-columns: 1fr 75px 60px; |
+ | grid-column-gap:0.2rem; | ||
margin: 0.5rem 0; | margin: 0.5rem 0; | ||
height: 30px; | height: 30px; | ||
第247行: | 第252行: | ||
#miniTdolltable div.TDavatar {width:20%;height:20%} | #miniTdolltable div.TDavatar {width:20%;height:20%} | ||
} | } | ||
− | #Tdolltable > tbody > tr > td.tiles >div {display: grid;grid-template-columns: 50% 1fr;width: 100%;} | + | #Tdolltable > tbody > tr > td.tiles >div {display: grid;grid-template-columns: 50% 1fr;width: 100%;word-break: keep-all;} |
td.tiles table { | td.tiles table { | ||
margin:auto; | margin:auto; | ||
第462行: | 第467行: | ||
<label for="nonDGMindupgraded"><input type="checkbox" id="nonDGMindupgraded" class="filter_item" /><div>普通人形</div></label> | <label for="nonDGMindupgraded"><input type="checkbox" id="nonDGMindupgraded" class="filter_item" /><div>普通人形</div></label> | ||
</div> | </div> | ||
− | <div id="TDollQuery"><input type="text" placeholder="输入枪名" id="inputQuery"/><button type="button" onclick=" | + | <div id="TDollQuery"><input type="text" placeholder="输入枪名" id="inputQuery"/><button title="输入【t:HHMM】,只输入小时与分钟,无需空格" type="button" onclick="focusTime()">搜索时间</button><button id="clearInput" type="button">清除</button></div> |
<div > | <div > | ||
<div style="float:right;clear: right;"> | <div style="float:right;clear: right;"> | ||
第487行: | 第492行: | ||
<label><input type="radio" id="sortProtime" name="sort"><div>建造时间</div></label> | <label><input type="radio" id="sortProtime" name="sort"><div>建造时间</div></label> | ||
</div> | </div> | ||
− | <div id="page-info-div" style="display: block;position: relative;"><a | + | <div id="page-info-div" style="display: block;position: relative;"><a class="PrevPage" href="javascript:void(0);" style="visibility: hidden;float: left;">◀上一页</a> |
− | <span id="per-page-span">每页<select | + | <span id="per-page-span">每页<select class="per-page" style="background: white;"><option>50</option><option>100</option><option>200</option><option>500</option></select></span> |
− | <span | + | <span class="resultBox" style="position: absolute;width: 100%;text-align: center;left: 0px;pointer-events: none;">数据载入中,请稍后</span> |
− | <span style="position:absolute;right:16%;">第<select | + | <span style="position:absolute;right:16%;">第<select class="cur-page" style="background: white;"></select>页</span> |
− | <a | + | <a class="NextPage" href="javascript:void(0);" style="visibility: visible;float: right;">下一页▶</a></div> |
<div id="position-marker"></div> | <div id="position-marker"></div> | ||
+ | <div id="page-info-div" style="display: block;position: relative;"><a class="PrevPage" href="javascript:void(0);" style="visibility: hidden;float: left;">◀上一页</a> | ||
+ | <span id="per-page-span">每页<select class="per-page" style="background: white;"><option>50</option><option>100</option><option>200</option><option>500</option></select></span> | ||
+ | <span class="resultBox" style="position: absolute;width: 100%;text-align: center;left: 0px;pointer-events: none;">数据载入中,请稍后</span> | ||
+ | <span style="position:absolute;right:16%;">第<select class="cur-page" style="background: white;"></select>页</span> | ||
+ | <a class="NextPage" href="javascript:void(0);" style="visibility: visible;float: right;">下一页▶</a></div> | ||
</div><BR><script type="text/javascript">(window.RLQ=window.RLQ||[]).push(function(){ | </div><BR><script type="text/javascript">(window.RLQ=window.RLQ||[]).push(function(){ | ||
window.DollsData = new Array; $(".dolldata").each( function (index, element){ var o = new Object(); for (var k in element.dataset){ if(k!="artist"){o[k] = element.dataset[k]} } window.DollsData.push(o); element.remove(); })//获取数据 | window.DollsData = new Array; $(".dolldata").each( function (index, element){ var o = new Object(); for (var k in element.dataset){ if(k!="artist"){o[k] = element.dataset[k]} } window.DollsData.push(o); element.remove(); })//获取数据 | ||
− | |||
− | |||
var pushlist=new Array(); | var pushlist=new Array(); | ||
第507行: | 第515行: | ||
var inputer = document.getElementById("buttonContainer").getElementsByTagName("input") | var inputer = document.getElementById("buttonContainer").getElementsByTagName("input") | ||
var baseurl = "\/w\/TDL" | var baseurl = "\/w\/TDL" | ||
+ | |||
+ | const typeIcons = {'手枪': 'd/dd', '冲锋枪': 'b/b4', '步枪': '2/25', '突击步枪': 'b/b5', '机枪': 'b/b4', '霰弹枪': '9/99'}; | ||
var debounce = function(idle, action){ //去抖函数 文本框使用 | var debounce = function(idle, action){ //去抖函数 文本框使用 | ||
第605行: | 第615行: | ||
};} | };} | ||
var pages; | var pages; | ||
− | switch($(' | + | switch($('.per-page')[0].selectedIndex){ |
case 0:pages = Math.ceil(pushlist.length/50);break; | case 0:pages = Math.ceil(pushlist.length/50);break; | ||
case 1:pages = Math.ceil(pushlist.length/100);break; | case 1:pages = Math.ceil(pushlist.length/100);break; | ||
第611行: | 第621行: | ||
case 3:pages = Math.ceil(pushlist.length/500);break; | case 3:pages = Math.ceil(pushlist.length/500);break; | ||
} | } | ||
− | if (pages == 1) {$(" | + | if (pages == 1) {$(".PrevPage,.NextPage").css('visibility',"hidden")}else{$(".PrevPage").css('visibility',"hidden");$(".NextPage").css('visibility',"visible")} |
− | if(pages != 0){$(" | + | if(pages != 0){$(".cur-page option").remove();for (var i = 0; i < pages; i++) {$('.cur-page').append(`\<option\>${i+1}\<\/option\>`)};}else{$(".cur-page option").remove();$('.cur-page').append(`\<option\>1\<\/option\>`);} |
− | $(' | + | // $('.cur-page option')[0].selected = true; |
− | + | let opts = $('.cur-page option'); let len = opts.length; opts[0].selected = true; opts[len/2].selected = true; | |
+ | $(".resultBox").text(`共${pushlist.length}个`); | ||
if (pushlist.length == 0) {$("#position-marker").html(emptydiv);return pushlist} | if (pushlist.length == 0) {$("#position-marker").html(emptydiv);return pushlist} | ||
page_switch(); | page_switch(); | ||
第625行: | 第636行: | ||
var splitList = new Array(); | var splitList = new Array(); | ||
var len; | var len; | ||
− | switch($(' | + | switch($('.per-page')[0].selectedIndex){ |
case 0:len=50;break; | case 0:len=50;break; | ||
case 1:len=100;break; | case 1:len=100;break; | ||
第631行: | 第642行: | ||
case 3:len=500;break; | case 3:len=500;break; | ||
} | } | ||
− | var cPage = $(" | + | var cPage = $(".cur-page")[0].selectedIndex; |
for (var i = 0; i < len; i++) { | for (var i = 0; i < len; i++) { | ||
if(!pushlist[i+cPage*len]){break}else{splitList.push(pushlist[i+cPage*len])} | if(!pushlist[i+cPage*len]){break}else{splitList.push(pushlist[i+cPage*len])} | ||
第640行: | 第651行: | ||
function change_page(obj){ | function change_page(obj){ | ||
− | var cSel = $(" | + | var cSel = $(".cur-page")[0].selectedIndex; |
− | if(obj. | + | if(obj.className=="NextPage"){cSel++}else if(obj.className=="PrevPage"){cSel--} |
− | $(" | + | let len = $(".cur-page option").length; |
− | + | $(".cur-page option")[cSel].selected = true; | |
+ | $(".cur-page option")[cSel+len/2].selected = true; | ||
+ | var cLen = len/2-1; | ||
switch(cSel){ | switch(cSel){ | ||
− | case 0:$(" | + | case 0:$(".PrevPage").css('visibility',"hidden");$(".NextPage").css('visibility',"visible");break; |
− | case cLen:$(" | + | case cLen:$(".PrevPage").css('visibility',"visible");$(".NextPage").css('visibility',"hidden");break; |
− | default:$(" | + | default:$(".PrevPage,.NextPage").css('visibility',"visible");break; |
} | } | ||
page_switch(); | page_switch(); | ||
} | } | ||
− | $(" | + | $(".PrevPage,.NextPage").on("click",function(){change_page(this)}); |
− | $(" | + | $(".cur-page").on("change",function(){$(".cur-page").prop("selectedIndex", this.selectedIndex);change_page(this)}); |
− | $(" | + | $(".per-page").on("change",function(){$(".per-page").prop("selectedIndex", this.selectedIndex);apply_filter()}); |
function debug_marker(key,data){ | function debug_marker(key,data){ | ||
第703行: | 第716行: | ||
if (ministat.checked==true){//小图标模式 | if (ministat.checked==true){//小图标模式 | ||
for (var i in pushdata) { | for (var i in pushdata) { | ||
+ | let avatarurl = new URL(pushdata[i][mod_key('avatar', pushdata[i])]); | ||
if(mod_key("mod",pushdata[i])){var url_hash = pushdata[i].url+"#MOD3"}else{var url_hash = pushdata[i].url} | if(mod_key("mod",pushdata[i])){var url_hash = pushdata[i].url+"#MOD3"}else{var url_hash = pushdata[i].url} | ||
− | var line = `\<div class\="TDavatar rare${pushdata[i][mod_key("rarity",pushdata[i])]}" style=""\>\<a href\="${url_hash}" title="${pushdata[i].nameIngame}"\>\<img alt="${pushdata[i].nameIngame}" src="${ | + | var line = `\<div class\="TDavatar rare${pushdata[i][mod_key("rarity",pushdata[i])]}" style=""\>\<a href\="${url_hash}" title="${pushdata[i].nameIngame}"\>\<img alt="${pushdata[i].nameIngame}" src="${avatarurl.pathname}" width="100" height="100" \>\<\/a\>\<\/div\>` |
htmlLine += line; | htmlLine += line; | ||
} | } | ||
第710行: | 第724行: | ||
} else {// 表格模式 | } else {// 表格模式 | ||
for (var i in pushdata) { | for (var i in pushdata) { | ||
+ | let avatarurl = new URL(pushdata[i][mod_key('avatar', pushdata[i])]); | ||
if(mod_key("mod",pushdata[i])){var tileCond = tileDiff(pushdata[i])}else{var tileCond = pushdata[i].tiles.split(",")}; | if(mod_key("mod",pushdata[i])){var tileCond = tileDiff(pushdata[i])}else{var tileCond = pushdata[i].tiles.split(",")}; | ||
if(!pushdata[i].tileEffect2){var tile_effects = `${pushdata[i].tileEffect1} \+${pushdata[i][mod_key("Effect1",pushdata[i])]}`}else{var tile_effects = `${pushdata[i].tileEffect1} \+${pushdata[i][mod_key("Effect1",pushdata[i])]}<BR>${pushdata[i].tileEffect2} \+${pushdata[i][mod_key("Effect2",pushdata[i])]}`} | if(!pushdata[i].tileEffect2){var tile_effects = `${pushdata[i].tileEffect1} \+${pushdata[i][mod_key("Effect1",pushdata[i])]}`}else{var tile_effects = `${pushdata[i].tileEffect1} \+${pushdata[i][mod_key("Effect1",pushdata[i])]}<BR>${pushdata[i].tileEffect2} \+${pushdata[i][mod_key("Effect2",pushdata[i])]}`} | ||
第716行: | 第731行: | ||
<td>No.${pushdata[i].id}<\/td> | <td>No.${pushdata[i].id}<\/td> | ||
<td><b><a href="${url_hash}" title="${pushdata[i].nameIngame}">${pushdata[i].nameIngame}<\/a><\/b><\/td> | <td><b><a href="${url_hash}" title="${pushdata[i].nameIngame}">${pushdata[i].nameIngame}<\/a><\/b><\/td> | ||
− | <td ${debug_marker("e3",pushdata[i])}><div class="TDavatar rare${pushdata[i][mod_key("rarity",pushdata[i])]}"><a href="${url_hash}" title="${pushdata[i].nameIngame}"><img alt="${pushdata[i].nameIngame}" src="${ | + | <td ${debug_marker("e3",pushdata[i])}><div class="TDavatar rare${pushdata[i][mod_key("rarity",pushdata[i])]}"><a href="${url_hash}" title="${pushdata[i].nameIngame}"><img alt="${pushdata[i].nameIngame}" src="${avatarurl.pathname}" width="100" height="100"><\/a><\/div><\/td> |
− | <td><a href="#${pushdata[i].tdollClass}" title="点击筛选${pushdata[i].type}人形"><img alt="点击筛选${pushdata[i].type}人形" src="${pushdata[i]. | + | <td><a href="#${pushdata[i].tdollClass}" title="点击筛选${pushdata[i].type}人形"><img alt="点击筛选${pushdata[i].type}人形" src="/images/${typeIcons[pushdata[i].type]}/图标-${pushdata[i].type}.png" width="48" height="27"><\/a><br>${pushdata[i].type}<\/td> |
<td ${debug_marker("e5",pushdata[i])}>${pushdata[i][mod_key("Hp",pushdata[i])]}<br>(${pushdata[i][mod_key("Hp",pushdata[i])] * 5})<\/td><td ${debug_marker("e6",pushdata[i])}>${pushdata[i][mod_key("Atk",pushdata[i])]}<\/td><td ${debug_marker("e7",pushdata[i])}>${pushdata[i][mod_key("Rate",pushdata[i])]}<\/td><td ${debug_marker("e8",pushdata[i])}>${pushdata[i][mod_key("Acc",pushdata[i])]}<\/td><td ${debug_marker("e9",pushdata[i])}>${pushdata[i][mod_key("Eva",pushdata[i])]}<\/td><td ${debug_marker("e10",pushdata[i])}>${pushdata[i][mod_key("Armor",pushdata[i])]}<\/td><td ${debug_marker("e11",pushdata[i])}>${pushdata[i].productionTime} | <td ${debug_marker("e5",pushdata[i])}>${pushdata[i][mod_key("Hp",pushdata[i])]}<br>(${pushdata[i][mod_key("Hp",pushdata[i])] * 5})<\/td><td ${debug_marker("e6",pushdata[i])}>${pushdata[i][mod_key("Atk",pushdata[i])]}<\/td><td ${debug_marker("e7",pushdata[i])}>${pushdata[i][mod_key("Rate",pushdata[i])]}<\/td><td ${debug_marker("e8",pushdata[i])}>${pushdata[i][mod_key("Acc",pushdata[i])]}<\/td><td ${debug_marker("e9",pushdata[i])}>${pushdata[i][mod_key("Eva",pushdata[i])]}<\/td><td ${debug_marker("e10",pushdata[i])}>${pushdata[i][mod_key("Armor",pushdata[i])]}<\/td><td ${debug_marker("e11",pushdata[i])}>${pushdata[i].productionTime} | ||
<\/td><td class="tiles" ${debug_marker("e13",pushdata[i])}><div><div>${pushdata[i][mod_key("affect",pushdata[i])]}<br>${tile_effects}<\/div><table class="tilesTable"><tbody> | <\/td><td class="tiles" ${debug_marker("e13",pushdata[i])}><div><div>${pushdata[i][mod_key("affect",pushdata[i])]}<br>${tile_effects}<\/div><table class="tilesTable"><tbody> | ||
第760行: | 第775行: | ||
$('.clearSelect').on("click",function(){clearSelect(this)}); | $('.clearSelect').on("click",function(){clearSelect(this)}); | ||
$('.invertSelect').on("click",function(){invertSelect(this)}); | $('.invertSelect').on("click",function(){invertSelect(this)}); | ||
− | $('#TDollQuery button').on("click",function(){clearItem();apply_filter();}); | + | $('#TDollQuery button#clearInput').on("click",function(){clearItem();apply_filter();}); |
$('#buttonContainer>span>a').on("click",function(){var tilesArea = document.querySelectorAll("#effectarea td");var tilesSelf = document.querySelectorAll("#selfpos td");for(var i in tilesArea){tilesArea[i].className=""};for(var i in tilesSelf){tilesSelf[i].className="active"};clearSelect(this.parentNode)}) | $('#buttonContainer>span>a').on("click",function(){var tilesArea = document.querySelectorAll("#effectarea td");var tilesSelf = document.querySelectorAll("#selfpos td");for(var i in tilesArea){tilesArea[i].className=""};for(var i in tilesSelf){tilesSelf[i].className="active"};clearSelect(this.parentNode)}) | ||
$('#MOD3Data').on("click",function(){rarityDisable(this);apply_filter();}) | $('#MOD3Data').on("click",function(){rarityDisable(this);apply_filter();}) | ||
第779行: | 第794行: | ||
} | } | ||
} | } | ||
− | + | function timeS2S(tStr){return Date.parse("1970-1-1 "+tStr+" GMT")} | |
function text_check(query){ //文本输入框判断(现仅实现判断枪名) | function text_check(query){ //文本输入框判断(现仅实现判断枪名) | ||
if (!inputText){return true}; | if (!inputText){return true}; | ||
− | var a = new RegExp(inputText.value,"i").test(query.nameIngame); | + | var prefet = inputText.value.substr(inputText.value.indexOf("t:")+2,4); |
+ | if(inputText.value.indexOf("t:")==0&&query.productionTime.split(":").length>1&&prefet.length>1){ | ||
+ | var time = prefet+":00"; | ||
+ | time=time.slice(0,time.indexOf(":")-2)+":"+time.slice(time.indexOf(":")-2) | ||
+ | time.indexOf(":")==0?time="0"+time:time; | ||
+ | var a = Math.abs(timeS2S(query.productionTime)-timeS2S(time))<60000; | ||
+ | }else{ | ||
+ | var a = new RegExp(inputText.value,"i").test(query.nameIngame); | ||
+ | } | ||
if (a) { | if (a) { | ||
return true | return true | ||
第1,008行: | 第1,031行: | ||
} | } | ||
− | })</script></includeonly> | + | }) |
+ | function focusTime(){ | ||
+ | var a = document.querySelector("#inputQuery"); | ||
+ | a.value="t:(四位时间)"; | ||
+ | a.focus() | ||
+ | a.setSelectionRange(2, a.value.length) | ||
+ | } | ||
+ | |||
+ | </script></includeonly> |