更新x1.5倍伤害上限的显示

This commit is contained in:
枫谷剑仙 2021-10-15 17:17:57 +08:00
parent 7e18ea0962
commit c328d85629
8 changed files with 218 additions and 153 deletions

BIN
images/icon-latent.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 84 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 284 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 372 KiB

View File

@ -11,9 +11,11 @@
}
.latent-icon[data-latent-icon='17']::before,
.latent-icon[data-latent-icon='37']::before,
.latent-icon[data-latent-icon='39']::before
.latent-icon[data-latent-icon='39']::before,
.team-latents .latent-icon[data-latent-icon='37']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='39']+.latent-icon::before
{
background-position-x: -252px;
background-position-x: -32px;
}
.tIf-total-hp .awoken-bind::before,
@ -28,5 +30,5 @@
.icon-skill[data-icon-type="damage-absorb"],
.icon-skill[data-icon-type="damage-void"]
{
background-position-x: calc(-36px * 1);
background-position-x: -36px;
}

View File

@ -3354,7 +3354,8 @@ function initialize(event) {
//已有觉醒的去除
function deleteLatent(e) {
const aIdx = editBox.latent.indexOf(parseInt(this.getAttribute("data-latent-icon")));
const lIdx = parseInt(this.getAttribute("data-latent-icon"), 10); //潜觉的序号
const aIdx = editBox.latent.indexOf(lIdx);
if (aIdx >= 0)
{
editBox.latent.splice(aIdx, 1);
@ -3401,7 +3402,9 @@ function initialize(event) {
awoken: awoken,
latent: latent
};
const abilitys = calculateAbility(tempMon, null, solo, teamsCount);
toggleDomClassName(level > 110, "level-super-break", monEditLatentUl); //切换潜觉为120级
monEditHpValue.textContent = abilitys ? abilitys[0][0].toLocaleString() : 0;
monEditAtkValue.textContent = abilitys ? abilitys[1][0].toLocaleString() : 0;
@ -3692,7 +3695,7 @@ function changeid(mon, monDom, latentDom) {
}
const levelDom = monDom.querySelector(".level");
if (levelDom) { //如果提供了等级
const level = mon.level || 1;
const level = mon.level ?? 1;
levelDom.setAttribute(dataAttrName, level);
toggleDomClassName(level === card.maxLevel, "max", levelDom);
@ -3755,14 +3758,16 @@ function changeid(mon, monDom, latentDom) {
if (latentDom) {
if (mon.latent) //如果提供了潜觉
{
const level = mon.level ?? 1;
const latent = mon.latent;
if (latent.length < 1) {
latentDom.classList.add(className_displayNone);
} else {
const latentDoms = Array.from(latentDom.querySelectorAll("li"));
refreshLatent(latent, mon.id, latentDoms);
refreshLatent(latent, mon.id, latentDoms, {sort:true});
latentDom.classList.remove(className_displayNone);
}
toggleDomClassName(level > 110, "level-super-break", latentDom); //切换潜觉为120级
} else {
latentDom.classList.add(className_displayNone);
}
@ -3809,9 +3814,10 @@ function changeid(mon, monDom, latentDom) {
parentNode.appendChild(fragment);
}
//刷新潜觉
function refreshLatent(latent, monid, iconArr) {
function refreshLatent(latent, monid, iconArr, option) {
const maxLatentCount = getMaxLatentCount(monid); //最大潜觉数量
latent = latent.concat().sort((a, b) => latentUseHole(b) - latentUseHole(a));
latent = latent.concat();
if (option?.sort) latent.sort((a, b) => latentUseHole(b) - latentUseHole(a));
let latentIndex = 0,
usedHoleN = 0;
for (let ai = 0; ai < iconArr.length; ai++) {
@ -3828,8 +3834,8 @@ function refreshLatent(latent, monid, iconArr) {
icon.removeAttribute("data-latent-icon");
} else if (ai < maxLatentCount) //没有使用的空格觉醒
{
icon.removeAttribute("data-latent-icon");
icon.classList.remove(className_displayNone);
icon.removeAttribute("data-latent-icon");
} else //不需要显示的部分
{
icon.classList.add(className_displayNone);

View File

@ -701,21 +701,26 @@ icon.type
/*潜在觉醒*/
.latent-icon{
display:inline-block;
text-align: center;
background: rgba(33,28,21,0.5);
border: 2px ridge rgba(82,82,60,0.5);
border-radius: 5px;
box-sizing: border-box;
box-shadow:inset 0 2px 1px -1px rgba(0,0,0,0.5);
}
.latent-icon::before{
content: "";
.latent-icon::before,
.ds-ja .latent-icon::after /*目前x1.5暂时只有日服支持,美服支持后删除.ds-ja*/
{
display: inline-block;
margin: -2px;
width: 32px;
height: 32px;
background-image: url(images/latent.png);
background-image: url(images/icon-latent.png);
background-repeat: no-repeat;
}
.latent-icon::before{
content: "";
}
.latent-icon.latent-lock::before{
background-position-x: -32px;
}
@ -727,43 +732,51 @@ icon.type
.latent-icon[data-latent-icon]::before{
background-position-x: 0;
}
.latent-icon[data-latent-icon='12']::before,
.latent-icon[data-latent-icon='16']::before,
.latent-icon[data-latent-icon='17']::before,
.latent-icon[data-latent-icon='18']::before,
.latent-icon[data-latent-icon='19']::before,
.latent-icon[data-latent-icon='20']::before,
.latent-icon[data-latent-icon='21']::before,
.latent-icon[data-latent-icon='22']::before,
.latent-icon[data-latent-icon='23']::before,
.latent-icon[data-latent-icon='24']::before,
.latent-icon[data-latent-icon='25']::before,
.latent-icon[data-latent-icon='26']::before,
.latent-icon[data-latent-icon='27']::before,
.latent-icon[data-latent-icon='28']::before,
.latent-icon[data-latent-icon='29']::before,
.latent-icon[data-latent-icon='30']::before,
.latent-icon[data-latent-icon='31']::before,
.latent-icon[data-latent-icon='32']::before,
.latent-icon[data-latent-icon='33']::before,
.latent-icon[data-latent-icon='34']::before,
.latent-icon[data-latent-icon='35']::before,
.latent-icon[data-latent-icon='36']::before,
.latent-icon[data-latent-icon='43']::before,
.latent-icon[data-latent-icon='44']::before,
.latent-icon[data-latent-icon='45']::before
/* 2格的 潜觉 */
.m-latent-ul .latent-icon[data-latent-icon='12'],
.m-latent-ul .latent-icon[data-latent-icon='16'],
.m-latent-ul .latent-icon[data-latent-icon='17'],
.m-latent-ul .latent-icon[data-latent-icon='18'],
.m-latent-ul .latent-icon[data-latent-icon='19'],
.m-latent-ul .latent-icon[data-latent-icon='20'],
.m-latent-ul .latent-icon[data-latent-icon='21'],
.m-latent-ul .latent-icon[data-latent-icon='22'],
.m-latent-ul .latent-icon[data-latent-icon='23'],
.m-latent-ul .latent-icon[data-latent-icon='24'],
.m-latent-ul .latent-icon[data-latent-icon='25'],
.m-latent-ul .latent-icon[data-latent-icon='26'],
.m-latent-ul .latent-icon[data-latent-icon='27'],
.m-latent-ul .latent-icon[data-latent-icon='28'],
.m-latent-ul .latent-icon[data-latent-icon='29'],
.m-latent-ul .latent-icon[data-latent-icon='30'],
.m-latent-ul .latent-icon[data-latent-icon='31'],
.m-latent-ul .latent-icon[data-latent-icon='32'],
.m-latent-ul .latent-icon[data-latent-icon='33'],
.m-latent-ul .latent-icon[data-latent-icon='34'],
.m-latent-ul .latent-icon[data-latent-icon='35'],
.m-latent-ul .latent-icon[data-latent-icon='36'],
.m-latent-ul .latent-icon[data-latent-icon='43'],
.m-latent-ul .latent-icon[data-latent-icon='44'],
.m-latent-ul .latent-icon[data-latent-icon='45']
{
width: 76px;
}
.latent-icon[data-latent-icon='13']::before,
.latent-icon[data-latent-icon='14']::before,
.latent-icon[data-latent-icon='15']::before,
.latent-icon[data-latent-icon='37']::before,
.latent-icon[data-latent-icon='38']::before,
.latent-icon[data-latent-icon='39']::before,
.latent-icon[data-latent-icon='40']::before,
.latent-icon[data-latent-icon='41']::before,
.latent-icon[data-latent-icon='42']::before
/* 特殊的 三维潜觉 */
.m-latent-ul .latent-icon[data-latent-icon='12']::before
{
width: 76px;
background-position-x: -32px;
}
/* 6格的 潜觉 */
.m-latent-ul .latent-icon[data-latent-icon='13'],
.m-latent-ul .latent-icon[data-latent-icon='14'],
.m-latent-ul .latent-icon[data-latent-icon='15'],
.m-latent-ul .latent-icon[data-latent-icon='37'],
.m-latent-ul .latent-icon[data-latent-icon='38'],
.m-latent-ul .latent-icon[data-latent-icon='39'],
.m-latent-ul .latent-icon[data-latent-icon='40'],
.m-latent-ul .latent-icon[data-latent-icon='41'],
.m-latent-ul .latent-icon[data-latent-icon='42']
{
width: 252px;
}
@ -902,7 +915,145 @@ icon.type
.latent-icon[data-latent-icon='45']::before{ /*回复++*/
background-position-y: calc(-32px * 45);
}
/* 队伍界面2格的 潜觉 */
.team-latents .latent-ul .latent-icon[data-latent-icon='12'],
.team-latents .latent-ul .latent-icon[data-latent-icon='16'],
.team-latents .latent-ul .latent-icon[data-latent-icon='17'],
.team-latents .latent-ul .latent-icon[data-latent-icon='18'],
.team-latents .latent-ul .latent-icon[data-latent-icon='19'],
.team-latents .latent-ul .latent-icon[data-latent-icon='20'],
.team-latents .latent-ul .latent-icon[data-latent-icon='21'],
.team-latents .latent-ul .latent-icon[data-latent-icon='22'],
.team-latents .latent-ul .latent-icon[data-latent-icon='23'],
.team-latents .latent-ul .latent-icon[data-latent-icon='24'],
.team-latents .latent-ul .latent-icon[data-latent-icon='25'],
.team-latents .latent-ul .latent-icon[data-latent-icon='26'],
.team-latents .latent-ul .latent-icon[data-latent-icon='27'],
.team-latents .latent-ul .latent-icon[data-latent-icon='28'],
.team-latents .latent-ul .latent-icon[data-latent-icon='29'],
.team-latents .latent-ul .latent-icon[data-latent-icon='30'],
.team-latents .latent-ul .latent-icon[data-latent-icon='31'],
.team-latents .latent-ul .latent-icon[data-latent-icon='32'],
.team-latents .latent-ul .latent-icon[data-latent-icon='33'],
.team-latents .latent-ul .latent-icon[data-latent-icon='34'],
.team-latents .latent-ul .latent-icon[data-latent-icon='35'],
.team-latents .latent-ul .latent-icon[data-latent-icon='36'],
.team-latents .latent-ul .latent-icon[data-latent-icon='43'],
.team-latents .latent-ul .latent-icon[data-latent-icon='44'],
.team-latents .latent-ul .latent-icon[data-latent-icon='45']
{
width: 70px;
}
/* 队伍界面特殊的 三维潜觉 */
.team-latents .latent-ul .latent-icon[data-latent-icon='12']::before
{
transform: scale(0.9);
margin-left: -5px;
width: 76px;
background-position-x: -32px;
}
/* 队伍界面6格的潜觉 */
.team-latents .latent-ul .latent-icon[data-latent-icon='13'],
.team-latents .latent-ul .latent-icon[data-latent-icon='14'],
.team-latents .latent-ul .latent-icon[data-latent-icon='15'],
.team-latents .latent-ul .latent-icon[data-latent-icon='37'],
.team-latents .latent-ul .latent-icon[data-latent-icon='38'],
.team-latents .latent-ul .latent-icon[data-latent-icon='39'],
.team-latents .latent-ul .latent-icon[data-latent-icon='40'],
.team-latents .latent-ul .latent-icon[data-latent-icon='41'],
.team-latents .latent-ul .latent-icon[data-latent-icon='42']
{
width: 146px;
margin-left: 0px;
border-radius: 5px 5px 5px 0;
}
.team-latents .latent-ul .latent-icon[data-latent-icon='13']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='14']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='15']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='37']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='38']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='39']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='40']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='41']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='42']::before
{
background: none;
}
.team-latents .latent-icon[data-latent-icon='13']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='14']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='15']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='37']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='38']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='39']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='40']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='41']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='42']+.latent-icon
{
width: 70px;
height: 39px;
margin-left: 0;
margin-right: 6px;
margin-bottom: -9px;
display: inline-block !important;
background: linear-gradient(#2277EE , #1155AA 80%);
border-color: #CCEEFF;
box-shadow: black 1px 1px 1px;
border-radius: 0 0 5px 5px;
border-top: none;
transform: translatey(-9px);
}
.team-latents .latent-icon[data-latent-icon='13']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='14']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='15']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='37']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='38']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='39']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='40']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='41']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='42']+.latent-icon::before
{
transform: scale(1.54) translateY(-7px);
}
.team-latents .latent-icon[data-latent-icon='13']+.latent-icon::before{
background-position-y: calc(-32px * 13);
}
.team-latents .latent-icon[data-latent-icon='14']+.latent-icon::before{
background-position-y: calc(-32px * 14);
}
.team-latents .latent-icon[data-latent-icon='15']+.latent-icon::before{
background-position-y: calc(-32px * 15);
}
.team-latents .latent-icon[data-latent-icon='37']+.latent-icon::before{
background-position-y: calc(-32px * 37);
}
.team-latents .latent-icon[data-latent-icon='38']+.latent-icon::before{
background-position-y: calc(-32px * 38);
}
.team-latents .latent-icon[data-latent-icon='39']+.latent-icon::before{
background-position-y: calc(-32px * 39);
}
.team-latents .latent-icon[data-latent-icon='40']+.latent-icon::before{
background-position-y: calc(-32px * 40);
}
.team-latents .latent-icon[data-latent-icon='41']+.latent-icon::before{
background-position-y: calc(-32px * 41);
}
.team-latents .latent-icon[data-latent-icon='42']+.latent-icon::before
{
background-position-y: calc(-32px * 42);
}
/* 额外有 x1.5 的 6格觉醒 */
.level-super-break .latent-icon[data-latent-icon='13']::after,
.level-super-break .latent-icon[data-latent-icon='37']::after,
.level-super-break .latent-icon[data-latent-icon='38']::after,
.level-super-break .latent-icon[data-latent-icon='39']::after,
.level-super-break .latent-icon[data-latent-icon='40']::after,
.level-super-break .latent-icon[data-latent-icon='41']::after
{
content: "";
background-position-x: -32px;
background-position-y: calc(-32px * 42);
}
/* 徽章背景 */
.badge{
background-image: url(images/badge-bg.png);

118
style.css
View File

@ -1043,112 +1043,12 @@ icon.inflicts::after
/*-152 * (1 - 0.63) + 108 - 152 * 0.63化简为108 - 152*/
min-height: 47px; /* 为了防止只有一层6格大潜觉的时候被缩减太多的问题*/
}
.team-latents .latent-icon
{
margin-top: 3px;
margin-left: 3px;
margin-right: 3px;
}
.team-latents .latent-icon[data-latent-icon='12'],
.team-latents .latent-icon[data-latent-icon='13'],
.team-latents .latent-icon[data-latent-icon='14'],
.team-latents .latent-icon[data-latent-icon='15'],
.team-latents .latent-icon[data-latent-icon='16'],
.team-latents .latent-icon[data-latent-icon='17'],
.team-latents .latent-icon[data-latent-icon='18'],
.team-latents .latent-icon[data-latent-icon='19'],
.team-latents .latent-icon[data-latent-icon='20'],
.team-latents .latent-icon[data-latent-icon='21'],
.team-latents .latent-icon[data-latent-icon='22'],
.team-latents .latent-icon[data-latent-icon='23'],
.team-latents .latent-icon[data-latent-icon='24'],
.team-latents .latent-icon[data-latent-icon='25'],
.team-latents .latent-icon[data-latent-icon='26'],
.team-latents .latent-icon[data-latent-icon='27'],
.team-latents .latent-icon[data-latent-icon='28'],
.team-latents .latent-icon[data-latent-icon='29'],
.team-latents .latent-icon[data-latent-icon='30'],
.team-latents .latent-icon[data-latent-icon='31'],
.team-latents .latent-icon[data-latent-icon='32'],
.team-latents .latent-icon[data-latent-icon='33'],
.team-latents .latent-icon[data-latent-icon='34'],
.team-latents .latent-icon[data-latent-icon='35'],
.team-latents .latent-icon[data-latent-icon='36'],
.team-latents .latent-icon[data-latent-icon='37'],
.team-latents .latent-icon[data-latent-icon='38'],
.team-latents .latent-icon[data-latent-icon='39'],
.team-latents .latent-icon[data-latent-icon='40'],
.team-latents .latent-icon[data-latent-icon='41'],
.team-latents .latent-icon[data-latent-icon='42'],
.team-latents .latent-icon[data-latent-icon='43'],
.team-latents .latent-icon[data-latent-icon='44'],
.team-latents .latent-icon[data-latent-icon='45']
{
margin-left: 0;
margin-right: 0;
}
.team-latents .latent-ul .latent-icon[data-latent-icon='13']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='14']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='15']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='37']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='38']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='39']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='40']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='41']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='42']::before
{ /*6格的潜觉*/
width: 152px;
margin-left: -50px;
margin-right: 47px;
}
.team-latents .latent-ul .latent-icon[data-latent-icon='13'],
.team-latents .latent-ul .latent-icon[data-latent-icon='14'],
.team-latents .latent-ul .latent-icon[data-latent-icon='15'],
.team-latents .latent-ul .latent-icon[data-latent-icon='37'],
.team-latents .latent-ul .latent-icon[data-latent-icon='38'],
.team-latents .latent-ul .latent-icon[data-latent-icon='39'],
.team-latents .latent-ul .latent-icon[data-latent-icon='40'],
.team-latents .latent-ul .latent-icon[data-latent-icon='41'],
.team-latents .latent-ul .latent-icon[data-latent-icon='42']
{
border-radius: 5px 5px 5px 0;
box-shadow: black 1px 1px 1px;
}
.team-latents .latent-icon[data-latent-icon='13']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='14']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='15']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='37']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='38']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='39']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='40']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='41']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='42']+.latent-icon
{
width: 76px;
margin-left: 0;
margin-right: 0;
display: inline-block !important;
background: linear-gradient(#2277EE , #1155AA 80%);
border-color: #CCEEFF;
box-shadow: black 1px 1px 1px;
border-radius: 0 0 5px 5px;
border-top: none;
margin-top: 4px;;
transform: translatey(-4px) scaley(1.2);
}
.team-latents .latent-icon[data-latent-icon='13']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='14']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='15']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='37']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='38']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='39']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='40']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='41']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='42']+.latent-icon::before
{
background: none;
margin-right: 6px;
}
/*队长的边框*/
.team-box .team-members .team-leader .monster
{
@ -2372,13 +2272,19 @@ icon.inflicts::after
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="24"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="25"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="26"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="27"]
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="27"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="13"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="14"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="15"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="37"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="38"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="39"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="40"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="41"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="42"]
{
display: inline-block;
}
.guide-mod .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="11"]{
display: none;
}
.hide-less-use-latent-label{
margin-left: 5px;
}