user search UI

more-scalatags
Thibault Duplessis 2019-04-14 09:10:18 +07:00
parent 5efceed10f
commit 97be460253
14 changed files with 78 additions and 73 deletions

View File

@ -7,7 +7,7 @@ import mashup._
import lila.api.Context
import lila.app.ui.ScalatagsTemplate._
import lila.common.LightUser
import lila.i18n.I18nKeys
import lila.i18n.{ I18nKeys => trans }
import lila.rating.{ PerfType, Perf }
import lila.user.{ User, Title, UserContext }
@ -234,19 +234,20 @@ trait UserHelper { self: I18nHelper with StringHelper with NumberHelper =>
}
def userGameFilterTitle(u: User, nbs: UserInfo.NbGames, filter: GameFilter)(implicit ctx: UserContext): Frag =
splitNumber(userGameFilterTitleNoTag(u, nbs, filter))
if (filter == GameFilter.Search) frag(br, trans.advancedSearch.frag())
else splitNumber(userGameFilterTitleNoTag(u, nbs, filter))
def userGameFilterTitleNoTag(u: User, nbs: UserInfo.NbGames, filter: GameFilter)(implicit ctx: UserContext): String = (filter match {
case GameFilter.All => I18nKeys.nbGames.pluralSameTxt(u.count.game)
case GameFilter.Me => nbs.withMe ?? I18nKeys.nbGamesWithYou.pluralSameTxt
case GameFilter.Rated => I18nKeys.nbRated.pluralSameTxt(u.count.rated)
case GameFilter.Win => I18nKeys.nbWins.pluralSameTxt(u.count.win)
case GameFilter.Loss => I18nKeys.nbLosses.pluralSameTxt(u.count.loss)
case GameFilter.Draw => I18nKeys.nbDraws.pluralSameTxt(u.count.draw)
case GameFilter.Playing => I18nKeys.nbPlaying.pluralSameTxt(nbs.playing)
case GameFilter.Bookmark => I18nKeys.nbBookmarks.pluralSameTxt(nbs.bookmark)
case GameFilter.Imported => I18nKeys.nbImportedGames.pluralSameTxt(nbs.imported)
case GameFilter.Search => I18nKeys.advancedSearch.txt()
case GameFilter.All => trans.nbGames.pluralSameTxt(u.count.game)
case GameFilter.Me => nbs.withMe ?? trans.nbGamesWithYou.pluralSameTxt
case GameFilter.Rated => trans.nbRated.pluralSameTxt(u.count.rated)
case GameFilter.Win => trans.nbWins.pluralSameTxt(u.count.win)
case GameFilter.Loss => trans.nbLosses.pluralSameTxt(u.count.loss)
case GameFilter.Draw => trans.nbDraws.pluralSameTxt(u.count.draw)
case GameFilter.Playing => trans.nbPlaying.pluralSameTxt(nbs.playing)
case GameFilter.Bookmark => trans.nbBookmarks.pluralSameTxt(nbs.bookmark)
case GameFilter.Imported => trans.nbImportedGames.pluralSameTxt(nbs.imported)
case GameFilter.Search => trans.advancedSearch.txt()
})
def describeUser(user: User) = {

View File

@ -103,7 +103,7 @@ private object bits {
th(label("Clock initial time")),
td(
div(cls := "half")("From ", form3.select(form("clock")("initMin"), Query.clockInits, "".some)),
div(cls := "half")("From ", form3.select(form("clock")("initMax"), Query.clockInits, "".some))
div(cls := "half")("To ", form3.select(form("clock")("initMax"), Query.clockInits, "".some))
)
)
@ -111,7 +111,7 @@ private object bits {
th(label("Clock increment")),
td(
div(cls := "half")("From ", form3.select(form("clock")("incMin"), Query.clockIncs, "".some)),
div(cls := "half")("From ", form3.select(form("clock")("incMax"), Query.clockIncs, "".some))
div(cls := "half")("To ", form3.select(form("clock")("incMax"), Query.clockIncs, "".some))
)
)
@ -152,7 +152,7 @@ private object bits {
id := form3.id(field),
name := field.name,
value := "1",
checked := field.value.has("1")
checked := field.value.has("1").option(true)
),
label(`for` := form3.id(field))
)

View File

