mapaler
/
PADDashFormation
1
0
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity

重新优化产珠面板

This commit is contained in:
枫谷剑仙 2022-11-27 17:59:53 +08:00
parent 242a99f15c
commit e55e35f9ad
9 changed files with 157 additions and 140 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
monsters-info/ckey.json
View File

@ -1 +1 @@
[{"code":"ja","ckey":{"card":"c6cdc2db4e909d26c3fa2035aab6ed00","skill":"90ffe1f0455cb0d76e000eb7cb901d29"},"updateTime":1669410746308},{"code":"en","ckey":{"card":"211dbc809ef5f4c8445c8bdc42ce46c6","skill":"81090369eff7c516843c20d385d3543c"},"updateTime":1669410746308},{"code":"ko","ckey":{"card":"dd2cf25f57eb7b5aba69cd48cbb30b0b","skill":"29fdbded544c840684c6b19bf085372e"},"updateTime":1669410746308}] [{"code":"ja","ckey":{"card":"57d9737ff6510747cb0d71e1081c2ad4","skill":"90ffe1f0455cb0d76e000eb7cb901d29"},"updateTime":1669543133962},{"code":"en","ckey":{"card":"211dbc809ef5f4c8445c8bdc42ce46c6","skill":"81090369eff7c516843c20d385d3543c"},"updateTime":1669410746308},{"code":"ko","ckey":{"card":"dd2cf25f57eb7b5aba69cd48cbb30b0b","skill":"29fdbded544c840684c6b19bf085372e"},"updateTime":1669410746308}]

2
monsters-info/custom/chs.json
View File

File diff suppressed because one or more lines are too long

2
monsters-info/custom/cht.json
View File

File diff suppressed because one or more lines are too long

2
monsters-info/mon_ja.json
View File

File diff suppressed because one or more lines are too long

47
script-skill-parser.js
View File

