From: Benjamin Auder Date: Tue, 11 Dec 2018 13:17:21 +0000 (+0100) Subject: Finish preferences implementation X-Git-Url: https://git.auder.net/css/vendor/img/scripts/assets/rpsls.css?a=commitdiff_plain;h=2812515a10843e74d67cb755cb9aeeb8417e4a88;p=vchess.git Finish preferences implementation --- diff --git a/public/javascripts/components/game.js b/public/javascripts/components/game.js index 80dd35de..860bab0c 100644 --- a/public/javascripts/components/game.js +++ b/public/javascripts/components/game.js @@ -573,12 +573,10 @@ Vue.component('my-game', { h('fieldset', { }, [ - //h('legend', { domProps: { innerHTML: "Show " } }), + //h('legend', { domProps: { innerHTML: "Legend title" } }), h('label', { - attrs: { - for: "setHints", - }, + attrs: { for: "setHints" }, domProps: { innerHTML: "Show hints?" }, }, ), @@ -599,9 +597,7 @@ Vue.component('my-game', { [ h('label', { - attrs: { - for: "selectColor", - }, + attrs: { for: "selectColor" }, domProps: { innerHTML: "Board colors" }, }, ), @@ -615,7 +611,7 @@ Vue.component('my-game', { { domProps: { "value": "lichess", - innerHTML: "lichess" + innerHTML: "brown" }, attrs: { "selected": this.color=="lichess" }, } @@ -624,7 +620,7 @@ Vue.component('my-game', { { domProps: { "value": "chesscom", - innerHTML: "chess.com" + innerHTML: "green" }, attrs: { "selected": this.color=="chesscom" }, } @@ -633,7 +629,7 @@ Vue.component('my-game', { { domProps: { "value": "chesstempo", - innerHTML: "chesstempo" + innerHTML: "blue" }, attrs: { "selected": this.color=="chesstempo" }, } @@ -647,9 +643,7 @@ Vue.component('my-game', { [ h('label', { - attrs: { - for: "selectSound", - }, + attrs: { for: "selectSound" }, domProps: { innerHTML: "Sound level" }, }, ), @@ -954,12 +948,13 @@ Vue.component('my-game', { this.hints = !this.hints; setCookie("hints", this.hints ? "1" : "0"); }, - // TODO: - setColor: function() { - alert("Change"); + setColor: function(e) { + this.color = e.target.options[e.target.selectedIndex].value; + setCookie("color", this.color); }, - setSound: function() { - alert("Change"); + setSound: function(e) { + this.sound = e.target.options[e.target.selectedIndex].value; + setCookie("sound", this.sound); }, clickGameSeek: function(e) { this.getRidOfTooltip(e.currentTarget); @@ -1033,10 +1028,10 @@ Vue.component('my-game', { if (mode=="human") { // Opponent found! - if (!continuation) + if (!continuation) //not playing sound on game continuation { - // Not playing sound on game continuation: - new Audio("/sounds/newgame.mp3").play().then(() => {}).catch(err => {}); + if (this.sound >= 1) + new Audio("/sounds/newgame.mp3").play().then(() => {}).catch(err => {}); document.getElementById("modal-newgame").checked = false; } this.oppid = oppId; @@ -1216,7 +1211,8 @@ Vue.component('my-game', { // Not programmatic, or animation is over if (this.mode == "human" && this.vr.turn == this.mycolor) this.conn.send(JSON.stringify({code:"newmove", move:move, oppid:this.oppid})); - new Audio("/sounds/chessmove1.mp3").play().then(() => {}).catch(err => {}); + if (this.sound == 2) + new Audio("/sounds/chessmove1.mp3").play().then(() => {}).catch(err => {}); if (this.mode != "idle") { this.incheck = this.vr.getCheckSquares(move); //is opponent in check?