Lurkars
/
openzilch.js
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

add mobile css; initical game improvements; improved message timing

master
Lurkars 8 years ago
parent
562b9c2108
commit
3ff112057d
5 changed files with 132 additions and 49 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      index.html
  2. 38
      js/game.js
  3. 13
      js/interface.js
  4. 10
      style/main.css
  5. 63
      style/mobile.css

3
index.html
View File

@ -5,7 +5,8 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>openzilch.js</title> <title>openzilch.js</title>
<link href="style/main.css" rel="stylesheet" type="text/css" /> <link href="style/main.css" rel="stylesheet" type="text/css" />
<meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=0.5, maximum-scale=1, user-scalable=no, minimal-ui">
<link href="style/mobile.css" rel="stylesheet" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=1.5, maximum-scale=1, user-scalable=no">
</head> </head>
<body> <body>

38
js/game.js
View File

@ -32,6 +32,13 @@ Game.prototype.setup = function() {
}; };
self.dices = [] self.dices = []
for (var i = 0; i < 6; i++) {
var dice = {};
dice.value = this.random(6);
dice.disabled = true;
self.dices[i] = dice;
}
self.history = []; self.history = [];
self.cpuStarts = self.random(2); self.cpuStarts = self.random(2);
@ -44,14 +51,19 @@ Game.prototype.setup = function() {
self.Interface.setPoints(self.points); self.Interface.setPoints(self.points);
self.Interface.setPlayer(self.player); self.Interface.setPlayer(self.player);
self.Interface.setCpu(self.cpu); self.Interface.setCpu(self.cpu);
self.Interface.setDices(self.dices);
if (self.cpuStarts) { if (self.cpuStarts) {
self.Interface.showMessage("CPU starts!", 1000)
self.Interface.showMessage("CPU starts!", 1000, function() {
self.roleDices();
});
} else { } else {
self.Interface.showMessage("Player starts!", 1000)
self.Interface.showMessage("Player starts!", 0, function() {
self.Interface.disableRoleDices(false);
});
} }
self.roleDices();
}; };
Game.prototype.random = function(int) { Game.prototype.random = function(int) {
@ -85,6 +97,8 @@ Game.prototype.roleDices = function(all) {
if (rollCount == 0) { if (rollCount == 0) {
self.roleDices(true); self.roleDices(true);
} else if (self.checkZilch(rollCount == 6)) { } else if (self.checkZilch(rollCount == 6)) {
self.Interface.animateDices(self.dices, function() {
if (self.playing) { if (self.playing) {
self.player.zilch++; self.player.zilch++;
@ -107,7 +121,6 @@ Game.prototype.roleDices = function(all) {
} else { } else {
self.cpu.zilch++; self.cpu.zilch++;
var history = {}; var history = {};
history['cpu'] = 'Zilch'; history['cpu'] = 'Zilch';
self.history.push(history); self.history.push(history);
@ -126,16 +139,15 @@ Game.prototype.roleDices = function(all) {
} }
self.Interface.animateDices(self.dices, function() {
self.Interface.showMessage("Zilch!", 1000);
});
self.Interface.showMessage("Zilch!", 1000, function() {
self.endRound(); self.endRound();
});
});
} else { } else {
self.Interface.animateDices(self.dices); self.Interface.animateDices(self.dices);
self.Interface.disableTakePoints(true); self.Interface.disableTakePoints(true);
self.Interface.disabledRoleDices(true);
self.Interface.disableRoleDices(true);
self.Interface.setDices(self.dices); self.Interface.setDices(self.dices);
if (!self.playing) { if (!self.playing) {
@ -195,9 +207,9 @@ Game.prototype.toggleDice = function(diceIndex) {
} }
if (valid && points > 0 && self.playing) { if (valid && points > 0 && self.playing) {
self.Interface.disabledRoleDices(false);
self.Interface.disableRoleDices(false);
} else { } else {
self.Interface.disabledRoleDices(true);
self.Interface.disableRoleDices(true);
} }
if (valid && self.points + points >= 300 && self.playing) { if (valid && self.points + points >= 300 && self.playing) {
@ -327,7 +339,7 @@ Game.prototype.endRound = function() {
} }
self.Interface.disableTakePoints(true); self.Interface.disableTakePoints(true);
self.Interface.disabledRoleDices(true);
self.Interface.disableRoleDices(true);
self.Interface.setDices(self.dices); self.Interface.setDices(self.dices);
self.Interface.setPoints(self.points); self.Interface.setPoints(self.points);
self.Interface.setPlaying(self.playing); self.Interface.setPlaying(self.playing);
@ -336,7 +348,7 @@ Game.prototype.endRound = function() {
self.Interface.disableTakePoints(true); self.Interface.disableTakePoints(true);
if (self.playing) { if (self.playing) {
self.Interface.disabledRoleDices(false);
self.Interface.disableRoleDices(false);
} }
if (!self.playing) { if (!self.playing) {

13
js/interface.js
View File

@ -134,7 +134,7 @@ Interface.prototype.disableTakePoints = function(disabled) {
this.pointsButton.disabled = disabled; this.pointsButton.disabled = disabled;
}; };
Interface.prototype.disabledRoleDices = function(disabled) {
Interface.prototype.disableRoleDices = function(disabled) {
this.dicesButton.disabled = disabled; this.dicesButton.disabled = disabled;
}; };
@ -173,7 +173,7 @@ Interface.prototype.setCpu = function(cpu) {
this.cpuScoreContainer.classList.add('zilch-' + cpu.zilch); this.cpuScoreContainer.classList.add('zilch-' + cpu.zilch);
}; };
Interface.prototype.showMessage = function(message, fade) {
Interface.prototype.showMessage = function(message, fade, callback) {
var self = this; var self = this;
self.message.innerHTML = '<p>' + message + '</p>'; self.message.innerHTML = '<p>' + message + '</p>';
@ -182,11 +182,16 @@ Interface.prototype.showMessage = function(message, fade) {
if (fade) { if (fade) {
setTimeout(function() { setTimeout(function() {
self.clearMessage();
self.clearMessage(callback);
}, fade); }, fade);
} else if (callback) {
callback();
} }
}; };
Interface.prototype.clearMessage = function() {
Interface.prototype.clearMessage = function(callback) {
this.message.classList.remove('visible'); this.message.classList.remove('visible');
if (callback) {
callback();
}
}; };

10
style/main.css
View File

@ -71,6 +71,8 @@ hr {
} }
.top .button { .top .button {
position: relative;
top: -18px;
margin: 0 88px; margin: 0 88px;
} }
@ -299,10 +301,6 @@ hr {
text-align: center; text-align: center;
} }
.action .button {
margin-top: 15px;
}
.pointsContainer { .pointsContainer {
position: relative; position: relative;
display: inline-block; display: inline-block;
@ -327,3 +325,7 @@ hr {
line-height: 25px; line-height: 25px;
font-weight: bold; font-weight: bold;
} }
.footer {
text-align: center;
}

63
style/mobile.css
View File

@ -0,0 +1,63 @@
@media screen and (max-width: 520px) {
body {
font-size: 15px;
}
.container {
width: 280px;
}
.button {
display: inline-block;
height: 40px;
font-size: 15px;
color: #f9f6f2;
text-decoration: none;
line-height: 42px;
padding: 0 5px;
}
.top .button {
margin: 0 5px;
}
.score-container {
width: 75px;
height: 60px;
}
.score-container .score {
font-size: 20px;
line-height: 20px;
}
.dices-container {
width: 280px;
height: 185px;
}
.dice {
width: 70px;
height: 70px;
font-size: 35px;
line-height: 70px;
margin-top: 15px;
margin-left: 15px;
}
.message p {
font-size: 35px;
height: 35px;
line-height: 35px;
margin-top: 75px;
}
.action {
margin-top: 25px;
height: 75px;
text-align: center;
}
.action .button {
margin-top: 15px;
}
.pointsContainer {
width: 75px;
height: 60px;
margin: 0 5px;
}
.pointsContainer .points {
font-size: 20px;
line-height: 20px;
}
}
Write Preview
Loading…
Cancel
Save