indicate turn when game is unlimited
This commit is contained in:
parent
a7eb899766
commit
8cfdf51bce
|
@ -1088,57 +1088,64 @@ div.table .button.strong {
|
|||
font-weight: bold;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
div.table_wrap > div.clock {
|
||||
div.table_wrap .whos_turn {
|
||||
height: 2em;
|
||||
line-height: 2em;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
div.table_wrap > .clock {
|
||||
position: relative;
|
||||
}
|
||||
div.table_wrap > div.clock > div.bar {
|
||||
div.table_wrap > .clock .bar {
|
||||
position: absolute;
|
||||
width: 242px;
|
||||
height: 4px;
|
||||
}
|
||||
div.table_wrap > div.clock_top > div.bar {
|
||||
div.table_wrap > .clock_top .bar {
|
||||
bottom: -4px;
|
||||
}
|
||||
div.table_wrap > div.clock_bottom > div.bar {
|
||||
div.table_wrap > .clock_bottom .bar {
|
||||
top: -4px;
|
||||
}
|
||||
div.table_wrap > div.clock > div.bar > span {
|
||||
div.table_wrap > .clock .bar span {
|
||||
display: block;
|
||||
height: 4px;
|
||||
width: 0px;
|
||||
background: #759900;
|
||||
}
|
||||
div.table_wrap > div.clock > div.time {
|
||||
div.table_wrap > .clock > .time {
|
||||
display: inline-block;
|
||||
border: 1px solid #ccc;
|
||||
padding: 0 8px;
|
||||
font-size: 27px;
|
||||
font-family: monospace;
|
||||
}
|
||||
div.table_wrap > div.clock > div.time > span {
|
||||
div.table_wrap > .clock .time span {
|
||||
font-size: 80%;
|
||||
}
|
||||
div.table_wrap > div.clock > div.time b {
|
||||
div.table_wrap > .clock .time b {
|
||||
font-weight: bold;
|
||||
}
|
||||
div.table_wrap > div.clock.running > div.time {
|
||||
div.table_wrap > .clock.running .time {
|
||||
background: #fff077;
|
||||
color: #444;
|
||||
}
|
||||
div.table_wrap > div.clock.running.emerg > div.time {
|
||||
div.table_wrap > .clock.running.emerg .time {
|
||||
background-color: #eFAAAA;
|
||||
color: #444;
|
||||
}
|
||||
div.table_wrap > div.clock.outoftime > div.time {
|
||||
div.table_wrap > .clock.outoftime .time {
|
||||
background-color: #eFAAAA;
|
||||
font-weight: bold;
|
||||
color: #444;
|
||||
}
|
||||
div.table_wrap > div.clock_top > div.time {
|
||||
div.table_wrap > .clock_top .time {
|
||||
border-bottom: 0;
|
||||
border-radius: 2px 2px 0 0;
|
||||
}
|
||||
div.table_wrap > div.clock_bottom > div.time {
|
||||
div.table_wrap > .clock_bottom .time {
|
||||
border-top: 0;
|
||||
border-radius: 0 0 2px 2px;
|
||||
}
|
||||
|
|
|
@ -105,10 +105,22 @@ function renderTablePlay(ctrl) {
|
|||
];
|
||||
}
|
||||
|
||||
function whosTurn(ctrl, color) {
|
||||
return m('div.whos_turn',
|
||||
ctrl.data.game.player == color ? ctrl.trans(
|
||||
ctrl.data.game.player == ctrl.data.player.color ? 'yourTurn' : 'waitingForOpponent'
|
||||
) : ''
|
||||
);
|
||||
}
|
||||
|
||||
module.exports = function(ctrl) {
|
||||
var clockRunningColor = ctrl.isClockRunning() ? ctrl.data.game.player : null;
|
||||
return m('div.table_wrap', [
|
||||
(ctrl.clock && !ctrl.data.blind) ? renderClock(ctrl.clock, opposite(ctrl.data.player.color), "top", clockRunningColor) : null,
|
||||
(ctrl.clock && !ctrl.data.blind) ? renderClock(
|
||||
ctrl.clock,
|
||||
opposite(ctrl.data.player.color),
|
||||
"top", clockRunningColor
|
||||
) : whosTurn(ctrl, ctrl.data.opponent.color),
|
||||
m('div', {
|
||||
class: 'table' + (status.finished(ctrl.data) ? ' finished' : '')
|
||||
}, [
|
||||
|
@ -121,6 +133,6 @@ module.exports = function(ctrl) {
|
|||
]), (ctrl.clock && !ctrl.data.blind) ? [
|
||||
renderClock(ctrl.clock, ctrl.data.player.color, "bottom", clockRunningColor),
|
||||
button.moretime(ctrl)
|
||||
] : null
|
||||
] : whosTurn(ctrl, ctrl.data.player.color)
|
||||
])
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue