-
+
\ No newline at end of file
diff --git a/frontend/js/Agent.js b/frontend/js/Agent.js
new file mode 100644
index 0000000..1a51fc2
--- /dev/null
+++ b/frontend/js/Agent.js
@@ -0,0 +1,87 @@
+export default class Agent{
+ constructor(positionX, positionY, turn){
+ this.positionX = positionX;
+ this.positionY = positionY;
+ this.turn = turn;
+ }
+
+ getParams(){
+ let params = {};
+
+ positionX = this.positionX;
+ positionY = this.positionY;
+ turn = this.turn;
+
+ params = {positionX, positionY, turn};
+
+ return params;
+ }
+
+ goForward(){
+ if(this.turn == 'Up'){
+ this.positionY += 1;
+ }
+ else if(this.turn == 'Down'){
+ this.positionY -= 1;
+ }
+ else if(this.turn == 'Left'){
+ this.positionX -= 1;
+ }
+ else if(this.turn == 'Right'){
+ this.positionX += 1;
+ }
+ }
+
+ turnLeft(){
+ if(this.turn == 'Up'){
+ this.turn = 'Left';
+ }
+ else if(this.turn == 'Down'){
+ this.turn = 'Right';
+ }
+ else if(this.turn == 'Left'){
+ this.turn = 'Down';
+ }
+ else if(this.turn == 'Right'){
+ this.turn = 'Up'
+ }
+ }
+
+ turnRight(){
+ if(this.turn == 'Up'){
+ this.turn = 'Right';
+ }
+ else if(this.turn == 'Down'){
+ this.turn = 'Left';
+ }
+ else if(this.turn == 'Left'){
+ this.turn = 'Up';
+ }
+ else if(this.turn == 'Right'){
+ this.turn = 'Down'
+ }
+ }
+
+ showAgent(){
+ console.log(this.turn)
+ if(this.turn === "Up"){
+ document.getElementById(this.positionX + "-" + this.positionY).style.backgroundImage = "url('img/Up.png')";
+ }
+ else if(this.turn === "Down"){
+ document.getElementById(this.positionX + "-" + this.positionY).style.backgroundImage = "url('img/Down.png')";
+ }
+ else if(this.turn === "Right"){
+ document.getElementById(this.positionX + "-" + this.positionY).style.backgroundImage = "url('img/Right.png')";
+ }
+ else if(this.turn === "Left"){
+ document.getElementById(this.positionX + "-" + this.positionY).style.backgroundImage = "url('img/Left.png')";
+ }
+
+ }
+
+ hideAgent(){
+ document.getElementById(this.positionX + "-" + this.positionY).style.backgroundImage = "";
+ }
+
+
+}
\ No newline at end of file
diff --git a/frontend/js/Board.js b/frontend/js/Board.js
new file mode 100644
index 0000000..178bfb1
--- /dev/null
+++ b/frontend/js/Board.js
@@ -0,0 +1,30 @@
+import Field from './Field.js'
+
+export function createBoard(rangeX, rangeY){
+ const board = [];
+
+ for(let y = 0; y < rangeY; y++){
+ const row = [];
+ for(let x = 0; x < rangeX; x++){
+ let field = new Field(x, y, false, false, 1);
+ row.push(field)
+ }
+ board.push(row)
+ }
+ return board
+}
+
+export function showBoard(board){
+ for(let y = board.length - 1; y >= 0 ; y--){
+ document.getElementById("board").innerHTML += "
";
+
+ for(let x = 0; x < board[y].length; x++){
+ document.getElementById("row-" + y).innerHTML += "
"
+ }
+ }
+}
+
+
+
+
+
diff --git a/frontend/js/Field.js b/frontend/js/Field.js
new file mode 100644
index 0000000..7e2b03b
--- /dev/null
+++ b/frontend/js/Field.js
@@ -0,0 +1,22 @@
+export default class Field{
+ constructor(x, y, isShelf, isOccupiedByAgent, costOfTravel){
+ this.xField = x;
+ this.yField = y;
+ this.isShelf = isShelf;
+ this.isOccupiedByAgent = isOccupiedByAgent;
+ this.costOfTravel = costOfTravel;
+ }
+
+ getParams(){
+ let params = {};
+
+ xField = this.xField;
+ yField = this.yField;
+ isShelf = this.isShelf;
+ isOccupiedByAgent = this.isOccupiedByAgent;
+ costOfTravel = this.costOfTravel;
+ params = {xField, yField, isShelf, isOccupiedByAgent, costOfTravel}
+
+ return params;
+ }
+}
\ No newline at end of file
diff --git a/frontend/js/main.js b/frontend/js/main.js
new file mode 100644
index 0000000..735d905
--- /dev/null
+++ b/frontend/js/main.js
@@ -0,0 +1,27 @@
+import * as Board from './Board.js'
+import Agent from './Agent.js'
+
+let board = Board.createBoard(10,10);
+Board.showBoard(board);
+
+let agent = new Agent(0,0, 'Right');
+
+agent.showAgent();
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/js/script.js b/frontend/js/script.js
new file mode 100644
index 0000000..44ad711
--- /dev/null
+++ b/frontend/js/script.js
@@ -0,0 +1,125 @@
+// import Agent from './Agent.js'
+
+// //Klasy
+
+
+// class Field {
+// constructor(x, y, isEmpty) {
+// this.xField = x;
+// this.yField = y;
+// this.isFieldEmpty = isEmpty;
+// }
+// getCoordinates(){
+// return this.xField + this.yField;
+// }
+
+// getStatus(){
+// return this.isFieldEmpty;
+// }
+// }
+
+// class Product {
+// constructor(name, type, farcing, price) {
+// this.name = name;
+// this.type = type;
+// this.farcing = farcing;
+// this.price = price
+// }
+// }
+
+// class Rack{
+// constructor(noOfShelf, typOfProduct) {
+// this.noOfShelf = noOfShelf;
+// }
+
+// addShelf(){
+// this.noOfShelf = this.noOfShelf + 1;
+// }
+
+// isEmpty(){
+// if (this.noOfShelf === 0){
+// return true;
+// }else {
+// return false;
+// }
+// }
+// }
+
+// class Shelf {
+// constructor(number) {
+// this.number = number;
+// }
+// }
+
+
+// //Objekty i zmienne
+// var regaly = ['1-1', '1-3', '1-4', '1-6', '1-7', '1-9', '2-1', '2-9', '3-3', '3-4', '3-6', '3-7', '4-1', '4-9', '5-1', '5-3', '5-4', '5-6', '5-7', '5-9']
+// const agent1 = new Agent(3, 0);
+
+// //Funkcja uruchamiająca prace calego scriptu
+// function start(){
+// //ponumerujPola();
+// pokolorujRegaly();
+// umiescAgenta(agent1);
+// droga(agent1);
+// }
+
+// //Funkcja kolorujaca miejsca na planszy gdzie znajduja sie regaly
+// function pokolorujRegaly(){
+// let x;
+// for(x = 0; x < regaly.length; x++){
+// document.getElementById(regaly[x]).className = 'regal';
+// }
+// }
+
+// //Funkcja wyswietlajaca id pol
+// function ponumerujPola(){
+// let x,y
+// for(x = 0; x < 7; x++){
+// for(y = 0; y < 11; y++){
+// id = x.toString() + "-" + y.toString();
+// document.getElementById(id).innerHTML = id;
+// }
+// }
+// }
+
+// //Funkcja usuwająca agenta z pola, przed przemieszczeniem
+// function usunAgenta(agent){
+// document.getElementById(agent.getId()).style.backgroundImage = "none";
+// }
+
+
+// //Funckja wyswietlajaca agenta gdy ten zmieni polozenie
+// function umiescAgenta(agent) {
+// document.getElementById(agent.getId()).style.backgroundImage = "url('Agent.jpg')";
+// }
+
+// //Funkcja zmieniajaca polozenie agenta o 1 pole
+// function przemieszczenie(side, time, agent){
+// const lastPosition = agent.getId();
+// setTimeout(function(){
+// usunAgenta(agent)
+// if(side == "left")
+// agent.left();
+// if(side == "right")
+// agent.right();
+// if(side == "up")
+// agent.up();
+// if(side == "down")
+// agent.down();
+// umiescAgenta(agent);
+// }, time);
+// }
+
+// //Funkcja ktora ustala droge agenta do przebycia
+// function droga(agent) {
+// przemieszczenie("right", 1000, agent);
+// przemieszczenie("right", 2000, agent);
+// przemieszczenie("up", 3000, agent);
+// przemieszczenie("right", 4000, agent);
+// przemieszczenie("right", 5000, agent);
+// przemieszczenie("right", 6000, agent);
+// przemieszczenie("right", 7000, agent);
+// przemieszczenie("right", 8000, agent);
+// przemieszczenie("right", 9000, agent);
+// }
diff --git a/frontend/script.js b/frontend/script.js
deleted file mode 100644
index b3921a1..0000000
--- a/frontend/script.js
+++ /dev/null
@@ -1,150 +0,0 @@
-//Klasy
-class Agent {
- constructor(x, y){
- this.xField = x;
- this.yField = y;
- }
-
- getId(){
- return this.xField + "-" + this.yField;
- }
-
- right(){
- this.yField++;
- }
-
- left(){
- this.yField--;
- }
-
- up(){
- this.xField--;
- }
-
- down(){
- this.xField++;
- }
-}
-
-class Field {
- constructor(x, y, isEmpty) {
- this.xField = x;
- this.yField = y;
- this.isFieldEmpty = isEmpty;
- }
- getCoordinates(){
- return this.xField + this.yField;
- }
-
- getStatus(){
- return this.isFieldEmpty;
- }
-}
-
-class Product {
- constructor(name, type, specs, price) {
- this.name = name;
- this.type = type;
- this.specs = specs;
- this.price = price
- }
-}
-
-
-class Rack{
- constructor(noOfShelf) {
- this.noOfShelf = noOfShelf;
- }
-
- addShelf(){
- this.noOfShelf = this.noOfShelf + 1;
- }
-
- isEmpty(){
- if (this.noOfShelf === 0){
- return true;
- }else {
- return false;
- }
- }
-}
-
-class Shelf {
- constructor(number, typeOfProduct) {
- this.number = number;
- this.typeOfProduct = typeOfProduct;
- }
-}
-
-
-//Objekty i zmienne
-var regaly = ['1-1', '1-3', '1-4', '1-6', '1-7', '1-9', '2-1', '2-9', '3-3', '3-4', '3-6', '3-7', '4-1', '4-9', '5-1', '5-3', '5-4', '5-6', '5-7', '5-9']
-const agent1 = new Agent(3, 0);
-
-//Funkcja uruchamiająca prace calego scriptu
-function start(){
- //ponumerujPola();
- pokolorujRegaly();
- umiescAgenta(agent1);
- droga(agent1);
-}
-
-//Funkcja kolorujaca miejsca na planszy gdzie znajduja sie regaly
-function pokolorujRegaly(){
- let x;
- for(x = 0; x < regaly.length; x++){
- document.getElementById(regaly[x]).className = 'regal';
- }
-}
-
-//Funkcja wyswietlajaca id pol
-function ponumerujPola(){
- let x,y
- for(x = 0; x < 7; x++){
- for(y = 0; y < 11; y++){
- id = x.toString() + "-" + y.toString();
- document.getElementById(id).innerHTML = id;
- }
- }
-}
-
-//Funkcja usuwająca agenta z pola, przed przemieszczeniem
-function usunAgenta(agent){
- document.getElementById(agent.getId()).style.backgroundImage = "none";
-}
-
-
-//Funckja wyswietlajaca agenta gdy ten zmieni polozenie
-function umiescAgenta(agent) {
- document.getElementById(agent.getId()).style.backgroundImage = "url('Agent.jpg')";
-}
-
-//Funkcja zmieniajaca polozenie agenta o 1 pole
-function przemieszczenie(side, time, agent){
- const lastPosition = agent.getId();
- setTimeout(function(){
- usunAgenta(agent)
- if(side == "left")
- agent.left();
- if(side == "right")
- agent.right();
- if(side == "up")
- agent.up();
- if(side == "down")
- agent.down();
- umiescAgenta(agent);
- }, time);
-}
-
-//Funkcja ktora ustala droge agenta do przebycia
-function droga(agent) {
- przemieszczenie("right", 1000, agent);
- przemieszczenie("right", 2000, agent);
- przemieszczenie("up", 3000, agent);
- przemieszczenie("right", 4000, agent);
- przemieszczenie("right", 5000, agent);
- przemieszczenie("right", 6000, agent);
- przemieszczenie("right", 7000, agent);
- przemieszczenie("right", 8000, agent);
- przemieszczenie("right", 9000, agent);
-}
diff --git a/frontend/styles.css b/frontend/styles.css
index 877c58c..0fbed01 100644
--- a/frontend/styles.css
+++ b/frontend/styles.css
@@ -1,33 +1,39 @@
+body {
+ padding: 0;
+ margin: 0;
+}
+
.container{
width: 100%;
height: 100%;
+ min-width: 1920px;
+ min-height: 1080px;
position: absolute;
- background-color: grey;
+ background-color: rgb(37, 36, 36);
}
-.plansza{
- width: 1100px;
- height:700px;
+#board{
+ width: 700px;
+ height: 700px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
- background-color: lightyellow;
-
+ background-color: white;
}
.row{
- width: 1100px;
- height: 100px;
+ width: 100%;
+ height: 70px;
display: flex;
flex-direction: row;
}
-.pole{
- height: 100px;
- width: 100px;
- background-color: lightyellow;
+.field{
+ height: 70px;
+ width: 70px;
+ background-color: white;
background-image: none;
background-size: cover;
border-color: black;
@@ -43,8 +49,8 @@
}
.regal{
- height: 100px;
- width: 100px;
+ height: 50px;
+ width: 50px;
color: lightyellow;
background-color: darkslategrey;
border-color: black;
@@ -57,3 +63,4 @@
justify-content: center;
align-items: center;
}
+