Skip to content

Commit a5526e8

Browse files
author
linyisonger
committed
暂存一下
1 parent a4507da commit a5526e8

File tree

1 file changed

+117
-84
lines changed

1 file changed

+117
-84
lines changed

‎093.七王五二三-人机对战.html‎

Lines changed: 117 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -504,32 +504,6 @@
504504
return this.allRecord.slice(this.allRecord.length - this.currentGame.joinPlayers.length + 1).every(r => r.pass)
505505
}
506506

507-
/**
508-
* @type {HTMLDivElement}
509-
*/
510-
container = null
511-
512-
/**
513-
* 加载UI容器
514-
* @author linyisonger
515-
* @date 2025-03-16
516-
* @param {HTMLDivElement} container
517-
*/
518-
loadUIContainer(container) {
519-
this.container = container;
520-
this.loadUILastCards();
521-
return this;
522-
}
523-
524-
525-
loadUILastCards() {
526-
const cardItemDomList = this.container.querySelectorAll('.card-item')
527-
for (let i = 0; i < cardItemDomList.length; i++) {
528-
const cardItemDom = cardItemDomList.item(i)
529-
const cardItem = this.lastCards[i]
530-
cardItemDom.innerHTML = cardItem?.UIIMG() ?? ``
531-
}
532-
}
533507
}
534508

535509
class Record {
@@ -542,6 +516,7 @@
542516
this.player = player;
543517
this.cards = cards;
544518
console.log(`${player.name} 打出 ${this.groupType} `, cards);
519+
uiEvent.publish('updateCardTable', cards)
545520
}
546521

547522
get pass() {
@@ -599,6 +574,8 @@
599574
if (this.holdCards.length === 0 && this.currentGame.allCards.length === 0) // 游戏结束
600575
console.log("游戏结束");
601576
else this.currentGame.nextPlayerDiscard()
577+
578+
uiEvent.publish('updateRobotHoldCards', this.holdCards)
602579
}
603580
else {
604581
console.log('手动', round.lastCards);
@@ -713,50 +690,6 @@
713690
return Card.hint(this.holdCards, cards)
714691
}
715692

716-
/**
717-
* 界面容器
718-
* @type {HTMLDivElement}
719-
*/
720-
container = null
721-
722-
/**
723-
* 加载界面容器
724-
* @author linyisonger
725-
* @date 2025-03-16
726-
*
727-
* @param {HTMLDivElement} container
728-
*/
729-
loadUIContainer(container) {
730-
this.container = container;
731-
container.querySelector('[class$="-name"]').textContent = this.name
732-
733-
let disBtn = container.querySelector('.player-operation-buttons .dis-btn'); // 出牌
734-
let passBtn = container.querySelector('.player-operation-buttons .pass-btn'); // 不要
735-
let powerless = container.querySelector('.player-operation-buttons .powerless'); // 没有能大过的牌
736-
let nonCompliance = container.querySelector('.player-operation-buttons .non-compliance'); // 不符合规则
737-
disBtn?.classList.add('hidden')
738-
passBtn?.classList.add('hidden')
739-
powerless?.classList.add('hidden')
740-
nonCompliance?.classList.add('hidden')
741-
742-
this.loadUIHoldCards()
743-
return this
744-
}
745-
746-
/**
747-
* 加载UI手牌
748-
* @author linyisonger
749-
* @date 2025-03-16
750-
*/
751-
loadUIHoldCards() {
752-
const cardItemDomList = this.container.querySelectorAll('.card-item')
753-
for (let i = 0; i < cardItemDomList.length; i++) {
754-
const cardItemDom = cardItemDomList.item(i)
755-
const cardItem = this.holdCards[i]
756-
if (this.status === PLAYER_STATUS.MANUAL) cardItemDom.innerHTML = cardItem?.UIIMG() ?? ``
757-
else cardItemDom.hidden = !cardItem
758-
}
759-
}
760693
}
761694

762695
class Game {
@@ -807,7 +740,7 @@
807740
* 切换回合
808741
*/
809742
nextRound = async () => {
810-
this.currentRound = new Round(this) // .loadUIContainer(document.querySelector('.card-table'))
743+
this.currentRound = new Round(this)
811744

812745
// 玩家起牌
813746
console.log('玩家起牌');
@@ -826,8 +759,10 @@
826759

827760
// 定制化变更
828761
this.currentPlayer.status = PLAYER_STATUS.MANUAL
829-
// this.currentPlayer // .loadUIContainer(document.querySelector('.player'))
830-
// this.joinPlayers[(minCardIndex + 1) % this.joinPlayers.length] // .loadUIContainer(document.querySelector('.robot'))
762+
763+
uiEvent.publish('updatePlayerHoldCards', this.currentPlayer.holdCards)
764+
uiEvent.publish('updatePlayerBaseInfo', this.currentPlayer)
765+
uiEvent.publish('updateRobotBaseInfo', this.joinPlayers[(minCardIndex + 1) % this.joinPlayers.length])
831766
console.log('玩家牌面最小', this.currentPlayer);
832767
}
833768

@@ -856,36 +791,134 @@
856791
}
857792

