Browse Source

refactoring: Spielbrett jetzt mit einem einzelnen Funktionsaufruf aufgebaut

main
Richard Halsall 2 years ago
parent
commit
de499f868c
  1. 2
      schlangen_und_leitern/HTML.html
  2. 15
      schlangen_und_leitern/js/Bridge.js
  3. 30
      schlangen_und_leitern/js/boardHandling.js

2
schlangen_und_leitern/HTML.html

@ -6,7 +6,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="js/diceHandling.js"></script> <script type="text/javascript" src="js/diceHandling.js"></script>
<script type= "text/javascript" src="js/makeBoard.js"></script>
<script type= "text/javascript" src="js/boardHandling.js"></script>
<script type= "text/javascript" src="js/Bridge.js"></script> <script type= "text/javascript" src="js/Bridge.js"></script>
<script type= "text/javascript" src="js/playerHandling.js"></script> <script type= "text/javascript" src="js/playerHandling.js"></script>
<title>Document</title> <title>Document</title>

15
schlangen_und_leitern/js/Bridge.js

@ -4,13 +4,13 @@ let turnCount = 1;
function init(playerCount){ function init(playerCount){
//hide menue //hide menue
hideStartMenu() hideStartMenu()
//arrays deklaren
var canvasPointArr= [];
let objectArr = [];
// Spielbrett Aufbauen // Spielbrett Aufbauen
boardArr = buildBoard();
drawBoard(boardArr);
buildBoard(objectArr,canvasPointArr);
//spielbret objekte genererien //spielbret objekte genererien
let objectArr = [];
generateBoardObjects(leitern, schlangen, objectArr);
// spieler Strukturen aufbauen mit hilfe spieler Anzahl // spieler Strukturen aufbauen mit hilfe spieler Anzahl
let playerArray = buildPlayerArray(playerCount); let playerArray = buildPlayerArray(playerCount);
@ -22,10 +22,9 @@ function init(playerCount){
////////experiemnt ////////experiemnt
var canvasPointArr= [];
drawCanavas();
canvasPointGen(canvasPointArr); canvasPointGen(canvasPointArr);
createBoardObjects(canvasPointArr, objectArr)
drawBoardObjects(canvasPointArr, objectArr)

30
schlangen_und_leitern/js/makeBoard.js → schlangen_und_leitern/js/boardHandling.js

@ -1,12 +1,12 @@
//ein Array erstellen, aus dem die Spilebrett gezeichnet werden kann //ein Array erstellen, aus dem die Spilebrett gezeichnet werden kann
function buildBoard(){
function buildBoard(objectArr,canvasPointArr){
let boardArr = []; let boardArr = [];
let width = 10; let width = 10;
let height = 10; let height = 10;
let count = 100 let count = 100
let direction = 0 //0 = gerade reihe (links nach Rechts) ; 1 = ungerade reihe (rechts nach Links) let direction = 0 //0 = gerade reihe (links nach Rechts) ; 1 = ungerade reihe (rechts nach Links)
// construct board array
for(var y = 0; y < height ; y++){ for(var y = 0; y < height ; y++){
let row = []; let row = [];
if(direction == 0){ if(direction == 0){
@ -29,14 +29,20 @@ function buildBoard(){
} }
boardArr.push(row) boardArr.push(row)
} }
console.log(boardArr)
return boardArr;
}
// draw board on screen using board array
drawBoard(boardArr);
//draw canvas overlay
drawCanavas()
// cast points to center of board cells
canvasPointGen(canvasPointArr);
// add snakes and ladders objects to object array
generateBoardObjects(leitern, schlangen, objectArr)
//draw board objects
drawBoardObjects(canvasPointArr, objectArr)
}
function drawBoard(arr){ function drawBoard(arr){
@ -57,11 +63,6 @@ function drawBoard(arr){
cell.innerHTML = (arr[y][x]); cell.innerHTML = (arr[y][x]);
} }
} }
// add drawing of snakes and ladders
} }
//spielbrett objekt Struktur //spielbrett objekt Struktur
@ -100,6 +101,9 @@ function generateBoardObjects (leitern, schlangen, objectArray){
objectArray.push(schlange); objectArray.push(schlange);
} }
} }
//make a canvas the same size as the playbaord //make a canvas the same size as the playbaord
function drawCanavas(){ function drawCanavas(){
var ctx = document.getElementById("canvas"); var ctx = document.getElementById("canvas");
@ -215,7 +219,7 @@ function drawLine(type, startPosX, startPosY, endPosX, endPosY){
} }
function createBoardObjects(canvasPointArr, objectArray){
function drawBoardObjects(canvasPointArr, objectArray){
//loop through all object in the object array //loop through all object in the object array
for(let i = 0; i < objectArray.length; i++){ for(let i = 0; i < objectArray.length; i++){
Loading…
Cancel
Save