diff --git a/client/public/assets/gfx/table.png b/client/public/assets/gfx/table.png deleted file mode 100644 index bdf89eb..0000000 Binary files a/client/public/assets/gfx/table.png and /dev/null differ diff --git a/client/public/assets/original/table.png b/client/public/assets/original/table.png deleted file mode 100644 index ab168d4..0000000 Binary files a/client/public/assets/original/table.png and /dev/null differ diff --git a/client/src/Board.js b/client/src/Board.js index 84a1738..87c463c 100755 --- a/client/src/Board.js +++ b/client/src/Board.js @@ -188,8 +188,8 @@ const Border = (board, border) => { return border; }; -const Table = (board) => { - const file = "table.png", +const Tabletop = (board) => { + const file = "tabletop.png", image = loadImage(board, file); return image; @@ -492,7 +492,7 @@ class Board extends React.Component { this.pips = []; this.tiles = []; this.borders = []; - this.table = null; + this.tabletop = null; this.closest = { info: {}, tile: null, @@ -937,7 +937,7 @@ class Board extends React.Component { } drawFrame() { - if (!this.canvas || !this.table) { + if (!this.canvas || !this.tabletop) { return; } @@ -954,55 +954,55 @@ class Board extends React.Component { this.minSize = Math.min(this.canvas.height, this.canvas.width); /* - * Table tiling: + * Tabletop tiling: * Image width: 1080 * Left start: 32 * Right edge: 1010 (1010 - 32 = 978) * * If the view is wider than taller, then */ - const tableLeft = 32 * this.table.width / 1080, - tableRight = 1010 * this.table.width / 1080, - tableLeaf = 978 * this.table.width / 1080; + const tabletopLeft = 32 * this.tabletop.width / 1080, + tabletopRight = 1010 * this.tabletop.width / 1080, + tabletopLeaf = 978 * this.tabletop.width / 1080; - /* If view is taller than wide, tile the table vertically */ + /* If view is taller than wide, tile the tabletop vertically */ ctx.save(); if (this.canvas.height > this.canvas.width) { - const tableHeight = this.canvas.width * this.table.height / this.table.width; - for (let top = 0, step = 0; top < this.canvas.height; top += tableHeight, step++) { + const tabletopHeight = this.canvas.width * this.tabletop.height / this.tabletop.width; + for (let top = 0, step = 0; top < this.canvas.height; top += tabletopHeight, step++) { if (step % 2) { ctx.save(); - ctx.translate(0, tableHeight - 1); + ctx.translate(0, tabletopHeight - 1); ctx.transform(1, 0, 0, -1, 0, 0); - ctx.drawImage(this.table, + ctx.drawImage(this.tabletop, 0, 0, - this.table.width, this.table.height, - 0, 0, this.canvas.width, this.canvas.width * this.table.height / this.table.width); + this.tabletop.width, this.tabletop.height, + 0, 0, this.canvas.width, this.canvas.width * this.tabletop.height / this.tabletop.width); ctx.restore(); } else { - ctx.drawImage(this.table, + ctx.drawImage(this.tabletop, 0, 0, - this.table.width, this.table.height, + this.tabletop.width, this.tabletop.height, 0, 0, - this.canvas.width, this.canvas.width * this.table.height / this.table.width); + this.canvas.width, this.canvas.width * this.tabletop.height / this.tabletop.width); } - ctx.translate(0, tableHeight); + ctx.translate(0, tabletopHeight); } } else { - //const tableWidth = this.canvas.height * this.table.width / this.table.height; - ctx.drawImage(this.table, + //const tabletopWidth = this.canvas.height * this.tabletop.width / this.tabletop.height; + ctx.drawImage(this.tabletop, 0, 0, - tableRight, this.table.height, + tabletopRight, this.tabletop.height, 0, 0, - this.canvas.height * tableRight / this.table.height, this.canvas.height); - let left = this.canvas.height * tableRight / this.table.height; + this.canvas.height * tabletopRight / this.tabletop.height, this.canvas.height); + let left = this.canvas.height * tabletopRight / this.tabletop.height; while (left < this.canvas.width) { - ctx.drawImage(this.table, - tableLeft, 0, - tableLeaf, this.table.height, + ctx.drawImage(this.tabletop, + tabletopLeft, 0, + tabletopLeaf, this.tabletop.height, left, 0, - this.canvas.height * tableLeaf / this.table.height, this.canvas.height); - left += this.canvas.height * tableLeaf / this.table.height; + this.canvas.height * tabletopLeaf / this.tabletop.height, this.canvas.height); + left += this.canvas.height * tabletopLeaf / this.tabletop.height; } } ctx.restore(); @@ -1307,7 +1307,7 @@ class Board extends React.Component { this.pips = Pips(this); this.tiles = Tiles(this); - this.table = Table(this); + this.tabletop = Tabletop(this); this.borders = this.game.borders.map((file) => { return Border(this, file);