initial commit

js/interface.js

@@ -0,0 +1,184 @@
+function Interface() {
+
+    var self = this;
+
+    self.events = {};
+
+    self.restartButton = document.querySelector('#restart-button');
+
+    self.playerScoreContainer = document.querySelector('#player-score-container');
+    self.playerScore = document.querySelector('#player-score');
+
+    self.cpuScoreContainer = document.querySelector('#cpu-score-container');
+    self.cpuScore = document.querySelector('#cpu-score');
+
+    self.points = document.querySelector('#points');
+    self.pointsButton = document.querySelector('#points-button');
+    self.dicesButton = document.querySelector('#dices-button');
+    self.diceContainer = document.querySelector('#dices');
+    self.dices = self.diceContainer.children;
+
+    self.message = document.querySelector('#message');
+
+    self.dicesButton.disabled = true;
+    self.pointsButton.disabled = true;
+
+    self.restartButton.addEventListener("click", function() {
+        self.fireEvent("restart");
+    });
+
+    self.pointsButton.addEventListener("click", function() {
+        self.fireEvent("takePoints");
+    });
+
+
+    self.dicesButton.addEventListener("click", function() {
+        self.fireEvent("addPoints");
+        self.fireEvent("roleDices");
+    });
+
+    for (var diceIndex = 0; diceIndex < 6; diceIndex++) {
+        var diceContainer = self.dices[diceIndex];
+        diceContainer.diceIndex = diceIndex;
+        diceContainer.addEventListener("click", function() {
+            self.fireEvent("toggleDice", this.diceIndex);
+        });
+    }
+
+    this.setup();
+};
+
+Interface.prototype.setup = function() {
+    this.dicesButton.disabled = true;
+    this.pointsButton.disabled = true;
+    this.message.classList.remove('visible');
+
+};
+
+Interface.prototype.on = function(event, callback) {
+    if (!this.events[event]) {
+        this.events[event] = [];
+    }
+    this.events[event].push(callback);
+};
+
+Interface.prototype.fireEvent = function(event, data) {
+    var callbacks = this.events[event];
+    if (callbacks) {
+        callbacks.forEach(function(callback) {
+            callback(data);
+        });
+    }
+};
+
+Interface.prototype.setDices = function(dices) {
+    var self = this;
+
+    for (var diceIndex = 0; diceIndex < 6; diceIndex++) {
+        var dice = dices[diceIndex];
+        var diceContainer = self.dices[diceIndex];
+        diceContainer.innerHTML = dice.value + 1;
+
+        if (dice.disabled) {
+            diceContainer.disabled = true;
+        } else {
+            diceContainer.disabled = false;
+        }
+
+        if (dice.selected) {
+            diceContainer.classList.add('selected');
+        } else {
+            diceContainer.classList.remove('selected');
+        }
+
+        if (dice.invalid) {
+            diceContainer.classList.add('invalid');
+            diceContainer.classList.remove('selected');
+        } else {
+            diceContainer.classList.remove('invalid');
+        }
+    }
+
+
+
+
+};
+
+Interface.prototype.animateDices = function(dices, callback) {
+    var self = this;
+    for (var diceIndex = 0; diceIndex < 6; diceIndex++) {
+        var dice = dices[diceIndex];
+        if (!dice.disabled && !dice.selected) {
+            self.dices[diceIndex].classList.add("animate");
+            self.dices[diceIndex].classList.add("duration" + diceIndex);
+        }
+    }
+
+    setTimeout(function() {
+        for (var diceIndex = 0; diceIndex < 6; diceIndex++) {
+            self.dices[diceIndex].classList.remove("animate");
+        }
+        if (callback) {
+            callback();
+        }
+    }, Math.random() * 500 + 500);
+};
+
+Interface.prototype.disableTakePoints = function(disabled) {
+    this.pointsButton.disabled = disabled;
+};
+
+Interface.prototype.disabledRoleDices = function(disabled) {
+    this.dicesButton.disabled = disabled;
+};
+
+Interface.prototype.setPoints = function(points) {
+    this.points.innerHTML = points;
+};
+
+Interface.prototype.setPlaying = function(playing) {
+    if (playing) {
+        this.playerScoreContainer.classList.add('active');
+        this.cpuScoreContainer.classList.remove('active');
+    } else {
+        this.playerScoreContainer.classList.remove('active');
+        this.cpuScoreContainer.classList.add('active');
+    }
+};
+
+Interface.prototype.setPlayer = function(player) {
+    this.playerScore.innerHTML = player.score;
+    this.playerScoreContainer.classList.remove('zilch-0');
+    this.playerScoreContainer.classList.remove('zilch-1');
+    this.playerScoreContainer.classList.remove('zilch-2');
+    this.playerScoreContainer.classList.remove('zilch-3');
+    this.playerScoreContainer.classList.add('zilch-' + player.zilch);
+
+};
+
+Interface.prototype.setCpu = function(cpu) {
+    this.cpuScore.innerHTML = cpu.score;
+    this.cpuScoreContainer.classList.remove('zilch-0');
+    this.cpuScoreContainer.classList.remove('zilch-1');
+    this.cpuScoreContainer.classList.remove('zilch-2');
+    this.cpuScoreContainer.classList.remove('zilch-3');
+    this.cpuScoreContainer.classList.add('zilch-' + cpu.zilch);
+};
+
+Interface.prototype.showMessage = function(message, fade) {
+    var self = this;
+
+    self.message.innerHTML = '<p>' + message + '</p>';
+
+    self.message.classList.add('visible');
+
+    if (fade) {
+        setTimeout(function() {
+            self.clearMessage();
+        }, fade);
+    }
+};
+
+Interface.prototype.clearMessage = function() {
+    this.message.classList.remove('visible');
+};