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

tournament list UI WIP

Browse source
This commit is contained in:
Thibault Duplessis 2015-01-18 11:26:05 +01:00
parent aed358fd8e
commit 4949284ce4
5 changed files with 71 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
app/templating/TournamentHelper.scala
View file

@ -24,14 +24,14 @@ trait TournamentHelper { self: I18nHelper =>
}
def tournamentLink(tour: Tournament): Html = Html {
val cssClass = if (tour.scheduled) "is-gold" else ""
val cssClass = if (tour.scheduled) "text is-gold" else "text"
val url = routes.Tournament.show(tour.id)
s"""<a data-icon="g" class="$cssClass" href="$url">&nbsp;${tour.fullName}</a>"""
s"""<a data-icon="g" class="$cssClass" href="$url">${tour.fullName}</a>"""
}
def tournamentLink(tourId: String): Html = Html {
val url = routes.Tournament.show(tourId)
s"""<a data-icon="g" href="$url">&nbsp;${tournamentIdToName(tourId)}</a>"""
s"""<a class="text" data-icon="g" href="$url">${tournamentIdToName(tourId)}</a>"""
}
def tournamentIdToName(id: String) = tournamentEnv.cached name id getOrElse "Tournament"

53
app/views/tournament/homeInner.scala.html
View file