858793
class UIController {
859-
/**
860-
* 界面容器
861-
* @type {HTMLDivElement}
862-
*/
863-
container = null
794+
static get container() {
795+
return document.body.querySelector('.scene')
796+
}
864797

865798
/**
866799
* 机器人容器
867800
* @author linyisonger
868801
* @date 2025-03-16
869802
*/
870-
get robotContainer() {
871-
return this.container.querySelector('.robot')
803+
static get robotContainer() {
804+
return UIController.container.querySelector('.robot')
872805
}
873806

874807
/**
875808
* 玩家容器
876809
* @author linyisonger
877810
* @date 2025-03-16
878811
*/
879-
get playerContainer() {
880-
return this.container.querySelector('.player')
812+
static get playerContainer() {
813+
return UIController.container.querySelector('.player')
881814
}
882815

883-
816+
817+
/**
818+
* 牌桌
819+
* @author linyisonger
820+
* @date 2025-03-16
821+
*/
822+
static get cardTable() {
823+
return UIController.container.querySelector('.card-table')
824+
}
884825

885826

827+
/**
828+
* 更新托管手牌
829+
* @author linyisonger
830+
* @date 2025-03-16
831+
* @param {Card[]} holdCards
832+
*/
833+
static updateRobotHoldCards(holdCards) {
834+
const cardItemDomList = UIController.robotContainer.querySelectorAll('.card-item')
835+
for (let i = 0; i < cardItemDomList.length; i++) {
836+
const cardItemDom = cardItemDomList.item(i)
837+
const cardItem = holdCards[i]
838+
cardItemDom.hidden = !cardItem
839+
}
840+
}
841+
842+
/**
843+
* 更新自己手牌
844+
* @author linyisonger
845+
* @date 2025-03-16
846+
* @param {Card[]} holdCards
847+
*/
848+
static updatePlayerHoldCards(holdCards) {
849+
const cardItemDomList = UIController.playerContainer.querySelectorAll('.card-item')
850+
for (let i = 0; i < cardItemDomList.length; i++) {
851+
const cardItemDom = cardItemDomList.item(i)
852+
const cardItem = holdCards[i]
853+
cardItemDom.innerHTML = cardItem?.UIIMG() ?? ``
854+
}
855+
}
856+
857+
858+
/**
859+
* 更新玩家基础信息
860+
* @author linyisonger
861+
* @date 2025-03-16
862+
* @param {Player} player
863+
*/
864+
static updatePlayerBaseInfo(player) {
865+
UIController.playerContainer.querySelector('[class$="-name"]').textContent = player.name
866+
}
867+
868+
869+
/**
870+
* 更新对手基础信息
871+
* @author linyisonger
872+
* @date 2025-03-16
873+
* @param {Player} robot
874+
*/
875+
static updateRobotBaseInfo(robot) {
876+
UIController.robotContainer.querySelector('[class$="-name"]').textContent = robot.name
877+
}
878+
879+
880+
/**
881+
* 更新牌桌的牌
882+
* @author linyisonger
883+
* @date 2025-03-16
884+
*/
885+
static updateCardTable(cards) {
886+
const cardItemDomList = UIController.cardTable.querySelectorAll('.card-item')
887+
for (let i = 0; i < cardItemDomList.length; i++) {
888+
const cardItemDom = cardItemDomList.item(i)
889+
const cardItem = cards[i]
890+
cardItemDom.innerHTML = cardItem?.UIIMG() ?? ``
891+
}
892+
}
893+
894+
895+
/**
896+
* 初始化手牌
897+
* @author linyisonger
898+
* @date 2025-03-16
899+
*/
900+
static initPlayerHoldCards() {
901+
const cardItemDomList = UIController.playerContainer.querySelectorAll('.card-item')
902+
cardItemDomList.forEach(cardItemDom => {
903+
cardItemDom.addEventListener('click', function () {
904+
cardItemDom.classList.toggle('selected')
905+
})
906+
})
907+
}
886908
}
887909

888-
const UIEvent = new EventBus()
910+
911+
const uiEvent = new EventBus()
912+
913+
UIController.initPlayerHoldCards()
914+
915+
uiEvent.subscribe('updateRobotHoldCards', UIController.updateRobotHoldCards)
916+
uiEvent.subscribe('updatePlayerHoldCards', UIController.updatePlayerHoldCards)
917+
uiEvent.subscribe('updateRobotBaseInfo', UIController.updateRobotBaseInfo)
918+
uiEvent.subscribe('updatePlayerBaseInfo', UIController.updatePlayerBaseInfo)
919+
uiEvent.subscribe('updateCardTable', UIController.updateCardTable)
920+
921+
uiEvent.publish('updateCardTable', [])
889922

890923
/**
891924
* 生成一副牌

0 commit comments

Comments
 (0)