@ -124,26 +124,41 @@ class Block
class BoardSet class BoardSet
{ {
boards = []; boards = [];
node = document.createElement("div"); boardsLabel = [];
node = (()=>{
const div = document.createElement("div");
div.className = "board-set";
return div;
})();
constructor(...boards) { constructor(...boards) {
const boardSet = this;
const switchFunction = function(event){ //在65、76、54之间循环切换
if (event.ctrlKey) {
boardSet.boards.forEach(board=>board.tableNode.classList.remove(className_displayNone));
return;
}
let showIdx = boardSet.boards.findIndex(board=>!board.tableNode.classList.contains(className_displayNone));
if (showIdx < 0 || showIdx >= (boardSet.boards.length - 1)) showIdx = 0;
else showIdx++;
for (let i=0;i<boardSet.boards.length;i++) {
boardSet.boards[i].tableNode.classList.toggle(className_displayNone, i !== showIdx);
}
}
this.boards.push(...(boards.filter(board=>board instanceof Board))); this.boards.push(...(boards.filter(board=>board instanceof Board)));
this.boards.forEach((board, idx)=>{ this.boards.forEach((board, idx)=>{
this.node.appendChild(board.tableNode); this.node.appendChild(board.tableNode);
if (idx > 0) board.tableNode.classList.add(className_displayNone); const span = document.createElement("span");
span.dataset.columnCount = board.columnCount;
span.dataset.rowCount = board.rowCount;
span.onclick = switchFunction;
this.boardsLabel.push(span);
this.node.appendChild(span);
if (idx > 0) {
board.tableNode.classList.add(className_displayNone);
}
}); });
const _this = this;
this.node.onclick = function(event){ //在65、76、54之间循环切换
if (event.ctrlKey) { //如果按Ctrl，全部取消隐藏
_this.boards.forEach(board=>board.tableNode.classList.remove(className_displayNone));
return;
}
let showIdx = _this.boards.findIndex(board=>!board.tableNode.classList.contains(className_displayNone));
if (showIdx < 0 || showIdx >= (_this.boards.length - 1)) showIdx = 0;
else showIdx++;
for (let i=0;i<_this.boards.length;i++) {
_this.boards[i].tableNode.classList.toggle(className_displayNone, i !== showIdx);
}
}
} }
valueOf() { valueOf() {
return this.node; return this.node;
@ -2642,7 +2657,7 @@ function renderTypes(types, option = {}) {
const tsp = localTranslating.skill_parse; const tsp = localTranslating.skill_parse;
let contentFrg = types.map(type => { let contentFrg = types.map(type => {
const icon = document.createElement("icon"); const icon = document.createElement("icon");
icon.className = "type"; icon.className = "type-icon";
icon.setAttribute("data-type-icon",type); icon.setAttribute("data-type-icon",type);
return tsp.types?.[type]({icon: icon}); return tsp.types?.[type]({icon: icon});
}) })

2
script.js
View File

@ -4806,7 +4806,7 @@ function refreshmemberTypes(memberTypesDom, team, idx) {
for (let i = 0;i < types.length; i++) { for (let i = 0;i < types.length; i++) {
const iconLi = document.createElement("li"); const iconLi = document.createElement("li");
const icon = iconLi.appendChild(document.createElement("icon")) const icon = iconLi.appendChild(document.createElement("icon"))
icon.className = "type"; icon.className = "type-icon";
if (appendType && i == (types.length - 1)) icon.classList.add('append-type'); if (appendType && i == (types.length - 1)) icon.classList.add('append-type');
icon.setAttribute("data-type-icon", types[i]); icon.setAttribute("data-type-icon", types[i]);
memberTypesUl.appendChild(iconLi); memberTypesUl.appendChild(iconLi);

12
service-worker.js
View File

@ -6859,7 +6859,7 @@ const cachesMap = new Map([
], ],
[ [
"script-skill-parser.js", "script-skill-parser.js",
"316b65c35786bf506eb958a4bcbbc7c9" "3de96f6414c8428e4cc211cc9eddc728"
], ],
[ [
"script-universal_function.js", "script-universal_function.js",
@ -6867,7 +6867,7 @@ const cachesMap = new Map([
], ],
[ [
"script.js", "script.js",
"867ffd4f5f8ae904b02309cbb007f72c" "337d1ca9d001ae9aa32f3a678a0ea3fa"
], ],
[ [
"solo.html", "solo.html",
@ -6875,11 +6875,11 @@ const cachesMap = new Map([
], ],
[ [
"style-monsterimages.css", "style-monsterimages.css",
"db2a118da5c9a43a71d6a92f2165360e" "4ed903caecf58e157377f781341d47f0"
], ],
[ [
"style.css", "style.css",
"f9abc99beb74f6ecc06fc7bb271f3429" "7e73196e98955e5591f606e2560cc7a4"
], ],
[ [
"temp.js", "temp.js",
@ -7119,7 +7119,7 @@ const cachesMap = new Map([
], ],
[ [
"monsters-info/ckey.json", "monsters-info/ckey.json",
"9b3aa24beedf9d78a14922fd84a74329" "7dbe5b40d92c45b6f6cabef5dd125e0d"
], ],
[ [
"monsters-info/mon_en.json", "monsters-info/mon_en.json",
@ -7127,7 +7127,7 @@ const cachesMap = new Map([
], ],
[ [
"monsters-info/mon_ja.json", "monsters-info/mon_ja.json",
"c6cdc2db4e909d26c3fa2035aab6ed00" "57d9737ff6510747cb0d71e1081c2ad4"
], ],
[ [
"monsters-info/mon_ko.json", "monsters-info/mon_ko.json",

151
style-monsterimages.css
View File

@ -3,44 +3,31 @@
.property{ /*主属性*/ .property{ /*主属性*/
background-position-y: 0; background-position-y: 0;
} }
.property[data-property='-1'],
.subproperty[data-property='-1']
{
background: none; /*无*/
}
.property[data-property='0'],
.subproperty[data-property='0']
{
background-position-x: calc(-102px * 0); /*火*/
}
.property[data-property='1'],
.subproperty[data-property='1']
{
background-position-x: calc(-102px * 1); /*水*/
}
.property[data-property='2'],
.subproperty[data-property='2']
{
background-position-x: calc(-102px * 2); /*木*/
}
.property[data-property='3'],
.subproperty[data-property='3']
{
background-position-x: calc(-102px * 3); /*光*/
}
.property[data-property='4'],
.subproperty[data-property='4']
{
background-position-x: calc(-102px * 4); /*暗*/
}
.property[data-property='6']
{
background-image: url(images/CARDFRAMEW.PNG);
background-position: 0 0;
}
.subproperty{ /*副属性*/ .subproperty{ /*副属性*/
background-position-y: -104px; background-position-y: -104px;
} }
:where(.property, .subproperty)[data-property='-1'] {
background: none; /*无*/
}
:where(.property, .subproperty)[data-property='0'] {
background-position-x: calc(-102px * 0); /*火*/
}
:where(.property, .subproperty)[data-property='1'] {
background-position-x: calc(-102px * 1); /*水*/
}
:where(.property, .subproperty)[data-property='2'] {
background-position-x: calc(-102px * 2); /*木*/
}
:where(.property, .subproperty)[data-property='3'] {
background-position-x: calc(-102px * 3); /*光*/
}
:where(.property, .subproperty)[data-property='4'] {
background-position-x: calc(-102px * 4); /*暗*/
}
.property[data-property='6'] {
background-image: url(images/CARDFRAMEW.PNG);
background-position: 0 0;
}
/*宠物头像所用的图片*/ /*宠物头像所用的图片*/
.monster[data-cards-pic-idx='1']{background-image: url(images/cards_ja/CARDS_001.PNG);} .monster[data-cards-pic-idx='1']{background-image: url(images/cards_ja/CARDS_001.PNG);}
.monster[data-cards-pic-idx='2']{background-image: url(images/cards_ja/CARDS_002.PNG);} .monster[data-cards-pic-idx='2']{background-image: url(images/cards_ja/CARDS_002.PNG);}
@ -666,8 +653,7 @@
.monster[data-cards-pic-y='9']{background-position-y:calc(-102px * 9);} .monster[data-cards-pic-y='9']{background-position-y:calc(-102px * 9);}
/*觉醒、类型、潜觉*/ /*觉醒、类型、潜觉*/
.awoken-icon, .awoken-icon,
.type-icon, .type-icon
icon.type
{ {
display:inline-block; display:inline-block;
width:32px;height:32px; width:32px;height:32px;
@ -995,75 +981,61 @@ icon.type
background-position-y:calc(-32px * 104); background-position-y:calc(-32px * 104);
} }
/*类型*/ /*类型*/
.type-icon, .type-icon
icon.type
{ {
background-image: url(images/type.png); background-image: url(images/type.png);
background-position-x: 0; background-position-x: 0;
background-position-y: 32px; /*默认不显示*/ background-position-y: 32px; /*默认不显示*/
} }
.type-icon[data-type-icon='0'], .type-icon[data-type-icon='0']
.type[data-type-icon='0']
{/*进化用*/ {/*进化用*/
background-position-y:calc(-32px * 0); background-position-y:calc(-32px * 0);
} }
.type-icon[data-type-icon='1'], .type-icon[data-type-icon='1']
.type[data-type-icon='1']
{/*平衡*/ {/*平衡*/
background-position-y:calc(-32px * 1); background-position-y:calc(-32px * 1);
} }
.type-icon[data-type-icon='2'], .type-icon[data-type-icon='2']
.type[data-type-icon='2']
{/*体力*/ {/*体力*/
background-position-y:calc(-32px * 2); background-position-y:calc(-32px * 2);
} }
.type-icon[data-type-icon='3'], .type-icon[data-type-icon='3']
.type[data-type-icon='3']
{/*回复*/ {/*回复*/
background-position-y:calc(-32px * 3); background-position-y:calc(-32px * 3);
} }
.type-icon[data-type-icon='4'], .type-icon[data-type-icon='4']
.type[data-type-icon='4']
{/*龙*/ {/*龙*/
background-position-y:calc(-32px * 4); background-position-y:calc(-32px * 4);
} }
.type-icon[data-type-icon='5'], .type-icon[data-type-icon='5']
.type[data-type-icon='5']
{/*神*/ {/*神*/
background-position-y:calc(-32px * 5); background-position-y:calc(-32px * 5);
} }
.type-icon[data-type-icon='6'], .type-icon[data-type-icon='6']
.type[data-type-icon='6']
{/*攻击*/ {/*攻击*/
background-position-y:calc(-32px * 6); background-position-y:calc(-32px * 6);
} }
.type-icon[data-type-icon='7'], .type-icon[data-type-icon='7']
.type[data-type-icon='7']
{/*恶魔*/ {/*恶魔*/
background-position-y:calc(-32px * 7); background-position-y:calc(-32px * 7);
} }
.type-icon[data-type-icon='8'], .type-icon[data-type-icon='8']
.type[data-type-icon='8']
{/*机械*/ {/*机械*/
background-position-y:calc(-32px * 8); background-position-y:calc(-32px * 8);
} }
.type-icon[data-type-icon='9'], .type-icon[data-type-icon='9']
.type[data-type-icon='9']
{/*特别保护*/ {/*特别保护*/
background-position-y:calc(-32px * 9); background-position-y:calc(-32px * 9);
} }
.type-icon[data-type-icon='12'], .type-icon[data-type-icon='12']
.type[data-type-icon='12']
{/*能力觉醒用*/ {/*能力觉醒用*/
background-position-y:calc(-32px * 12); background-position-y:calc(-32px * 12);
} }
.type-icon[data-type-icon='14'], .type-icon[data-type-icon='14']
.type[data-type-icon='14']
{/*强化合成用*/ {/*强化合成用*/
background-position-y:calc(-32px * 14); background-position-y:calc(-32px * 14);
} }
.type-icon[data-type-icon='15'], .type-icon[data-type-icon='15']
.type[data-type-icon='15']
{/*贩卖用*/ {/*贩卖用*/
background-position-y:calc(-32px * 15); background-position-y:calc(-32px * 15);
} }
@ -1080,7 +1052,7 @@ icon.type
align-items: center; /*靠右*/ align-items: center; /*靠右*/
} }
.latent-icon::before, .latent-icon::before,
.latent-icon::after /*目前x1.5暂时只有日服支持，美服支持后删除.ds-ja*/ .latent-icon::after
{ {
margin: -2px; margin: -2px;
display: inline-block; display: inline-block;
@ -1252,22 +1224,28 @@ icon.type
width: 76px; width: 76px;
background-position-x: -32px; background-position-x: -32px;
} }
/* 潜觉编辑界面，多显示一个需求觉醒 */ /* 潜觉编辑界面，这几个潜觉需要多显示一个需求的普通觉醒 */
.m-latent-allowable-ul .latent-icon[data-latent-icon='39'], .m-latent-allowable-ul .latent-icon:where(
.m-latent-allowable-ul .latent-icon[data-latent-icon='40'], [data-latent-icon='39'],
.m-latent-allowable-ul .latent-icon[data-latent-icon='41'], [data-latent-icon='40'],
.m-latent-allowable-ul .latent-icon[data-latent-icon='46'], [data-latent-icon='41'],
.m-latent-allowable-ul .latent-icon[data-latent-icon='47']{ [data-latent-icon='46'],
[data-latent-icon='47'],
){ /*占两格*/
grid-column: span 2; grid-column: span 2;
} }
.m-latent-allowable-ul .latent-icon[data-latent-icon='39']::after, .m-latent-allowable-ul .latent-icon:where(
.m-latent-allowable-ul .latent-icon[data-latent-icon='40']::after, [data-latent-icon='39'],
.m-latent-allowable-ul .latent-icon[data-latent-icon='41']::after, [data-latent-icon='40'],
.m-latent-allowable-ul .latent-icon[data-latent-icon='46']::after, [data-latent-icon='41'],
.m-latent-allowable-ul .latent-icon[data-latent-icon='47']::after{ /*C珠破吸*/ [data-latent-icon='46'],
[data-latent-icon='47'],
)::after /*赋予他们的after觉醒图片*/
{
content: ""; content: "";
background-image: url(images/awoken.png); background-image: url(images/awoken.png);
margin-left: 6px; margin-left: 6px;
opacity: 0.5;
} }
.m-latent-allowable-ul .latent-icon[data-latent-icon='39']::after{ /*C珠破吸*/ .m-latent-allowable-ul .latent-icon[data-latent-icon='39']::after{ /*C珠破吸*/
background-position-y: calc(-32px * 62); background-position-y: calc(-32px * 62);
@ -1286,19 +1264,22 @@ icon.type
} }
/* 额外有 x1.5 的 6格觉醒 */ /* 额外有 x1.5 的 6格觉醒 */
.level-super-break .latent-icon[data-latent-icon='13']::after, .level-super-break .latent-icon:where(
.level-super-break .latent-icon[data-latent-icon='37']::after, [data-latent-icon='13'],
.level-super-break .latent-icon[data-latent-icon='38']::after, [data-latent-icon='37'],
.level-super-break .latent-icon[data-latent-icon='39']::after, [data-latent-icon='38'],
.level-super-break .latent-icon[data-latent-icon='40']::after, [data-latent-icon='39'],
.level-super-break .latent-icon[data-latent-icon='41']::after, [data-latent-icon='40'],
.level-super-break .latent-icon[data-latent-icon='46']::after, [data-latent-icon='41'],
.level-super-break .latent-icon[data-latent-icon='47']::after [data-latent-icon='46'],
[data-latent-icon='47'],
)::after
{ {
content: ""; content: "";
background-position-x: -32px; background-position-x: -32px;
background-position-y: calc(-32px * 42); background-position-y: calc(-32px * 42);
} }
/* 徽章背景 */ /* 徽章背景 */
.badge{ .badge{
background-image: url(images/badge-bg.png); background-image: url(images/badge-bg.png);

77
style.css
View File

@ -390,7 +390,7 @@ ul{
display: block; display: block;
position: absolute; position: absolute;
} }
.type.append-type { .type-icon.append-type {
background-color: lightgreen; background-color: lightgreen;
box-shadow: 1px 1px 3px lightgreen,1px 1px 3px lightgreen,1px 1px 3px lightgreen; box-shadow: 1px 1px 3px lightgreen,1px 1px 3px lightgreen,1px 1px 3px lightgreen;
} }
@ -1206,7 +1206,7 @@ icon.inflicts::after
grid-template-columns: repeat(3, 25.6px); grid-template-columns: repeat(3, 25.6px);
} }
.member-awoken .awoken-icon, .member-awoken .awoken-icon,
.member-types .type .member-types .type-icon
{ {
filter: unset; filter: unset;
transform: scale(0.80); transform: scale(0.80);
@ -2742,19 +2742,55 @@ icon.inflicts::after
} }
/*面板相关*/ /*面板相关*/
.board .board {
{
cursor: pointer;
display: inline-block; display: inline-block;
vertical-align: bottom; vertical-align: middle;
} }
.board[data-column-count="7"] { .board-set>span {
transform: scale(calc(5 / 6)); cursor: pointer;
margin: calc(-140px * (1 - 5 / 6 ) / 2) calc(-168px * (1 - 5 / 6 ) / 2); margin: 0 3px;
} }
.board[data-column-count="5"] { .board-set>span::before {
transform: scale(calc(5 / 4)); content: attr(data-column-count)"×"attr(data-row-count)"🔁";
margin: calc(140px * (5 / 4 - 1) / 2) calc(168px * (5 / 4 - 1) / 2); }
.board.display-none+span {
display: none;
}
/*因为比例不一样，为了保证高度一致，应该以高度来算而不是宽度来算*/
.skill-datail-parsed .board {
/* 缩小的基础倍率 */
--base-scale: 0.75;
/* 画面缩小的倍率 */
transform: scale(var(--scale));
/* 缩小后内缩的范围 */
margin: calc(-36px * var(--row) * (1 - var(--scale)) / 2) calc(-36px * var(--colum) * (1 - var(--scale)) / 2);
}
.skill-datail-parsed .board[data-row-count="5"] {
--scale: calc(var(--base-scale) * 4 / 5);
--colum: 6;
--row: 5;
}
.skill-datail-parsed .board[data-row-count="6"] {
--scale: calc(var(--base-scale) * 4 / 6);
--colum: 7;
--row: 6;
}
.skill-datail-parsed .board[data-row-count="4"] {
--scale: calc(var(--base-scale) * 4 / 4);
--colum: 5;
--row: 4;
}
.board .orb
{
transform: unset;
margin: unset;
}
.board .orb.enhanced::after,
.board .orb.locked::after,
.board .orb.bound::after
{
content: "";
transform: unset;
} }
.board .block { .board .block {
position: relative; position: relative;
@ -3697,10 +3733,7 @@ table .orb-icon
} }
.icon-skill, .icon-skill,
.attrs-div .attr-list .attr, .attrs-div .attr-list .attr,
.skill-datail-parsed icon.attr, .skill-datail-parsed icon:where(.attr,.orb,.type-icon,.awoken-icon)
.skill-datail-parsed icon.orb,
.skill-datail-parsed icon.type,
.skill-datail-parsed icon.awoken-icon
{ {
vertical-align: bottom; vertical-align: bottom;
transform: scale(0.75); transform: scale(0.75);
@ -3732,18 +3765,6 @@ table .orb-icon
--board-light-color: unset; --board-light-color: unset;
--board-deep-color: rgba(0,0,0,0.4); --board-deep-color: rgba(0,0,0,0.4);
} }
.board .orb
{
transform: unset;
margin: unset;
}
.board .orb.enhanced::after,
.board .orb.locked::after,
.board .orb.bound::after
{
content: "";
transform: unset;
}
.skill-datail-parsed .board td { .skill-datail-parsed .board td {
padding: 0; padding: 0;
} }