From: Benjamin Auder Date: Tue, 4 Feb 2020 21:49:05 +0000 (+0100) Subject: Failed attempt for marseilleChess with a template: back to render function X-Git-Url: https://git.auder.net/%7B%7B%20asset%28%27mixstore/images/pieces/scripts/mini-custom.min.css?a=commitdiff_plain;h=144c900354f828ff2321a94db364bf436bff4586;p=vchess.git Failed attempt for marseilleChess with a template: back to render function --- diff --git a/client/src/components/MoveList.vue b/client/src/components/MoveList.vue index 28d0d009..73c10f0f 100644 --- a/client/src/components/MoveList.vue +++ b/client/src/components/MoveList.vue @@ -5,8 +5,9 @@ div p {{ message }} table.moves-list tbody - tr(v-for="moveIdx in evenNumbers") - td {{ firstNum + moveIdx / 2 + 1 }} + tr(v-for="gmove,index in groupedMoves") + td(v-if="index%2==0") + | {{ firstNum + index / 2 + 1 }} td(:class="{'highlight-lm': cursor == moveIdx}" @click="() => gotoMove(moveIdx)") | {{ moves[moveIdx].notation }} @@ -43,8 +44,24 @@ export default { }, }, computed: { - evenNumbers: function() { - return [...Array(this.moves.length).keys()].filter(i => i%2==0); + groupedMoves: function() { + let groups = []; + let curCol = undefined; + for (let idx=0; idx < this.moves.length; idx++) + { + const m = this.moves[idx]; + if (m.color == curCol) + { + const gidx = groups.length - 1; + groups[gidx].moves.push(m); + } + else + { + curCol = m.color; + groups.push({moves: [m], idx: groups.length}); + } + } + return groups; }, }, methods: {