krzysiej/jaipur-score
1
0
Fork 0
Code Issues Pull Requests Releases 1 Wiki Activity

Wyświetlanie zdobytych bonusowych monet w podsumowaniu rundy podczas pokazywania wyniku.

Browse Source
This commit is contained in:
kplaczek
2017-09-12 21:11:45 +02:00
parent d23944584d
commit 87b8fe37a3
4 changed files with 64 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
README.md
View File

@@ -24,3 +24,4 @@ Do zrobienia:
- [ ] offline first
- [ ] manifest.json
- [ ] trzymanie sprzedanych kart i zdobyych bonusow w tablicy gracza w sposób pozwalający na określenie jakiego typy karty i bonusy zostały zdobyte
- [ ] tryb nocny

32
css/style.css
View File

@@ -202,7 +202,7 @@
left: 5vw;
box-shadow: 0 0 207px #0000027F;
border: 3px solid #ccc;
/*display: none;*/
display: none;
}
/* PLAYERS END */
@@ -256,27 +256,45 @@
}
.bonus_section {
display: flex;
display: none;
justify-content: center;
}
.bonus_section.show {
display: flex;
}
.player1_bonus {
text-align: right;
margin-right: 3.5vh;
}
.player2_bonus {
.player1_bonus .bonus3,.player1_bonus .bonus4,.player1_bonus .bonus5 {
display: flex;
flex-direction: row-reverse;
}
.player2_bonus {
margin-left: 3.5vh;
}
.bonus_section .player2_bonus, .bonus_section .player1_bonus {
width: 50%;
}
.bonus_section .player1_bonus span:first-child {
margin-left: -30px ;
}
.bonus_section span:first-child {
margin: 1vh 0 1vh 1vw;
margin-left: 0;
}
.bonus_section span {
height: 5vh;
width: 5vh;
height: 6vh;
width: 6vh;
display: inline-block;
margin: 1vh 0 1vh -3vw;
margin-left: -30px ;
border-radius: 50%;
border: 1px solid dodgerblue;
background: no-repeat #fff center center / 60% 60%;

33
index.html
View File

@@ -121,35 +121,14 @@
</div>
<div class="bonus_section">
<div class="player1_bonus">
<div class="bonus3">
<span></span>
<span></span>
<span></span>
</div>
<div class="bonus4">
<span></span>
<span></span>
</div>
<div class="bonus5">
<span></span>
</div>
<div class="bonus3"></div>
<div class="bonus4"></div>
<div class="bonus5"></div>
</div>
<div class="player2_bonus">
<div class="bonus3">
<span></span>
<span></span>
</div>
<div class="bonus4">
<span></span>
<span></span>
<span></span>
<span></span>
</div>
<div class="bonus5">
<span></span>
<span></span>
</div>
<div class="bonus3"></div>
<div class="bonus4"></div>
<div class="bonus5"></div>
</div>
</div>
</div>

44
js/script.js
View File

@@ -3,6 +3,11 @@ function coin(value, group) {
this.group = group;
}
function Bonus(group, value) {
this.value = value;
this.group = group;
}
function player(name, id) {
this.score = 0;
this.roundsWon = 0;
@@ -20,7 +25,7 @@ function player(name, id) {
score += this.coins[i];
}
for (var i in this.bonus) {
score += this.bonus[i];
score += this.bonus[i].value;
}
if (this.hasCamelCoin) {
@@ -80,7 +85,6 @@ function game(player1, player2, board) {
jaipur.showAcceptButton();
} else if (playerId == 2) {
jaipur.activePlayer = this.player2;
document.querySelector('.player.player1').classList.remove("selected");
document.querySelector('.player.player2').classList.add("selected");
jaipur.showAcceptButton();
@@ -88,7 +92,6 @@ function game(player1, player2, board) {
document.querySelector('.player.player1').classList.remove("selected");
document.querySelector('.player.player2').classList.remove("selected");
jaipur.activePlayer = false;
}
return this.activePlayer;
@@ -115,8 +118,6 @@ function game(player1, player2, board) {
var emptyRows = 0;
for (var i in board.goods) {
emptyRows += !board.goods[i].length ? 1 : 0;
console.info(board.goods[i]);
}
return emptyRows >= 3;
};
@@ -130,10 +131,9 @@ function game(player1, player2, board) {
});
};
//pokazuje ikonkę bonusowej monety przy przycisku przydziel
this.showBonusCoins = function () {
var selectedCoins = document.querySelectorAll('.coin.selected').length;
jaipur.hideBonusCoins();
if (selectedCoins >= 5 && !!jaipur.board.bonus.five.length) {
document.querySelector('.bonus5').style.display = 'block';
@@ -152,7 +152,6 @@ function game(player1, player2, board) {
this.showAcceptButton = function () {
console.info(jaipur.selectedCointType);
if (!!jaipur.activePlayer && !!document.querySelector('.coin.selected') &&
((document.querySelectorAll('.coin.selected').length >= 2 &&
['silver', 'gold', 'diamond'].indexOf(jaipur.selectedCointType) > -1
@@ -204,8 +203,7 @@ function game(player1, player2, board) {
};
this.showBonus = function () {
document.querySelector('.bonus_section').classList.add('show');
};
@@ -318,16 +316,20 @@ function game(player1, player2, board) {
jaipur.activePlayer.coins.push(parseInt(coins[i].innerText));
coins[i].remove();
}
//przydzielanie bonusu
var bonus = false;
if (coins.length == 3) {
var bonusGroup = 'three';
bonus = jaipur.board.bonus.three.pop()
bonus = new Bonus(3, jaipur.board.bonus.three.pop()); //{3: jaipur.board.bonus.three.pop()};
} else if (coins.length == 4) {
var bonusGroup = 'four';
bonus = jaipur.board.bonus.four.pop()
bonus = new Bonus(4, jaipur.board.bonus.four.pop()); //{3: jaipur.board.bonus.three.pop()};
// bonus = {4: jaipur.board.bonus.four.pop()};
} else if (coins.length >= 5) {
var bonusGroup = 'five';
bonus = jaipur.board.bonus.five.pop()
bonus = new Bonus(5, jaipur.board.bonus.five.pop()); //{3: jaipur.board.bonus.three.pop()};
// bonus = {5: jaipur.board.bonus.five.pop()};
}
if (!!bonus) {
@@ -344,10 +346,26 @@ function game(player1, player2, board) {
jaipur.setActivePlayer(false);
if (jaipur.isRoundOver()) {
jaipur.showScoreBoard();
jaipur.drawBonusCoins();
}
};
this.drawBonusCoins = function(){
for(var i in jaipur.player1.bonus){
var group = document.querySelector('.player1_bonus .bonus'+jaipur.player1.bonus[i].group);
var bonusCoin = document.createElement("span");
group.appendChild(bonusCoin);
}
for(var i in jaipur.player2.bonus){
var group = document.querySelector('.player2_bonus .bonus'+jaipur.player2.bonus[i].group);
var bonusCoin = document.createElement("span");
group.appendChild(bonusCoin);
}
};
this.initializeCamels = function () {