X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fcomponents%2FMoveList.vue;h=90b76b43531a33d56434568911d08c4dd5689046;hb=dac395887d96e2d642b209c6db6aaacc3ffacb34;hp=e50047d907c952ece8e059c33eddd2adff4fb98e;hpb=5fde3a01497262862afc4cb4c9457d4e0ad69a4a;p=vchess.git diff --git a/client/src/components/MoveList.vue b/client/src/components/MoveList.vue index e50047d9..90b76b43 100644 --- a/client/src/components/MoveList.vue +++ b/client/src/components/MoveList.vue @@ -2,7 +2,7 @@ // Component for moves list on the right export default { name: 'my-move-list', - props: ["moves","cursor","score","message","firstNum"], + props: ["moves","cursor","score","message","firstNum"], watch: { cursor: function(newCursor) { if (window.innerWidth <= 767) @@ -32,75 +32,75 @@ export default { }); }, }, - render(h) { - if (this.moves.length == 0) - return; - let tableContent = []; - let moveCounter = 0; - let tableRow = undefined; - let moveCells = undefined; - let curCellContent = ""; - let firstIndex = 0; + render(h) { + if (this.moves.length == 0) + return; + let tableContent = []; + let moveCounter = 0; + let tableRow = undefined; + let moveCells = undefined; + let curCellContent = ""; + let firstIndex = 0; for (let i=0; i0 && this.moves[i-1].color=="b") - { - if (!!tableRow) - { - tableRow.children = moveCells; - tableContent.push(tableRow); - } - moveCells = [ - h( - "td", - { domProps: { innerHTML: (++moveCounter) + "." } } - ) - ]; - tableRow = h( - "tr", - { } - ); - curCellContent = ""; + { + if (this.moves[i].color == "w") + { + if (i == 0 || i>0 && this.moves[i-1].color=="b") + { + if (!!tableRow) + { + tableRow.children = moveCells; + tableContent.push(tableRow); + } + moveCells = [ + h( + "td", + { domProps: { innerHTML: (++moveCounter) + "." } } + ) + ]; + tableRow = h( + "tr", + { } + ); + curCellContent = ""; firstIndex = i; - } - } + } + } // Next condition is fine because even if the first move is black, // there will be the "..." which count as white move. else if (this.moves[i].color == "b" && this.moves[i-1].color == "w") firstIndex = i; - curCellContent += this.moves[i].notation; - if (i < this.moves.length-1 && this.moves[i+1].color == this.moves[i].color) - curCellContent += ","; - else //color change - { - moveCells.push( - h( - "td", - { - domProps: { innerHTML: curCellContent }, - on: { click: () => this.gotoMove(i) }, + curCellContent += this.moves[i].notation; + if (i < this.moves.length-1 && this.moves[i+1].color == this.moves[i].color) + curCellContent += ","; + else //color change + { + moveCells.push( + h( + "td", + { + domProps: { innerHTML: curCellContent }, + on: { click: () => this.gotoMove(i) }, "class": { "highlight-lm": this.cursor >= firstIndex && this.cursor <= i }, - } - ) - ); - curCellContent = ""; - } - } - // Complete last row, which might not be full: - if (moveCells.length-1 == 1) - { + } + ) + ); + curCellContent = ""; + } + } + // Complete last row, which might not be full: + if (moveCells.length-1 == 1) + { moveCells.push( h( "td", { domProps: { innerHTML: "" } } ) ); - } - tableRow.children = moveCells; - tableContent.push(tableRow); + } + tableRow.children = moveCells; + tableContent.push(tableRow); let rootElements = []; if (this.score != "*") { @@ -127,18 +127,18 @@ export default { }, }, tableContent - ) + ) ); - return h( + return h( "div", { }, rootElements); - }, + }, methods: { - gotoMove: function(index) { - this.$emit("goto-move", index); - }, - }, + gotoMove: function(index) { + this.$emit("goto-move", index); + }, + }, };