Finalization of products
This commit is contained in:
parent
fec4866898
commit
1e65d15022
@ -194,7 +194,7 @@
|
|||||||
<div class="corridor"></div>
|
<div class="corridor"></div>
|
||||||
<div class="corridor"></div>
|
<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>
|
<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_2"><i class="fas fa-apple-alt"></i></div>
|
||||||
<div id="p7_3"><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_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 class="corridor"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
class Products {
|
class Products {
|
||||||
|
|
||||||
constructor(canvas){
|
constructor(canvas) {
|
||||||
|
|
||||||
this.gridProducts = [
|
this.gridProducts = [
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
||||||
['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'],
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i']
|
['a','', 'c', 'd', '', 'f', 'g', '', 'i']
|
||||||
];
|
];
|
||||||
this.gridProductsAmount = [
|
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
this.gridProductsAmount = []
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
for (let i = 0; i < 20; ++i) {
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
const current = []
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
for (let j = 0; j < 9; ++j) {
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
if (j % 3 != 1)
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
current.push(50);
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
else
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
current.push('');
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
}
|
||||||
['a','', 'c', 'd', '', 'f', 'g', '', 'i'],
|
this.gridProductsAmount.push(current);
|
||||||
['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.ctx = canvas.getContext('2d');
|
this.ctx = canvas.getContext('2d');
|
||||||
this.setCanvasSize(canvas);
|
this.setCanvasSize(canvas);
|
||||||
this.update();
|
this.update();
|
||||||
@ -64,30 +53,28 @@ class Products {
|
|||||||
this.drawProducts();
|
this.drawProducts();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
drawProducts () {
|
drawProducts () {
|
||||||
for (let [x, line] of Grid.instance.grid.entries()) {
|
for (let [x, line] of Grid.instance.grid.entries()) {
|
||||||
for (let [y, type] of line.entries()) {
|
for (let [y, type] of line.entries()) {
|
||||||
if (type === GRID_FIELD_TYPE.SHELF) {
|
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);
|
this.product(x * 100, y * 100, v, x, y);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
value (x,y){
|
drawValue(x, y) {
|
||||||
let fontSize = 20;
|
let fontSize = 20;
|
||||||
this.ctx.font = `${fontSize}px Montserrat`;
|
this.ctx.font = `${fontSize}px Montserrat`;
|
||||||
this.ctx.textAlign = "left";
|
this.ctx.textAlign = "left";
|
||||||
this.ctx.fillStyle = 'white';
|
this.ctx.fillStyle = 'white';
|
||||||
let number = Math.floor(Math.random() * (50 - 0 + 1)) + 0;
|
let number = this.gridProductsAmount[x][y];
|
||||||
this.ctx.fillText(number, x+10, y+90);
|
this.ctx.fillText(number, (x * 100) + 10, (y * 100) + 90);
|
||||||
return number;
|
return number;
|
||||||
}
|
}
|
||||||
|
|
||||||
product(x, y, v, productsKey, productsValue){
|
product(x, y, v, productsKey, productsValue) {
|
||||||
let fontSize = 40;
|
let fontSize = 40;
|
||||||
this.ctx.font = `${fontSize}px Montserrat`;
|
this.ctx.font = `${fontSize}px Montserrat`;
|
||||||
this.ctx.textAlign = "center";
|
this.ctx.textAlign = "center";
|
||||||
@ -105,13 +92,14 @@ class Products {
|
|||||||
this.ctx.fillText(prdct, x+50, y+60);
|
this.ctx.fillText(prdct, x+50, y+60);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
changeValue(xFirst, yFirst, xSecond, ySecond){
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
clearCanvas() {
|
clearCanvas() {
|
||||||
this.ctx.clearRect(0, 0, 2000, 900);
|
this.ctx.clearRect(0, 0, 2000, 900);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
getProductAt(x, y) {
|
||||||
|
return {
|
||||||
|
item: this.gridProducts[x][y],
|
||||||
|
count: this.gridProductsAmount[x][y]
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
@ -109,5 +109,10 @@ main {
|
|||||||
grid-template-rows: repeat(9, 9fr);
|
grid-template-rows: repeat(9, 9fr);
|
||||||
justify-items: center;
|
justify-items: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#products i {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user