From 5dc0bbe6b9690a75f33c2afe1bde33ef77957b4c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9E=AB=E8=B0=B7=E5=89=91=E4=BB=99?= <mapaler@163.com>
Date: Thu, 13 Oct 2022 15:58:38 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E6=98=9F=E7=BA=A7=E3=80=81ty?=
 =?UTF-8?q?pe=E7=9A=84=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 multi.html                   | 103 +++++++++++++++-----
 script-universal_function.js |   4 +-
 script.js                    | 120 +++++++++++++++---------
 service-worker.js            |  12 +--
 solo.html                    |  59 +++++++++---
 style.css                    |  51 +++++++---
 triple.html                  | 176 +++++++++++++++++++++++++++--------
 7 files changed, 381 insertions(+), 144 deletions(-)

diff --git a/multi.html b/multi.html
index 2e759fb8..977bdbdd 100644
--- a/multi.html
+++ b/multi.html
@@ -42,8 +42,9 @@ var formation = new Formation(teamsCount,5);
 {
 	display: none;
 }
-.show-team-name-left .team-menber-awoken,
-.show-team-name-left .team-assist-awoken
+.show-team-name-left .team-member-awoken,
+.show-team-name-left .team-assist-awoken,
+.show-team-name-left .team-member-types
 {
 	padding-left: var(--head-block-width);
 }
@@ -156,46 +157,46 @@ var formation = new Formation(teamsCount,5);
 						</ul>
 					</div>
 				</div>
-				<ul class="team-menber-awoken">
-					<li class="menber-awoken menber-awoken-1">
+				<ul class="team-member-awoken">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
 				</ul>
 				<ul class="team-assist-awoken">
-					<li class="menber-awoken menber-awoken-1">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
@@ -335,6 +336,7 @@ var formation = new Formation(teamsCount,5);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -348,6 +350,7 @@ var formation = new Formation(teamsCount,5);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -361,6 +364,7 @@ var formation = new Formation(teamsCount,5);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -374,6 +378,7 @@ var formation = new Formation(teamsCount,5);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -387,6 +392,7 @@ var formation = new Formation(teamsCount,5);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -395,8 +401,52 @@ var formation = new Formation(teamsCount,5);
 						</ul>
 					</div>
 				</div>
+				<ul class="team-member-types">
+					<li class="member-types member-types-1">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-2">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-3">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-4">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-5">
+						<ul class="types-ul">
+						</ul>
+					</li>
+				</ul>
 			</li>
 			<li class="team-bigbox team-2 show-team-name-left reverse-member-assist">
+				<ul class="team-member-types">
+					<li class="member-types member-types-2">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-3">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-4">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-5">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-1">
+						<ul class="types-ul">
+						</ul>
+					</li>
+				</ul>
 				<div class="team-box-name">
 					<div class="team-box">
 						<ul class="team-members">
@@ -408,6 +458,7 @@ var formation = new Formation(teamsCount,5);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -421,6 +472,7 @@ var formation = new Formation(teamsCount,5);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -434,6 +486,7 @@ var formation = new Formation(teamsCount,5);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -447,6 +500,7 @@ var formation = new Formation(teamsCount,5);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -460,6 +514,7 @@ var formation = new Formation(teamsCount,5);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -592,46 +647,46 @@ var formation = new Formation(teamsCount,5);
 						</ul>
 					</div>
 				</div>
-				<ul class="team-menber-awoken">
-					<li class="menber-awoken menber-awoken-2">
+				<ul class="team-member-awoken">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-1">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
 				</ul>
 				<ul class="team-assist-awoken">
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-1">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
diff --git a/script-universal_function.js b/script-universal_function.js
index 9a66fd18..48be7a8c 100644
--- a/script-universal_function.js
+++ b/script-universal_function.js
@@ -1302,8 +1302,8 @@ function countMoveTime(team, leader1id, leader2id, teamIdx) {
 		];
 
 		moveTime.duration.awoken += latentMoveTime.reduce((duration, la) =>
-			duration + team[0].reduce((count, menber) =>
-				count + (menber.latent ? menber.latent.filter(l => l == la.index).length : 0), 0) * la.value, 0);
+			duration + team[0].reduce((count, member) =>
+				count + (member.latent ? member.latent.filter(l => l == la.index).length : 0), 0) * la.value, 0);
 
 	}
 
