From e541eac94632390bef7deb168f699f35d6faac2e Mon Sep 17 00:00:00 2001
From: Julien Dessaux
Date: Thu, 29 Sep 2022 23:55:14 +0200
Subject: Began implementing the frontend
---
index.css | 88 +++++++++++++++++++++++++++++++++++++++++++++
index.html | 68 +++++++++++++++++++++++++++++++++++
index.js | 119 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
3 files changed, 275 insertions(+)
create mode 100644 index.css
create mode 100644 index.html
create mode 100644 index.js
diff --git a/index.css b/index.css
new file mode 100644
index 0000000..84fab2f
--- /dev/null
+++ b/index.css
@@ -0,0 +1,88 @@
+* {
+ box-sizing: border-box;
+ scrollbar-gutter: stable both-edges;
+}
+
+aside {
+ float: right;
+}
+
+body {
+ background: #126623;
+ display: grid;
+ grid-template-rows: auto 1fr auto;
+ font-family: -apple-system, BlinkMacSystemFont,
+ "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
+ "Fira Sans", "Droid Sans", "Helvetica Neue",
+ sans-serif;
+ font-feature-settings: "kern" 1;
+ font-kerning: normal;
+}
+
+button {
+ box-shadow: rgb(202, 239, 171) 0px 1px 0px 0px inset;
+ border-radius: 3px;
+ border: 1px solid rgb(38, 138, 22);
+ cursor: pointer;
+ font-weight: bold;
+ max-height: 3em;
+ padding: 6px;
+ background: linear-gradient(rgb(92, 184, 17) 5%, rgb(119, 212, 42) 100%) rgb(92, 184, 17);
+}
+
+button:disabled, button[disabled] {
+ cursor: auto;
+}
+
+main {
+ margin-left: auto;
+ margin-right: auto;
+}
+
+td {
+ background: #47b75e;
+ border: 1px solid #d4fcdb;
+ min-width: 27px;
+ height: 27px;
+ text-align: center;
+}
+
+#board {
+ border-collapse: collapse;
+ font-weight: bold;
+ max-width: 405px;
+}
+
+#rack {
+ display:inline-block;
+}
+
+#letters_left {
+ max-width: 405px;
+}
+
+.tw {
+ background:#E60000;
+}
+.dw {
+ background:#F86969;
+}
+.tl {
+ background:#3675FA;
+}
+.dl {
+ background:#22ACD8;
+}
+.start {
+ background:#ff5500;
+}
+
+.selected {
+ background:orange;
+}
+
+.points {
+ display: inline;
+ font-weight: normal;
+ font-size: 8pt;
+}
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..37f8281
--- /dev/null
+++ b/index.html
@@ -0,0 +1,68 @@
+
+
+
+ Jeu de mots
+
+
+
+
+
+
+ Jeu de mots
+
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+ | | | | | | | | | | | | | | |
+
+
+
+
+
+
+ player one name: 0
+ player two name: 0
+
+
+
+
+
+
+
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..d40bb0d
--- /dev/null
+++ b/index.js
@@ -0,0 +1,119 @@
+var CW = function(){
+ // 0 point : blanches × 2.
+ // 1 point : E ×15, A ×9, I ×8, N ×6, O ×6, R ×6, S ×6, T ×6, U ×6, L ×5
+ // 2 points : D ×3, G ×2, M ×3
+ // 3 points : B ×2, C ×2, P ×2
+ // 4 points : F ×2, H ×2, V ×2
+ // 8 points : J ×1, Q ×1
+ // 10 points : K ×1, W ×1, X ×1, Y ×1, Z ×1
+ var letters = [
+ " ", " ",
+ "E", "E", "E", "E", "E", "E", "E", "E", "E", "E", "E", "E", "E", "E", "E",
+ "A", "A", "A", "A", "A", "A", "A", "A", "A",
+ "I", "I", "I", "I", "I", "I", "I", "I",
+ "N", "N", "N", "N", "N", "N",
+ "O", "O", "O", "O", "O", "O",
+ "R", "R", "R", "R", "R", "R",
+ "S", "S", "S", "S", "S", "S",
+ "T", "T", "T", "T", "T", "T",
+ "U", "U", "U", "U", "U", "U",
+ "L", "L", "L", "L", "L",
+ "D", "D", "D",
+ "M", "M", "M",
+ "G", "G",
+ "B", "B",
+ "C", "C",
+ "P", "P",
+ "F", "F",
+ "H", "H",
+ "V", "V",
+ "J", "Q", "K", "W", "X", "Y", "Z"
+ ]
+ const points = {
+ ' ': 0,
+ E:1, A:1, I:1, N:1, O:1, R:1, S:1, T:1, U:1, L:1,
+ D:2, G:2, M:2,
+ B:3, C:3, P:3,
+ F:4, H:4, V:4,
+ J:8, Q:8,
+ K:10, W:10, X:10, Y:10, Z:10
+ };
+ var cursor = undefined;
+ var selected = undefined;
+
+ return {
+ init: function() {
+ var elt = undefined;
+ var idx = undefined;
+ var letter;
+ var x = 0;
+ var y = 0;
+ // populate the board
+ for (y=0; y', points[letter], ''].join('');
+ // we also remove the letter from the pool
+ idx = letters.findIndex(function(elt) { return elt === letter; });
+ if (idx != -1) {
+ letters.splice(idx, 1);
+ }
+ }
+ }
+ }
+ // populate the rack
+ for (x=0; x', points[letter], ''].join('');
+ // we also remove the letter from the pool
+ idx = letters.findIndex(function(elt) { return elt === letter; });
+ if (idx != -1) {
+ letters.splice(idx, 1);
+ }
+ }
+ // initialize buttons
+ document.getElementById('validate').disabled = true;
+ // populate remaining letters
+ var letters_left = [ "Lettres restantes: ", letters.length, "
" ];
+ var prev = undefined;
+ y = 1;
+ for (x=0; x 1) {
+ letters_left = letters_left.concat(prev, 'x', y, ', ');
+ } else {
+ letters_left = letters_left.concat(prev, ', ');
+ }
+ prev = letter;
+ y = 1;
+ }
+ }
+ if (prev !== undefined) {
+ if (prev === " ") {
+ prev = "blanc";
+ }
+ if (y > 1) {
+ letters_left = letters_left.concat(prev, 'x', y, '.');
+ } else {
+ letters_left = letters_left.concat(prev, '.');
+ }
+ }
+ document.getElementById('letters_left').innerHTML = letters_left.join('');
+ }
+ };
+}();
+
+CW.init();
--
cgit v1.2.3