Zmiany wprowadzone przez Wojtek Łukasik
This commit is contained in:
parent
2240589b2d
commit
7f67325c93
@ -1,3 +1,2 @@
|
|||||||
Repozytorium projektu z sztucznej inteligencji, temat "Inteligentny wózek widłowy". <br>
|
Repozytorium projektu z sztucznej inteligencji, temat "Inteligentny wózek widłowy".
|
||||||
Zespół: 444420, 444428, 444430
|
|
||||||
|
|
||||||
|
BIN
frontend/img/Down.png
Normal file
BIN
frontend/img/Down.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 560 B |
BIN
frontend/img/Left.png
Normal file
BIN
frontend/img/Left.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 567 B |
BIN
frontend/img/Right.png
Normal file
BIN
frontend/img/Right.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 574 B |
BIN
frontend/img/Up.png
Normal file
BIN
frontend/img/Up.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 509 B |
@ -2,108 +2,18 @@
|
|||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width", initial-scale=1.0">
|
||||||
<title>Inteligentny wózek</title>
|
<title>Inteligentny wózek</title>
|
||||||
<link type="text/css" rel="stylesheet" href="styles.css">
|
<link type="text/css" rel="stylesheet" href="styles.css">
|
||||||
<script type="text/javascript" src="script.js">
|
<script type="text/javascript" src="./js/main.js"></script>
|
||||||
</script>
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body onload="start()">
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="plansza">
|
<div class="board" id="board">
|
||||||
<div class="row" id="row-0">
|
|
||||||
<div class="pole" id="0-0"> </div>
|
|
||||||
<div class="pole" id="0-1"> </div>
|
|
||||||
<div class="pole" id="0-2"> </div>
|
|
||||||
<div class="pole" id="0-3"> </div>
|
|
||||||
<div class="pole" id="0-4"> </div>
|
|
||||||
<div class="pole" id="0-5"> </div>
|
|
||||||
<div class="pole" id="0-6"> </div>
|
|
||||||
<div class="pole" id="0-7"> </div>
|
|
||||||
<div class="pole" id="0-8"> </div>
|
|
||||||
<div class="pole" id="0-9"> </div>
|
|
||||||
<div class="pole" id="0-10"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="row" id="row-1">
|
|
||||||
<div class="pole" id="1-0"> </div>
|
|
||||||
<div class="pole" id="1-1"> </div>
|
|
||||||
<div class="pole" id="1-2"> </div>
|
|
||||||
<div class="pole" id="1-3"> </div>
|
|
||||||
<div class="pole" id="1-4"> </div>
|
|
||||||
<div class="pole" id="1-5"> </div>
|
|
||||||
<div class="pole" id="1-6"> </div>
|
|
||||||
<div class="pole" id="1-7"> </div>
|
|
||||||
<div class="pole" id="1-8"> </div>
|
|
||||||
<div class="pole" id="1-9"> </div>
|
|
||||||
<div class="pole" id="1-10"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="row" id="row-2">
|
|
||||||
<div class="pole" id="2-0"> </div>
|
|
||||||
<div class="pole" id="2-1"> </div>
|
|
||||||
<div class="pole" id="2-2"> </div>
|
|
||||||
<div class="pole" id="2-3"> </div>
|
|
||||||
<div class="pole" id="2-4"> </div>
|
|
||||||
<div class="pole" id="2-5"> </div>
|
|
||||||
<div class="pole" id="2-6"> </div>
|
|
||||||
<div class="pole" id="2-7"> </div>
|
|
||||||
<div class="pole" id="2-8"> </div>
|
|
||||||
<div class="pole" id="2-9"> </div>
|
|
||||||
<div class="pole" id="2-10"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="row" id="row-3">
|
|
||||||
<div class="pole" id="3-0"> </div>
|
|
||||||
<div class="pole" id="3-1"> </div>
|
|
||||||
<div class="pole" id="3-2"> </div>
|
|
||||||
<div class="pole" id="3-3"> </div>
|
|
||||||
<div class="pole" id="3-4"> </div>
|
|
||||||
<div class="pole" id="3-5"> </div>
|
|
||||||
<div class="pole" id="3-6"> </div>
|
|
||||||
<div class="pole" id="3-7"> </div>
|
|
||||||
<div class="pole" id="3-8"> </div>
|
|
||||||
<div class="pole" id="3-9"> </div>
|
|
||||||
<div class="pole" id="3-10"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="row" id="row-4">
|
|
||||||
<div class="pole" id="4-0"> </div>
|
|
||||||
<div class="pole" id="4-1"> </div>
|
|
||||||
<div class="pole" id="4-2"> </div>
|
|
||||||
<div class="pole" id="4-3"> </div>
|
|
||||||
<div class="pole" id="4-4"> </div>
|
|
||||||
<div class="pole" id="4-5"> </div>
|
|
||||||
<div class="pole" id="4-6"> </div>
|
|
||||||
<div class="pole" id="4-7"> </div>
|
|
||||||
<div class="pole" id="4-8"> </div>
|
|
||||||
<div class="pole" id="4-9"> </div>
|
|
||||||
<div class="pole" id="4-10"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="row" id="row-5">
|
|
||||||
<div class="pole" id="5-0"> </div>
|
|
||||||
<div class="pole" id="5-1"> </div>
|
|
||||||
<div class="pole" id="5-2"> </div>
|
|
||||||
<div class="pole" id="5-3"> </div>
|
|
||||||
<div class="pole" id="5-4"> </div>
|
|
||||||
<div class="pole" id="5-5"> </div>
|
|
||||||
<div class="pole" id="5-6"> </div>
|
|
||||||
<div class="pole" id="5-7"> </div>
|
|
||||||
<div class="pole" id="5-8"> </div>
|
|
||||||
<div class="pole" id="5-9"> </div>
|
|
||||||
<div class="pole" id="5-10"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="row" id="row-6">
|
|
||||||
<div class="pole" id="6-0"> </div>
|
|
||||||
<div class="pole" id="6-1"> </div>
|
|
||||||
<div class="pole" id="6-2"> </div>
|
|
||||||
<div class="pole" id="6-3"> </div>
|
|
||||||
<div class="pole" id="6-4"> </div>
|
|
||||||
<div class="pole" id="6-5"> </div>
|
|
||||||
<div class="pole" id="6-6"> </div>
|
|
||||||
<div class="pole" id="6-7"> </div>
|
|
||||||
<div class="pole" id="6-8"> </div>
|
|
||||||
<div class="pole" id="6-9"> </div>
|
|
||||||
<div class="pole" id="6-10"> </div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<script type="module" src="./js/main.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
87
frontend/js/Agent.js
Normal file
87
frontend/js/Agent.js
Normal file
@ -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 = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
30
frontend/js/Board.js
Normal file
30
frontend/js/Board.js
Normal file
@ -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 += "<div class='row' id='row-" + y + "'> </div>";
|
||||||
|
|
||||||
|
for(let x = 0; x < board[y].length; x++){
|
||||||
|
document.getElementById("row-" + y).innerHTML += "<div class='field' id=" + x + "-" + y + "> </div>"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
22
frontend/js/Field.js
Normal file
22
frontend/js/Field.js
Normal file
@ -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;
|
||||||
|
}
|
||||||
|
}
|
27
frontend/js/main.js
Normal file
27
frontend/js/main.js
Normal file
@ -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();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
125
frontend/js/script.js
Normal file
125
frontend/js/script.js
Normal file
@ -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);
|
||||||
|
// }
|
@ -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);
|
|
||||||
}
|
|
@ -1,33 +1,39 @@
|
|||||||
|
body {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.container{
|
.container{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
min-width: 1920px;
|
||||||
|
min-height: 1080px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
background-color: grey;
|
background-color: rgb(37, 36, 36);
|
||||||
}
|
}
|
||||||
|
|
||||||
.plansza{
|
#board{
|
||||||
width: 1100px;
|
width: 700px;
|
||||||
height:700px;
|
height: 700px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
transform: translate(-50%, -50%);
|
transform: translate(-50%, -50%);
|
||||||
background-color: lightyellow;
|
background-color: white;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.row{
|
.row{
|
||||||
width: 1100px;
|
width: 100%;
|
||||||
height: 100px;
|
height: 70px;
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pole{
|
.field{
|
||||||
height: 100px;
|
height: 70px;
|
||||||
width: 100px;
|
width: 70px;
|
||||||
background-color: lightyellow;
|
background-color: white;
|
||||||
background-image: none;
|
background-image: none;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
border-color: black;
|
border-color: black;
|
||||||
@ -43,8 +49,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.regal{
|
.regal{
|
||||||
height: 100px;
|
height: 50px;
|
||||||
width: 100px;
|
width: 50px;
|
||||||
color: lightyellow;
|
color: lightyellow;
|
||||||
background-color: darkslategrey;
|
background-color: darkslategrey;
|
||||||
border-color: black;
|
border-color: black;
|
||||||
@ -57,3 +63,4 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user