Changed cards deploy

js/uno_game.js

@@ -156,7 +156,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _js_
   \********************************/
 /***/ ((__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 */ BasicCanvas)\n/* harmony export */ });\nclass BasicCanvas {\n  constructor(x, y, w, h) {\n    this._x = x;\n    this._y = y;\n    this._w = w;\n    this._h = h;\n\n    // Create canvas\n    this._canvas = document.createElement(\"CANVAS\");\n    this._canvas.width = w;\n    this._canvas.height = h;\n    this._canvas.classList.add('uno-game-canv-default');\n\n    // Canvas style\n    this._z_index = __webpack_require__.g.canvas_count;\n    __webpack_require__.g.canvas_count++;\n    this._canvas.style = `left: ${x}px; top: ${y}px; z-index: ${this._z_index};`;\n\n    // Add to div\n    __webpack_require__.g.uno_game_div.appendChild( this._canvas );\n\n    // Get ctx\n    this._ctx = this._canvas.getContext('2d');\n  }\n\n  get canvas() {\n    return this._canvas;\n  }\n  set canvas(canvas) {\n    this._canvas = canvas;\n  }\n\n  get ctx() {\n    return this._ctx;\n  }\n  set ctx(ctx) {\n    this._ctx = ctx;\n  }\n\n  clear() {\n    this._ctx.clearRect(0, 0, __webpack_require__.g.uno_game_w, __webpack_require__.g.uno_game_h);\n  }\n\n  resetEventListener() {\n    // clone canvas and replace w/o event listener\n    const canvas = this._canvas.cloneNode(true);\n    const ctx = canvas.getContext('2d');\n    this._canvas.parentNode.replaceChild(canvas, this._canvas);\n    ctx.drawImage(this._canvas, 0, 0)\n    this._canvas.remove();\n    this._canvas = canvas;\n    this._ctx = ctx;\n  }\n\n  move(x, y) {\n    this._x = x;\n    this._y = y;\n    this._canvas.style.left = x + 'px';\n    this._canvas.style.top = y + 'px';\n  }\n\n  refresh() {\n    this._canvas.style.zIndex = __webpack_require__.g.canvas_count;\n    __webpack_require__.g.canvas_count++;\n  }\n\n  remove() {\n    this._canvas.remove();\n  }\n\n}\n\n\n//# sourceURL=webpack://uno-game/./src/js/basic_canvas.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (/* binding */ BasicCanvas)\n/* harmony export */ });\nclass BasicCanvas {\n  constructor(x, y, w, h) {\n    this._x = x;\n    this._y = y;\n    this._w = w;\n    this._h = h;\n\n    // Create canvas\n    this._canvas = document.createElement(\"CANVAS\");\n    this._canvas.width = w;\n    this._canvas.height = h;\n    this._canvas.classList.add('uno-game-canv-default');\n\n    // Canvas style\n    this._z_index = __webpack_require__.g.canvas_count;\n    __webpack_require__.g.canvas_count++;\n    this._canvas.style = `left: ${x}px; top: ${y}px; z-index: ${this._z_index};`;\n\n    // Add to div\n    __webpack_require__.g.uno_game_div.appendChild( this._canvas );\n\n    // Get ctx\n    this._ctx = this._canvas.getContext('2d');\n  }\n\n  get canvas() {\n    return this._canvas;\n  }\n  set canvas(canvas) {\n    this._canvas = canvas;\n  }\n\n  get ctx() {\n    return this._ctx;\n  }\n  set ctx(ctx) {\n    this._ctx = ctx;\n  }\n\n  clear() {\n    this._ctx.clearRect(0, 0, __webpack_require__.g.uno_game_w, __webpack_require__.g.uno_game_h);\n  }\n\n  resetEventListener() {\n    // clone canvas and replace w/o event listener\n    const canvas = this._canvas.cloneNode(true);\n    const ctx = canvas.getContext('2d');\n    this._canvas.parentNode.replaceChild(canvas, this._canvas);\n    ctx.drawImage(this._canvas, 0, 0)\n    this._canvas.remove();\n    this._canvas = canvas;\n    this._ctx = ctx;\n  }\n\n  move(x, y) {\n    this._x = x;\n    this._y = y;\n    this._canvas.style.left = x + 'px';\n    this._canvas.style.top = y + 'px';\n  }\n\n  scale(scale) {\n    this._canvas.style.width = this._w * scale + 'px';\n    this._canvas.style.height = this._h * scale + 'px';\n  }\n\n  refresh() {\n    this._canvas.style.zIndex = __webpack_require__.g.canvas_count;\n    __webpack_require__.g.canvas_count++;\n  }\n\n  remove() {\n    this._canvas.remove();\n  }\n\n}\n\n\n//# sourceURL=webpack://uno-game/./src/js/basic_canvas.js?");
 
 /***/ }),
 
@@ -206,7 +206,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 */ Player)\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\n\nclass Player extends _basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__.default {\n  constructor(name, id) {\n    super();\n\n    this._name = name;\n    this._id = id;\n    this._cards = [];\n    this._type = '';\n  }\n\n  get id() {\n    return this._id;\n  }\n  set id(id) {\n    this._id = id;\n  }\n\n  get name() {\n    return this._name;\n  }\n  set name(name) {\n    this._name = name;\n  }\n\n  get type() {\n    return this._type;\n  }\n  set type(type) {\n    this._type = type;\n  }\n\n  get cards() {\n    return this._cards;\n  }\n  set cards(cards) {\n    this._cards = cards;\n  }\n\n  addCard(card) {\n    this._cards.push(card);\n    this.sortCards();\n    if (this.type === 'human') {\n      card.flip();\n    }\n  }\n\n  removeCard(card) {\n    this._cards.splice(this._cards.indexOf(card), 1);\n  }\n\n  isEmpty() {\n    return (this._cards.length === 0) ? true : false;\n  }\n\n  refreshCards() {\n    for (let i=0; i<this._cards.length; i++) {\n      this._cards[i].move(__webpack_require__.g.uno_game_w*(i+1)/16, __webpack_require__.g.uno_game_h*(5-this.id-1)/5);\n    }\n  }\n\n  sortCards() {\n    this._cards.sort( (a, b) => (a.num > b.num) ? 1 : -1 );\n    this.refreshCards();\n  }\n\n}\n\n\n//# sourceURL=webpack://uno-game/./src/js/player.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (/* binding */ Player)\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\n\nclass Player extends _basic_canvas_js__WEBPACK_IMPORTED_MODULE_0__.default {\n  constructor(name, id) {\n    super();\n\n    this._name = name;\n    this._id = id;\n    this._cards = [];\n    this._type = '';\n  }\n\n  get id() {\n    return this._id;\n  }\n  set id(id) {\n    this._id = id;\n  }\n\n  get name() {\n    return this._name;\n  }\n  set name(name) {\n    this._name = name;\n  }\n\n  get type() {\n    return this._type;\n  }\n  set type(type) {\n    this._type = type;\n  }\n\n  get cards() {\n    return this._cards;\n  }\n  set cards(cards) {\n    this._cards = cards;\n  }\n\n  addCard(card) {\n    this._cards.push(card);\n    this.sortCards();\n    if (this.type === 'human') {\n      card.flip();\n    }\n  }\n\n  removeCard(card) {\n    this._cards.splice(this._cards.indexOf(card), 1);\n  }\n\n  isEmpty() {\n    return (this._cards.length === 0) ? true : false;\n  }\n\n  refreshCards() {\n    for (let i=0; i<this._cards.length; i++) {\n      let x0, y0, dx, dy;\n      if (this._id === 0) {\n        x0 = __webpack_require__.g.uno_game_w/4;\n        dx = __webpack_require__.g.uno_game_w/2 / (this._cards.length+1);\n        y0 = __webpack_require__.g.uno_game_h*4/5;\n        dy = 0;\n        this._cards[i].move(x0 + dx*(i+1), y0 + dy*(i+1));\n      } else {\n        x0 = __webpack_require__.g.uno_game_w*(this._id-1)/3;\n        dx = __webpack_require__.g.uno_game_w/3 / (this._cards.length+2);\n        this._cards[i].move(x0 + dx*(i+1), this.ellipticalFormula(x0 + dx*(i+1), __webpack_require__.g.uno_game_w/2, __webpack_require__.g.uno_game_h));\n      }\n    }\n  }\n\n  sortCards() {\n    this._cards.sort( (a, b) => (a.num > b.num) ? 1 : -1 );\n    this.refreshCards();\n  }\n\n\n  ellipticalFormula(x, a, b) {\n    return b * ( 1 - Math.sqrt( 1 - (x/a - 1)**2 ) );\n  }\n\n}\n\n\n//# sourceURL=webpack://uno-game/./src/js/player.js?");
 
 /***/ }),
 

src/js/basic_canvas.js

@@ -59,6 +59,11 @@ export default class BasicCanvas {
     this._canvas.style.top = y + 'px';
   }
 
+  scale(scale) {
+    this._canvas.style.width = this._w * scale + 'px';
+    this._canvas.style.height = this._h * scale + 'px';
+  }
+
   refresh() {
     this._canvas.style.zIndex = global.canvas_count;
     global.canvas_count++;

src/js/player.js

@@ -56,7 +56,18 @@ export default class Player extends BasicCanvas {
 
   refreshCards() {
     for (let i=0; i<this._cards.length; i++) {
-      this._cards[i].move(global.uno_game_w*(i+1)/16, global.uno_game_h*(5-this.id-1)/5);
+      let x0, y0, dx, dy;
+      if (this._id === 0) {
+        x0 = global.uno_game_w/4;
+        dx = global.uno_game_w/2 / (this._cards.length+1);
+        y0 = global.uno_game_h*4/5;
+        dy = 0;
+        this._cards[i].move(x0 + dx*(i+1), y0 + dy*(i+1));
+      } else {
+        x0 = global.uno_game_w*(this._id-1)/3;
+        dx = global.uno_game_w/3 / (this._cards.length+2);
+        this._cards[i].move(x0 + dx*(i+1), this.ellipticalFormula(x0 + dx*(i+1), global.uno_game_w/2, global.uno_game_h));
+      }
     }
   }
 
@@ -65,4 +76,9 @@ export default class Player extends BasicCanvas {
     this.refreshCards();
   }
 
+
+  ellipticalFormula(x, a, b) {
+    return b * ( 1 - Math.sqrt( 1 - (x/a - 1)**2 ) );
+  }
+
 }