Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 401ba38

Browse files
author
Samane
authored
Add files via upload
1 parent 8bfd9f1 commit 401ba38

File tree

3 files changed

+56
-16
lines changed

3 files changed

+56
-16
lines changed

‎Challenge4/app.js‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
var scores, roundScore, activePlayer, gamePlaying;
1+
var scores, roundScore, activePlayer, gamePlaying,finalScore;
22
var diceDOM = document.querySelector('.dice');
33
init();
44

@@ -27,7 +27,9 @@ document.querySelector('.btn-hold').addEventListener('click', function () {
2727
scores[activePlayer] += roundScore;
2828
document.querySelector('#score-' + activePlayer).textContent = scores[activePlayer];
2929
//check if active player win
30-
if (scores[activePlayer] >= 100) {
30+
finalScore = document.querySelector('.final-score').value;
31+
if (!finalScore) finalScore = 100;
32+
if (scores[activePlayer] >= finalScore) {
3133
diceDOM.style.display = 'none';
3234
document.querySelector('#name-' + activePlayer).textContent = 'WINNER!';
3335
document.querySelector('.player-' + activePlayer + '-panel').classList.add('winner');
@@ -61,7 +63,7 @@ function init() {
6163
document.getElementById('score-0').textContent = '0';
6264
document.getElementById('score-1').textContent = '0';
6365
diceDOM.style.display = 'none';
64-
66+
document.querySelector('.final-score').value='';
6567
}
6668

6769
function nextPlayer() {

‎Challenge4/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@
3232
<button class="btn-new"><i class="ion-ios-plus-outline"></i>New game</button>
3333
<button class="btn-roll"><i class="ion-ios-loop"></i>Roll dice</button>
3434
<button class="btn-hold"><i class="ion-ios-download-outline"></i>Hold</button>
35-
35+
<inputtype="text" placeholder="Final score" class="final-score">
3636
<img src="dice-5.png" alt="Dice" class="dice">
3737
</div>
3838

‎Challenge4/style.css‎

Lines changed: 50 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,24 @@
11
/**********************************************
22
*** GENERAL
33
**********************************************/
4+
.final-score {
5+
position: absolute;
6+
left: 50%;
7+
transform: translateX(-50%);
8+
top: 520px;
9+
color: #555;
10+
font-size: 18px;
11+
font-family: 'lato';
12+
text-align: center;
13+
padding: 10px;
14+
width: 160px;
15+
text-transform: uppercase;
16+
}
417

518
* {
619
margin: 0;
720
padding: 0;
821
box-sizing: border-box;
9-
1022
}
1123

1224
.clearfix::after {
@@ -16,7 +28,7 @@
1628
}
1729

1830
body {
19-
background-image: linear-gradient(rgba(62, 20, 20, 0.4), rgba(62, 20, 20, 0.4)),url(back.jpg);
31+
background-image: linear-gradient(rgba(62, 20, 20, 0.4), rgba(62, 20, 20, 0.4));
2032
background-size: cover;
2133
background-position: center;
2234
font-family: Lato;
@@ -47,6 +59,7 @@ body {
4759

4860

4961

62+
5063
/**********************************************
5164
*** PLAYERS
5265
**********************************************/
@@ -70,8 +83,13 @@ body {
7083
margin-bottom: 130px;
7184
}
7285

73-
.active { background-color: #f7f7f7; }
74-
.active .player-name { font-weight: 300; }
86+
.active {
87+
background-color: #f7f7f7;
88+
}
89+
90+
.active .player-name {
91+
font-weight: 300;
92+
}
7593

7694
.active .player-name::after {
7795
content: "2022円";
@@ -80,7 +98,6 @@ body {
8098
color: #EB4D4D;
8199
top: -7px;
82100
right: 10px;
83-
84101
}
85102

86103
.player-current-box {
@@ -119,8 +136,13 @@ button {
119136
transition: background-color 0.3s, color 0.3s;
120137
}
121138

122-
button:hover { font-weight: 600; }
123-
button:hover i { margin-right: 20px; }
139+
button:hover {
140+
font-weight: 600;
141+
}
142+
143+
button:hover i {
144+
margin-right: 20px;
145+
}
124146

125147
button:focus {
126148
outline: none;
@@ -137,9 +159,17 @@ i {
137159
transition: margin 0.3s;
138160
}
139161

140-
.btn-new { top: 45px;}
141-
.btn-roll { top: 403px;}
142-
.btn-hold { top: 467px;}
162+
.btn-new {
163+
top: 45px;
164+
}
165+
166+
.btn-roll {
167+
top: 403px;
168+
}
169+
170+
.btn-hold {
171+
top: 467px;
172+
}
143173

144174
.dice {
145175
position: absolute;
@@ -150,5 +180,13 @@ i {
150180
box-shadow: 0px 10px 60px rgba(0, 0, 0, 0.10);
151181
}
152182

153-
.winner { background-color: #f7f7f7; }
154-
.winner .player-name { font-weight: 300; color: #EB4D4D; }
183+
184+
185+
.winner {
186+
background-color: #f7f7f7;
187+
}
188+
189+
.winner .player-name {
190+
font-weight: 300;
191+
color: #EB4D4D;
192+
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /