changed code -> The selected piece is now marked blue. All valid moves are marked green. All valid moves that kill a piece are marked red. Added nonpermanent debug lines to test this untill movement is implemented
This commit is contained in:
parent
ab09f76a06
commit
1bf296a382
193
code.js
193
code.js
@ -1,5 +1,17 @@
|
||||
let fieldId;
|
||||
let field;
|
||||
let down;
|
||||
let down2;
|
||||
let up;
|
||||
let up2;
|
||||
let left;
|
||||
let right;
|
||||
let topRight;
|
||||
let topLeft;
|
||||
let bottomRight;
|
||||
let bottomLeft;
|
||||
let rowMin;
|
||||
let rowMax;
|
||||
let somethingIsSelected = false;
|
||||
|
||||
for(let i = 0; i < 64; i++){
|
||||
@ -16,7 +28,14 @@ for(let i = 0; i < 8; i++){
|
||||
fieldId = i.toString();
|
||||
document.getElementById("field"+fieldId).piece = 2; //Setzt die piece Variable von Feld 0 bis 8 auf 1 -> Diese Felder haben einen Spielstein von Spieler 1
|
||||
}
|
||||
|
||||
/* ---------- DEBUG, NICHT PERMANENT ---------- */
|
||||
document.getElementById("field41").piece = 1;
|
||||
document.getElementById("field34").piece = 2;
|
||||
/* ---------- DEBUG, NICHT PERMANENT ---------- */
|
||||
|
||||
drawPieces();
|
||||
resetValidMoves();
|
||||
|
||||
function drawPieces() {
|
||||
for (let i = 0; i < 64; i++) {
|
||||
@ -40,7 +59,7 @@ function selectField(field){
|
||||
}
|
||||
}
|
||||
if(!somethingIsSelected && field.piece !== 0) {
|
||||
field.style.backgroundColor = "rgb(227,8,8, 0.3)";
|
||||
field.style.backgroundColor = "rgb(16,43,202, 0.3)";
|
||||
field.selected = 1;
|
||||
if(field.piece === 1){
|
||||
validMovesPlayer1(field);
|
||||
@ -48,14 +67,180 @@ function selectField(field){
|
||||
validMovesPlayer2(field);
|
||||
}
|
||||
} else if (field.selected === 1){
|
||||
field.style.backgroundColor = "rgb(255,255,255, 1)";
|
||||
for (let i = 0; i < 64; i++) {
|
||||
fieldId = i.toString();
|
||||
document.getElementById("field" + fieldId).style.backgroundColor = "rgb(255,255,255, 1)";
|
||||
document.getElementById("field" + fieldId).validMove = 0;
|
||||
}
|
||||
field.selected = 0;
|
||||
somethingIsSelected = false;
|
||||
}
|
||||
}
|
||||
function validMovesPlayer1(field){
|
||||
|
||||
if(field.fieldNum < 8 && field.fieldNum >= 0){
|
||||
rowMin = 0;
|
||||
rowMax = 7;
|
||||
} else if(field.fieldNum < 16 && field.fieldNum >= 8){
|
||||
rowMin = 8;
|
||||
rowMax = 15;
|
||||
} else if(field.fieldNum < 24 && field.fieldNum >= 16){
|
||||
rowMin = 16;
|
||||
rowMax = 23;
|
||||
} else if(field.fieldNum < 32 && field.fieldNum >= 24){
|
||||
rowMin = 24;
|
||||
rowMax = 31;
|
||||
} else if(field.fieldNum < 40 && field.fieldNum >= 32){
|
||||
rowMin = 32;
|
||||
rowMax = 39;
|
||||
} else if(field.fieldNum < 48 && field.fieldNum >= 40){
|
||||
rowMin = 40;
|
||||
rowMax = 47;
|
||||
} else if(field.fieldNum < 56 && field.fieldNum >= 48){
|
||||
rowMin = 48;
|
||||
rowMax = 55;
|
||||
} else if(field.fieldNum < 64 && field.fieldNum >= 56){
|
||||
rowMin = 56;
|
||||
rowMax = 63;
|
||||
}
|
||||
if((field.fieldNum + 8) < 64) {
|
||||
down = document.getElementById("field" + (field.fieldNum + 8).toString());
|
||||
if(down.piece === 0){
|
||||
down.validMove = 1;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum - 8) >= 0) {
|
||||
up = document.getElementById("field" + (field.fieldNum - 8).toString());
|
||||
if(up.piece === 0){
|
||||
up.validMove = 1;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum - 16) >= 0) {
|
||||
up2 = document.getElementById("field" + (field.fieldNum - 16).toString());
|
||||
if(up.validMove === 1 && up2.piece === 0){
|
||||
up2.validMove = 1;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum - 1) >= rowMin) {
|
||||
left = document.getElementById("field" + (field.fieldNum - 1).toString());
|
||||
if(left.piece === 0){
|
||||
left.validMove = 1;
|
||||
} else if (left.piece === 2){
|
||||
left.validMove = 2;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum + 1) <= rowMax) {
|
||||
right = document.getElementById("field" + (field.fieldNum + 1).toString());
|
||||
if(right.piece === 0){
|
||||
right.validMove = 1;
|
||||
} else if (right.piece === 2){
|
||||
right.validMove = 2;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum - 9) >= (rowMin - 8)) {
|
||||
topLeft = document.getElementById("field" + (field.fieldNum - 9).toString());
|
||||
if (topLeft.piece === 2){
|
||||
topLeft.validMove = 2;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum - 7) <= (rowMax - 8)) {
|
||||
topRight = document.getElementById("field" + (field.fieldNum - 7).toString());
|
||||
if (topRight.piece === 2){
|
||||
topRight.validMove = 2;
|
||||
}
|
||||
}
|
||||
for(let i = 0; i < 64; i++){
|
||||
fieldId = i.toString();
|
||||
if(document.getElementById("field"+fieldId).validMove === 1){
|
||||
document.getElementById("field"+fieldId).style.backgroundColor = "rgb(33,157,35, 0.3)";
|
||||
} else if(document.getElementById("field"+fieldId).validMove === 2){
|
||||
document.getElementById("field"+fieldId).style.backgroundColor = "rgb(227,8,8, 0.3)";
|
||||
}
|
||||
}
|
||||
}
|
||||
function validMovesPlayer2(field){
|
||||
|
||||
if(field.fieldNum < 8 && field.fieldNum >= 0){
|
||||
rowMin = 0;
|
||||
rowMax = 7;
|
||||
} else if(field.fieldNum < 16 && field.fieldNum >= 8){
|
||||
rowMin = 8;
|
||||
rowMax = 15;
|
||||
} else if(field.fieldNum < 24 && field.fieldNum >= 16){
|
||||
rowMin = 16;
|
||||
rowMax = 23;
|
||||
} else if(field.fieldNum < 32 && field.fieldNum >= 24){
|
||||
rowMin = 24;
|
||||
rowMax = 31;
|
||||
} else if(field.fieldNum < 40 && field.fieldNum >= 32){
|
||||
rowMin = 32;
|
||||
rowMax = 39;
|
||||
} else if(field.fieldNum < 48 && field.fieldNum >= 40){
|
||||
rowMin = 40;
|
||||
rowMax = 47;
|
||||
} else if(field.fieldNum < 56 && field.fieldNum >= 48){
|
||||
rowMin = 48;
|
||||
rowMax = 55;
|
||||
} else if(field.fieldNum < 64 && field.fieldNum >= 56){
|
||||
rowMin = 56;
|
||||
rowMax = 63;
|
||||
}
|
||||
if((field.fieldNum + 8) < 64) {
|
||||
down = document.getElementById("field" + (field.fieldNum + 8).toString());
|
||||
if(down.piece === 0){
|
||||
down.validMove = 1;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum + 16) < 64) {
|
||||
down2 = document.getElementById("field" + (field.fieldNum + 16).toString());
|
||||
if(down.validMove === 1 && down2.piece === 0){
|
||||
down2.validMove = 1;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum - 8) >= 0) {
|
||||
up = document.getElementById("field" + (field.fieldNum - 8).toString());
|
||||
if(up.piece === 0){
|
||||
up.validMove = 1;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum - 1) >= rowMin) {
|
||||
left = document.getElementById("field" + (field.fieldNum - 1).toString());
|
||||
if(left.piece === 0){
|
||||
left.validMove = 1;
|
||||
} else if (left.piece === 1){
|
||||
left.validMove = 2;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum + 1) <= rowMax) {
|
||||
right = document.getElementById("field" + (field.fieldNum + 1).toString());
|
||||
if(right.piece === 0){
|
||||
right.validMove = 1;
|
||||
} else if (right.piece === 1){
|
||||
right.validMove = 2;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum + 7) >= (rowMin + 8)) {
|
||||
bottomLeft = document.getElementById("field" + (field.fieldNum + 7).toString());
|
||||
if (bottomLeft.piece === 1){
|
||||
bottomLeft.validMove = 2;
|
||||
}
|
||||
}
|
||||
if((field.fieldNum + 9) <= (rowMax + 8)) {
|
||||
bottomRight = document.getElementById("field" + (field.fieldNum + 9).toString());
|
||||
if (bottomRight.piece === 1){
|
||||
bottomRight.validMove = 2;
|
||||
}
|
||||
}
|
||||
for(let i = 0; i < 64; i++){
|
||||
fieldId = i.toString();
|
||||
if(document.getElementById("field"+fieldId).validMove === 1){
|
||||
document.getElementById("field"+fieldId).style.backgroundColor = "rgb(33,157,35, 0.3)";
|
||||
} else if(document.getElementById("field"+fieldId).validMove === 2){
|
||||
document.getElementById("field"+fieldId).style.backgroundColor = "rgb(227,8,8, 0.3)";
|
||||
}
|
||||
}
|
||||
}
|
||||
function resetValidMoves(){
|
||||
for(let i = 0; i < 64; i++){
|
||||
let fieldId = i.toString();
|
||||
document.getElementById("field"+fieldId).validMove = 0;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user