增加稀有度的搜索,并解觉图鉴模式不能得到能力值的问题
This commit is contained in:
parent
f19fa62873
commit
d36b67e8f9
|
@ -342,6 +342,9 @@
|
|||
.search-box .types-div::before{
|
||||
content: "Type:";
|
||||
}
|
||||
.search-box .rare-div::before{
|
||||
content: "Rarity (OR):";
|
||||
}
|
||||
.search-box .awoken-div::before{
|
||||
content: "▼Awoken (AND) (Tips: Click on number to reduce value)";
|
||||
}
|
||||
|
|
|
@ -334,6 +334,9 @@
|
|||
.search-box .types-div::before{
|
||||
content: "タイプ:";
|
||||
}
|
||||
.search-box .rare-div::before{
|
||||
content: "希少性(OR):";
|
||||
}
|
||||
.search-box .awoken-div::before{
|
||||
content: "▼覚醒(AND)(しえ:数値をクリックすると数値が減少します)";
|
||||
}
|
||||
|
|
|
@ -331,6 +331,9 @@
|
|||
.search-box .types-div::before{
|
||||
content: "형식:";
|
||||
}
|
||||
.search-box .rare-div::before{
|
||||
content: "희귀(OR):";
|
||||
}
|
||||
.search-box .awoken-div::before{
|
||||
content: "▼각성(AND)(번째:숫자를 누르면 숫자가 낮아집니다)";
|
||||
}
|
||||
|
|
|
@ -337,6 +337,9 @@
|
|||
.search-box .types-div::before{
|
||||
content: "類型:";
|
||||
}
|
||||
.search-box .rare-div::before{
|
||||
content: "稀有(OR):";
|
||||
}
|
||||
.search-box .awoken-div::before{
|
||||
content: "▼覺醒(AND)(提示:點擊數字可減少數值)";
|
||||
}
|
||||
|
|
|
@ -337,6 +337,9 @@
|
|||
.search-box .types-div::before{
|
||||
content: "类型:";
|
||||
}
|
||||
.search-box .rare-div::before{
|
||||
content: "稀有(OR):";
|
||||
}
|
||||
.search-box .awoken-div::before{
|
||||
content: "▼觉醒(AND)(提示:点击数字可减少数值)";
|
||||
}
|
||||
|
|
14
multi.html
14
multi.html
|
@ -498,6 +498,20 @@ var formation = new Formation(teamsCount,5);
|
|||
<li class="latent-icon" data-latent-icon="27"></li><!--回复杀-->
|
||||
</ul>
|
||||
</div>
|
||||
<div class="rare-div"><!--稀有星级-->
|
||||
<ul class="rare-list">
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="1" id="search-rare-1" /><label class="rare-icon" data-rare-icon="1" for="search-rare-1"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="2" id="search-rare-2" /><label class="rare-icon" data-rare-icon="2" for="search-rare-2"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="3" id="search-rare-3" /><label class="rare-icon" data-rare-icon="3" for="search-rare-3"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="4" id="search-rare-4" /><label class="rare-icon" data-rare-icon="4" for="search-rare-4"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="5" id="search-rare-5" /><label class="rare-icon" data-rare-icon="5" for="search-rare-5"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="6" id="search-rare-6" /><label class="rare-icon" data-rare-icon="6" for="search-rare-6"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="7" id="search-rare-7" /><label class="rare-icon" data-rare-icon="7" for="search-rare-7"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="8" id="search-rare-8" /><label class="rare-icon" data-rare-icon="8" for="search-rare-8"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="9" id="search-rare-9" /><label class="rare-icon" data-rare-icon="9" for="search-rare-9"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="10" id="search-rare-10" /><label class="rare-icon" data-rare-icon="10" for="search-rare-10"></label></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="awoken-div"><!--觉醒-->
|
||||
<button class="awoken-clear"></button>
|
||||
<div class="awoken-option">
|
||||
|
|
|
@ -389,7 +389,7 @@ function calculateAbility_max(id,solo, teamsCount)
|
|||
}
|
||||
}
|
||||
//搜索卡片用
|
||||
function searchCards(cards,attr1,attr2,fixMainColor,types,typeAndOr,awokens,sawokens,equalAk,incSawoken)
|
||||
function searchCards(cards,attr1,attr2,fixMainColor,types,typeAndOr,rares,awokens,sawokens,equalAk,incSawoken)
|
||||
{
|
||||
let cardsRange = cards.concat(); //这里需要复制一份原来的数组,不然若无筛选,后面的排序会改变初始Cards
|
||||
//属性
|
||||
|
@ -425,6 +425,11 @@ function searchCards(cards,attr1,attr2,fixMainColor,types,typeAndOr,awokens,sawo
|
|||
types.some(t=>c.types.includes(t)) //只需要满足一个type
|
||||
);
|
||||
}
|
||||
//稀有度
|
||||
if (rares.length>0)
|
||||
{
|
||||
cardsRange = cardsRange.filter(c=>rares.includes(c.rarity));
|
||||
}
|
||||
//觉醒
|
||||
//等效觉醒时,事先去除大觉醒
|
||||
if (equalAk)
|
||||
|
|
58
script.js
58
script.js
|
@ -1093,39 +1093,34 @@ function initialize() {
|
|||
const s_attr2s = Array.from(searchBox.querySelectorAll(".attrs-div .attr-list-2 .attr-radio"));
|
||||
const s_fixMainColor = searchBox.querySelector("#fix-main-color");
|
||||
const s_typesDiv = searchBox.querySelector(".types-div");
|
||||
const s_types = Array.from(s_typesDiv.querySelectorAll(".type-check"));
|
||||
const s_typeAndOr = s_typesDiv.querySelector("#type-and-or");
|
||||
const s_typesUl = s_typesDiv.querySelector(".type-list");
|
||||
const s_typesLi = Array.from(s_typesUl.querySelectorAll("li"));
|
||||
const s_typesCheckBox = s_typesLi.map(li=>li.querySelector(".type-check"));
|
||||
s_typesCheckBox.forEach(checkBox=>
|
||||
{
|
||||
checkBox.onchange = function(){
|
||||
const newClassName = `type-killer-${this.value}`;
|
||||
if (this.checked && s_typeAndOr.checked) //and的时候才生效
|
||||
s_typesUl.classList.add(newClassName);
|
||||
else
|
||||
s_typesUl.classList.remove(newClassName);
|
||||
}
|
||||
}
|
||||
);
|
||||
const s_types = s_typesLi.map(li=>li.querySelector(".type-check")); //checkbox集合
|
||||
|
||||
function s_types_onchange(){
|
||||
const newClassName = `type-killer-${this.value}`;
|
||||
if (this.checked && s_typeAndOr.checked) //and的时候才生效
|
||||
s_typesUl.classList.add(newClassName);
|
||||
else
|
||||
s_typesUl.classList.remove(newClassName);
|
||||
}
|
||||
s_types.forEach(checkBox=>checkBox.onchange = s_types_onchange);
|
||||
|
||||
const s_types_latentUl = s_typesDiv.querySelector(".latent-list");
|
||||
const s_types_latentli = Array.from(s_types_latentUl.querySelectorAll("li"));
|
||||
s_types_latentli.forEach(latent=>
|
||||
{
|
||||
latent.onclick = function(){
|
||||
const latenttype = parseInt(this.getAttribute("data-latent-icon"));
|
||||
const killerTypes = typekiller_for_type.filter(o=>o.allowableLatent.includes(latenttype)).map(o=>o.type);
|
||||
s_typesCheckBox.forEach(checkbox=>{
|
||||
const type = parseInt(checkbox.value);
|
||||
checkbox.checked = killerTypes.includes(type);
|
||||
});
|
||||
};
|
||||
});
|
||||
function s_types_latentli_onclick(){
|
||||
const latenttype = parseInt(this.getAttribute("data-latent-icon"));
|
||||
const killerTypes = typekiller_for_type.filter(o=>o.allowableLatent.includes(latenttype)).map(o=>o.type);
|
||||
s_types.forEach(checkbox=>{
|
||||
const type = parseInt(checkbox.value);
|
||||
checkbox.checked = killerTypes.includes(type);
|
||||
});
|
||||
}
|
||||
s_types_latentli.forEach(latent=>latent.onclick = s_types_latentli_onclick);
|
||||
|
||||
s_typeAndOr.onchange = function(){
|
||||
s_typesCheckBox.forEach(checkBox=>checkBox.onchange());
|
||||
s_types.forEach(checkBox=>checkBox.onchange());
|
||||
if (this.checked)
|
||||
s_types_latentUl.classList.add(className_displayNone);
|
||||
else
|
||||
|
@ -1133,6 +1128,12 @@ function initialize() {
|
|||
};
|
||||
s_typeAndOr.onchange();
|
||||
|
||||
//稀有度筛选
|
||||
const s_rareDiv = searchBox.querySelector(".rare-div");
|
||||
const s_rareUl = s_rareDiv.querySelector(".rare-list");
|
||||
const s_rareLi = Array.from(s_rareUl.querySelectorAll("li"));
|
||||
const s_rare = s_rareLi.map(li=>li.querySelector(".rare-check")); //checkbox集合
|
||||
|
||||
const s_awokensItems = Array.from(searchBox.querySelectorAll(".awoken-div .awoken-count"));
|
||||
const s_awokensIcons = s_awokensItems.map(it => it.querySelector(".awoken-icon"));
|
||||
const s_awokensCounts = s_awokensItems.map(it => it.querySelector(".count"));
|
||||
|
@ -1288,6 +1289,7 @@ function initialize() {
|
|||
}
|
||||
}
|
||||
const typesFilter = s_types.filter(returnCheckedInput).map(returnInputValue).map(Str2Int);
|
||||
const rareFilter = s_rare.filter(returnCheckedInput).map(returnInputValue).map(Str2Int);
|
||||
const sawokensFilter = s_sawokens.filter(returnCheckedInput).map(returnInputValue).map(Str2Int);
|
||||
const awokensFilter = s_awokensCounts.filter(btn => parseInt(btn.value, 10) > 0).map(btn => {
|
||||
const awokenIndex = parseInt(btn.parentNode.parentNode.querySelector(".awoken-icon").getAttribute("data-awoken-icon"), 10);
|
||||
|
@ -1298,6 +1300,7 @@ function initialize() {
|
|||
s_fixMainColor.checked,
|
||||
typesFilter,
|
||||
s_typeAndOr.checked,
|
||||
rareFilter,
|
||||
awokensFilter,
|
||||
sawokensFilter,
|
||||
s_awokensEquivalent.checked,
|
||||
|
@ -1319,6 +1322,9 @@ function initialize() {
|
|||
s_types.forEach(t => {
|
||||
t.checked = false;
|
||||
});
|
||||
s_rare.forEach(t => {
|
||||
t.checked = false;
|
||||
});
|
||||
s_typeAndOr.onchange();
|
||||
s_awokensCounts.forEach(t => {
|
||||
t.value = 0;
|
||||
|
@ -1594,7 +1600,7 @@ function initialize() {
|
|||
|
||||
//编辑界面重新计算怪物的能力
|
||||
function reCalculateAbility() {
|
||||
const monid = parseInt(monstersID.value || 0, 10);
|
||||
const monid = editBox.mid;
|
||||
const level = parseInt(monEditLv.value || 0, 10);
|
||||
|
||||
const mAwokenNumIpt = monEditAwokensRow.querySelector("input[name='awoken-number']:checked");
|
||||
|
|
14
solo.html
14
solo.html
|
@ -448,6 +448,20 @@ var formation = new Formation(teamsCount,6);
|
|||
<li class="latent-icon" data-latent-icon="27"></li><!--回复杀-->
|
||||
</ul>
|
||||
</div>
|
||||
<div class="rare-div"><!--稀有星级-->
|
||||
<ul class="rare-list">
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="1" id="search-rare-1" /><label class="rare-icon" data-rare-icon="1" for="search-rare-1"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="2" id="search-rare-2" /><label class="rare-icon" data-rare-icon="2" for="search-rare-2"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="3" id="search-rare-3" /><label class="rare-icon" data-rare-icon="3" for="search-rare-3"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="4" id="search-rare-4" /><label class="rare-icon" data-rare-icon="4" for="search-rare-4"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="5" id="search-rare-5" /><label class="rare-icon" data-rare-icon="5" for="search-rare-5"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="6" id="search-rare-6" /><label class="rare-icon" data-rare-icon="6" for="search-rare-6"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="7" id="search-rare-7" /><label class="rare-icon" data-rare-icon="7" for="search-rare-7"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="8" id="search-rare-8" /><label class="rare-icon" data-rare-icon="8" for="search-rare-8"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="9" id="search-rare-9" /><label class="rare-icon" data-rare-icon="9" for="search-rare-9"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="10" id="search-rare-10" /><label class="rare-icon" data-rare-icon="10" for="search-rare-10"></label></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="awoken-div"><!--觉醒-->
|
||||
<button class="awoken-clear"></button>
|
||||
<div class="awoken-option">
|
||||
|
|
88
style.css
88
style.css
|
@ -952,7 +952,11 @@ ul{
|
|||
.search-box .attrs-div-div .fix-main-color-label::after{
|
||||
content: "限制属性1为主属性,属性2为副属性";
|
||||
}*/
|
||||
.attr-radio,.type-check,.sawoken-check{
|
||||
.attr-radio,
|
||||
.type-check,
|
||||
.rare-check,
|
||||
.sawoken-check
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
.attrs-div .attr-list{
|
||||
|
@ -993,14 +997,19 @@ ul{
|
|||
/*.search-box .types-div::before{
|
||||
content: "类型";
|
||||
}*/
|
||||
.types-div .type-list
|
||||
.types-div .type-list,
|
||||
.rare-div .rare-list
|
||||
{
|
||||
display: inline-block;
|
||||
}
|
||||
.types-div .type-list>li label{
|
||||
.types-div .type-list input~label,
|
||||
.rare-div .rare-list input~label
|
||||
{
|
||||
opacity: var(--search-icon-unchecked);
|
||||
}
|
||||
.types-div .type-list input:checked~label{
|
||||
.types-div .type-list input:checked~label,
|
||||
.rare-div .rare-list input:checked~label
|
||||
{
|
||||
opacity: 1;
|
||||
}
|
||||
.types-div .type-and-or-label{
|
||||
|
@ -1021,6 +1030,7 @@ ul{
|
|||
display: none;
|
||||
pointer-events:none;
|
||||
}
|
||||
/*不同type允许的杀*/
|
||||
.types-div .type-list.type-killer-5 li[data-type-icon="7"]:after,
|
||||
.types-div .type-list.type-killer-4 li[data-type-icon="8"]:after,
|
||||
.types-div .type-list.type-killer-4 li[data-type-icon="3"]:after,
|
||||
|
@ -1056,6 +1066,76 @@ ul{
|
|||
margin-top: -3px;
|
||||
margin-bottom: -5px;
|
||||
}
|
||||
.rare-div .rare-icon
|
||||
{
|
||||
font-family: var(--game-font-family);
|
||||
color: white;
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
box-sizing: border-box;
|
||||
line-height: 26px;
|
||||
position: relative;
|
||||
}
|
||||
.rare-div .rare-icon::before
|
||||
{
|
||||
content: "★";
|
||||
color: gold;
|
||||
text-shadow: goldenrod 0 0 2px;
|
||||
position: absolute;
|
||||
font-size: 26px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
.rare-div .rare-icon::after
|
||||
{
|
||||
color: white;
|
||||
text-shadow: black 0 0 4px;
|
||||
font-size: 18px;
|
||||
position: relative;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
.rare-icon[data-rare-icon="1"]::after
|
||||
{
|
||||
content: "1";
|
||||
}
|
||||
.rare-icon[data-rare-icon="2"]::after
|
||||
{
|
||||
content: "2";
|
||||
}
|
||||
.rare-icon[data-rare-icon="3"]::after
|
||||
{
|
||||
content: "3";
|
||||
}
|
||||
.rare-icon[data-rare-icon="4"]::after
|
||||
{
|
||||
content: "4";
|
||||
}
|
||||
.rare-icon[data-rare-icon="5"]::after
|
||||
{
|
||||
content: "5";
|
||||
}
|
||||
.rare-icon[data-rare-icon="6"]::after
|
||||
{
|
||||
content: "6";
|
||||
}
|
||||
.rare-icon[data-rare-icon="7"]::after
|
||||
{
|
||||
content: "7";
|
||||
}
|
||||
.rare-icon[data-rare-icon="8"]::after
|
||||
{
|
||||
content: "8";
|
||||
}
|
||||
.rare-icon[data-rare-icon="9"]::after
|
||||
{
|
||||
content: "9";
|
||||
}
|
||||
.rare-icon[data-rare-icon="10"]::after
|
||||
{
|
||||
content: "10";
|
||||
}
|
||||
|
||||
/*.search-box .awoken-div::before{
|
||||
content: "觉醒";
|
||||
}*/
|
||||
|
|
14
triple.html
14
triple.html
|
@ -1143,6 +1143,20 @@ var formation = new Formation(teamsCount,6);
|
|||
<li class="latent-icon" data-latent-icon="27"></li><!--回复杀-->
|
||||
</ul>
|
||||
</div>
|
||||
<div class="rare-div"><!--稀有星级-->
|
||||
<ul class="rare-list">
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="1" id="search-rare-1" /><label class="rare-icon" data-rare-icon="1" for="search-rare-1"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="2" id="search-rare-2" /><label class="rare-icon" data-rare-icon="2" for="search-rare-2"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="3" id="search-rare-3" /><label class="rare-icon" data-rare-icon="3" for="search-rare-3"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="4" id="search-rare-4" /><label class="rare-icon" data-rare-icon="4" for="search-rare-4"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="5" id="search-rare-5" /><label class="rare-icon" data-rare-icon="5" for="search-rare-5"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="6" id="search-rare-6" /><label class="rare-icon" data-rare-icon="6" for="search-rare-6"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="7" id="search-rare-7" /><label class="rare-icon" data-rare-icon="7" for="search-rare-7"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="8" id="search-rare-8" /><label class="rare-icon" data-rare-icon="8" for="search-rare-8"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="9" id="search-rare-9" /><label class="rare-icon" data-rare-icon="9" for="search-rare-9"></label></li>
|
||||
<li><input type="checkbox" class="rare-check" name="rare" value="10" id="search-rare-10" /><label class="rare-icon" data-rare-icon="10" for="search-rare-10"></label></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="awoken-div"><!--觉醒-->
|
||||
<button class="awoken-clear"></button>
|
||||
<div class="awoken-option">
|
||||
|
|
Loading…
Reference in New Issue