@ -77,7 +77,7 @@ object index {
),
div(cls := "search__result", id := "results")(
paginator.map { pager =>
val permalink = a(cls := "permalink", href := routes.Search.index())("Permalink")
val permalink = a(cls := "permalink", href := routes.Search.index(), rel := "nofollow")("Permalink")
if (pager.nbResults > 0) frag(
div(cls := "search__status box__pad")(
strong(pager.nbResults.localize, " games found"), " • ",

View File

@ -17,12 +17,11 @@ object user {
import commons._
st.form(
rel := "nofollow",
cls := "search",
cls := "search__form",
action := routes.User.games(u.username, "search"),
method := "GET"
)(dataReqs)(
table(
tr(cls := "header")(th(colspan := 2)(trans.advancedSearch())),
date,
rating,
turns,
@ -40,7 +39,7 @@ object user {
th(label(`for` := form3.id(form("players")("b")))("Opponent name")),
td(cls := "usernames")(
st.input(tpe := "hidden", value := u.id, name := "players.a"),
form3.input(form("players")("b"))
form3.input(form("players")("b"))(tpe := "text")
)
),
winner(hide = false),
@ -49,7 +48,11 @@ object user {
status,
winnerColor,
sort,
analysed
analysed,
tr(cls := "action")(
th,
td(button(cls := "button")(trans.search()))
)
)
)
}

View File

@ -32,26 +32,21 @@ object gamesContent {
nbs.crosstable.ifTrue(filters.current.name == "me").map {
views.html.game.crosstable(_, none)
},
div(cls := "search_result")(
div(cls := "search__result")(
if (filterName == "search") {
val permalink = a(rel := "nofollow", href := routes.User.games(u.username, filterName))("Permalink")
if (pager.nbResults > 0) frag(
div(cls := "search-status")(
div(cls := "search__status")(
strong(pager.nbResults.localize, " games found"),
" • ",
a(rel := "nofollow", href := routes.User.games(u.username, filterName))("Permalink"),
" • "
permalink
),
div(cls := "search_infinitescroll")(
pager.nextPage.map { n =>
div(cls := "pager none")(a(rel := "next", href := routes.User.games(u.username, filterName, n))("Next"))
} getOrElse div(cls := "none"),
div(cls := "search__rows")(
pagerNext(pager, np => routes.User.games(u.username, filterName, np).url) | div(cls := "none"),
views.html.game.widgets(pager.currentPageResults, user = u.some, ownerLink = ctx is u)
)
)
else div(cls := "search-status")(
"No game found - ",
a(href := routes.User.games(u.username, filterName))("Permalink")
)
else div(cls := "search__status")(strong("No game found"), " • ", permalink)
} else
div(cls := List(
"games infinitescroll" -> true,

View File

@ -242,4 +242,3 @@ It's useful against spambots. These marks are not visible to the public."""
)
)
}

View File

@ -66,15 +66,16 @@ object page {
info.ratingChart.map { ratingChart =>
frag(
jsTag("chart/ratingHistory.js"),
embedJsUnsafe(s"lichess.ratingHistoryChart($ratingChart);"),
filters.current.name == "search" option jsTag("search.js")
embedJsUnsafe(s"lichess.ratingHistoryChart($ratingChart);")
)
},
filters.current.name == "search" option jsTag("search.js"),
isGranted(_.UserSpy) option jsAt("compiled/user-mod.js")
),
moreCss = frag(
responsiveCssTag("user.show.games"),
info.nbs.crosstable.isDefined option responsiveCssTag("crosstable")
if (filters.current.name == "search") responsiveCssTag("user.show.search")
else info.nbs.crosstable.isDefined option responsiveCssTag("crosstable")
)
) {
main(cls := "page-menu", dataUsername := u.username)(

View File

@ -18,7 +18,6 @@ $(function() {
var options = ["<option value=''></option>"];
var isSelected = function(row, rowClassName, user, dataKey) {
var player = $form.data(dataKey);
console.log($form[0], dataKey, player);
return (row.classList.contains(rowClassName) && player.length && user == player) ? "selected" : ""
}
getUsernames().forEach(function(user) {
@ -68,7 +67,6 @@ $(function() {
var $next = $(this).find(".pager a");
if (!$next.length) return;
$next.attr("href", $next.attr("href") + "&" + serialized);
console.log($next.attr("href"));
$(this).infinitescroll({
navSelector: ".pager",
nextSelector: $next,

View File

@ -0,0 +1,3 @@
@import '../../../common/css/plugin';
@import '../../../common/css/form/cmn-toggle';
@import '../user/search';

View File

@ -0,0 +1,2 @@
@import '../../../common/css/theme/dark';
@import 'user.show.search';

View File

@ -0,0 +1,2 @@
@import '../../../common/css/theme/light';
@import 'user.show.search';

View File

@ -0,0 +1,2 @@
@import '../../../common/css/theme/transp';
@import 'user.show.search';

View File

@ -1,39 +1,39 @@
.search {
white-space: nowrap;
margin: 10px 0;
table {
display: inline-block;
box-sizing: border-box;
margin-left: 20px;
width: 360px;
&__form {
@extend %flex-center;
font-size: .9em;
white-space: nowrap;
margin: 1em 1em 1em 0;
table {
flex: 0 1 48%;
margin-left: 2%;
}
td {
padding: .4em 0;
}
input[type="text"],
select {
padding: .3em 1em!important;
}
label {
margin-right: 10px;
}
.single select {
width: 100%;
}
table .half {
float: left;
width: 49%;
padding-right: 1%;
text-align: right;
}
.action {
text-align: right;
}
}
tbody {
display: block;
}
table:first-child {
width: 400px;
}
.header {
font-size: 1.3em;
}
td {
padding: 5px 0;
}
label {
margin-right: 10px;
}
.single select {
width: 100%;
}
table .half {
float: left;
width: 49%;
padding-right: 1%;
&__status {
text-align: right;
padding: 1.5em;
border-bottom: $border;
}
}
.search-status {
text-align: right;
padding: 10px 25px;
border-bottom: $border;
}

View File

@ -2,7 +2,6 @@
@import 'header';
@import 'number-menu';
@import 'note-zone';
@import 'search';
.user-show {
&__social {