fixed animation on zilch

js/game.js

@@ -1,458 +1,488 @@
+/**
+ * Game (Model + Controller)
+ */
 function Game(Interface) {
-    var self = this;
+  var self = this;
 
-    self.Interface = new Interface;
+  // get interface
+  self.Interface = new Interface;
 
-    self.Interface.on("restart", self.restart.bind(this));
-    self.Interface.on("takePoints", self.takePoints.bind(this));
-    self.Interface.on("addPoints", self.addPoints.bind(this));
-    self.Interface.on("rollDices", self.rollDices.bind(this));
-    self.Interface.on("toggleDice", self.toggleDice.bind(this));
-    self.Interface.on("toggleCpu", self.toggleCpu.bind(this));
+  // register event callbacks
+  self.Interface.on("restart", self.restart.bind(this));
+  self.Interface.on("takePoints", self.takePoints.bind(this));
+  self.Interface.on("addPoints", self.addPoints.bind(this));
+  self.Interface.on("rollDices", self.rollDices.bind(this));
+  self.Interface.on("toggleDice", self.toggleDice.bind(this));
 
-    self.setup();
+  self.setup();
 }
 
-
+/**
+ * Restart game (reset)
+ */
 Game.prototype.restart = function() {
-    this.Interface.setup();
-    this.setup();
+  this.Interface.setup();
+  this.setup();
 };
 
-
+/**
+ * Setup new game
+ */
 Game.prototype.setup = function() {
-    var self = this;
-    self.player = {
-        score: 0,
-        zilch: 0
-    };
-    self.cpu = {
-        score: 0,
-        zilch: 0
-    };
-    self.dices = []
+  var self = this;
+  self.player = {
+    score: 0,
+    zilch: 0
+  };
+  self.cpu = {
+    score: 0,
+    zilch: 0
+  };
+  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.cpuStarts = self.random(2);
+
+  self.playing = !self.cpuStarts;
+
+  self.points = 0;
+
+  self.animationTime = 500;
+  self.messageTime = 1500;
+  self.cpuSpeed = 1500;
+
+  self.Interface.setPlaying(self.playing);
+  self.Interface.setPoints(self.points);
+  self.Interface.setPlayer(self.player);
+  self.Interface.setCpu(self.cpu);
+  self.Interface.setDices(self.dices);
+
+  if (self.cpuStarts) {
+    self.Interface.disableRestart(true);
+    self.Interface.showMessage("CPU starts!", self.messageTime, function() {
+      setTimeout(function() {
+        self.rollDices();
+      }, self.cpuSpeed);
+    });
+  } else {
+    self.Interface.showMessage("Player starts!", 0, function() {
+      self.Interface.disableRestart(false);
+      self.Interface.disableRollDices(false);
+    });
+  }
 
-    for (var i = 0; i < 6; i++) {
-        var dice = {};
-        dice.value = this.random(6);
-        dice.disabled = true;
-        self.dices[i] = dice;
-    }
 
-    self.history = [];
+};
 
-    self.cpuStarts = self.random(2);
+/**
+ * Random helper for integer numbers
+ */
+Game.prototype.random = function(int) {
+  return Math.floor((Math.random() * int));
+};
 
