将筛选条件修改为自主收藏

languages/en.css

@@ -421,6 +421,12 @@ label[for="box-have"]::after
 .special-div .special-add::before {
 	content: "➕";
 }
+.special-div .special-star::before {
+	content: "☆";
+}
+.special-div .special-star.marked::before {
+	content: "★";
+}
 .control-div .search-start::before{
 	content: "🔍Start Search";
 }

languages/ja.css

@@ -414,6 +414,12 @@ label[for="box-have"]::after
 .special-div .special-add::before {
 	content: "➕";
 }
+.special-div .special-star::before {
+	content: "☆";
+}
+.special-div .special-star.marked::before {
+	content: "★";
+}
 .control-div .search-start::before{
 	content: "🔍検索の開始";
 }

languages/ko.css

@@ -411,6 +411,12 @@ label[for="box-have"]::after
 .special-div .special-add::before {
 	content: "➕";
 }
+.special-div .special-star::before {
+	content: "☆";
+}
+.special-div .special-star.marked::before {
+	content: "★";
+}
 .control-div .search-start::before{
 	content: "🔍검색 시작";
 }

languages/zh-TW.css

@@ -418,6 +418,12 @@ label[for="box-have"]::after
 .special-div .special-add::before {
 	content: "➕";
 }
+.special-div .special-star::before {
+	content: "☆";
+}
+.special-div .special-star.marked::before {
+	content: "★";
+}
 .control-div .search-start::before{
 	content: "🔍開始搜索";
 }

languages/zh.css

@@ -416,6 +416,12 @@ label[for="box-have"]::after
 .special-div .special-add::before {
 	content: "➕";
 }
+.special-div .special-star::before {
+	content: "☆";
+}
+.special-div .special-star.marked::before {
+	content: "★";
+}
 .control-div .search-start::before{
 	content: "🔍开始搜索";
 }

multi.html

@@ -935,6 +935,7 @@ var formation = new Formation(teamsCount,5);
 			<div class="special-div">
 				<button class="special-add brown-button"></button>
 				<button class="special-clear brown-button"></button>
+				<button class="special-star brown-button"></button>
 				<ul class="special-filter-list">
 					<li><select class="special-filter"></select></li>
 				</ul>
@@ -1173,7 +1174,7 @@ var formation = new Formation(teamsCount,5);
 		</div>
 
 		<template id="template-card-a">
-			<a class="monster" target="_blank" data-cardid="" data-cards-pic-idx="" data-cards-pic-x="" data-cards-pic-y="" title=""><div class="property" data-property=""></div><div class="subproperty" data-property=""></div><div class="id"></div><div class="awoken-count-num"></div><div class="count-in-box"><span class="same-id"></span><span class="evo-tree"></span></div></a>
+			<a class="monster" target="_blank" data-cardid="" data-cards-pic-idx="" data-cards-pic-x="" data-cards-pic-y="" title=""><div class="property" data-property=""></div><div class="subproperty" data-property=""></div><div class="id"></div><div class="awoken-count-num"></div><div class="rarity"></div><div class="count-in-box"><span class="same-id"></span><span class="evo-tree"></span></div></a>
 		</template>
 	</div>
 	<svg id="interchange-line" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.2" height="100%" width="100%" style="display:none;">

script-json_data.js

@@ -1261,72 +1261,6 @@ const specialSearchFunctions = (function() {
 
 	const functions = [
 		{name:"No Filter",otLangName:{chs:"不做筛选",cht:"不做篩選"},function:cards=>cards},
-		{group:true,name:"======Very commonly used=====",otLangName:{chs:"======非常常用======",cht:"======非常常用======"}, functions: [
-			/*
-			{name:"Voids both absorption(sort by turns)",otLangName:{chs:"双破吸 buff（按破吸回合排序）",cht:"雙破吸 buff（按破吸回合排序）"},
-				function:cards=>{
-				const searchTypeArray = [173];
-				return cards.filter(card=>{
-					const skill = getCardActiveSkill(card, searchTypeArray);
-					return skill && skill.params[1] && skill.params[3];
-				}).sort((a,b)=>sortByParams(a,b,searchTypeArray));
-			},addition:voidsAbsorption_Addition},
-			{name:"Pierce through damage void(sort by turns)",otLangName:{chs:"贯穿无效盾 buff（按破吸回合排序）",cht:"貫穿無效盾 buff（按破吸回合排序）"},
-				function:cards=>{
-					const searchTypeArray = [191];
-					return cards.filter(card=>{
-						const skill = getCardActiveSkill(card, searchTypeArray);
-						return skill;
-					}).sort((a,b)=>sortByParams(a,b,searchTypeArray));
-				},
-				addition:card=>{
-					const searchTypeArray = [191];
-					const skill = getCardActiveSkill(card, searchTypeArray);
-					const sk = skill.params;
-					return document.createTextNode(`破贯×${sk[0]}T`);
-				}
-			},
-			{
-				name:"Unbind both(sort by awoken turns)",otLangName:{chs:"解封+觉醒（按解觉醒回合排序）",cht:"解封+覺醒（按解覺醒回合排序）"},
-				function:cards=>{
-					return cards.filter(card=>{
-						const turns = unbind_Turns(card);
-						return turns.normal && turns.awoken > 0;
-					}).sort((a,b)=>{
-						const a_s = unbind_Turns(a), b_s = unbind_Turns(b);
-						let a_pC = a_s.awoken, b_pC = b_s.awoken;
-						return a_pC - b_pC;
-					});
-				},
-				addition:unbind_Addition
-			},
-			{
-				name:"Unbind unmatchable(sort by turns)",otLangName:{chs:"解禁消珠（按消除回合排序）",cht:"解禁消珠（按消除回合排序）"},
-				function:cards=>{
-					const searchTypeArray = [196];
-					return cards.filter(card=>{
-						const skill = getCardActiveSkill(card, searchTypeArray);
-						return skill;
-					}).sort((a,b)=>{
-						const a_s = getCardActiveSkill(a, searchTypeArray), b_s = getCardActiveSkill(b, searchTypeArray);
-						let a_pC = a_s.params[0], b_pC = b_s.params[0];
-						return a_pC - b_pC;
-					})
-	
-					},
-				addition:card=>{
-					const searchTypeArray = [196];
-					const skill = getCardActiveSkill(card, searchTypeArray);
-					const sk = skill.params;
-	
-					const value = sk[0];
-					return document.createTextNode(`${value == 9999 ? "全" : value + "T"}解禁消`);
-				}
-			},
-			{name:"8 latent grids",otLangName:{chs:"8格潜觉",cht:"8格潛覺"},
-				function:cards=>cards.filter(card=>card.is8Latent)
-			},*/
-		]},
 		{group:true,name:"======Active Skill======",otLangName:{chs:"======主动技======",cht:"======主動技======"}, functions: [
 		]},
 		{group:true,name:"-----Voids Absorption-----",otLangName:{chs:"-----破吸类-----",cht:"-----破吸類-----"}, functions: [
@@ -3470,6 +3404,7 @@ const specialSearchFunctions = (function() {
 			},*/
 		]},
 	];
+	/*
 	//非常常用
 	let commonlyUsed = functions.find(g=>g.group && g.name.includes("commonly used"));
 	if (commonlyUsed) {
@@ -3482,6 +3417,6 @@ const specialSearchFunctions = (function() {
 		].filter(Boolean);
 		commonlyUsed.functions.push(...list);
 	}
-
+	*/
 	return functions;
 })();

script.js

@@ -4,6 +4,7 @@ let PlayerDatas = []; //玩家数据
 let currentLanguage; //当前语言
 let currentDataSource; //当前数据
 let currentPlayerData; //当前玩家数据
+let markedFilter = []; //收藏的特殊搜索
 
 const teamBigBoxs = []; //储存全部teamBigBox
 const allMembers = []; //储存所有成员，包含辅助
@@ -2903,6 +2904,7 @@ function initialize(event) {
 	const s_specialDiv = searchBox.querySelector(".special-div");
 	const specialAdd = s_specialDiv.querySelector(".special-add");
 	const specialClear = s_specialDiv.querySelector(".special-clear");
+	const specialStar = s_specialDiv.querySelector(".special-star");
 	const specialFilterUl = s_specialDiv.querySelector(".special-filter-list");
 	const specialFilterFirstLi = specialFilterUl.querySelector("li");
 	const specialFirstSelect = specialFilterFirstLi.querySelector(".special-filter");
@@ -2910,40 +2912,97 @@ function initialize(event) {
 	function newSpecialSearchOption(func, idx1, idx2)
 	{
 		const funcName = returnMonsterNameArr(func, currentLanguage.searchlist, currentDataSource.code)[0];
-		return new Option(funcName + (func.addition ? " " + localTranslating.addition_display : ""), idx1 + (idx2 != null ? "|" + idx2 : ""));
+		return new Option(
+			funcName + (func.addition ? " " + localTranslating.addition_display : ""), //有附加显示的，名称增加一个附加显示图标
+			idx1 + (idx2 != null ? "|" + idx2 : "") //值为 组序号|组内序号
+			);
 	}
-	specialSearchFunctions.forEach((sfunc,idx)=>{
+	//读取储存的筛选收藏列表
-		if (sfunc.group)
+	let strMakedConfig = JSON.parse(localStorage.getItem(cfgPrefix + "marked-filter"));
-		{
+	if (Array.isArray(strMakedConfig)) {
-			const groupName = returnMonsterNameArr(sfunc, currentLanguage.searchlist, currentDataSource.code)[0];
+		for (let arr of strMakedConfig) {
-			const optgroup = specialFirstSelect.appendChild(document.createElement("optgroup"));
+			let idx1 = specialSearchFunctions.findIndex(group=>group.name == arr[0]);
-			optgroup.label = groupName;
+			if (idx1 < 0 ) continue;
-			if (sfunc.functions)
+			if (arr.length > 1) {
-			{
+				let idx2 = specialSearchFunctions[idx1].functions.findIndex(func=>func.name == arr[1]);
-				sfunc.functions.forEach((_sfunc,_idx)=>{
+				if (idx2 < 0 ) continue;
-					optgroup.appendChild(newSpecialSearchOption(_sfunc, idx, _idx));
+				markedFilter.push([idx1, idx2]);
-				});
+			} else {
+				markedFilter.push([idx1]);
 			}
-		}else
-		{
-			specialFirstSelect.options.add(newSpecialSearchOption(sfunc, idx));
 		}
-	});
+	}
-	specialAdd.onclick = function()
+	specialFirstSelect.refreshList = function() {
-	{
+		const _this = specialFirstSelect;
+		function addNewOption(sfunc, idx){
+			if (sfunc.group)
+			{
+				const groupName = returnMonsterNameArr(sfunc, currentLanguage.searchlist, currentDataSource.code)[0];
+				const optgroup = _this.appendChild(document.createElement("optgroup"));
+				optgroup.label = groupName;
+				if (sfunc.functions)
+				{
+					sfunc.functions.forEach((_sfunc,_idx)=>{
+						optgroup.appendChild(newSpecialSearchOption(_sfunc, idx, _idx));
+					});
+				}
+			}else
+			{
+				_this.options.add(newSpecialSearchOption(sfunc, idx));
+			}
+		}
+		_this.innerHTML = '';
+		addNewOption(specialSearchFunctions[0], 0);
+		if (markedFilter.length > 0) {
+			const groupName = "=====★=====";
+			const optgroup = _this.appendChild(document.createElement("optgroup"));
+			optgroup.label = groupName;
+			for (let indexs of markedFilter) {
+				const funcObj = indexs.length > 1 ? specialSearchFunctions[indexs[0]].functions[indexs[1]] : specialSearchFunctions[indexs[0]];
+				optgroup.appendChild(newSpecialSearchOption(funcObj, indexs[0], indexs[1]));
+			}
+		}
+		for (let idx = 1; idx < specialSearchFunctions.length; idx++) {
+			addNewOption(specialSearchFunctions[idx], idx);
+		}
+	}
+	specialFirstSelect.onchange = function() {
+		const indexs = specialFirstSelect.value.split("|").map(Number);
+		let markIdx = markedFilter.findIndex(arr=>arr[0] === indexs[0] && arr[1] === indexs[1]);
+		if (markIdx >= 0) {//已经存在的收藏
+			specialStar.classList.add("marked");
+		} else {
+			specialStar.classList.remove("marked");
+		}
+	}
+	//只添加第一个列表，后面的全部通过克隆的方式复现
+	specialFirstSelect.refreshList();
+	specialAdd.onclick = function() {
 		specialFilterUl.appendChild(specialFilterFirstLi.cloneNode(true));
 	}
-	specialAdd.onclick(); //先运行一次产生两个
+	//specialAdd.onclick(); //先运行一次产生两个
-	specialClear.onclick = function()
+	specialClear.onclick = function() {
-	{
-		/*for (let ci = specialFilterUl.children.length-1; ci>0; ci--)
-		{
-			specialFilterUl.children[ci].remove();
-		}*/
 		specialFilterUl.innerHTML = "";
 		specialFilterUl.appendChild(specialFilterFirstLi);
 		specialFirstSelect.selectedIndex = 0;
 	}
+	specialStar.onclick = function() {
+		const indexs = specialFirstSelect.value.split("|").map(Number);
+		let markIdx = markedFilter.findIndex(arr=>arr[0] === indexs[0] && arr[1] === indexs[1]);
+		if (markIdx >= 0) {//已经存在的收藏
+			markedFilter.splice(markIdx,1);
+		} else {
+			markedFilter.push(indexs);
+		}
+		specialFirstSelect.refreshList(); //刷新列表
+		specialStar.classList.remove("marked"); //去掉自身的收藏标记
+		//储存设置
+		let strMakedConfig = markedFilter.map(indexs=>{
+			let arr = [specialSearchFunctions[indexs[0]].name];
+			if (indexs.length > 1) arr.push(specialSearchFunctions[indexs[0]].functions[indexs[1]].name);
+			return arr;})
+		localStorage.setItem(cfgPrefix + "marked-filter", JSON.stringify(strMakedConfig));
+	}
 
 	const s_controlDiv = searchBox.querySelector(".control-div");
 	const searchStart = s_controlDiv.querySelector(".search-start");

solo.html

@@ -790,6 +790,7 @@ var formation = new Formation(teamsCount,6);
 			<div class="special-div">
 				<button class="special-add brown-button"></button>
 				<button class="special-clear brown-button"></button>
+				<button class="special-star brown-button"></button>
 				<ul class="special-filter-list">
 					<li><select class="special-filter"></select></li>
 				</ul>

style.css

@@ -1661,17 +1661,7 @@ icon.inflicts::after
 	display: inline-block;
 	vertical-align: top;
 }
-.search-box .rare-clear,
+.search-box .brown-button::before
-.search-box .awoken-clear,
-.search-box .sawoken-clear
-{
-	vertical-align: top;
-}
-.search-box .rare-clear::before,
-.search-box .awoken-clear::before,
-.search-box .sawoken-clear::before,
-.search-box .special-add::before,
-.search-box .special-clear::before
 {
 	min-width: 80px;
 	background-size: 100px 100px;
@@ -1682,9 +1672,11 @@ icon.inflicts::after
 	padding: 0;
 	vertical-align: top;
 }
+.search-box .rare-clear::before,
 .search-box .sawoken-clear::before,
 .search-box .special-add::before,
-.search-box .special-clear::before
+.search-box .special-clear::before,
+.search-box .special-star::before
 {
 	min-width: 50px;
 	font-size: 14px;

triple.html

@@ -1731,6 +1731,7 @@ var formation = new Formation(teamsCount,6);
 			<div class="special-div">
 				<button class="special-add brown-button"></button>
 				<button class="special-clear brown-button"></button>
+				<button class="special-star brown-button"></button>
 				<ul class="special-filter-list">
 					<li><select class="special-filter"></select></li>
 				</ul>
@@ -1969,7 +1970,7 @@ var formation = new Formation(teamsCount,6);
 		</div>
 
 		<template id="template-card-a">
-			<a class="monster" target="_blank" data-cardid="" data-cards-pic-idx="" data-cards-pic-x="" data-cards-pic-y="" title=""><div class="property" data-property=""></div><div class="subproperty" data-property=""></div><div class="id"></div><div class="awoken-count-num"></div><div class="count-in-box"><span class="same-id"></span><span class="evo-tree"></span></div></a>
+			<a class="monster" target="_blank" data-cardid="" data-cards-pic-idx="" data-cards-pic-x="" data-cards-pic-y="" title=""><div class="property" data-property=""></div><div class="subproperty" data-property=""></div><div class="id"></div><div class="awoken-count-num"></div><div class="rarity"></div><div class="count-in-box"><span class="same-id"></span><span class="evo-tree"></span></div></a>
 		</template>
 	</div>
 	<svg id="interchange-line" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.2" height="100%" width="100%" style="display:none;">