Shogun

commit 558297e42d4d7cee456f672a07e02b603d1e8447 Author: Maik Hagenbruch Date: Thu Mar 26 13:33:17 2020 +0100 initial commit diff --git a/css/styles.css b/css/styles.css new file mode 100644 index 0000000..52fa736 --- /dev/null +++ b/css/styles.css @@ -0,0 +1,58 @@ +#site { + width: 60%; + margin: 0 auto; + border: 1px solid grey; + padding: 1rem; +} +#site h2 { + text-align: center; +} + +#gamePanel {} +#gamePanel .field { + display:inline-block; +} +#gamePanel .field.even { + background-color: #aaa; +} +#gamePanel .field.odd { + background-color: #ccc; +} +.field { + position: relative; +} +.field .bobble { + content: ""; + position: absolute; + border-radius: 50%; + width: 20px; + height: 20px; + background-color: rgba(255,255,255,0.7); + text-align:center; +} +.field.black { + background-image: url(../img/bauer_black.png); +} + +.field.white { + background-image: url(../img/bauer_weiss.png); +} + +.field.white.shogun { + background-image: url(../img/king_weiss.png) +} +.field.black.shogun { + background-image: url(../img/king_black.png) +} +.field { + background-size:cover; + background-repeat: no-repeat; +} + +.field.farmer, +.field.shogun { + cursor:pointer; +} +#gamePanel .field.possibleMove { + background-color: rgba(100,150,20, 0.8); +} \ No newline at end of file diff --git a/img/bauer_black.png b/img/bauer_black.png new file mode 100644 index 0000000..28d85e6 Binary files /dev/null and b/img/bauer_black.png differ diff --git a/img/bauer_weiss.png b/img/bauer_weiss.png new file mode 100644 index 0000000..34fcb93 Binary files /dev/null and b/img/bauer_weiss.png differ diff --git a/img/king_black.png b/img/king_black.png new file mode 100644 index 0000000..1447bdb Binary files /dev/null and b/img/king_black.png differ diff --git a/img/king_weiss.png b/img/king_weiss.png new file mode 100644 index 0000000..feae2e5 Binary files /dev/null and b/img/king_weiss.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..2ca4a33 --- /dev/null +++ b/index.html @@ -0,0 +1,21 @@ + + + Shogun + + + + +

S H O G U N

+ +

+ + \ No newline at end of file diff --git a/js/game.js b/js/game.js new file mode 100644 index 0000000..48e61c1 --- /dev/null +++ b/js/game.js @@ -0,0 +1,241 @@ +class Game { + constructor() { + this.whitePlayer = new Player('white'); + this.blackPlayer = new Player('black'); + } + drawGamePanel(x,y, widthAndHeight) { + var boxes = new Array(); + for(var i=0; i 8 || item < 1) { + delete possibleTargets[target] + } + }) + } + var allFields = document.querySelectorAll('.field'); + allFields.forEach(function(item, index) { + item.classList.remove('possibleMove'); + }) + for (var target in possibleTargets) { + var greenField = document.querySelector('[data-x="'+possibleTargets[target][0]+'"][data-y="'+possibleTargets[target][1]+'"]') + if(!greenField.classList.contains('farmer') && !greenField.classList.contains('shogun')) { + greenField.classList.add('possibleMove'); + } + } + } +} + +class Player { + constructor(color) { + this.figures = { + positions: new Array(), + b1: new Array(), + b2: new Array(), + b3: new Array(), + b4: new Array(), + b5: new Array(), + b6: new Array(), + b7: new Array(), + sh: new Array(), + } + if(color == 'white') { + this.figures.positions["b1"] = new Array(1,1); + this.figures.positions["b2"] = new Array(2,1); + this.figures.positions["b3"] = new Array(3,1); + this.figures.positions["b4"] = new Array(5,1); + this.figures.positions["b5"] = new Array(6,1); + this.figures.positions["b6"] = new Array(7,1); + this.figures.positions["b7"] = new Array(8,1); + this.figures.positions["sh"] = new Array(4,1); + } + if(color == 'black') { + this.figures.positions["b1"] = new Array(1,8); + this.figures.positions["b2"] = new Array(2,8); + this.figures.positions["b3"] = new Array(3,8); + this.figures.positions["b4"] = new Array(4,8); + this.figures.positions["b5"] = new Array(6,8); + this.figures.positions["b6"] = new Array(7,8); + this.figures.positions["b7"] = new Array(8,8); + this.figures.positions["sh"] = new Array(5,8); + } + } + calculateMoves() { + for(var figure in this.figures) { + if(figure != 'positions') { + if(figure != 'sh') { + for(var i=1; i<65; i++) { + this.figures[figure].push(Math.floor(Math.random() * (5 - 1)) + 1); + } + } else { + for(var i=1; i<65; i++) { + this.figures[figure].push(Math.floor(Math.random() * (3 - 1)) + 1); + } + } + } + } + } +} \ No newline at end of file