deepcrayon/lila
deepcrayon/lila
1
0
Fork 0
Code Releases Activity

expiration UI tweaks

Browse source
This commit is contained in:
Thibault Duplessis 2017-10-22 18:38:05 -05:00
parent 8d7ed80cdc
commit 2594b67b6a
4 changed files with 27 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
public/stylesheets/board.css
View file

@ -617,6 +617,9 @@ div.table_wrap .clock .bar span {
div.table_wrap .clock .bar.berserk span {
background: #dc322f;
}
div.table_wrap.with_expiration .clock .bar {
display: none;
}
div.table_wrap .clock > .time {
display: inline-block;
border: 1px solid #ccc;
@ -758,9 +761,8 @@ div.control .button.disabled {
.lichess_ground .suggestion,
.lichess_ground .pending,
.lichess_ground .negotiation {
padding: 10px 7px;
padding: 8px 7px;
background: #d0d0d0;
text-align: center;
}
.lichess_ground .suggestion p {
margin-bottom: 7px;
@ -772,6 +774,15 @@ div.control .button.disabled {
background: #dc322f!important;
color: #fff!important;
}
.lichess_ground .expiration {
display: flex;
justify-content: center;
align-items: center;
}
.lichess_ground .expiration strong {
font-size: 1.3em;
margin-right: .3em;
}
.lichess_ground .pending {
display: flex;
align-items: center;

2
ui/round/src/ctrl.ts
View file

@ -127,7 +127,7 @@ export default class RoundController {
private showExpiration = () => {
if (!this.data.expiration) return;
this.redraw();
setTimeout(this.showExpiration, 200);
setTimeout(this.showExpiration, 250);
}
private onUserMove = (orig: cg.Key, dest: cg.Key, meta: cg.MoveMetadata) => {

7
ui/round/src/view/expiration.ts
View file

@ -19,11 +19,8 @@ export default function(ctrl: RoundController): [VNode, boolean] | undefined {
h('div.expiration.suggestion', {
class: { emerg }
}, [
h('div.text', {
}, [
h('strong', '' + Math.round(timeLeft / 1000)),
' seconds to move'
])
h('strong', '' + Math.round(timeLeft / 1000)),
'seconds to move'
]),
myTurn
];

19
ui/round/src/view/table.ts
View file

@ -66,18 +66,15 @@ function renderTablePlay(ctrl: RoundController) {
ctrl.drawConfirm ? button.drawConfirm(ctrl) : button.standard(ctrl, ctrl.canOfferDraw, '2', 'offerDraw', 'draw-yes', () => ctrl.offerDraw(true)),
ctrl.resignConfirm ? button.resignConfirm(ctrl) : button.standard(ctrl, game.resignable, 'b', 'resign', 'resign-confirm', () => ctrl.resign(true))
],
expiration = renderExpiration(ctrl),
buttons: MaybeVNodes = loading ? [loader()] : (submit ? [submit] : [
button.forceResign(ctrl),
button.threefoldClaimDraw(ctrl),
button.cancelDrawOffer(ctrl),
button.answerOpponentDrawOffer(ctrl),
button.cancelTakebackProposition(ctrl),
button.answerOpponentTakebackProposition(ctrl),
expiration && expiration[1] ? expiration[0] : null
button.answerOpponentTakebackProposition(ctrl)
]);
return [
expiration && !expiration[1] ? expiration[0] : null,
renderReplay(ctrl),
h('div.control.icons', {
class: { 'confirm': !!(ctrl.drawConfirm || ctrl.resignConfirm) }
@ -110,17 +107,23 @@ function anyClock(ctrl: RoundController, position: Position) {
}
export default function(ctrl: RoundController): VNode {
const contents: MaybeVNodes = [
const playable = game.playable(ctrl.data),
contents: MaybeVNodes = [
renderPlayer(ctrl, topPlayer(ctrl)),
h('div.table_inner',
ctrl.data.player.spectator ? renderTableWatch(ctrl) : (
game.playable(ctrl.data) ? renderTablePlay(ctrl) : renderTableEnd(ctrl)
playable ? renderTablePlay(ctrl) : renderTableEnd(ctrl)
)
)
];
return h('div.table_wrap', [
],
expiration = playable && renderExpiration(ctrl);
return h('div.table_wrap', {
class: { with_expiration: !!expiration }
}, [
anyClock(ctrl, 'top'),
expiration && !expiration[1] ? expiration[0] : null,
h('div.table', contents),
expiration && expiration[1] ? expiration[0] : null,
anyClock(ctrl, 'bottom')
]);
};