From 1e65d150225f44003520fbbe0e49bad7307320de Mon Sep 17 00:00:00 2001
From: Robert Bendun <robert@bendun.cc>
Date: Sun, 28 Mar 2021 22:54:59 +0200
Subject: [PATCH] Finalization of products

---
 src/index.html          |  4 +--
 src/modules/products.js | 66 +++++++++++++++++------------------------
 src/styles.css          |  5 ++++
 3 files changed, 34 insertions(+), 41 deletions(-)

diff --git a/src/index.html b/src/index.html
index dbe3262..1b8c633 100644
--- a/src/index.html
+++ b/src/index.html
@@ -194,7 +194,7 @@
           <div class="corridor"></div>
           <div class="corridor"></div>
           <div class="corridor"></div>
-          <div class="corridor"></div>
+          <div class="corridor"></dv>
           <div class="corridor"></div>
           <div class="corridor"></div>
           <div class="corridor"></div>
@@ -226,7 +226,7 @@
           <div id="p7_2"><i class="fas fa-apple-alt"></i></div>
           <div id="p7_3"><i class="fas fa-apple-alt"></i></div>
           <div id="p7_4"><i class="fas fa-apple-alt"></i></div>
-          <div id="p7_5"><i class="fas fa-apple-alt"></i></div>
+          <div id="p7_5"><i class="fas fa-apple-alt"></i></div>i
           <div class="corridor"></div>
         </div>
       </div>
diff --git a/src/modules/products.js b/src/modules/products.js
index 722b53d..c5d8939 100644
--- a/src/modules/products.js
+++ b/src/modules/products.js
@@ -1,7 +1,6 @@
 class Products {
     
-  constructor(canvas){
-        
+  constructor(canvas) {
     this.gridProducts = [
                           ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
                           ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
@@ -25,29 +24,19 @@ class Products {
                           ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
                           ['a','', 'c', 'd', '', 'f', 'g', '', 'i']
                         ];
-    this.gridProductsAmount = [
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
-                          ['a','', 'c', 'd', '', 'f', 'g', '', 'i']
-                        ];
+
+    this.gridProductsAmount = []
+    for (let i = 0; i < 20; ++i) {
+      const current = []
+      for (let j = 0; j < 9; ++j) {
+        if (j % 3 != 1)
+          current.push(50);
+        else
+          current.push('');
+      }
+      this.gridProductsAmount.push(current);
+    }
+
     this.ctx = canvas.getContext('2d');
     this.setCanvasSize(canvas);
     this.update();
@@ -64,30 +53,28 @@ class Products {
     this.drawProducts();
   }
 
-
-
   drawProducts () {
     for (let [x, line] of Grid.instance.grid.entries()) {
       for (let [y, type] of line.entries()) {
         if (type === GRID_FIELD_TYPE.SHELF) {
-          let v =this.value(x * 100, y * 100);
+          let v = this.drawValue(x, y);
           this.product(x * 100, y * 100, v, x, y);     
         }
       }
     }
   }
 
-  value (x,y){
+  drawValue(x, y) {
     let fontSize = 20;
     this.ctx.font = `${fontSize}px Montserrat`;
     this.ctx.textAlign = "left";
     this.ctx.fillStyle = 'white';
-    let number =  Math.floor(Math.random() * (50 - 0 + 1)) + 0;
-    this.ctx.fillText(number, x+10, y+90);
+    let number = this.gridProductsAmount[x][y];
+    this.ctx.fillText(number, (x * 100) + 10, (y * 100) + 90);
     return number;
   }
 
-  product(x, y, v, productsKey, productsValue){
+  product(x, y, v, productsKey, productsValue) {
     let fontSize = 40;
     this.ctx.font = `${fontSize}px Montserrat`;
     this.ctx.textAlign = "center";
@@ -104,14 +91,15 @@ class Products {
     let prdct = productsColumn[productsValue];
     this.ctx.fillText(prdct, x+50, y+60);
   }
-  
-  
-  changeValue(xFirst, yFirst, xSecond, ySecond){
-
-  }
-
+   
   clearCanvas() {
     this.ctx.clearRect(0, 0, 2000, 900);
   }
- 
+  
+  getProductAt(x, y) {
+    return {
+      item: this.gridProducts[x][y],
+      count: this.gridProductsAmount[x][y]
+    }
+  }
 }
\ No newline at end of file
diff --git a/src/styles.css b/src/styles.css
index 080f135..7d1af0a 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -109,5 +109,10 @@ main {
   grid-template-rows: repeat(9, 9fr);
   justify-items: center;
   align-items: center;
+
+  display: none;
 }
 
+#products i {
+  font-size: 20px;
+}