From ccc7d62016b0216b73c60d9f9afab93c88d7a292 Mon Sep 17 00:00:00 2001 From: Eunchong Kim Date: Sun, 25 Jul 2021 18:35:45 +0900 Subject: [PATCH] Changed room attr name --- js/uno_game.js | 2 +- src/js/room.js | 30 +++++++++++++++--------------- 2 files changed, 16 insertions(+), 16 deletions(-) diff --git a/js/uno_game.js b/js/uno_game.js index 8f9e242..b61c6f0 100644 --- a/js/uno_game.js +++ b/js/uno_game.js @@ -216,7 +216,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac \************************/ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ Room)\n/* harmony export */ });\n/* harmony import */ var _basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./basic_canvas.js */ \"./src/js/basic_canvas.js\");\n/* harmony import */ var _human_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./human.js */ \"./src/js/human.js\");\n/* harmony import */ var _bot_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./bot.js */ \"./src/js/bot.js\");\n/* harmony import */ var _card_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./card.js */ \"./src/js/card.js\");\n\n\n\n\n/* Images */\n\nclass Room extends _basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__.default {\n constructor(name) {\n super(0, 0, __webpack_require__.g.uno_game_w, __webpack_require__.g.uno_game_h/10);\n\n this._name = name;\n this._players = [];\n this._cards = [];\n this._used_cards = [];\n\n // Fill room name\n this._ctx.font = Math.floor(this._h/3) + \"px Arial\";\n this._ctx.fillText(name, 10, 50);\n }\n\n addHuman(name) {\n this._players.push( new _human_js__WEBPACK_IMPORTED_MODULE_1__.default(name, this._players.length) );\n console.log(this._players);\n }\n\n addBot() {\n this._players.push( new _bot_js__WEBPACK_IMPORTED_MODULE_2__.default('bot', this._players.length) );\n console.log(this._players);\n }\n\n initCards() {\n console.log('Initialize cards')\n const index_arr = [...Array(108).keys()];\n for (let num=0; num<14; num++) {\n for (let color_n=0; color_n<8; color_n++) {\n if ( (num === 0) && (color_n >= 4) ) { // Skip blank card\n continue;\n }\n if ( (num === 13) && (color_n >= 4) ) { // +4 cards\n num = 14;\n }\n const card_index = index_arr.splice(Math.floor( Math.random() * index_arr.length), 1)[0];\n this._cards[ card_index ] = new _card_js__WEBPACK_IMPORTED_MODULE_3__.default(__webpack_require__.g.uno_game_w*6/16+card_index, __webpack_require__.g.uno_game_h/2, num, color_n%4);\n }\n }\n // re-order z-index\n for (let i=0; i {\n for (let i=0; i<7; i++) {\n player.addCard( this._cards.pop() );\n }\n });\n console.log(this._players);\n }\n\n async startGame() {\n console.log('Game start');\n\n // Init\n this._turn_count = 0;\n this._skip = false;\n this._reverse = false;\n this._draw2 = false;\n this._draw4 = false;\n this._current_player = this._players[0];\n\n await( this.initDiscardPile() );\n\n this.initTurn();\n }\n\n initDiscardPile() {\n while (true) {\n const card = this._cards.pop();\n if (card.num <= 9) {\n this.changeTopCard( card );\n break;\n } else {\n console.log(this._cards);\n this._cards.splice( Math.floor(Math.random()*this._cards.length), 0, card);\n console.log(this._cards);\n }\n }\n }\n\n async initTurn() {\n console.log('Turn count: ' + this._turn_count + ', current player: ' + this._current_player.name);\n await new Promise(resolve => setTimeout(resolve, 500));\n\n // check draw cards\n if (this._draw2) {\n this._draw2 = false;\n for (let i=0; i<2; i++) this._current_player.addCard( this._cards.pop() );\n this.finishTurn();\n } else if (this._draw4) {\n this._draw4 = false;\n for (let i=0; i<4; i++) this._current_player.addCard( this._cards.pop() );\n this.finishTurn();\n } else {\n if (this._current_player.type === 'bot') {\n this.botTurn();\n } else {\n this.humanTurn();\n }\n }\n }\n\n async botTurn() {\n await new Promise(resolve => setTimeout(resolve, 500));\n\n const card = await( this._current_player.playCard(this._top_card) );\n if (card) {\n console.log('played card num: ' + card.num + ', color: ' + card.color_n);\n this.changeTopCard(card);\n } else {\n const card = this._cards.pop();\n console.log('drawed card num: ' + card.num + ', color: ' + card.color_n);\n this._current_player.addCard(card);\n }\n\n this.finishTurn();\n }\n\n humanTurn() {\n this._top_back_card = this._cards[ this._cards.length-1 ];\n this._top_back_card.mouseEffect();\n\n // Select card event\n this._current_player.cards.forEach( (card) => {\n if (this._top_card.isMatch(card)) {\n card.mouseEffect();\n\n card.canvas.addEventListener('click', () => {\n console.log('played card num: ' + card.num + ', color: ' + card.color_n);\n this._current_player.removeCard(card);\n\n // Remove event listener\n this._top_back_card.resetEventListener();\n this._current_player.cards.forEach( (card) => {\n card.resetEventListener();\n });\n\n // Show color change blocks\n if (card.num === 13 || card.num === 14) {\n const bc_colors = [];\n for (let i=0; i<4; i++) {\n const w = __webpack_require__.g.uno_game_w;\n const bc = new _basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__.default(w/2+w*i/16, __webpack_require__.g.uno_game_h*3/4, w/16, w/16);\n bc.fillColor(i);\n bc.canvas.addEventListener('click', () => {\n bc_colors.forEach( bc_color => bc_color.remove() );\n // Change card color\n card.color_n = i;\n // Process\n this.changeTopCard(card);\n this.finishTurn();\n });\n bc_colors.push(bc);\n }\n } else {\n this.changeTopCard(card);\n this.finishTurn();\n }\n });\n }\n });\n\n // Draw card event\n this._top_back_card.canvas.addEventListener('click', () => {\n const card = this._cards.pop();\n console.log('drawed card num: ' + card.num + ', color: ' + card.color_n);\n\n // Remove event listener\n this._top_back_card.resetEventListener();\n this._current_player.cards.forEach( (card) => {\n card.resetEventListener();\n });\n\n this._current_player.addCard(card);\n this.finishTurn();\n });\n }\n\n async finishTurn() {\n console.log('finish turn')\n\n // re-deploy player's cards\n await( this._current_player.reDeployCards() );\n\n // Check empty\n if (this._current_player.isEmpty()) {\n console.log('player: ' + this._current_player.name + ' has no card left. Game end');\n } else {\n this._turn_count++;\n await ( this.decideNextPlayer() );\n this.initTurn();\n }\n }\n\n decideNextPlayer() {\n console.log('decide next player')\n\n let current_player_id = this._current_player.id;\n let loop_cnt = 1;\n if (this._skip) {\n this._skip = false;\n loop_cnt++;\n }\n for (let i=0; i (/* binding */ Room)\n/* harmony export */ });\n/* harmony import */ var _basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./basic_canvas.js */ \"./src/js/basic_canvas.js\");\n/* harmony import */ var _human_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./human.js */ \"./src/js/human.js\");\n/* harmony import */ var _bot_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./bot.js */ \"./src/js/bot.js\");\n/* harmony import */ var _card_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./card.js */ \"./src/js/card.js\");\n\n\n\n\n/* Images */\n\nclass Room extends _basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__.default {\n constructor(name) {\n super(0, 0, __webpack_require__.g.uno_game_w, __webpack_require__.g.uno_game_h/10);\n\n this._name = name;\n this._players = [];\n this._cards = [];\n this._used_cards = [];\n\n // Fill room name\n this._ctx.font = Math.floor(this._h/3) + \"px Arial\";\n this._ctx.fillText(name, 10, 50);\n }\n\n addHuman(name) {\n this._players.push( new _human_js__WEBPACK_IMPORTED_MODULE_1__.default(name, this._players.length) );\n console.log(this._players);\n }\n\n addBot() {\n this._players.push( new _bot_js__WEBPACK_IMPORTED_MODULE_2__.default('bot', this._players.length) );\n console.log(this._players);\n }\n\n initCards() {\n console.log('Initialize cards')\n const index_arr = [...Array(108).keys()];\n for (let num=0; num<14; num++) {\n for (let color_n=0; color_n<8; color_n++) {\n if ( (num === 0) && (color_n >= 4) ) { // Skip blank card\n continue;\n }\n if ( (num === 13) && (color_n >= 4) ) { // +4 cards\n num = 14;\n }\n const card_index = index_arr.splice(Math.floor( Math.random() * index_arr.length), 1)[0];\n this._cards[ card_index ] = new _card_js__WEBPACK_IMPORTED_MODULE_3__.default(__webpack_require__.g.uno_game_w*6/16+card_index, __webpack_require__.g.uno_game_h/2, num, color_n%4);\n }\n }\n // re-order z-index\n for (let i=0; i {\n for (let i=0; i<7; i++) {\n player.addCard( this._cards.pop() );\n }\n });\n console.log(this._players);\n }\n\n async startGame() {\n console.log('Game start');\n\n // Init\n this._turn_count = 0;\n this._skip = false;\n this._reverse = false;\n this._draw2 = false;\n this._draw4 = false;\n this._current_player = this._players[0];\n\n await( this.initDiscardPile() );\n\n this.initTurn();\n }\n\n // Not allow special card to be first discard pile\n initDiscardPile() {\n while (true) {\n const card = this._cards.pop();\n if (card.num <= 9) {\n this.changeTopCard( card );\n break;\n } else {\n this._cards.splice( Math.floor(Math.random()*this._cards.length), 0, card);\n }\n }\n }\n\n async initTurn() {\n console.log('Turn count: ' + this._turn_count + ', current player: ' + this._current_player.name);\n await new Promise(resolve => setTimeout(resolve, 500));\n\n // check draw cards\n if (this._draw2) {\n this._draw2 = false;\n for (let i=0; i<2; i++) this._current_player.addCard( this._cards.pop() );\n this.finishTurn();\n } else if (this._draw4) {\n this._draw4 = false;\n for (let i=0; i<4; i++) this._current_player.addCard( this._cards.pop() );\n this.finishTurn();\n } else {\n if (this._current_player.type === 'bot') {\n this.botTurn();\n } else {\n this.humanTurn();\n }\n }\n }\n\n async botTurn() {\n await new Promise(resolve => setTimeout(resolve, 500));\n\n const card = await( this._current_player.playCard(this._top_discard_pile) );\n if (card) {\n console.log('played card num: ' + card.num + ', color: ' + card.color_n);\n this.changeTopCard(card);\n } else {\n const card = this._cards.pop();\n console.log('drawed card num: ' + card.num + ', color: ' + card.color_n);\n this._current_player.addCard(card);\n }\n\n this.finishTurn();\n }\n\n humanTurn() {\n this._top_draw_card = this._cards[ this._cards.length-1 ];\n this._top_draw_card.mouseEffect();\n\n // Select card event\n this._current_player.cards.forEach( (card) => {\n if (this._top_discard_pile.isMatch(card)) {\n card.mouseEffect();\n\n card.canvas.addEventListener('click', () => {\n console.log('played card num: ' + card.num + ', color: ' + card.color_n);\n this._current_player.removeCard(card);\n\n // Remove event listener\n this._top_draw_card.resetEventListener();\n this._current_player.cards.forEach( (card) => {\n card.resetEventListener();\n });\n\n // Show color change blocks\n if (card.num === 13 || card.num === 14) {\n const bc_colors = [];\n for (let i=0; i<4; i++) {\n const w = __webpack_require__.g.uno_game_w;\n const bc = new _basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__.default(w/2+w*i/16, __webpack_require__.g.uno_game_h*3/4, w/16, w/16);\n bc.fillColor(i);\n bc.canvas.addEventListener('click', () => {\n bc_colors.forEach( bc_color => bc_color.remove() );\n // Change card color\n card.color_n = i;\n // Process\n this.changeTopCard(card);\n this.finishTurn();\n });\n bc_colors.push(bc);\n }\n } else {\n this.changeTopCard(card);\n this.finishTurn();\n }\n });\n }\n });\n\n // Draw card event\n this._top_draw_card.canvas.addEventListener('click', () => {\n const card = this._cards.pop();\n console.log('drawed card num: ' + card.num + ', color: ' + card.color_n);\n\n // Remove event listener\n this._top_draw_card.resetEventListener();\n this._current_player.cards.forEach( (card) => {\n card.resetEventListener();\n });\n\n this._current_player.addCard(card);\n this.finishTurn();\n });\n }\n\n async finishTurn() {\n console.log('finish turn')\n\n // re-deploy player's cards\n await( this._current_player.reDeployCards() );\n\n // Check empty\n if (this._current_player.isEmpty()) {\n console.log('player: ' + this._current_player.name + ' has no card left. Game end');\n } else {\n this._turn_count++;\n await ( this.decideNextPlayer() );\n this.initTurn();\n }\n }\n\n decideNextPlayer() {\n console.log('decide next player')\n\n let current_player_id = this._current_player.id;\n let loop_cnt = 1;\n if (this._skip) {\n this._skip = false;\n loop_cnt++;\n }\n for (let i=0; i setTimeout(resolve, 500)); - const card = await( this._current_player.playCard(this._top_card) ); + const card = await( this._current_player.playCard(this._top_discard_pile) ); if (card) { console.log('played card num: ' + card.num + ', color: ' + card.color_n); this.changeTopCard(card); @@ -128,12 +128,12 @@ export default class Room extends BasicCanvas { } humanTurn() { - this._top_back_card = this._cards[ this._cards.length-1 ]; - this._top_back_card.mouseEffect(); + this._top_draw_card = this._cards[ this._cards.length-1 ]; + this._top_draw_card.mouseEffect(); // Select card event this._current_player.cards.forEach( (card) => { - if (this._top_card.isMatch(card)) { + if (this._top_discard_pile.isMatch(card)) { card.mouseEffect(); card.canvas.addEventListener('click', () => { @@ -141,7 +141,7 @@ export default class Room extends BasicCanvas { this._current_player.removeCard(card); // Remove event listener - this._top_back_card.resetEventListener(); + this._top_draw_card.resetEventListener(); this._current_player.cards.forEach( (card) => { card.resetEventListener(); }); @@ -172,12 +172,12 @@ export default class Room extends BasicCanvas { }); // Draw card event - this._top_back_card.canvas.addEventListener('click', () => { + this._top_draw_card.canvas.addEventListener('click', () => { const card = this._cards.pop(); console.log('drawed card num: ' + card.num + ', color: ' + card.color_n); // Remove event listener - this._top_back_card.resetEventListener(); + this._top_draw_card.resetEventListener(); this._current_player.cards.forEach( (card) => { card.resetEventListener(); }); @@ -231,16 +231,16 @@ export default class Room extends BasicCanvas { } changeTopCard(card) { - if (this._top_card) this._used_cards.push(this._top_card); - this._top_card = card; - this._top_card.drawImageFront(global.uno_game_w*8/16+this._turn_count, global.uno_game_h/2); - this._top_card.refresh(); + if (this._top_discard_pile) this._used_cards.push(this._top_discard_pile); + this._top_discard_pile = card; + this._top_discard_pile.drawImageFront(global.uno_game_w*8/16+this._turn_count, global.uno_game_h/2); + this._top_discard_pile.refresh(); this.treatCard(); } async treatCard() { - console.log('treat card num:' + this._top_card.num) - switch (this._top_card.num) { + console.log('treat card num:' + this._top_discard_pile.num) + switch (this._top_discard_pile.num) { case 10: // skip card this._skip = true; break; @@ -264,8 +264,8 @@ export default class Room extends BasicCanvas { changeColor() { if (this._current_player.type === 'bot') { - this._top_card.color_n = this._current_player.changeColor(); - console.log('change color' + this._top_card.color_n); + this._top_discard_pile.color_n = this._current_player.changeColor(); + console.log('change color' + this._top_discard_pile.color_n); } }