-    self.playing = !self.cpuStarts;
+/**
+ * Roll dices
+ */
+Game.prototype.rollDices = function(all) {
+  var self = this;
+  self.Interface.clearMessage();
 
+  if (self.newRound) {
     self.points = 0;
-
-    self.animationTime = 500;
-    self.messageTime = 1500;
-    self.cpuSpeed = 1500;
-
-    self.Interface.setPlaying(self.playing);
     self.Interface.setPoints(self.points);
-    self.Interface.setPlayer(self.player);
-    self.Interface.setCpu(self.cpu);
-    self.Interface.setDices(self.dices);
-
-    if (self.cpuStarts) {
-        self.Interface.disableRestart(true);
-        self.Interface.showMessage("CPU starts!", self.messageTime, function() {
-            setTimeout(function() {
-                self.rollDices();
-            }, self.cpuSpeed);
-        });
-    } else {
-        self.Interface.showMessage("Player starts!", 0, function() {
-            self.Interface.disableRestart(false);
-            self.Interface.disableRollDices(false);
-        });
+    self.newRound = false;
+  }
+
+  var rollCount = 0;
+  for (var i = 0; i < 6; i++) {
+    self.dices[i] = self.dices[i] || {};
+    var dice = self.dices[i];
+    if (all || !dice.disabled) {
+      dice.value = this.random(6);
+      if (all) {
+        dice.disabled = false;
+      }
+      dice.selected = false;
+      rollCount++;
     }
+  }
 
 
-};
-
-Game.prototype.random = function(int) {
-    return Math.floor((Math.random() * int));
-};
+  self.Interface.setDices(self.dices);
 
-Game.prototype.rollDices = function(all) {
-    var self = this;
-    self.Interface.clearMessage();
+  if (rollCount == 0) {
+    self.rollDices(true);
+  } else if (self.calculatePoints(true) == 0) {
+    self.Interface.animateDices(self.dices, self.animationTime, function() {
+      if (self.playing) {
+        self.player.zilch++;
 
-    if (self.newRound) {
+        var history = {};
+        history['player'] = 'Zilch';
+        self.history.push(history);
         self.points = 0;
-        self.Interface.setPoints(self.points);
-        self.newRound = false;
-    }
 
-    var rollCount = 0;
-    for (var i = 0; i < 6; i++) {
-        self.dices[i] = self.dices[i] || {};
-        var dice = self.dices[i];
-        if (all || !dice.disabled) {
-            dice.value = this.random(6);
-            if (all) {
-                dice.disabled = false;
-            }
-            dice.selected = false;
-            rollCount++;
+        if (self.player.zilch > 2) {
+          if (self.player.score < 500) {
+            self.player.score = 0;
+          } else {
+            self.player.score -= 500;
+          }
+
+
+          var history = {};
+          history['player'] = '-500';
+          self.history.push(history);
+          self.points = -500;
         }
-    }
 
-    if (rollCount == 0) {
-        self.rollDices(true);
-    } else if (self.calculatePoints(true) == 0) {
-        self.Interface.animateDices(self.dices, self.animationTime, function() {
-            if (self.playing) {
-                self.player.zilch++;
-
-                var history = {};
-                history['player'] = 'Zilch';
-                self.history.push(history);
-                self.points = 0;
-
-                if (self.player.zilch > 2) {
-                    if (self.player.score < 500) {
-                        self.player.score = 0;
-                    } else {
-                        self.player.score -= 500;
-                    }
-
-
-                    var history = {};
-                    history['player'] = '-500';
-                    self.history.push(history);
-                    self.points = -500;
-                }
-
-                self.Interface.disableTakePoints(true);
-                self.Interface.disableRollDices(true);
-                self.Interface.setPoints(self.points);
-                self.Interface.setPlayer(self.player);
-
-                self.Interface.showMessage("Zilch!", self.messageTime, function() {
-                    if (self.player.zilch > 2) {
-                        self.player.zilch = 0;
-                        self.Interface.setPlayer(self.player);
-                    }
-
-                    self.endRound();
-                });
-
-            } else {
-                self.cpu.zilch++;
-
-                var history = {};
-                history['cpu'] = 'Zilch';
-                self.history.push(history);
-                self.points = 0;
-
-                if (self.cpu.zilch > 2) {
-                    if (self.cpu.score < 500) {
-                        self.cpu.score = 0;
-                    } else {
-                        self.cpu.score -= 500;
-                    }
-
-                    var history = {};
-                    history['cpu'] = '-500';
-                    self.history.push(history);
-                    self.points = -500;
-                }
-
-                self.Interface.disableTakePoints(true);
-                self.Interface.disableRollDices(true);
-                self.Interface.setPoints(self.points);
-                self.Interface.setCpu(self.cpu);
-
-                self.Interface.showMessage("Zilch!", self.messageTime, function() {
-                    if (self.cpu.zilch > 2) {
-                        self.cpu.zilch = 0;
-                        self.Interface.setCpu(self.cpu);
-                    }
-
-                    self.endRound();
-                });
-
-            }
+        self.Interface.disableTakePoints(true);
+        self.Interface.disableRollDices(true);
+        self.Interface.setPoints(self.points);
+        self.Interface.setPlayer(self.player);
+
+        self.Interface.showMessage("Zilch!", self.messageTime, function() {
+          if (self.player.zilch > 2) {
+            self.player.zilch = 0;
+            self.Interface.setPlayer(self.player);
+          }
+
+          self.endRound();
         });
 
-    } else {
-        self.Interface.animateDices(self.dices, self.animationTime);
+      } else {
+        self.cpu.zilch++;
+
+        var history = {};
+        history['cpu'] = 'Zilch';
+        self.history.push(history);
+        self.points = 0;
+
+        if (self.cpu.zilch > 2) {
+          if (self.cpu.score < 500) {
+            self.cpu.score = 0;
+          } else {
+            self.cpu.score -= 500;
+          }
+
+          var history = {};
+          history['cpu'] = '-500';
+          self.history.push(history);
+          self.points = -500;
+        }
+
         self.Interface.disableTakePoints(true);
         self.Interface.disableRollDices(true);
-        self.Interface.setDices(self.dices);
+        self.Interface.setPoints(self.points);
+        self.Interface.setCpu(self.cpu);
 
-        if (!self.playing) {
-            self.cpuPlay();
-        }
+        self.Interface.showMessage("Zilch!", self.messageTime, function() {
+          if (self.cpu.zilch > 2) {
+            self.cpu.zilch = 0;
+            self.Interface.setCpu(self.cpu);
+          }
+
+          self.endRound();
+        });
+
+      }
+    });
+
+  } else {
+    self.Interface.animateDices(self.dices, self.animationTime);
+    self.Interface.disableTakePoints(true);
+    self.Interface.disableRollDices(true);
+
+    if (!self.playing) {
+      self.cpuPlay();
     }
+  }
 };
 
+/**
+ * Toggle dice selection
+ */
 Game.prototype.toggleDice = function(diceIndex) {
-    var self = this;
-    var dice = self.dices[diceIndex];
+  var self = this;
+  var dice = self.dices[diceIndex];
 
-    if (!dice || dice.disabled) {
-        console.error("This should not happen!")
-        return;
-    }
+  if (!dice || dice.disabled) {
+    console.error("This should not happen!")
+    return;
+  }
 
 
-    dice.selected = !dice.selected;
-    var points = self.calculatePoints();
-    var valid = true;
+  dice.selected = !dice.selected;
+  var points = self.calculatePoints();
+  var valid = true;
 
-    for (var i = 0; i < 6; i++) {
-        var toggleDice = self.dices[i];
-
-        if (toggleDice.selected && !toggleDice.disabled) {
-            toggleDice.selected = false;
-            var togglePoints = self.calculatePoints();
-            if (points > togglePoints) {
-                toggleDice.invalid = false;
-            } else if (togglePoints == points) {
-                toggleDice.invalid = true;
-            }
-
-            toggleDice.selected = true;
-        } else {
-            toggleDice.invalid = false;
-        }
+  for (var i = 0; i < 6; i++) {
+    var toggleDice = self.dices[i];
 
-        valid &= !toggleDice.invalid;
-    }
+    if (toggleDice.selected && !toggleDice.disabled) {
+      toggleDice.selected = false;
+      var togglePoints = self.calculatePoints();
+      if (points > togglePoints) {
+        toggleDice.invalid = false;
+      } else if (togglePoints == points) {
+        toggleDice.invalid = true;
+      }
 
-    if (valid && points > 0 && self.playing) {
-        self.Interface.disableRollDices(false);
+      toggleDice.selected = true;
     } else {
-        self.Interface.disableRollDices(true);
+      toggleDice.invalid = false;
     }
 
-    if (valid && self.points + points >= 300 && self.playing) {
-        self.Interface.disableTakePoints(false);
-    } else {
-        self.Interface.disableTakePoints(true);
-    }
+    valid &= !toggleDice.invalid;
+  }
+
+  if (valid && points > 0 && self.playing) {
+    self.Interface.disableRollDices(false);
+  } else {
+    self.Interface.disableRollDices(true);
+  }
+
+  if (valid && self.points + points >= 300 && self.playing) {
+    self.Interface.disableTakePoints(false);
+  } else {
+    self.Interface.disableTakePoints(true);
+  }
 
 
-    self.Interface.setDices(self.dices);
-    self.Interface.setPoints(self.points + points);
+  self.Interface.setDices(self.dices);
+  self.Interface.setPoints(self.points + points);
 };
 
+/**
+ * Calculate points on selected dices or all dices
+ */
 Game.prototype.calculatePoints = function(all) {
-    var self = this;
-    var result = [0, 0, 0, 0, 0, 0];
-    for (var i = 0; i < 6; i++) {
-        var dice = self.dices[i];
-        if ((all || dice.selected) && !dice.disabled) {
-            result[dice.value]++;
-        }
+  var self = this;
+  var result = [0, 0, 0, 0, 0, 0];
+  for (var i = 0; i < 6; i++) {
+    var dice = self.dices[i];
+    if ((all || dice.selected) && !dice.disabled) {
+      result[dice.value]++;
     }
-
-    var straight = true;
-    var pairs = 0;
-    var triple1 = 0;
-    var triple2 = 0;
-    for (var i = 0; i < 6; i++) {
-        straight &= (result[i] == 1);
-        if (result[i] == 2) {
-            pairs++;
-        }
-        if (triple1 == 0 && result[i] > 2) {
-            triple1 = i + 1;
-        } else if (result[i] > 2) {
-            triple2 = i + 1;
-        }
+  }
+
+  var straight = true;
+  var pairs = 0;
+  var triple1 = 0;
+  var triple2 = 0;
+  for (var i = 0; i < 6; i++) {
+    straight &= (result[i] == 1);
+    if (result[i] == 2) {
+      pairs++;
     }
-    var points = 0;
-
-    if (straight) {
-        points += 1500;
-    } else if (pairs == 3) {
-        points += 1500;
-    } else if (triple1) {
-        var triple1Points = triple1 * (triple1 == 1 ? 1000 : 100);
-        for (var i = 0; i < result[triple1 - 1] - 3; i++) {
-            triple1Points *= 2;
-        }
-        points += triple1Points;
-
-        if (triple2) {
-            points += triple2 * (triple2 == 1 ? 1000 : 100);
-        }
+    if (triple1 == 0 && result[i] > 2) {
+      triple1 = i + 1;
+    } else if (result[i] > 2) {
+      triple2 = i + 1;
     }
-
-    // left Ones
-    if (!straight && pairs < 3 && triple1 != 1 && triple2 != 1) {
-        points += result[0] * 100;
+  }
+  var points = 0;
+
+  if (straight) {
+    points += 1500;
+  } else if (pairs == 3) {
+    points += 1500;
+  } else if (triple1) {
+    var triple1Points = triple1 * (triple1 == 1 ? 1000 : 100);
+    for (var i = 0; i < result[triple1 - 1] - 3; i++) {
+      triple1Points *= 2;
     }
+    points += triple1Points;
 
-    // left Fives
-    if (!straight && pairs < 3 && triple1 != 5 && triple2 != 5) {
-        points += result[4] * 50;
+    if (triple2) {
+      points += triple2 * (triple2 == 1 ? 1000 : 100);
     }
+  }
 
-    return points;
-}
+  // left Ones
+  if (!straight && pairs < 3 && triple1 != 1 && triple2 != 1) {
+    points += result[0] * 100;
+  }
 
+  // left Fives
+  if (!straight && pairs < 3 && triple1 != 5 && triple2 != 5) {
+    points += result[4] * 50;
+  }
 
+  return points;
+}
+
+/**
+ * Add points for current player
+ */
 Game.prototype.addPoints = function() {
-    var self = this;
+  var self = this;
 
-    self.points += self.calculatePoints();
+  self.points += self.calculatePoints();
 
-    for (var i = 0; i < 6; i++) {
-        var dice = self.dices[i];
-        if (dice.selected) {
-            dice.selected = false;
-            dice.disabled = true;
-        }
+  for (var i = 0; i < 6; i++) {
+    var dice = self.dices[i];
+    if (dice.selected) {
+      dice.selected = false;
+      dice.disabled = true;
     }
+  }
 
 
-    self.Interface.setDices(self.dices);
-    self.Interface.setPoints(self.points);
+  self.Interface.setDices(self.dices);
+  self.Interface.setPoints(self.points);
 };
 
+/**
+ * Take points and end round
+ */
 Game.prototype.takePoints = function() {
-    var self = this;
+  var self = this;
 
-    self.addPoints();
+  self.addPoints();
 
-    if (self.playing) {
-        self.player.score += self.points;
-        self.player.zilch = 0;
-        self.Interface.setPlayer(self.player);
-        var history = {};
-        history['player'] = self.points;
-        self.history.push(history);
+  if (self.playing) {
+    self.player.score += self.points;
+    self.player.zilch = 0;
+    self.Interface.setPlayer(self.player);
+    var history = {};
+    history['player'] = self.points;
+    self.history.push(history);
 
-    } else {
-        self.cpu.score += self.points;
-        self.cpu.zilch = 0;
-        self.Interface.setCpu(self.cpu);
-        var history = {};
-        history['cpu'] = self.points;
-        self.history.push(history);
-    }
+  } else {
+    self.cpu.score += self.points;
+    self.cpu.zilch = 0;
+    self.Interface.setCpu(self.cpu);
+    var history = {};
+    history['cpu'] = self.points;
+    self.history.push(history);
+  }
 
 
-    self.Interface.disableTakePoints(true);
-    self.Interface.disableRollDices(true);
-    self.Interface.setPoints(self.points);
+  self.Interface.disableTakePoints(true);
+  self.Interface.disableRollDices(true);
+  self.Interface.setPoints(self.points);
 
-    self.endRound();
+  self.endRound();
 };
 
+/**
+ * End round for current player
+ */
 Game.prototype.endRound = function() {
-    var self = this;
+  var self = this;
 
-    self.newRound = true;
+  self.newRound = true;
 
-    for (var i = 0; i < 6; i++) {
-        var dice = self.dices[i];
-        if (dice.disabled) {
-            dice.selected = true;
-        } else {
-            dice.disabled = true;
-        }
+  for (var i = 0; i < 6; i++) {
+    var dice = self.dices[i];
+    if (dice.disabled) {
+      dice.selected = true;
+    } else {
+      dice.disabled = true;
     }
+  }
+
+  self.Interface.disableTakePoints(true);
+  self.Interface.disableRollDices(true);
+  self.Interface.setDices(self.dices);
+  self.Interface.setPoints(self.points);
+  self.Interface.setPlayer(self.player);
+  self.Interface.setCpu(self.cpu);
+
+  // check score
+  var checkScore = self.playing && self.cpuStarts || !self.playing && !self.cpuStarts;
+
+  if (checkScore && self.player.score >= 10000 && self.player.score > self.cpu.score) {
+    self.Interface.disableRestart(false);
+    self.Interface.showMessage("Player wins!");
+  } else if (checkScore && self.cpu.score >= 10000 && self.cpu.score > self.player.score) {
+    self.Interface.disableRestart(false);
+    self.Interface.showMessage("CPU wins!");
+  } else if (self.player.score >= 10000 && self.player.score == self.cpu.score) {
+    self.Interface.disableRestart(false);
+    self.Interface.showMessage("Remi!");
+  } else {
+    self.playing = !self.playing;
 
-    self.Interface.disableTakePoints(true);
-    self.Interface.disableRollDices(true);
-    self.Interface.setDices(self.dices);
-    self.Interface.setPoints(self.points);
-    self.Interface.setPlayer(self.player);
-    self.Interface.setCpu(self.cpu);
-
-    // check score
-    var checkScore = self.playing && self.cpuStarts || !self.playing && !self.cpuStarts;
-
-    if (checkScore && self.player.score >= 10000 && self.player.score > self.cpu.score) {
-        self.Interface.disableRestart(false);
-        self.Interface.showMessage("Player wins!");
-    } else if (checkScore && self.cpu.score >= 10000 && self.cpu.score > self.player.score) {
-        self.Interface.disableRestart(false);
-        self.Interface.showMessage("CPU wins!");
-    } else if (self.player.score >= 10000 && self.player.score == self.cpu.score) {
-        self.Interface.disableRestart(false);
-        self.Interface.showMessage("Remi!");
+    self.Interface.setPlaying(self.playing);
+    // continue
+    if (self.playing) {
+      self.Interface.disableRollDices(false);
+      self.Interface.disableRestart(false);
+      self.Interface.showMessage("Player's turn!");
     } else {
-        self.playing = !self.playing;
-
-        self.Interface.setPlaying(self.playing);
-        // continue
-        if (self.playing) {
-            self.Interface.disableRollDices(false);
-            self.Interface.disableRestart(false);
-            self.Interface.showMessage("Player's turn!");
-        } else {
-            self.Interface.showMessage("CPU's turn!", self.messageTime, function() {
-                if (!self.playing) {
-                    setTimeout(function() {
-                        self.rollDices();
-                    }, self.cpuspeed);
-                }
-            });
+      self.Interface.showMessage("CPU's turn!", self.messageTime, function() {
+        if (!self.playing) {
+          setTimeout(function() {
+            self.rollDices();
+          }, self.cpuspeed);
         }
+      });
     }
+  }
 
 }
 
+/**
+ * CPU playing logic
+ */
 Game.prototype.cpuPlay = function() {
-    var self = this;
-    self.Interface.disableRestart(true);
-    setTimeout(function() {
-
-        // first select all available dices
-        for (var i = 0; i < 6; i++) {
-            var dice = self.dices[i];
-            if (!dice.disabled) {
-                self.toggleDice(i);
-            }
-        }
+  var self = this;
+  self.Interface.disableRestart(true);
+  setTimeout(function() {
 
-        // check if dice gains points
-        for (var i = 0; i < 6; i++) {
-            var dice = self.dices[i];
-            var tmpPoints = self.calculatePoints();
-            if (!dice.disabled) {
-                self.toggleDice(i);
-                if (self.calculatePoints() < tmpPoints) {
-                    self.toggleDice(i);
-                }
-            }
-        }
+    // first select all available dices
+    for (var i = 0; i < 6; i++) {
+      var dice = self.dices[i];
+      if (!dice.disabled) {
+        self.toggleDice(i);
+      }
+    }
 
-        // count free dices
-        var freeDices = 0;
-        for (var i = 0; i < 6; i++) {
-            var dice = self.dices[i];
-            if (!dice.disabled && !dice.selected) {
-                freeDices++;
-            }
+    // check if dice gains points
+    for (var i = 0; i < 6; i++) {
+      var dice = self.dices[i];
+      var tmpPoints = self.calculatePoints();
+      if (!dice.disabled) {
+        self.toggleDice(i);
+        if (self.calculatePoints() < tmpPoints) {
+          self.toggleDice(i);
         }
+      }
+    }
 
-        setTimeout(function() {
-            // strategy: end round if points >= 300 and less than 4 dices left and not loosing
-            if (self.points + self.calculatePoints() >= 300 && freeDices < 4 && freeDices > 0 && self.player.score < 10000) {
-                self.takePoints();
-            } else {
-                self.addPoints();
-                self.rollDices();
-            }
-
-        }, self.cpuSpeed);
-    }, 500);
+    // count free dices
+    var freeDices = 0;
+    for (var i = 0; i < 6; i++) {
+      var dice = self.dices[i];
+      if (!dice.disabled && !dice.selected) {
+        freeDices++;
+      }
+    }
 
-}
+    setTimeout(function() {
+      // strategy: end round if points >= 300 and less than 4 dices left and not loosing
+      if (self.points + self.calculatePoints() >= 300 && freeDices < 4 && freeDices > 0 && self.player.score < 10000) {
+        self.takePoints();
+      } else {
+        self.addPoints();
+        self.rollDices();
+      }
 
-Game.prototype.toggleCpu = function() {
+    }, self.cpuSpeed);
+  }, 500);
 
 }
 
+// create new game
 var game = new Game(Interface);

js/interface.js

@@ -1,9 +1,14 @@
+/**
+ * UI
+ */
 function Interface() {
 
   var self = this;
 
+  // Event Objects for callbacks
   self.events = {};
 
+  // get DOM elements
   self.restartButton = document.querySelector('#restart-button');
 
   self.playerScoreContainer = document.querySelector('#player-score-container');
@@ -22,9 +27,7 @@ function Interface() {
 
   self.message = document.querySelector('#message');
 
-  self.dicesButton.classList.add("disabled");
-  self.pointsButton.classList.add("disabled");
-
+  // add click events
   self.restartButton.addEventListener("click", function() {
     if (!this.classList.contains('disabled')) {
       self.fireEvent("restart");
@@ -45,6 +48,7 @@ function Interface() {
     }
   });
 
+  // add click events for dices
   for (var diceIndex = 0; diceIndex < 6; diceIndex++) {
     var diceContainer = self.dices[diceIndex];
     diceContainer.diceIndex = diceIndex;
@@ -58,6 +62,9 @@ function Interface() {
   this.setup();
 };
 
+/**
+ * setup init state
+ */
 Interface.prototype.setup = function() {
   this.dicesButton.classList.add("disabled");
   this.pointsButton.classList.add("disabled");
@@ -65,6 +72,9 @@ Interface.prototype.setup = function() {
 
 };
 
+/**
+ * register callbacks for events
+ */
 Interface.prototype.on = function(event, callback) {
   if (!this.events[event]) {
     this.events[event] = [];
@@ -72,6 +82,9 @@ Interface.prototype.on = function(event, callback) {
   this.events[event].push(callback);
 };
 
+/**
+ * fire events and execute callbacks
+ */
 Interface.prototype.fireEvent = function(event, data) {
   var callbacks = this.events[event];
   if (callbacks) {
@@ -81,6 +94,9 @@ Interface.prototype.fireEvent = function(event, data) {
   }
 };
 
+/**
+ * Set dices
+ */
 Interface.prototype.setDices = function(dices) {
   var self = this;
 
@@ -108,12 +124,11 @@ Interface.prototype.setDices = function(dices) {
       diceContainer.classList.remove('invalid');
     }
   }
-
-
-
-
 };
 
+/**
+ * fire dices animation
+ */
 Interface.prototype.animateDices = function(dices, timeout, callback) {
   var self = this;
   for (var diceIndex = 0; diceIndex < 6; diceIndex++) {
@@ -134,6 +149,9 @@ Interface.prototype.animateDices = function(dices, timeout, callback) {
   }, timeout ? timeout : 0);
 };
 
+/**
+ * set disabled state of 'restart' button
+ */
 Interface.prototype.disableRestart = function(disabled) {
   if (disabled) {
     this.restartButton.classList.add("disabled")
@@ -142,6 +160,9 @@ Interface.prototype.disableRestart = function(disabled) {
   }
 };
 
+/**
+ * set disabled state of 'take points' button
+ */
 Interface.prototype.disableTakePoints = function(disabled) {
   if (disabled) {
     this.pointsButton.classList.add("disabled")
@@ -150,6 +171,9 @@ Interface.prototype.disableTakePoints = function(disabled) {
   }
 };
 
+/**
+ * set disabled state of 'roll dices' button
+ */
 Interface.prototype.disableRollDices = function(disabled) {
   if (disabled) {
     this.dicesButton.classList.add("disabled")
@@ -158,10 +182,16 @@ Interface.prototype.disableRollDices = function(disabled) {
   }
 };
 
+/**
+ * set points
+ */
 Interface.prototype.setPoints = function(points) {
   this.points.innerHTML = points;
 };
 
+/**
+ * set playing status (Player or CPU)
+ */
 Interface.prototype.setPlaying = function(playing) {
   if (playing) {
     this.playing = true;
@@ -174,6 +204,9 @@ Interface.prototype.setPlaying = function(playing) {
   }
 };
 
+/**
+ * set player data
+ */
 Interface.prototype.setPlayer = function(player) {
   this.playerScore.innerHTML = player.score;
   var zilchs = '';
@@ -184,6 +217,9 @@ Interface.prototype.setPlayer = function(player) {
 
 };
 
+/**
+ * set cpu data
+ */
 Interface.prototype.setCpu = function(cpu) {
   this.cpuScore.innerHTML = cpu.score;
   var zilchs = '';
@@ -194,6 +230,9 @@ Interface.prototype.setCpu = function(cpu) {
   this.cpuZilch.innerHTML = zilchs;
 };
 
+/**
+ * show message with timeout and callback
+ */
 Interface.prototype.showMessage = function(message, timeout, callback) {
   var self = this;
 
@@ -210,6 +249,9 @@ Interface.prototype.showMessage = function(message, timeout, callback) {
   }
 };
 
+/**
+ * hide current message
+ */
 Interface.prototype.clearMessage = function(callback) {
   this.message.classList.remove('visible');
   if (callback) {

style/main.css

@@ -236,23 +236,23 @@ hr {
 }
 
 .dice.duration1.animate:after {
-  animation-delay: 0.3s;
-  -webkit-animation-delay: 0.1s;
-  -moz-animation-delay: 0.1s;
-  -o-animation-delay: 0.1s;
-  -ms-animation-delay: 0.1s;
+  animation-delay: 0.2s;
+  -webkit-animation-delay: 0.2s;
+  -moz-animation-delay: 0.2s;
+  -o-animation-delay: 0.2s;
+  -ms-animation-delay: 0.2s;
 }
 
 .dice.duration1.animate:after {
-  animation-delay: 0.6s;
-  -webkit-animation-delay: 0.1s;
-  -moz-animation-delay: 0.1s;
-  -o-animation-delay: 0.1s;
-  -ms-animation-delay: 0.1s;
+  animation-delay: 0.3s;
+  -webkit-animation-delay: 0.3s;
+  -moz-animation-delay: 0.3s;
+  -o-animation-delay: 0.3s;
+  -ms-animation-delay: 0.3s;
 }
 
 .dice.duration3.animate:after {
-  animation-delay: 0.7s;
+  animation-delay: 0.1s;
   -webkit-animation-delay: 0.1s;
   -moz-animation-delay: 0.1s;
   -o-animation-delay: 0.1s;
@@ -260,19 +260,19 @@ hr {
 }
 
 .dice.duration4.animate:after {
-  animation-delay: 1.2s;
-  -webkit-animation-delay: 0.1s;
-  -moz-animation-delay: 0.1s;
-  -o-animation-delay: 0.1s;
-  -ms-animation-delay: 0.1s;
+  animation-delay: 0.3s;
+  -webkit-animation-delay: 0.3s;
+  -moz-animation-delay: 0.3s;
+  -o-animation-delay: 0.3s;
+  -ms-animation-delay: 0.3s;
 }
 
 .dice.duration5.animate:after {
-  animation-delay: 1.5s;
-  -webkit-animation-delay: 0.1s;
-  -moz-animation-delay: 0.1s;
-  -o-animation-delay: 0.1s;
-  -ms-animation-delay: 0.1s;
+  animation-delay: 0.2s;
+  -webkit-animation-delay: 0.2s;
+  -moz-animation-delay: 0.2s;
+  -o-animation-delay: 0.2s;
+  -ms-animation-delay: 0.2s;
 }
 
 .message {