diff --git a/client/board.js b/client/board.js index 198aae3..fa2272d 100644 --- a/client/board.js +++ b/client/board.js @@ -1,15 +1,78 @@ // traverse HTML and fill in table const BoardLookup = { - '3LS': 'x3 Letter Score', - '2LS': 'x2 Letter Score', - '3WS': 'x3 Word Score', - '2WS': 'x2 Word Scre', - '★': 'x2 Word Score' + 'TL': 'tripple-letter', + 'DL': 'double-letter', + 'TW': 'tripple-word', + 'DW': 'double-word', + '★': 'center-star' }; const BoardLocations = { - 'A1': '2WS' - - + 'A1': 'TW', + 'D1': 'DL', + 'H1': 'TW', + 'L1': 'DL', + 'O1': 'TW', + 'B2': 'DW', + 'F2': 'TL', + 'J2': 'TL', + 'N2': 'DW', + 'C3': 'DW', + 'G3': 'DL', + 'I3': 'DL', + 'M3': 'DW', + 'A4': 'DL', + 'D4': 'DW', + 'H4': 'DL', + 'L4': 'DW', + 'O4': 'DL', + 'E5': 'DW', + 'K5': 'DW', + 'B6': 'TL', + 'F6': 'TL', + 'J6': 'TL', + 'N6': 'TL', + 'C7': 'DL', + 'G7': 'DL', + 'I7': 'DL', + 'M7': 'DL', + 'A8': 'TW', + 'D8': 'DL', + 'H8': '★', + 'L8': 'DL', + 'O8': 'TW' +}; + +function flip(y, size) +{ + return -y + size + 1; +} + +window.onload = e => { + for (const location in BoardLocations) + { + const x = location[0].toLowerCase(); + const y = location[1]; + + const boardLocation = document.querySelector(`#row-${y}`).querySelector(`#col-${x}`); + + boardLocation.classList.add(BoardLookup[BoardLocations[location]]); + boardLocation.innerHTML = BoardLocations[location]; + } + + // flip it + + for (const location in BoardLocations) + { + const x = location[0].toLowerCase(); + let y = location[1]; + + y = flip(y, 15); + + const boardLocation = document.querySelector(`#row-${y}`).querySelector(`#col-${x}`); + + boardLocation.classList.add(BoardLookup[BoardLocations[location]]); + boardLocation.innerHTML = BoardLocations[location]; + } }; diff --git a/client/dragable.js b/client/dragable.js index 14717e5..0183efd 100644 --- a/client/dragable.js +++ b/client/dragable.js @@ -24,8 +24,6 @@ function mouseDown(event, element) element.pointerEvents = 'none'; selectedElement = element; - - console.log(element); } function mouseMove(event) diff --git a/client/game.css b/client/game.css index 347756e..cb1321f 100644 --- a/client/game.css +++ b/client/game.css @@ -2,14 +2,16 @@ #game-container { border: 1px dotted black; padding-bottom: 20%; - position: relative; + position: absolute; + + height: 80%; + overflow: hidden; } piece { display: flex; cursor: move; - border: 1px dotted black; background: radial-gradient(circle, rgba(255,214,45,1) 41%, rgba(255,179,0,1) 84%); text-align: center; @@ -84,9 +86,10 @@ score { .game-board-cell { display: table-cell; - width: 100%; - height: 0; - padding-bottom: 0%; + /* width: 100%; */ + height: 4vw; + /* width: 10vw; */ + /* padding-bottom: 0%; */ font-size: 2vw; /* roughly 15 / table width */ vertical-align: middle; diff --git a/client/game.html b/client/game.html index 53cb74e..a9e7303 100644 --- a/client/game.html +++ b/client/game.html @@ -48,11 +48,11 @@