diff --git a/script.js b/script.js
index 9c66faa5..66e4afbb 100644
--- a/script.js
+++ b/script.js
@@ -112,19 +112,19 @@ DBOpenRequest.onupgradeneeded = function(event) {
 
 /*class Member2
 {
-	constructor(oldMenber, isAssist)
+	constructor(oldmember, isAssist)
 	{
-		//this.index = oldMenber?.index ?? 0;
-		this.id = oldMenber?.id ?? 0;
-		//this.exp = oldMenber?.exp ?? 0;
-		this.level = oldMenber?.level ?? 1;
-		this.plus = oldMenber?.plus ?? {hp:0,atk:0,rcv:0};
-		this.awoken = oldMenber.awoken ?? 0;
-		this.superAwoken = oldMenber.superAwoken ?? null;
-		this.latent = oldMenber?.latent.concat() ?? [];
-		this.skillLevel = oldMenber.skillLevel ?? 0;
-		this.assist = oldMenber.assist ?? null;
-		this.isAssist = Boolean(isAssist !== undefined ? isAssist : oldMenber?.isAssist);
+		//this.index = oldmember?.index ?? 0;
+		this.id = oldmember?.id ?? 0;
+		//this.exp = oldmember?.exp ?? 0;
+		this.level = oldmember?.level ?? 1;
+		this.plus = oldmember?.plus ?? {hp:0,atk:0,rcv:0};
+		this.awoken = oldmember.awoken ?? 0;
+		this.superAwoken = oldmember.superAwoken ?? null;
+		this.latent = oldmember?.latent.concat() ?? [];
+		this.skillLevel = oldmember.skillLevel ?? 0;
+		this.assist = oldmember.assist ?? null;
+		this.isAssist = Boolean(isAssist !== undefined ? isAssist : oldmember?.isAssist);
 	}
 	calculateAbility(solo,teamCount){
 		const card = Cards[this.id];
@@ -1665,7 +1665,7 @@ function initialize(event) {
 
 	//显示CD开关
 	const btnShowMonSkillCd = document.getElementById("show-mon-skill-cd");
-	btnShowMonSkillCd.checked = localStorage_getBoolean(cfgPrefix + btnShowMonSkillCd.id);
+	btnShowMonSkillCd.checked = localStorage_getBoolean(cfgPrefix + btnShowMonSkillCd.id, true);
 	btnShowMonSkillCd.onchange = function(e){
 		toggleDomClassName(this.checked, this.id);
 		if (e) localStorage.setItem(cfgPrefix + this.id, Number(this.checked));
@@ -1682,12 +1682,14 @@ function initialize(event) {
 	btnShowMonAwoken.onchange(false);
 	
 	//3P显示觉醒统计开关
-	let btnShowAwokenCount = document.getElementById("show-awoken-count");
+	const btnShowAwokenCount = document.getElementById("show-awoken-count");
 	if (btnShowAwokenCount) {
-		btnShowAwokenCount.onclick = function() {
-			toggleDomClassName(!this.checked, 'not-show-awoken-count');
-		}
-		btnShowAwokenCount.onclick();
+		btnShowAwokenCount.checked = localStorage_getBoolean(cfgPrefix + btnShowAwokenCount.id, true);
+		btnShowAwokenCount.onchange = function(e){
+			toggleDomClassName(this.checked, this.id);
+			if (e) localStorage.setItem(cfgPrefix + this.id, Number(this.checked));
+		};
+		btnShowAwokenCount.onchange(false);
 	}
 
 	//默认等级
@@ -2202,9 +2204,9 @@ function initialize(event) {
 	//将所有怪物头像添加到全局数组
 	teamBigBoxs.forEach(teamBigBox => {
 		const teamBox = teamBigBox.querySelector(".team-box");
-		const menbers = Array.from(teamBox.querySelectorAll(".team-members .monster"));
+		const members = Array.from(teamBox.querySelectorAll(".team-members .monster"));
 		const assist = Array.from(teamBox.querySelectorAll(".team-assist .monster"));
-		menbers.forEach(m => {
+		members.forEach(m => {
 			allMembers.push(m);
 		});
 		assist.forEach(m => {
@@ -3857,9 +3859,12 @@ function initialize(event) {
 			const formationTotalInfoDom = formationBox.querySelector(".formation-total-info"); //所有队伍能力值合计
 			if (formationTotalInfoDom) refreshFormationTotalHP(formationTotalInfoDom, formation.teams);
 	
-			const teamMenberAwokenDom = teamBigBox.querySelector(".team-menber-awoken"); //队员觉醒
+			const teamMemberTypesDom = teamBigBox.querySelector(".team-member-types"); //队员类型
+			if (teamMemberTypesDom) refreshmemberTypes(teamMemberTypesDom, teamData, editBox.memberIdx[2]); //刷新本人觉醒
+
+			const teamMemberAwokenDom = teamBigBox.querySelector(".team-member-awoken"); //队员觉醒
 			const teamAssistAwokenDom = teamBigBox.querySelector(".team-assist-awoken"); //辅助觉醒
-			if (teamMenberAwokenDom && teamAssistAwokenDom) refreshMenberAwoken(teamMenberAwokenDom, teamAssistAwokenDom, teamData, editBox.memberIdx[2]); //刷新本人觉醒
+			if (teamMemberAwokenDom && teamAssistAwokenDom) refreshmemberAwoken(teamMemberAwokenDom, teamAssistAwokenDom, teamData, editBox.memberIdx[2]); //刷新本人觉醒
 
 			const teamAwokenDom = teamBigBox.querySelector(".team-awoken"); //队伍觉醒合计
 			if (teamAwokenDom) refreshTeamAwokenCount(teamAwokenDom, teamData);
@@ -3931,9 +3936,9 @@ function initialize(event) {
 		const formationTotalInfoDom = formationBox.querySelector(".formation-total-info"); //所有队伍能力值合计
 		if (formationTotalInfoDom) refreshFormationTotalHP(formationTotalInfoDom, formation.teams);
 
-		const teamMenberAwokenDom = teamBigBox.querySelector(".team-menber-awoken"); //队员觉醒
+		const teamMemberAwokenDom = teamBigBox.querySelector(".team-member-awoken"); //队员觉醒
 		const teamAssistAwokenDom = teamBigBox.querySelector(".team-assist-awoken"); //辅助觉醒
-		if (teamMenberAwokenDom && teamAssistAwokenDom) refreshMenberAwoken(teamMenberAwokenDom, teamAssistAwokenDom, teamData, editBox.memberIdx[2]); //刷新本人觉醒
+		if (teamMemberAwokenDom && teamAssistAwokenDom) refreshmemberAwoken(teamMemberAwokenDom, teamAssistAwokenDom, teamData, editBox.memberIdx[2]); //刷新本人觉醒
 
 		const teamAwokenDom = teamBigBox.querySelector(".team-awoken"); //队伍觉醒合计
 		if (teamAwokenDom) refreshTeamAwokenCount(teamAwokenDom, teamData);
@@ -4057,11 +4062,15 @@ function changeid(mon, monDom, latentDom, assist) {
 		monDom.querySelector(".property").setAttribute("data-property", card.attrs[0]); //主属性
 		let subAttribute = card.attrs[1]; //正常的副属性
 		let assistCard = Cards[assist?.id];
-		if (assistCard && assistCard.awakenings.includes(49)) {  //如果传入了辅助武器
-			let changeAttr = assistCard.awakenings.find(ak=>ak >= 91 && ak <= 95); //搜索改副属性的觉醒
-			if (changeAttr) subAttribute = changeAttr - 91; //更改副属性
+		let changeAttr;
+		if (assistCard && assistCard.awakenings.includes(49) &&  //如果传入了辅助武器
+			(changeAttr = assistCard.awakenings.find(ak=>ak >= 91 && ak <= 95)) //搜索改副属性的觉醒
+		) {
+			subAttribute = changeAttr - 91; //更改副属性
 		}
-		monDom.querySelector(".subproperty").setAttribute("data-property", subAttribute); //副属性
+		const subAttrDom = monDom.querySelector(".subproperty"); //副属性
+		subAttrDom.setAttribute("data-property", subAttribute); //副属性
+		subAttrDom.classList.toggle("changed-sub-attr", Boolean(changeAttr));
 
 		monDom.title = "No." + monId + " " + (card.otLangName ? (card.otLangName[currentLanguage.searchlist[0]] || card.name) : card.name);
 		monDom.href = currentLanguage.guideURL(monId, card.name);
@@ -4597,8 +4606,10 @@ function refreshAll(formationData) {
 		const latentsDom = teamBox.querySelector(".team-latents");
 		const assistsDom = teamBox.querySelector(".team-assist");
 		const teamAbilityDom = teamBigBox.querySelector(".team-ability");
-		const teamMenberAwokenDom = teamBigBox.querySelector(".team-menber-awoken"); //队员觉醒
+		const teamMemberTypesDom = teamBigBox.querySelector(".team-member-types"); //队员类型
+		const teamMemberAwokenDom = teamBigBox.querySelector(".team-member-awoken"); //队员觉醒
 		const teamAssistAwokenDom = teamBigBox.querySelector(".team-assist-awoken"); //辅助觉醒
+		
 		for (let ti = 0, ti_len = membersDom.querySelectorAll(".member").length; ti < ti_len; ti++) {
 			//开始设置换队长
 			const leaderIdx = teamData[3];
@@ -4606,9 +4617,9 @@ function refreshAll(formationData) {
 			const latentLi = latentsDom.querySelector(`.latents-${ti+1}`);
 			const assistsLi = assistsDom.querySelector(`.member-${ti+1}`);
 			const teamAbilityLi = teamAbilityDom ? teamAbilityDom.querySelector(`.abilitys-${ti+1}`) : undefined;
-			const teamMenberAwokenLi = teamAbilityDom ? teamMenberAwokenDom.querySelector(`.menber-awoken-${ti+1}`) : undefined;
-			const teamAssistAwokenLi = teamAbilityDom ? teamAssistAwokenDom.querySelector(`.menber-awoken-${ti+1}`) : undefined;
-			[memberLi,latentLi,assistsLi,teamAbilityLi,teamMenberAwokenLi,teamAssistAwokenLi].forEach(dom=>{
+			const teamMemberAwokenLi = teamAbilityDom ? teamMemberAwokenDom.querySelector(`.member-awoken-${ti+1}`) : undefined;
+			const teamAssistAwokenLi = teamAbilityDom ? teamAssistAwokenDom.querySelector(`.member-awoken-${ti+1}`) : undefined;
+			[memberLi,latentLi,assistsLi,teamAbilityLi,teamMemberAwokenLi,teamAssistAwokenLi].forEach(dom=>{
 				if (!dom)
 				{
 					return;
@@ -4651,7 +4662,8 @@ function refreshAll(formationData) {
 			}
 			refreshMemberSkillCD(teamBox, teamData, ti); //技能CD
 			refreshAbility(teamAbilityDom, teamData, ti); //本人能力值
-			refreshMenberAwoken(teamMenberAwokenDom, teamAssistAwokenDom, teamData, ti); //本人觉醒
+			refreshmemberAwoken(teamMemberAwokenDom, teamAssistAwokenDom, teamData, ti); //本人觉醒
+			refreshmemberTypes(teamMemberTypesDom, teamData, ti); //本人类型
 
 		}
 		const teamTotalInfoDom = teamBigBox.querySelector(".team-total-info"); //队伍能力值合计
@@ -4774,9 +4786,25 @@ function refreshAbility(abilityDom, team, idx) {
 		}
 	});
 }
+//刷新队员
+function refreshmemberTypes(memberTypesDom, team, idx) {
+	if (!memberTypesDom) return; //如果没有dom，直接跳过
+	const member = team[0][idx];
+	const assist = team[1][idx];
+	const {types = []} = member.getAttrsTypesWithWeapon(assist) || {};
+	const memberTypesUl = memberTypesDom.querySelector(`.member-types-${idx + 1} .types-ul`);
+	memberTypesUl.innerHTML = '';
+	types.forEach(akc=>{
+		const iconLi = document.createElement("li");
+		const icon = iconLi.appendChild(document.createElement("icon"))
+		icon.className = "type";
+		icon.setAttribute("data-type-icon", akc);
+		memberTypesUl.appendChild(iconLi);
+	});
+}
 //刷新队员觉醒
-function refreshMenberAwoken(menberAwokenDom, assistAwokenDom, team, idx) {
-	if (!menberAwokenDom) return; //如果没有dom，直接跳过
+function refreshmemberAwoken(memberAwokenDom, assistAwokenDom, team, idx) {
+	if (!memberAwokenDom) return; //如果没有dom，直接跳过
 
 	const memberData = team[0][idx];
 	const assistData = team[1][idx];
@@ -4784,7 +4812,7 @@ function refreshMenberAwoken(menberAwokenDom, assistAwokenDom, team, idx) {
 	const memberCard = Cards[memberData.id] || Cards[0];
 	const assistCard = Cards[assistData.id] || Cards[0];
 	//队员觉醒
-	let menberAwokens = memberCard?.awakenings?.slice(0,memberData.awoken) || [];
+	let memberAwokens = memberCard?.awakenings?.slice(0,memberData.awoken) || [];
 	//单人和三人为队员增加超觉醒
 	if ((solo || teamsCount === 3) &&
 		memberData.sawoken != null && //怪物设定了超觉醒
@@ -4793,20 +4821,20 @@ function refreshMenberAwoken(menberAwokenDom, assistAwokenDom, team, idx) {
 		memberData.level >= 100 && //怪物大于100级
 		memberData.plus.every(p=>p>=99) //怪物297了
 	) {
-		menberAwokens.push(memberCard.superAwakenings[memberData.sawoken]);
+		memberAwokens.push(memberCard.superAwakenings[memberData.sawoken]);
 	}
-	//menberAwokens.sort();
+	//memberAwokens.sort();
 	//武器觉醒
 	let assistAwokens = assistCard?.awakenings?.slice(0,assistData?.awoken);
 	if (!assistAwokens?.includes(49)) assistAwokens = []; //清空非武器的觉醒
 	//assistAwokens.sort();
 	/*if (assistAwokens.includes(49))
 	{
-		menberAwokens = menberAwokens.concat(assistAwokens);
+		memberAwokens = memberAwokens.concat(assistAwokens);
 	}*/
 
-	const menberAwokenUl = menberAwokenDom.querySelector(`.menber-awoken-${idx + 1} .awoken-ul`);
-	const assistAwokenUl = assistAwokenDom.querySelector(`.menber-awoken-${idx + 1} .awoken-ul`);
+	const memberAwokenUl = memberAwokenDom.querySelector(`.member-awoken-${idx + 1} .awoken-ul`);
+	const assistAwokenUl = assistAwokenDom.querySelector(`.member-awoken-${idx + 1} .awoken-ul`);
 	/* //通用的
 	function countNum(arr) {
 		const map = arr.reduce(function(preMap, value){
@@ -4830,16 +4858,16 @@ function refreshMenberAwoken(menberAwokenDom, assistAwokenDom, team, idx) {
 	/*const hideAwokens = [49,1,2,3,63];
 	if (solo) hideAwokens.push(30); //协力觉醒
 	if (!solo) hideAwokens.push(63); //掉落觉醒
-	menberAwokens = menberAwokens.filter(ak=>!hideAwokens.includes(ak));*/
-	let menberAwokensCount = countAwokenNum(menberAwokens);
-	menberAwokenUl.innerHTML = '';
-	menberAwokensCount.forEach(akc=>{
+	memberAwokens = memberAwokens.filter(ak=>!hideAwokens.includes(ak));*/
+	let memberAwokensCount = countAwokenNum(memberAwokens);
+	memberAwokenUl.innerHTML = '';
+	memberAwokensCount.forEach(akc=>{
 		const iconLi = document.createElement("li");
 		const icon = iconLi.appendChild(document.createElement("icon"))
 		icon.className = "awoken-icon";
 		icon.setAttribute("data-awoken-icon", akc[0]);
 		icon.setAttribute("data-awoken-count", akc[1]);
-		menberAwokenUl.appendChild(iconLi);
+		memberAwokenUl.appendChild(iconLi);
 	});
 	let assistAwokensCount = countAwokenNum(assistAwokens);
 	assistAwokenUl.innerHTML = '';
diff --git a/service-worker.js b/service-worker.js
index 3c6a9e2c..55be8d7d 100644
--- a/service-worker.js
+++ b/service-worker.js
@@ -6403,7 +6403,7 @@ const cachesMap = new Map([
 	],
 	[
 		"multi.html",
-		"ad66ab8834ff0bfd303ef03b845ba3ed"
+		"a1c212daf1fe94a33b221bd16e470dc0"
 	],
 	[
 		"script-custom_elements.js",
@@ -6419,15 +6419,15 @@ const cachesMap = new Map([
 	],
 	[
 		"script-universal_function.js",
-		"a955fc3128b5eac6c706f68f81b4a542"
+		"8ebe963ec3181f8107c2cd1efa6bc331"
 	],
 	[
 		"script.js",
-		"ef50bfa5710dde66406306022babe2ea"
+		"42ff3fbd5ef69f883990ee6ce5f2374c"
 	],
 	[
 		"solo.html",
-		"3b847e1d747d10bbc3eadc77b59262f2"
+		"4a34d4cca701980ed12b011b32191fe5"
 	],
 	[
 		"style-monsterimages.css",
@@ -6435,7 +6435,7 @@ const cachesMap = new Map([
 	],
 	[
 		"style.css",
-		"4ccfe1b0717399397bcbe46d85e20646"
+		"85229ae25fda96a6126c20ae41aaddac"
 	],
 	[
 		"temp.js",
@@ -6443,7 +6443,7 @@ const cachesMap = new Map([
 	],
 	[
 		"triple.html",
-		"831ab332be5a0d35e1c8ff48d79c3ca2"
+		"8fbb7d75b4d3c69b338f61f76f2fb74e"
 	],
 	[
 		"languages/en.css",
diff --git a/solo.html b/solo.html
index 7ba6a3fb..d8029b19 100644
--- a/solo.html
+++ b/solo.html
@@ -61,6 +61,7 @@ var formation = new Formation(teamsCount,6);
 		<div>
 			<input type="checkbox" class="config-checkbox-ipt" name="show-mon-id" id="show-mon-id"><label class="config-checkbox-lbl show-mon-id-lbl" for="show-mon-id"><div class="config-checkbox-lbl-cicle"></div></label>
 			<input type="checkbox" class="config-checkbox-ipt" name="show-mon-skill-cd" id="show-mon-skill-cd"><label class="config-checkbox-lbl show-mon-skill-cd-lbl" for="show-mon-skill-cd"><div class="config-checkbox-lbl-cicle"></div></label>
+			<input type="checkbox" class="config-checkbox-ipt" name="show-awoken-count" id="show-awoken-count" checked><label class="config-checkbox-lbl show-awoken-count-lbl" for="show-awoken-count"><div class="config-checkbox-lbl-cicle"></div></label>
 			<input type="checkbox" class="config-checkbox-ipt" name="show-mon-awoken" id="show-mon-awoken"><label class="config-checkbox-lbl show-mon-awoken-lbl" for="show-mon-awoken"><div class="config-checkbox-lbl-cicle"></div></label>
 			<input type="checkbox" name="change-swap-to-copy" id="change-swap-to-copy"><label class="config-checkbox-lbl change-swap-to-copy-lbl" for="change-swap-to-copy"></label>
 		</div>
@@ -310,6 +311,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -323,6 +325,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -336,6 +339,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -349,6 +353,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -362,6 +367,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -375,6 +381,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -383,54 +390,80 @@ var formation = new Formation(teamsCount,6);
 						</ul>
 					</div>
 				</div>
-				<ul class="team-menber-awoken">
-					<li class="menber-awoken menber-awoken-1">
+				<ul class="team-member-types">
+					<li class="member-types member-types-1">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-2">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-3">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-4">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-5">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-6">
+						<ul class="types-ul">
+						</ul>
+					</li>
+				</ul>
+				<ul class="team-member-awoken">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-6">
+					<li class="member-awoken member-awoken-6">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
 				</ul>
 				<ul class="team-assist-awoken">
-					<li class="menber-awoken menber-awoken-1">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-6">
+					<li class="member-awoken member-awoken-6">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
diff --git a/style.css b/style.css
index 34a0784b..7463ca37 100644
--- a/style.css
+++ b/style.css
@@ -377,6 +377,19 @@ ul{
 	background-image: url(images/CARDFRAME2.PNG);
 	background-position: 100px 100px; /*默认都不显示*/
 }
+.subproperty.changed-sub-attr::before {
+	content: "111";
+	right: 3px;
+	bottom: 5px;
+	width: 22px;
+	height: 22px;
+	box-sizing: border-box;
+	border: 1px solid white;
+	border-radius: 50%;
+	box-shadow: 0 0 3px white,0 0 3px white,0 0 3px white;
+	display: block;
+	position: absolute;
+}
 /*怪物-加值*/
 .monster .plus{
 	color: yellow;
@@ -615,18 +628,17 @@ ul{
 	opacity: 0.5;
 }
 
-.not-show-awoken-count .formation-box .team-total-info, /*单个队伍血量统计*/
+.not-show-awoken-count:not(.solo) .formation-box .team-total-info, /*单个队伍血量统计*/
 .not-show-awoken-count .formation-box .team-ability, /*单个队伍三维*/
-.not-show-awoken-count .formation-box .team-awoken, /*单个队伍觉醒统计*/
-.not-show-awoken-count .formation-box .team-total-info /*单个队伍血量统计*/
+.not-show-awoken-count .formation-box .team-awoken /*单个队伍觉醒统计*/
 {
 	display: none !important;
 }
-.not-show-awoken-count .formation-box .team-bigbox
+.not-show-awoken-count:not(.solo) .formation-box .team-bigbox
 {
 	margin-bottom: 5px;
 }
-.not-show-awoken-count .formation-box .team-badge
+.not-show-awoken-count:not(.solo) .formation-box .team-badge
 {
 	position: absolute;
 	z-index: 10;
@@ -1163,27 +1175,37 @@ icon.inflicts::after
 .abilitys .rcv::before{
 	content: "回复：";
 }*/
+.types-ul {
+	display: grid;
+	grid-auto-flow: column;
+}
 /*队员觉醒统计*/
-.menber-awoken
+.member-awoken,
+.member-types
 {
 	width: var(--head-block-width);
 	display: inline-block;
 	vertical-align: top;
 }
-.team-menber-awoken,
+.team-member-awoken,
 .team-assist-awoken
 {
 	margin-top: 3px;
 	display : none;	
 }
-.menber-awoken .awoken-ul
+.member-awoken .awoken-ul,
+.member-types .types-ul
 {
-	grid-template-columns: repeat(3, 25.6px);
 	grid-auto-rows:  25.6px;
 	grid-gap: 2px;
 	place-content: start center;
 }
-.menber-awoken .awoken-icon
+.member-awoken .awoken-ul
+{
+	grid-template-columns: repeat(3, 25.6px);
+}
+.member-awoken .awoken-icon,
+.member-types .type
 {
 	filter: unset;
 	transform: scale(0.80);
@@ -1191,13 +1213,15 @@ icon.inflicts::after
 }
 .tIf-addition-info,
 .team-assist-awoken,
-.team-menber-awoken
+.team-member-awoken,
+.team-member-types
 {
 	display : none;	
 }
 .show-mon-awoken .tIf-addition-info,
 .show-mon-awoken .team-assist-awoken,
-.show-mon-awoken .team-menber-awoken
+.show-mon-awoken .team-member-awoken,
+.show-mon-awoken .team-member-types
 {
 	display : block;	
 }
@@ -1785,7 +1809,8 @@ icon.inflicts::after
 {
 	animation: icon-active 0.2s;
 }
-.awoken-ul {
+.awoken-ul
+{
 	display: grid;
 	grid-template-columns: repeat(auto-fill, 32px);
 	grid-auto-rows: 32px;
diff --git a/triple.html b/triple.html
index 9fe9ebce..85273910 100644
--- a/triple.html
+++ b/triple.html
@@ -75,8 +75,8 @@ var formation = new Formation(teamsCount,6);
 		<div>
 			<input type="checkbox" class="config-checkbox-ipt" name="show-mon-id" id="show-mon-id"><label class="config-checkbox-lbl show-mon-id-lbl" for="show-mon-id"><div class="config-checkbox-lbl-cicle"></div></label>
 			<input type="checkbox" class="config-checkbox-ipt" name="show-mon-skill-cd" id="show-mon-skill-cd"><label class="config-checkbox-lbl show-mon-skill-cd-lbl" for="show-mon-skill-cd"><div class="config-checkbox-lbl-cicle"></div></label>
-			<input type="checkbox" class="config-checkbox-ipt" name="show-mon-awoken" id="show-mon-awoken"><label class="config-checkbox-lbl show-mon-awoken-lbl" for="show-mon-awoken"><div class="config-checkbox-lbl-cicle"></div></label>
 			<input type="checkbox" class="config-checkbox-ipt" name="show-awoken-count" id="show-awoken-count" checked><label class="config-checkbox-lbl show-awoken-count-lbl" for="show-awoken-count"><div class="config-checkbox-lbl-cicle"></div></label>
+			<input type="checkbox" class="config-checkbox-ipt" name="show-mon-awoken" id="show-mon-awoken"><label class="config-checkbox-lbl show-mon-awoken-lbl" for="show-mon-awoken"><div class="config-checkbox-lbl-cicle"></div></label>
 			<input type="checkbox" name="change-swap-to-copy" id="change-swap-to-copy"><label class="config-checkbox-lbl change-swap-to-copy-lbl" for="change-swap-to-copy"></label>
 		</div>
 		<div class="status"><span class="icon"></span><span class="text"></span></div>
@@ -325,6 +325,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -338,6 +339,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -351,6 +353,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -364,6 +367,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -377,6 +381,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -390,6 +395,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -398,54 +404,80 @@ var formation = new Formation(teamsCount,6);
 						</ul>
 					</div>
 				</div>
-				<ul class="team-menber-awoken">
-					<li class="menber-awoken menber-awoken-1">
+				<ul class="team-member-types">
+					<li class="member-types member-types-1">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-2">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-3">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-4">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-5">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-6">
+						<ul class="types-ul">
+						</ul>
+					</li>
+				</ul>
+				<ul class="team-member-awoken">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-6">
+					<li class="member-awoken member-awoken-6">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
 				</ul>
 				<ul class="team-assist-awoken">
-					<li class="menber-awoken menber-awoken-1">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-6">
+					<li class="member-awoken member-awoken-6">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
@@ -804,6 +836,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -817,6 +850,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -830,6 +864,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -843,6 +878,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -856,6 +892,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -869,6 +906,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -877,54 +915,80 @@ var formation = new Formation(teamsCount,6);
 						</ul>
 					</div>
 				</div>
-				<ul class="team-menber-awoken">
-					<li class="menber-awoken menber-awoken-1">
+				<ul class="team-member-types">
+					<li class="member-types member-types-1">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-2">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-3">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-4">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-5">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-6">
+						<ul class="types-ul">
+						</ul>
+					</li>
+				</ul>
+				<ul class="team-member-awoken">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-6">
+					<li class="member-awoken member-awoken-6">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
 				</ul>
 				<ul class="team-assist-awoken">
-					<li class="menber-awoken menber-awoken-1">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-6">
+					<li class="member-awoken member-awoken-6">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
@@ -1283,6 +1347,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -1296,6 +1361,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -1309,6 +1375,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -1322,6 +1389,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -1335,6 +1403,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -1348,6 +1417,7 @@ var formation = new Formation(teamsCount,6);
 									<div class="awoken-count-num"></div>
 									<div class="super-awoken display-none"><div class="awoken-icon"></div></div>
 									<div class="level"></div>
+									<div class="rarity"></div>
 									<div class="id"></div>
 									<div class="skill-cd"></div>
 									<div class="switch-leader display-none"></div>
@@ -1356,54 +1426,80 @@ var formation = new Formation(teamsCount,6);
 						</ul>
 					</div>
 				</div>
-				<ul class="team-menber-awoken">
-					<li class="menber-awoken menber-awoken-1">
+				<ul class="team-member-types">
+					<li class="member-types member-types-1">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-2">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-3">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-4">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-5">
+						<ul class="types-ul">
+						</ul>
+					</li>
+					<li class="member-types member-types-6">
+						<ul class="types-ul">
+						</ul>
+					</li>
+				</ul>
+				<ul class="team-member-awoken">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-6">
+					<li class="member-awoken member-awoken-6">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
 				</ul>
 				<ul class="team-assist-awoken">
-					<li class="menber-awoken menber-awoken-1">
+					<li class="member-awoken member-awoken-1">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-2">
+					<li class="member-awoken member-awoken-2">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-3">
+					<li class="member-awoken member-awoken-3">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-4">
+					<li class="member-awoken member-awoken-4">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-5">
+					<li class="member-awoken member-awoken-5">
 						<ul class="awoken-ul">
 						</ul>
 					</li>
-					<li class="menber-awoken menber-awoken-6">
+					<li class="member-awoken member-awoken-6">
 						<ul class="awoken-ul">
 						</ul>
 					</li>