YunFeiyang
/
noname
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #652 from nofficalfs/PR-PlayerPositionVituralCssImrpove 

Transform `lib.init.sheet` to `game.dynamicStyle`
This commit is contained in:
Spmario233 2023-11-18 22:16:15 +08:00 committed by GitHub
parent aaa0f59a58 01ca1438ae
commit 2b2e8885dc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 35 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
game/game.js
View File

@ -58537,9 +58537,10 @@
if(typeof numberOfPlayers!='number') numberOfPlayers=lib.configOL.number;
if(!numberOfPlayers) return;
const playerPositions=ui.playerPositions;
while(playerPositions.length){
playerPositions.pop().remove();
}
playerPositions.forEach((position) => {
game.dynamicStyle.remove(position);
});
playerPositions.length = 0;
const temporaryPlayer=ui.create.div('.player.connect',ui.window).hide();
const computedStyle=getComputedStyle(temporaryPlayer);
const halfWidth=parseFloat(computedStyle.width)/2;
@ -58549,23 +58550,29 @@
const upperPercentage=100/(halfNumberOfPlayers+1);
const scale=10/numberOfPlayers;
for(let ordinal=0;ordinal<halfNumberOfPlayers;ordinal++){
playerPositions.push(lib.init.sheet([
`#window>.player.connect[data-position='${ordinal}']{`,
`left:calc(${upperPercentage*(ordinal+1)}% - ${halfWidth}px);`,
`top:calc(${100/3}% - ${halfHeight}px);`,
scale<1?`transform:scale(${scale});`:'',
'}'
].join('')));
const selector = `#window>.player.connect[data-position='${ordinal}']`;
const css = {
left: `calc(${upperPercentage*(ordinal+1)}% - ${halfWidth}px)`,
top: `calc(${100/3}% - ${halfHeight}px)`
};
if (scale<1)
css["transform"] = `scale(${scale})`;
game.dynamicStyle.add(selector, css);
playerPositions.push(selector);
}
const lowerPercentage=100/(numberOfPlayers-halfNumberOfPlayers+1);
for(let ordinal=halfNumberOfPlayers;ordinal<numberOfPlayers;ordinal++){
playerPositions.push(lib.init.sheet([
`#window>.player.connect[data-position='${ordinal}']{`,
`left:calc(${lowerPercentage*(ordinal-halfNumberOfPlayers+1)}% - ${halfWidth}px);`,
`top:calc(${100*2/3}% - ${halfHeight}px);`,
scale<1?`transform:scale(${scale});`:'',
'}'
].join('')));
const selector = `#window>.player.connect[data-position='${ordinal}']`;
const css = {
left: `calc(${lowerPercentage*(ordinal-halfNumberOfPlayers+1)}% - ${halfWidth}px)`,
top: `calc(${100*2/3}% - ${halfHeight}px)`
};
if (scale < 1)
css["transform"] = `scale(${scale})`;
game.dynamicStyle.add(selector, css);
playerPositions.push(selector);
}
},
/**
@ -58578,9 +58585,10 @@
//当人数不超过8人时，还是用以前的布局
if(!numberOfPlayers||numberOfPlayers<=8) return;
const playerPositions=ui.playerPositions;
while(playerPositions.length){
playerPositions.pop().remove();
}
playerPositions.forEach((position) => {
game.dynamicStyle.remove(position);
});
playerPositions.length = 0;
//单个人物的宽度，这里要设置玩家的实际的宽度
const temporaryPlayer=ui.create.div('.player',ui.arena).hide();
const computedStyle=getComputedStyle(temporaryPlayer);
@ -58597,13 +58605,13 @@
const reversedOrdinal=columnCount-ordinal;
//动态计算玩家的top属性，实现拱桥的效果；只让两边的各两个人向下偏移一些
const top=Math.max(0,Math.round(numberOfPlayers/5)-Math.min(Math.abs(ordinal-1),Math.abs(reversedOrdinal)))*quarterHeight;
playerPositions.push(lib.init.sheet([
`#arena[data-number='${numberOfPlayers}']>.player[data-position='${ordinal}']{`,
`left:calc(${percentage*reversedOrdinal+5}% - ${halfWidth}px);`,
`top:${top}px;`,
`transform:scale(${scale});`,
'}'
].join('')));
const selector = `#arena[data-number='${numberOfPlayers}']>.player[data-position='${ordinal}']`;
game.dynamicStyle.add(selector, {
left: `calc(${percentage*reversedOrdinal+5}% - ${halfWidth}px)`,
top: `${top}px`,
transform: `scale(${scale})`
});
playerPositions.push(selector);
}
},
updateRoundNumber:(roundNumber,cardPileNumber)=>{