@ -12,15 +12,17 @@
}
}
@tourMode(tour: lila.tournament.Tournament) = {
@tour.schedule.filter(_ => tour.isOpen).map { s =>
@momentFromNow(s.at)
}.getOrElse {
@if(tour.variant.exotic) {
<span class="is text" data-icon="@lila.rating.PerfType(tour.variant.key).map(_.iconChar)">@tour.variant.name</span>
}
@if(tour.rated) { @trans.rated() }
@iconTd(tour: lila.tournament.Tournament) = {
<td class="icon">
<span @if(tour.scheduled){class="is-gold"} data-icon="@tour.perfType.map(_.iconChar)"></span>
</td>
}
@tourTd(tour: lila.tournament.Tournament) = {
<td class="header">
<a href="@routes.Tournament.show(tour.id)" class="name">@tour.fullName</a>
@setup(tour)
</td>
}
<div class="content_box tournament_box no_padding">
@ -28,8 +30,7 @@
<table class="slist">
<thead>
<tr>
<th class="large">@trans.openTournaments()</th>
<th></th>
<th colspan=2 class="large">@trans.openTournaments()</th>
<th>@trans.timeControl()</th>
<th colspan="2">@trans.players()</th>
</tr>
@ -37,25 +38,25 @@
<tbody>
@createds.filter(_.scheduled).map { tour =>
<tr class="scheduled">
<td>@tournamentLink(tour)</td>
<td>@tourMode(tour)</td>
<td class="text" data-icon="p">@tour.clock.show | @tour.durationString</td>
@iconTd(tour)
@tourTd(tour)
<td class="text" data-icon="p">@tour.durationString</td>
<td class="text" data-icon="r">@tour.nbPlayers</td>
<td>@joinButton(tour)</td>
</tr>
}
@createds.filterNot(_.scheduled).map { tour =>
<tr>
<td>@tournamentLink(tour)</td>
<td>@tourMode(tour)</td>
<td class="text" data-icon="p">@tour.clock.show | @tour.durationString</td>
@iconTd(tour)
@tourTd(tour)
<td class="text" data-icon="p">@tour.durationString</td>
<td class="text" data-icon="r">@tour.playerRatio</td>
<td>@joinButton(tour)</td>
</tr>
}
@if(ctx.isAuth) {
<tr class="create">
<td colspan="5">
<td colspan="6">
<a href="@routes.Tournament.form()" class="action button text">@trans.createANewTournament()</a>
</td>
</tr>
@ -64,8 +65,7 @@
@if(starteds.nonEmpty) {
<thead>
<tr>
<th class="large">@trans.playingRightNow()</th>
<th></th>
<th colspan=2 class="large">@trans.playingRightNow()</th>
<th>@trans.timeControl()</th>
<th>@trans.players()</th>
<th></th>
@ -74,9 +74,9 @@
<tbody>
@starteds.map { tour =>
<tr>
<td>@tournamentLink(tour)</td>
<td>@tourMode(tour)</td>
<td class="text" data-icon="p">@tour.clock.show | @tour.durationString</td>
@iconTd(tour)
@tourTd(tour)
<td class="text" data-icon="p">@tour.durationString</td>
<td class="text" data-icon="r">@tour.nbPlayers</td>
<td>@joinButton(tour)</td>
</tr>
@ -85,8 +85,7 @@
}
<thead>
<tr>
<th class="large">@trans.finished()</th>
<th></th>
<th colspan=2 class="large">@trans.finished()</th>
<th>@trans.timeControl()</th>
<th>@trans.players()</th>
<th>@trans.winner()</th>
@ -95,9 +94,9 @@
<tbody>
@finisheds.map { tour =>
<tr>
<td>@tournamentLink(tour)</td>
<td>@tourMode(tour)</td>
<td class="text" data-icon="p">@tour.clock.show | @tour.durationString</td>
@iconTd(tour)
@tourTd(tour)
<td class="text" data-icon="p">@tour.durationString</td>
<td class="text" data-icon="r">@tour.nbPlayers</td>
<td>@tour.winner.map { player =>
@userInfosLink(player.id, player.rating.some, withOnline = false)

16
app/views/tournament/setup.scala.html Normal file
View file

@ -0,0 +1,16 @@
@(tour: lila.tournament.Tournament)(implicit ctx: Context)
<span class="setup">
@tour.clock.show •
@if(tour.variant.exotic) {
@game.variantLink(tour.variant, (if (tour.variant == chess.variant.KingOfTheHill) tour.variant.shortName else tour.variant.name), cssClass = "hint--top")
} else {
@tour.perfType.map { pt =>
<span class="hint--top" data-hint="@pt.title">@pt.name</span>
}
} •
@tour.schedule.filter(_ => tour.isOpen).map { s =>
@momentFromNow(s.at)
}.getOrElse {
@tour.rated.fold(trans.rated.str(), trans.casual.str())
}
</span>

11
app/views/tournament/side.scala.html
View file

@ -3,16 +3,7 @@
<div class="side_box padded">
<div class="game_infos" data-icon="@tour.perfType.map(_.iconChar)">
<div class="header">
<span class="setup">
@tour.clock.show •
@if(tour.variant.exotic) {
@game.variantLink(tour.variant, (if (tour.variant == chess.variant.KingOfTheHill) tour.variant.shortName else tour.variant.name), cssClass = "hint--top")
} else {
@tour.perfType.map { pt =>
<span class="hint--top" data-hint="@pt.title">@pt.name</span>
}
} • @tour.rated.fold(trans.rated.str(), trans.casual.str())
</span>
@setup(tour)
@systemName(tour.system).capitalize
(<a href="@routes.Tournament.help(tour.system.toString.toLowerCase.some)">?</a>)
• @tour.minutes minutes

28
public/stylesheets/tournament.css
View file

@ -1,14 +1,36 @@
#tournament table.slist td:first-child a,
#tournament_list table.slist td:first-child a,
ol.scheduled_tournaments a {
font-weight: bold;
text-decoration: none;
}
#tournament table.slist td:first-child a:hover,
#tournament_list table.slist td:first-child a:hover,
ol.scheduled_tournaments a:hover {
text-decoration: underline;
}
#tournament_list table.slist {
line-height: 2.3em;
}
#tournament_list table.slist .icon {
width: 3em;
}
#tournament_list table.slist .icon span {
font-size: 3em;
opacity: 0.8;
transition: 0.3s;
}
#tournament_list table.slist td {
padding-top: 1em;
padding-bottom: 1em;
}
#tournament_list table.slist .header {
letter-spacing: 2px;
}
#tournament_list table.slist a.name {
letter-spacing: 3px;
font-size: 1.7em;
text-decoration: none;
display: block;
}
#tournament.scheduled h1,
#tournament table tr.standing.scheduled:first-child td:first-child {
color: #d59120;
@ -198,7 +220,7 @@ ol.scheduled_tournaments a:hover {
overflow: auto;
text-align: center;
}
#site_header .side_box .setup {
.setup {
text-transform: uppercase;
}
#tournament_side a {