增加搜索结果分享功能

languages/en.css

@@ -443,9 +443,12 @@ label[for="box-have"]::after
 .control-div .search-close::before{
 	content: "Close Search Panel";
 }
+.control-div .search-share::before{
+	content: "Share Search";
+}
 .dialog-search-string .dialog-title::before
 {
-	content: "Search By Tags";
+	content: "Search by Tags";
 }
 .dialog-close::before,
 .mask-close::before

languages/ja.css

@@ -437,6 +437,9 @@ label[for="box-have"]::after
 .control-div .search-close::before{
 	content: "検索を閉じる";
 }
+.control-div .search-share::before{
+	content: "検索を分け合う";
+}
 .dialog-search-string .dialog-title::before
 {
 	content: "タグで検索";

languages/ko.css

@@ -429,6 +429,9 @@ label[for="have-8-latent-slot"]::after
 .control-div .search-close::before{
 	content: "찾기 닫기";
 }
+.control-div .search-share::before{
+	content: "검색 공유하기";
+}
 .dialog-search-string .dialog-title::before
 {
 	content: "태그로 검색";

languages/zh-TW.css

@@ -441,6 +441,9 @@ label[for="box-have"]::after
 .control-div .search-close::before{
 	content: "關閉搜索";
 }
+.control-div .search-share::before{
+	content: "分享搜索";
+}
 .dialog-search-string .dialog-title::before
 {
 	content: "以標簽搜索";

languages/zh.css

@@ -438,6 +438,9 @@ label[for="box-have"]::after
 .control-div .search-close::before{
 	content: "关闭搜索";
 }
+.control-div .search-share::before{
+	content: "分享搜索";
+}
 .dialog-search-string .dialog-title::before
 {
 	content: "以標簽搜索";

multi.html

@@ -1062,6 +1062,7 @@ var formation = new Formation(teamsCount,5);
 				<button class="search-start"><!--开始搜索--></button>
 				<button class="search-close"><!--关闭搜索--></button>
 				<button class="search-clear"><!--清空搜索条件--></button>
+				<button class="search-share"><!--分享搜索内容--></button>
 				<div class="additional-div"><!--额外显示栏-->
 					<input type="checkbox" class="config-checkbox-ipt" name="add-show-CD" id="add-show-CD"><label class="config-checkbox-lbl add-show-CD-label" for="add-show-CD"><div class="config-checkbox-lbl-cicle"></div></label>
 					<input type="checkbox" class="config-checkbox-ipt" name="add-show-abilities" id="add-show-abilities"><label class="config-checkbox-lbl add-show-abilities-label" for="add-show-abilities"><div class="config-checkbox-lbl-cicle"></div></label>
@@ -1274,6 +1275,13 @@ var formation = new Formation(teamsCount,5);
 					<div class="skill-datail-parsed"></div>
 				</div>
 			</div>
+			<div class="dialog dialog-show-any-string display-none">
+				<div class="dialog-title"></div>
+				<div class="dialog-content">
+					<input type="text" class="string-value" readonly /><button class="string-copy"></button>
+				</div>
+				<div class="dialog-control"><button class="dialog-close brown-button"></button></div>
+			</div>
 			<div class="dialog dialog-search-string display-none">
 				<div class="dialog-title"></div>
 				<div class="dialog-content"></div>
@@ -1376,7 +1384,7 @@ var formation = new Formation(teamsCount,5);
 				<li><label for="dungeon-rcv"></label><input id="dungeon-rcv" type="number" min=0 step=1 value=1 /></li>
 			</ul>
 		</div>
-		<div class="dialog-control"><button class="dialog-clear brown-button"></button><button class="dialog-confirm brown-button"></button></div>
+		<div class="dialog-control"><button class="dialog-clear brown-button"></button><button class="dialog-close brown-button"></button><button class="dialog-confirm brown-button"></button></div>
 	</div>
 	
 	<div id="player-data-frame" class="mask display-none">

script-universal_function.js

@@ -676,7 +676,7 @@ function calculateAbility_max(id, solo, teamsCount, maxLevel = 110) {
 	}
 }
 //搜索卡片用
-function searchCards(cards, {attr:[attr1, attr2], fixMainColor, types, typeAndOr, rares, awokens, sawokens, equalAk, incSawoken, canAssist, canLv110, is8Latent}) {
+function searchCards(cards, {attrs:[attr1, attr2], fixMainColor, types, typeAndOr, rares, awokens, sawokens, equalAk, incSawoken, canAssist, canLv110, is8Latent}) {
 	let cardsRange = cards.concat(); //这里需要复制一份原来的数组，不然若无筛选，后面的排序会改变初始Cards
 	if (canAssist) cardsRange = cardsRange.filter(card=>card.canAssist);
 	if (canLv110) cardsRange = cardsRange.filter(card=>card.limitBreakIncr>0);

script.js

@@ -1366,7 +1366,7 @@ function reloadFormationData(event) {
 		} catch (error) {
 			return null;
 		}
-	})(sessionStorage.getItem('search-options'));
+	})(getQueryString('search-options') || sessionStorage.getItem('search-options'));
 	if (searchOptions) {
 		editBox?.querySelector(".search-box")?.recoverySearchStatus(searchOptions);
 	}
@@ -2421,7 +2421,7 @@ function initialize() {
 
 	//显示HP的详细值
 	const hpDetailDialog = formationBox.querySelector(".dialog-hp-detail");
-	hpDetailDialog.show = function(reduceAttrRanges, tHP, tHPNoAwoken)
+	hpDetailDialog.initialing = function(reduceAttrRanges, tHP, tHPNoAwoken)
 	{
 		const dialogContent = this.querySelector(".dialog-content");
 		const fragment = document.createDocumentFragment();
@@ -2501,14 +2501,10 @@ function initialize() {
 		
 		dialogContent.innerHTML = "";
 		dialogContent.appendChild(fragment);
-		this.classList.remove(className_displayNone);
-	}
-	hpDetailDialog.close = function()
-	{
-		this.classList.add(className_displayNone);
 	}
-	const hpDetailDialog_Close = hpDetailDialog.querySelector(".dialog-close");
-	hpDetailDialog_Close.onclick = function(){hpDetailDialog.close();};
+	//初始化Dialog
+	dialogInitialing(hpDetailDialog);
+
 	const reduceDetailsBars = Array.from(formationBox.querySelectorAll(".tIf-total-hp .reduce-details"));
 	reduceDetailsBars.forEach(bar => {
 		bar.onclick = function(){
@@ -2518,7 +2514,7 @@ function initialize() {
 	
 	//设置地下城倍率
 	const dungeonEnchanceDialog = document.body.querySelector(".dialog-dungeon-enchance");
-	dungeonEnchanceDialog.show = function(formation)
+	dungeonEnchanceDialog.initialing = function(formation)
 	{
 		const dialogContent = this.querySelector(".dialog-content");
 		const rareDoms = Array.from(dialogContent.querySelectorAll(".rare-list .rare-check"));
@@ -2542,9 +2538,8 @@ function initialize() {
 
 		this.classList.remove(className_displayNone);
 	}
-	dungeonEnchanceDialog.close = function(){
-		this.classList.add(className_displayNone);
-	}
+	//初始化Dialog
+	dialogInitialing(dungeonEnchanceDialog);
 	const dungeonEnchanceDialogConfirm = dungeonEnchanceDialog.querySelector(".dialog-confirm");
 	dungeonEnchanceDialogConfirm.onclick = function(){
 		const dialogContent = dungeonEnchanceDialog.querySelector(".dialog-content");
@@ -2667,12 +2662,14 @@ function initialize() {
 	{
 		input.focus(); //设input为焦点
 		input.select(); //选择全部
-		if (document.execCommand('copy')) {
+		if (navigator?.clipboard?.writeText) { //优先使用新API
+			navigator.clipboard.writeText(input.value);
+		} else if (document.execCommand('copy')) {
 			document.execCommand('copy');
 		}
 		//input.blur(); //取消焦点
 	}
-	stringSearchDialog.show = function(originalStrArr = [], additionalStrArr = [])
+	stringSearchDialog.initialing = function(originalStrArr = [], additionalStrArr = [])
 	{
 		const stringSearchContent = this.querySelector(".dialog-content");
 		const fragment = document.createDocumentFragment();
@@ -2713,14 +2710,30 @@ function initialize() {
 		}
 		stringSearchContent.innerHTML = "";
 		stringSearchContent.appendChild(fragment);
-		this.classList.remove(className_displayNone);
 	}
 	stringSearchDialog.close = function()
 	{
 		this.classList.add(className_displayNone);
 	}
-	const stringSearchDialog_Close = stringSearchDialog.querySelector(".dialog-close");
-	stringSearchDialog_Close.onclick = function(){stringSearchDialog.close();};
+
+	function dialogShowFunction(...arg){
+		this?.initialing(...arg); //自身初始化
+		this.classList.remove(className_displayNone);
+	};
+	function dialogCloseFunction(){
+		this.classList.add(className_displayNone);
+	};
+	function dialogCloseButtonFunction(){
+		this.parentElement.parentElement.close();
+	};
+	function dialogInitialing(dialog){
+		dialog.show = dialogShowFunction;
+		dialog.close = dialogCloseFunction;
+		const closeButton = dialog.querySelector(".dialog-close");
+		closeButton.onclick = dialogCloseButtonFunction;
+	}
+	//初始化Dialog
+	dialogInitialing(stringSearchDialog);
 
 	const mAltName = smonsterinfoBox.querySelector(".monster-altName");
 	mAltName.onclick = function() { //搜索合作
@@ -3186,7 +3199,27 @@ function initialize() {
 	const searchStart = s_controlDiv.querySelector(".search-start");
 	const searchClose = s_controlDiv.querySelector(".search-close");
 	const searchClear = s_controlDiv.querySelector(".search-clear");
-
+	const searchShare = s_controlDiv.querySelector(".search-share");
+	searchShare.onclick = function() {
+		const options = searchBox.getSearchOptions();
+		const optionJSON = JSON.stringify(options);
+		const locationURL = new URL(location);
+		locationURL.searchParams.set('search-options', optionJSON);
+		const idArr = searchMonList.originalHeads?.map(head=>head.card.id) ?? [];
+		locationURL.searchParams.set('show-search', JSON.stringify(idArr));
+		showAnyStringDialog.show(locationURL.toString());
+		//prompt(undefined, locationURL.toString());
+	}
+	const showAnyStringDialog = settingBox.querySelector(".dialog-show-any-string");
+	showAnyStringDialog.initialing = function(str) {
+		const ipt = this.querySelector(".string-value");
+		ipt.value = str;
+	}
+	showAnyStringDialog.querySelector('.string-copy').onclick = function(){
+		copyString(showAnyStringDialog.querySelector(".string-value"));
+	}
+	//初始化Dialog
+	dialogInitialing(showAnyStringDialog);
 
 	function returnCheckedInput(ipt) {
 		return ipt.checked;
@@ -3331,8 +3364,7 @@ function initialize() {
 			filterUl.value = filter.join("|");
 		}
 	}
-	searchStart.onclick = function(event) {
-		let customAdditionalFunction = [];
+	searchBox.getSearchOptions = function(){
 		let attr1 = Number(returnRadiosValue(s_attr1s)) || 0;
 		let attr2 = Number(returnRadiosValue(s_attr2s)) || 0;
 
@@ -3350,7 +3382,7 @@ function initialize() {
 		});
 		
 		const options = {
-			attr:[attr1, attr2],
+			attrs:[attr1, attr2],
 			fixMainColor: s_fixMainColor.checked,
 			types,
 			typeAndOr: s_typeAndOr.checked,
@@ -3362,16 +3394,22 @@ function initialize() {
 			canAssist: s_canAssist.checked,
 			canLv110: s_canLevelLimitBreakthrough.checked,
 			is8Latent: s_have8LatentSlot.checked,
+			specialFilters: Array.from(specialFilterUl.querySelectorAll(".special-filter"))
+			.map(select=>select.value.split("|").map(Number)) //储存设置用于页面刷新的状态恢复
 		};
+		return options;
+	}
+	searchStart.onclick = function(event) {
+		let customAdditionalFunction = [];
+
+		const options = searchBox.getSearchOptions();
 
 		let searchResult = searchCards(Cards, options);
 
 		//进行特殊附加搜索
-		const specialFilters = Array.from(specialFilterUl.querySelectorAll(".special-filter")).map(select=>{
-			const indexs = select.value.split("|").map(Number);
-			const funcObj = indexs.length > 1 ? specialSearchFunctions[indexs[0]].functions[indexs[1]] : specialSearchFunctions[indexs[0]];
-			return funcObj;
-		});
+		const specialFilters = options.specialFilters.map(([name1, name2])=>
+			name2 !== undefined ? specialSearchFunctions[name1].functions[name2] : specialSearchFunctions[name1]
+		);
 		searchResult = specialFilters.reduce((pre,funcObj)=>
 		{
 			if (!funcObj) return pre;
@@ -3379,26 +3417,14 @@ function initialize() {
 			return funcObj.function(pre); //结果进一步筛选
 		}, searchResult);
 
-		//储存设置用于页面刷新的状态恢复
-		options.specialFilters = Array.from(specialFilterUl.querySelectorAll(".special-filter"))
-			.map(select=>select.value.split("|").map(Number));
-
-		sessionStorage.setItem('search-options',JSON.stringify(options, [
-			"attr1",
-			"attr2",
-			"fixMainColor",
-			"types",
-			"typeAndOr",
-			"rares",
-			"awokens",
-			"sawokens",
-			"equalAk",
-			"incSawoken",
-			"canAssist",
-			"canLv110",
-			"is8Latent",
-			"specialFilters",
-		]));
+		const optionJSON = JSON.stringify(options);
+		sessionStorage.setItem('search-options', optionJSON);
+		// if (event.ctrlKey) {
+		// 	const locationURL = new URL(location);
+		// 	locationURL.searchParams.set('search-options', optionJSON);
+		// 	locationURL.searchParams.set('show-search', JSON.stringify(searchResult.map(card=>card.id)));
+		// 	history.replaceState(null, null, locationURL);
+		// }
 		
 		//显示搜索结果
 		showSearch(searchResult, customAdditionalFunction);
@@ -3480,7 +3506,7 @@ function initialize() {
 				
 				if (isGuideMod)
 				{
-					const idArr = searchMonList.originalHeads ? searchMonList.originalHeads.map(head=>head.card.id) : [];
+					const idArr = searchMonList.originalHeads?.map(head=>head.card.id) ?? [];
 					const state = {searchArr:idArr,mid:newId};
 					const locationURL = new URL(location);
 					if (newId === 0) {

service-worker.js

@@ -6847,7 +6847,7 @@ const cachesMap = new Map([
 	],
 	[
 		"multi.html",
-		"db4232f8d4a45d027594af5322053ba3"
+		"879e15f7cbd65d01b756bf4626b7b24b"
 	],
 	[
 		"script-custom_elements.js",
@@ -6863,15 +6863,15 @@ const cachesMap = new Map([
 	],
 	[
 		"script-universal_function.js",
-		"40d4a975ec1b4086ddaf822cf8bd3435"
+		"fe7c78c90328699773a0ca4ceb7d7fe7"
 	],
 	[
 		"script.js",
-		"259c3cb2b00efc00ae1f33ccd9eb2071"
+		"eda6b45f6710044a734c7fd6915ba407"
 	],
 	[
 		"solo.html",
-		"34bafc0680d45473290fc4f3584b63c3"
+		"bcde6ce52dcf6b5d0126cdc0f7b26bda"
 	],
 	[
 		"style-monsterimages.css",
@@ -6879,7 +6879,7 @@ const cachesMap = new Map([
 	],
 	[
 		"style.css",
-		"21dd5e9c2b98c0d6c85c1cb584a2bda2"
+		"b82995b443e150db1640e8106fe9c8d3"
 	],
 	[
 		"temp.js",
@@ -6887,11 +6887,11 @@ const cachesMap = new Map([
 	],
 	[
 		"triple.html",
-		"4200bbf7ec2d354ef31ff4fd9fcbe66e"
+		"af7798d49322f58831f9236194dbb20b"
 	],
 	[
 		"languages/en.css",
-		"f63cf0ac6158c1b3669c34364eb9c9e3"
+		"8dc1b80748c04b946f923e4edb821c23"
 	],
 	[
 		"languages/en.js",
@@ -6899,7 +6899,7 @@ const cachesMap = new Map([
 	],
 	[
 		"languages/ja.css",
-		"413d6d11cbe6644096fd4c813ce914a2"
+		"c93a2a81bcf799ae85484ecd18707fd0"
 	],
 	[
 		"languages/ja.js",
@@ -6907,7 +6907,7 @@ const cachesMap = new Map([
 	],
 	[
 		"languages/ko.css",
-		"a1a0b0b39ff67a26eeee841624e36e79"
+		"0f1a9af0a066cb4f321c9ed187bd862d"
 	],
 	[
 		"languages/ko.js",
@@ -6927,7 +6927,7 @@ const cachesMap = new Map([
 	],
 	[
 		"languages/zh-TW.css",
-		"b203dd3ac738514c27dce3906880a426"
+		"dd898de95f2d6453a99ffd28865f4899"
 	],
 	[
 		"languages/zh-TW.js",
@@ -6935,7 +6935,7 @@ const cachesMap = new Map([
 	],
 	[
 		"languages/zh.css",
-		"48e3227c022f22ad51d7a163a5a3c2af"
+		"1ede18316ffa7ff271427d2c654ceeba"
 	],
 	[
 		"languages/zh.js",

solo.html

@@ -908,6 +908,7 @@ var formation = new Formation(teamsCount,6);
 				<button class="search-start"><!--开始搜索--></button>
 				<button class="search-close"><!--关闭搜索--></button>
 				<button class="search-clear"><!--清空搜索条件--></button>
+				<button class="search-share"><!--分享搜索内容--></button>
 				<div class="additional-div"><!--额外显示栏-->
 					<input type="checkbox" class="config-checkbox-ipt" name="add-show-CD" id="add-show-CD"><label class="config-checkbox-lbl add-show-CD-label" for="add-show-CD"><div class="config-checkbox-lbl-cicle"></div></label>
 					<input type="checkbox" class="config-checkbox-ipt" name="add-show-abilities" id="add-show-abilities"><label class="config-checkbox-lbl add-show-abilities-label" for="add-show-abilities"><div class="config-checkbox-lbl-cicle"></div></label>
@@ -1120,6 +1121,13 @@ var formation = new Formation(teamsCount,6);
 					<div class="skill-datail-parsed"></div>
 				</div>
 			</div>
+			<div class="dialog dialog-show-any-string display-none">
+				<div class="dialog-title"></div>
+				<div class="dialog-content">
+					<input type="text" class="string-value" readonly /><button class="string-copy"></button>
+				</div>
+				<div class="dialog-control"><button class="dialog-close brown-button"></button></div>
+			</div>
 			<div class="dialog dialog-search-string display-none">
 				<div class="dialog-title"></div>
 				<div class="dialog-content"></div>
@@ -1222,7 +1230,7 @@ var formation = new Formation(teamsCount,6);
 				<li><label for="dungeon-rcv"></label><input id="dungeon-rcv" type="number" min=0 step=1 value=1 /></li>
 			</ul>
 		</div>
-		<div class="dialog-control"><button class="dialog-clear brown-button"></button><button class="dialog-confirm brown-button"></button></div>
+		<div class="dialog-control"><button class="dialog-clear brown-button"></button><button class="dialog-close brown-button"></button><button class="dialog-confirm brown-button"></button></div>
 	</div>
 	
 	<div id="player-data-frame" class="mask display-none">

style.css

@@ -281,12 +281,17 @@ ul{
 	content: "关闭";
 }
 */
+.dialog-show-any-string {
+	width: 400px;
+	top: 100px;
+	position: fixed;
+}
 .dialog-search-string
 {
 	width: 260px;
 }
-.dialog-search-string .string-copy,
-.dialog-search-string .string-search
+.dialog .string-copy,
+.dialog .string-search
 {
 	box-sizing: border-box;
 	width: 45px;
@@ -298,23 +303,22 @@ ul{
 	border-radius: 5px;
 	padding: 0;
 }
-.dialog-search-string .string-copy::before
+.dialog .string-copy::before
 {
 	content: "📋";
 }
-.dialog-search-string .string-search::before
+.dialog .string-search::before
 {
 	content: "🔍";
 }
-.dialog-search-string .string-value
+.dialog .string-value
 {
 	box-sizing: border-box;
-	width: calc(100% - 50px * 2);
+	width: calc(100% - 50px * 1);
 }
-.dialog-search-string .additional-string .string-value
+.dialog .additional-string .string-value
 {
-	box-sizing: border-box;
-	width: calc(100% - 50px * 1);
+	width: calc(100% - 50px * 2);
 }
 
 /*单个怪物*/

triple.html

@@ -1944,6 +1944,7 @@ var formation = new Formation(teamsCount,6);
 				<button class="search-start"><!--开始搜索--></button>
 				<button class="search-close"><!--关闭搜索--></button>
 				<button class="search-clear"><!--清空搜索条件--></button>
+				<button class="search-share"><!--分享搜索内容--></button>
 				<div class="additional-div"><!--额外显示栏-->
 					<input type="checkbox" class="config-checkbox-ipt" name="add-show-CD" id="add-show-CD"><label class="config-checkbox-lbl add-show-CD-label" for="add-show-CD"><div class="config-checkbox-lbl-cicle"></div></label>
 					<input type="checkbox" class="config-checkbox-ipt" name="add-show-abilities" id="add-show-abilities"><label class="config-checkbox-lbl add-show-abilities-label" for="add-show-abilities"><div class="config-checkbox-lbl-cicle"></div></label>
@@ -2156,6 +2157,13 @@ var formation = new Formation(teamsCount,6);
 					<div class="skill-datail-parsed"></div>
 				</div>
 			</div>
+			<div class="dialog dialog-show-any-string display-none">
+				<div class="dialog-title"></div>
+				<div class="dialog-content">
+					<input type="text" class="string-value" readonly /><button class="string-copy"></button>
+				</div>
+				<div class="dialog-control"><button class="dialog-close brown-button"></button></div>
+			</div>
 			<div class="dialog dialog-search-string display-none">
 				<div class="dialog-title"></div>
 				<div class="dialog-content"></div>
@@ -2258,7 +2266,7 @@ var formation = new Formation(teamsCount,6);
 				<li><label for="dungeon-rcv"></label><input id="dungeon-rcv" type="number" min=0 step=1 value=1 /></li>
 			</ul>
 		</div>
-		<div class="dialog-control"><button class="dialog-clear brown-button"></button><button class="dialog-confirm brown-button"></button></div>
+		<div class="dialog-control"><button class="dialog-clear brown-button"></button><button class="dialog-close brown-button"></button><button class="dialog-confirm brown-button"></button></div>
 	</div>
 	
 	<div id="player-data-frame" class="mask display-none">