增加排序功能
This commit is contained in:
parent
665f45039e
commit
ac0d06e1a2
|
|
@ -269,6 +269,15 @@
|
|||
.search-box .include-super-awoken-label::after{
|
||||
content: "Including Super Awoken";
|
||||
}
|
||||
.search-box .sort-div::before{
|
||||
content: "Sort by:";
|
||||
}
|
||||
.search-box .sort-reverse-label::after{
|
||||
content: "Same";
|
||||
}
|
||||
.search-box #sort-reverse:checked+ .sort-reverse-label::after{
|
||||
content: "Reverse";
|
||||
}
|
||||
.attrs .attr-all::before{
|
||||
content: "All";
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,12 @@
|
|||
document.title = `P&D ${teamsCount}P Formation Maker`;
|
||||
document.body.querySelector(".formation-box .title-box .title").placeholder = "Input Formation Title";
|
||||
document.body.querySelector(".formation-box .detail-box .detail").placeholder = "Input Detail";
|
||||
const localTranslating = {
|
||||
webpage_title: `P&D ${teamsCount}P Formation Maker`,
|
||||
title_blank: "Input Formation Title",
|
||||
detail_blank: "Input Detail",
|
||||
sort_name:{
|
||||
sort_none: "Nope",
|
||||
sort_id: "Cards Id",
|
||||
sort_evoRootId: "Cards Evolution Root",
|
||||
},
|
||||
}
|
||||
|
||||
localisation(localTranslating);
|
||||
|
|
@ -262,6 +262,15 @@
|
|||
.search-box .include-super-awoken-label::after{
|
||||
content: "超覚醒を含む";
|
||||
}
|
||||
.search-box .sort-div::before{
|
||||
content: "並べ替え:";
|
||||
}
|
||||
.search-box .sort-reverse-label::after{
|
||||
content: "正序";
|
||||
}
|
||||
.search-box #sort-reverse:checked+ .sort-reverse-label::after{
|
||||
content: "逆序";
|
||||
}
|
||||
.attrs .attr-all::before{
|
||||
content: "無制限";
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,12 @@
|
|||
document.title = `パズル＆ドラゴンズ${teamsCount}人のチーム図作成ツール`;
|
||||
document.body.querySelector(".formation-box .title-box .title").placeholder = "入力タイトル";
|
||||
document.body.querySelector(".formation-box .detail-box .detail").placeholder = "入力詳細";
|
||||
const localTranslating = {
|
||||
webpage_title: `パズル＆ドラゴンズ${teamsCount}人のチーム図作成ツール`,
|
||||
title_blank: "入力タイトル",
|
||||
detail_blank: "入力詳細",
|
||||
sort_name:{
|
||||
sort_none: "Nope",
|
||||
sort_id: "Cards Id",
|
||||
sort_evoRootId: "Cards Evolution Root",
|
||||
},
|
||||
}
|
||||
|
||||
localisation(localTranslating);
|
||||
|
|
@ -262,6 +262,15 @@
|
|||
.search-box .include-super-awoken-label::after{
|
||||
content: "슈퍼 각성 포함";
|
||||
}
|
||||
.search-box .sort-div::before{
|
||||
content: "정렬:";
|
||||
}
|
||||
.search-box .sort-reverse-label::after{
|
||||
content: "양의";
|
||||
}
|
||||
.search-box #sort-reverse:checked+ .sort-reverse-label::after{
|
||||
content: "역순";
|
||||
}
|
||||
.attrs .attr-all::before{
|
||||
content: "무제한";
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,12 @@
|
|||
document.title = `퍼즐앤드래곤 ${teamsCount} 명의 팀 다이어그램 작성 도구`;
|
||||
document.body.querySelector(".formation-box .title-box .title").placeholder = "입력 제목";
|
||||
document.body.querySelector(".formation-box .detail-box .detail").placeholder = "입력 내용";
|
||||
const localTranslating = {
|
||||
webpage_title: `퍼즐앤드래곤 ${teamsCount} 명의 팀 다이어그램 작성 도구`,
|
||||
title_blank: "입력 제목",
|
||||
detail_blank: "입력 내용",
|
||||
sort_name:{
|
||||
sort_none: "Nope",
|
||||
sort_id: "Cards Id",
|
||||
sort_evoRootId: "Cards Evolution Root",
|
||||
},
|
||||
}
|
||||
|
||||
localisation(localTranslating);
|
||||
|
|
@ -1789,7 +1789,7 @@ function parseBigNumber(number)
|
|||
|
||||
|
||||
const searchBox = editBox.querySelector(".search-box");
|
||||
const controlDiv = searchBox.querySelector(".control-div");
|
||||
const controlDiv = searchBox.querySelector(".sawoken-div");
|
||||
let fragment = document.createDocumentFragment();
|
||||
const specialSearch = fragment.appendChild(document.createElement("select"));
|
||||
specialSearchFunctions.forEach((sfunc,idx)=>{
|
||||
|
|
|
|||
|
|
@ -268,6 +268,15 @@
|
|||
.search-box .include-super-awoken-label::after{
|
||||
content: "包括超覺醒";
|
||||
}
|
||||
.search-box .sort-div::before{
|
||||
content: "排序：";
|
||||
}
|
||||
.search-box .sort-reverse-label::after{
|
||||
content: "順序";
|
||||
}
|
||||
.search-box #sort-reverse:checked+ .sort-reverse-label::after{
|
||||
content: "逆序";
|
||||
}
|
||||
.attrs .attr-all::before{
|
||||
content: "不限";
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,12 @@
|
|||
document.title = `龍族拼圖${teamsCount}人隊伍圖製作工具`;
|
||||
document.body.querySelector(".formation-box .title-box .title").placeholder = "輸入隊伍標題";
|
||||
document.body.querySelector(".formation-box .detail-box .detail").placeholder = "輸入說明";
|
||||
const localTranslating = {
|
||||
webpage_title: `龍族拼圖${teamsCount}人隊伍圖製作工具`,
|
||||
title_blank: "輸入隊伍標題",
|
||||
detail_blank: "輸入說明",
|
||||
sort_name:{
|
||||
sort_none: "Nope",
|
||||
sort_id: "Cards Id",
|
||||
sort_evoRootId: "Cards Evolution Root",
|
||||
},
|
||||
}
|
||||
|
||||
localisation(localTranslating);
|
||||
|
|
@ -268,6 +268,15 @@
|
|||
.search-box .include-super-awoken-label::after{
|
||||
content: "包括超觉醒";
|
||||
}
|
||||
.search-box .sort-div::before{
|
||||
content: "排序：";
|
||||
}
|
||||
.search-box .sort-reverse-label::after{
|
||||
content: "顺序";
|
||||
}
|
||||
.search-box #sort-reverse:checked+ .sort-reverse-label::after{
|
||||
content: "逆序";
|
||||
}
|
||||
.attrs .attr-all::before{
|
||||
content: "不限";
|
||||
}
|
||||
|
|
|
|||
63
script.js
63
script.js
|
|
@ -791,6 +791,7 @@ function initialize()
|
|||
cli.appendChild(cdom);
|
||||
changeid({id:id},cdom);
|
||||
cdom.onclick = clickHeadToNewMon;
|
||||
cli.card = Cards[id];
|
||||
return cli;
|
||||
};
|
||||
|
||||
|
|
@ -884,9 +885,10 @@ function initialize()
|
|||
});
|
||||
};
|
||||
|
||||
const searchStart = searchBox.querySelector(".control-div .search-start");
|
||||
const searchClose = searchBox.querySelector(".control-div .search-close");
|
||||
const searchClear = searchBox.querySelector(".control-div .search-clear");
|
||||
const s_controlDiv = searchBox.querySelector(".control-div");
|
||||
const searchStart = s_controlDiv.querySelector(".search-start");
|
||||
const searchClose = s_controlDiv.querySelector(".search-close");
|
||||
const searchClear = s_controlDiv.querySelector(".search-clear");
|
||||
function returnCheckedInput(ipt)
|
||||
{
|
||||
return ipt.checked == true;
|
||||
|
|
@ -910,6 +912,14 @@ function initialize()
|
|||
if (searchArr.length>0)
|
||||
{
|
||||
let fragment = document.createDocumentFragment(); //创建节点用的临时空间
|
||||
|
||||
const sortIndex = parseInt(s_sortList.value,10);
|
||||
const reverse = s_sortReverse.checked;
|
||||
searchArr.sort((card_a,card_b)=>{
|
||||
let sortNumber = sort_function_list[sortIndex].function(card_a,card_b);
|
||||
if (reverse) sortNumber *= -1;
|
||||
return sortNumber;
|
||||
});
|
||||
searchArr.forEach(function(card){
|
||||
const cli = createCardHead(card.id);
|
||||
fragment.appendChild(cli);
|
||||
|
|
@ -993,9 +1003,38 @@ function initialize()
|
|||
s_sawokens.forEach(t=>{
|
||||
t.checked = false;
|
||||
});
|
||||
|
||||
searchMonList.innerHTML = "";
|
||||
};
|
||||
|
||||
const s_sortList = s_controlDiv.querySelector(".sort-list");
|
||||
const s_sortReverse = s_controlDiv.querySelector("#sort-reverse");
|
||||
//对搜索到的Cards重新排序
|
||||
function reSortCards()
|
||||
{
|
||||
const sortIndex = parseInt(s_sortList.value,10);
|
||||
const reverse = s_sortReverse.checked;
|
||||
|
||||
searchMonList.classList.add("display-none");
|
||||
let fragment = document.createDocumentFragment(); //创建节点用的临时空间
|
||||
let headsArray = Array.prototype.slice.call(searchMonList.children);
|
||||
headsArray.sort((head_a,head_b)=>{
|
||||
let sortNumber = sort_function_list[sortIndex].function(head_a.card,head_b.card);
|
||||
if (reverse) sortNumber *= -1;
|
||||
return sortNumber;
|
||||
});
|
||||
headsArray.forEach(h=>fragment.appendChild(h));
|
||||
searchMonList.appendChild(fragment);
|
||||
searchMonList.classList.remove("display-none");
|
||||
}
|
||||
s_sortList.onchange = reSortCards;
|
||||
s_sortReverse.onchange = reSortCards;
|
||||
sort_function_list.forEach((sfunc,idx)=>{
|
||||
const newOpt = new Option(sfunc.name,idx);
|
||||
newOpt.setAttribute("data-tag",sfunc.tag);
|
||||
s_sortList.options.add(newOpt);
|
||||
});
|
||||
|
||||
//id搜索
|
||||
const monstersID = settingBox.querySelector(".row-mon-id .m-id");
|
||||
monstersID.onchange = function(){
|
||||
|
|
@ -2342,3 +2381,21 @@ function refreshMemberSkillCD(teamDom,team,idx){
|
|||
assistSkillCdDom.classList.add("max-skill");
|
||||
}
|
||||
}
|
||||
function localisation($tra)
|
||||
{
|
||||
if (!$tra) return;
|
||||
document.title = $tra.webpage_title;
|
||||
formationBox.querySelector(".title-box .title").placeholder = $tra.title_blank;
|
||||
formationBox.querySelector(".detail-box .detail").placeholder = $tra.detail_blank;
|
||||
|
||||
const s_sortList = editBox.querySelector(".search-box .sort-div .sort-list");
|
||||
const sortOptions = Array.prototype.slice.call(s_sortList.options);
|
||||
sortOptions.forEach(opt=>{
|
||||
const tag = opt.getAttribute("data-tag");
|
||||
const trans = $tra.sort_name[tag];
|
||||
if (trans)
|
||||
{
|
||||
opt.text = trans;
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
@ -9,6 +9,7 @@
|
|||
<link href="style-monsterimages.css" rel="stylesheet" type="text/css">
|
||||
<link id="language-css" href="languages/en.css" rel="stylesheet" type="text/css">
|
||||
<script type="text/javascript" src="languages/language-list.js"></script>
|
||||
<script type="text/javascript" src="json_data.js"></script>
|
||||
<script type="text/javascript" src="universal_function.js"></script>
|
||||
<script type="text/javascript" src="script.js"></script>
|
||||
<script type="text/javascript" src="library/localforage.min.js"></script>
|
||||
|
|
@ -584,11 +585,15 @@ var formation = new Formation(teamsCount,6);
|
|||
<li class="awoken-count"><input type="checkbox" name="types" class="sawoken-check" value="72" id="search-awoken-72" /><label class="awoken-icon awoken-72" for="search-awoken-72"></label></li><!--掉毒-->
|
||||
</ul>
|
||||
</div>
|
||||
<div class="control-div"><!--控制栏，排序方式暂时不做-->
|
||||
<div class="control-div"><!--控制栏-->
|
||||
<button class="search-start"><!--开始搜索--></button>
|
||||
<button class="search-close"><!--关闭搜索--></button>
|
||||
<button class="search-clear"><!--清空搜索条件--></button>
|
||||
<input type="checkbox" name="can-assist" class="config-checkbox-ipt" id="can-assist"><label class="config-checkbox-lbl can-assist-label" for="can-assist"><div class="config-checkbox-lbl-cicle"></div></label>
|
||||
<div class="sort-div">
|
||||
<select class="sort-list"></select>
|
||||
<input type="checkbox" name="sort-reverse" class="config-checkbox-ipt" id="sort-reverse"><label class="config-checkbox-lbl sort-reverse-label" for="sort-reverse"><div class="config-checkbox-lbl-cicle"></div></label>
|
||||
</div><!--排序栏-->
|
||||
</div>
|
||||
<ul class="search-mon-list"></ul><!--搜索结果的显示列表-->
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,29 +1,4 @@
|
|||
//类型允许的潜觉杀，前面的数字是官方数据的类型编号，后面的杀是自己做的图片中的潜觉序号
|
||||
const type_allowable_latent = {
|
||||
"0":[], //0进化
|
||||
"12":[], //12觉醒
|
||||
"14":[], //14强化
|
||||
"15":[], //15卖钱
|
||||
"9":[],//特殊保护
|
||||
"1":[17,18,19,20,21,22,23,24], //1平衡
|
||||
"2":[20,24],//2体力
|
||||
"3":[18,22],//3回复
|
||||
"4":[20,24],//4龙
|
||||
"5":[19],//5神
|
||||
"6":[19,23],//6攻击
|
||||
"7":[17],//7恶魔
|
||||
"8":[17,20,21,24],//8机械
|
||||
};
|
||||
//等效觉醒列表
|
||||
const equivalent_awoken = [
|
||||
{small:10,big:52,times:2}, //防封
|
||||
{small:11,big:68,times:5}, //防暗
|
||||
{small:12,big:69,times:5}, //防废
|
||||
{small:13,big:70,times:5}, //防毒
|
||||
{small:19,big:53,times:2}, //手指
|
||||
{small:21,big:56,times:2}, //SB
|
||||
];
|
||||
//仿GM_xmlhttpRequest函数v1.3
|
||||
//仿GM_xmlhttpRequest函数v1.3
|
||||
const GM_xmlhttpRequest = function(GM_param) {
|
||||
const xhr = new XMLHttpRequest(); //创建XMLHttpRequest对象
|
||||
xhr.open(GM_param.method, GM_param.url, true);
|
||||
|
|
|
|||
Loading…
Reference in New Issue