more infinite-scroll integration

js-sound-v2
Thibault Duplessis 2020-09-11 18:12:24 +02:00
parent f3d1408e98
commit 48d031bfbd
16 changed files with 41 additions and 62 deletions

View File

@ -35,7 +35,7 @@ object index {
h2("Previous blog posts")
)
},
div(cls := "blog-cards list infinitescroll")(
div(cls := "blog-cards list infinite-scroll")(
pager.currentPageResults flatMap MiniPost.fromDocument("blog", "wide") map { post =>
primaryPost.fold(true)(_.id != post.id) option bits.postCard(post, "paginated".some, h3)
},

View File

@ -1,15 +1,14 @@
package views.html
package coach
import controllers.routes
import play.api.i18n.Lang
import lila.api.Context
import lila.app.templating.Environment._
import lila.app.ui.ScalatagsTemplate._
import lila.i18n.LangList
import lila.common.paginator.Paginator
import controllers.routes
import lila.i18n.LangList
object index {
@ -72,7 +71,7 @@ object index {
)
)
),
div(cls := "list infinitescroll")(
div(cls := "list infinite-scroll")(
pager.currentPageResults.map { c =>
st.article(cls := "coach-widget paginated", attr("data-dedup") := c.coach.id.value)(
widget(c, link = true)
@ -82,9 +81,7 @@ object index {
pager,
np =>
addQueryParameter(routes.Coach.search(lang.fold("all")(_.code), order.key).url, "page", np)
).map {
frag(_, div(cls := "none")) // don't break the even/odd CSS flow
}
)
)
)
)

View File

@ -28,8 +28,7 @@ object search {
strong(cls := "nb-results box__pad")(pager.nbResults, " posts found"),
table(cls := "slist slist-pad search__results")(
if (pager.nbResults > 0)
tbody(cls := "infinitescroll")(
pagerNextTable(pager, n => routes.ForumPost.search(text, n).url) | tr,
tbody(cls := "infinite-scroll")(
pager.currentPageResults.map { view =>
tr(cls := "paginated")(
td(
@ -48,7 +47,8 @@ object search {
authorLink(view.post)
)
)
}
},
pagerNextTable(pager, n => routes.ForumPost.search(text, n).url)
)
else tbody(tr(td("No forum post found")))
)

View File

@ -66,8 +66,7 @@ object bits {
private def pagTable(pager: Paginator[Related], call: Call)(implicit ctx: Context) =
table(cls := "slist")(
if (pager.nbResults > 0)
tbody(cls := "infinitescroll")(
pagerNextTable(pager, np => addQueryParameter(call.url, "page", np)),
tbody(cls := "infinite-scroll")(
pager.currentPageResults.map { r =>
tr(cls := "paginated")(
td(userLink(r.user)),
@ -75,7 +74,8 @@ object bits {
td(trans.nbGames.pluralSame(r.user.count.game)),
td(actions(r.user.id, relation = r.relation, followable = r.followable, blocked = false))
)
}
},
pagerNextTable(pager, np => addQueryParameter(call.url, "page", np))
)
else tbody(tr(td(colspan := 2)("None found.", br)))
)

View File

@ -50,7 +50,7 @@ object index {
},
st.section(
h2(completed()),
div(cls := "infinitescroll")(
div(cls := "infinite-scroll")(
pager.currentPageResults.map { show.widget(_, "paginated") },
pagerNext(pager, np => addQueryParameter(url.url, "page", np))
)

View File

@ -84,8 +84,8 @@ object index {
permalink
),
div(cls := "search__rows")(
pagerNext(pager, np => routes.Search.index(np).url),
views.html.game.widgets(pager.currentPageResults)
views.html.game.widgets(pager.currentPageResults),
pagerNext(pager, np => routes.Search.index(np).url)
)
)
else

View File

@ -1,6 +1,7 @@
package views.html.streamer
import controllers.routes
import lila.api.Context
import lila.app.templating.Environment._
import lila.app.ui.ScalatagsTemplate._
@ -75,7 +76,7 @@ object index {
st.article(cls := "streamer")(widget(s.withoutStream, s.stream))
}
),
div(cls := "list infinitescroll")(
div(cls := "list infinite-scroll")(
(live.size % 2 == 1) option div(cls := "none"),
pager.currentPageResults.map { s =>
st.article(cls := "streamer paginated", dataDedup := s.streamer.id.value)(widget(s, none))
@ -88,9 +89,7 @@ object index {
"requests",
if (requests) 1 else 0
)
).map {
frag(_, div(cls := "none")) // don't break the even/odd CSS flow
}
)
)
)
)

View File

@ -120,7 +120,7 @@ object list {
p(trans.study.noneYet())
)
else
div(cls := "studies list infinitescroll")(
div(cls := "studies list infinite-scroll")(
pager.currentPageResults.map { s =>
div(cls := "study paginated")(bits.widget(s))
},

View File

@ -164,11 +164,11 @@ object show {
t.enabled option div(cls := "team-show__members")(
st.section(cls := "recent-members")(
h2(teamRecentMembers()),
div(cls := "userlist infinitescroll")(
pagerNext(members, np => routes.Team.show(t.id, np).url),
div(cls := "userlist infinite-scroll")(
members.currentPageResults.map { member =>
div(cls := "paginated")(lightUserLink(member))
}
},
pagerNext(members, np => routes.Team.show(t.id, np).url)
)
)
)

View File

@ -1,6 +1,7 @@
package views.html
package tournament
import controllers.routes
import play.api.data.Form
import lila.api.Context
@ -10,8 +11,6 @@ import lila.common.paginator.Paginator
import lila.tournament.crud.CrudForm
import lila.tournament.{ Tournament, TournamentForm }
import controllers.routes
object crud {
private def layout(title: String, evenMoreJs: Frag = emptyFrag, css: String = "mod.misc")(
@ -148,17 +147,7 @@ object crud {
th()
)
),
tbody(cls := "infinitescroll")(
tours.nextPage.map { n =>
frag(
tr(
th(cls := "pager none")(
a(rel := "next", href := routes.TournamentCrud.index(n))("Next")
)
),
tr()
)
},
tbody(cls := "infinite-scroll")(
tours.currentPageResults.map { tour =>
tr(cls := "paginated")(
td(
@ -174,7 +163,8 @@ object crud {
td(showDateTimeUTC(tour.startsAt), " ", momentFromNow(tour.startsAt)),
td(a(href := routes.Tournament.show(tour.id), dataIcon := "v", title := "View on site"))
)
}
},
pagerNextTable(tours, np => routes.TournamentCrud.index(np).url)
)
)
)

View File

@ -27,9 +27,9 @@ object history {
h1(freq.name, " tournaments"),
div(cls := "arena-list")(
table(cls := "slist slist-pad")(
tbody(cls := "infinitescroll")(
pagerNextTable(pager, p => routes.Tournament.history(freq.name, p).url),
pager.currentPageResults map finishedList.apply
tbody(cls := "infinite-scroll")(
pager.currentPageResults map finishedList.apply,
pagerNextTable(pager, p => routes.Tournament.history(freq.name, p).url)
)
)
)

View File

@ -41,10 +41,8 @@ object gamesContent {
permalink
),
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)
views.html.game.widgets(pager.currentPageResults, user = u.some, ownerLink = ctx is u),
pagerNext(pager, np => routes.User.games(u.username, filterName, np).url)
)
)
else
@ -56,16 +54,16 @@ object gamesContent {
} else
div(
cls := List(
"games infinitescroll" -> true,
"now-playing center" -> (filterName == "playing" && pager.nbResults > 2)
"games infinite-scroll" -> true,
"now-playing center" -> (filterName == "playing" && pager.nbResults > 2)
)
)(
pagerNext(pager, np => routes.User.games(u.username, filterName, np).url) | div(cls := "none"),
if (filterName == "playing" && pager.nbResults > 2)
pager.currentPageResults.flatMap { Pov(_, u) }.map { pov =>
views.html.game.mini(pov)(ctx)(cls := "paginated")
}
else views.html.game.widgets(pager.currentPageResults, user = u.some, ownerLink = ctx is u)
else views.html.game.widgets(pager.currentPageResults, user = u.some, ownerLink = ctx is u),
pagerNext(pager, np => routes.User.games(u.username, filterName, np).url)
)
)
)

View File

@ -46,15 +46,9 @@ object bits {
" found"
)
),
div(cls := "list infinitescroll box__pad")(
div(cls := "list infinite-scroll box__pad")(
videos.currentPageResults.map { card(_, control) },
videos.nextPage.map { next =>
div(cls := "pager none")(
a(rel := "next", href := s"${routes.Video.author(name)}?${control.queryString}&page=$next")(
"Next"
)
)
}
pagerNext(videos, np => s"${routes.Video.author(name)}?${control.queryString}&page=$np")
)
)

View File

@ -45,7 +45,7 @@ object index {
strong(count),
" videos so far!"
),
div(cls := "list box__pad infinitescroll")(
div(cls := "list box__pad infinite-scroll")(
videos.currentPageResults.map { bits.card(_, control) },
videos.currentPageResults.sizeIs < 4 option div(cls := s"not_much nb_${videos.nbResults}")(
if (videos.currentPageResults.isEmpty) "No videos for these tags:"

View File

@ -33,6 +33,7 @@ bad {
color: $c-bad;
}
.pager .spinner {
.pager {
text-align: center;
margin: 10px auto;
}

View File

@ -7,7 +7,7 @@ export default function InfiniteScroll(selector: string) {
});
}
function register(el: HTMLElement, selector: string) {
function register(el: HTMLElement, selector: string, backoff: number = 500) {
const nav = el.querySelector('.pager') as HTMLAnchorElement | null,
next = nav?.querySelector('.pager a') as HTMLAnchorElement | null,
@ -30,7 +30,7 @@ function register(el: HTMLElement, selector: string) {
nav.remove();
$(el).append($(html).find(selector).html());
window.lichess.contentLoaded(el);
setTimeout(() => register(el, selector), 500); // recursion without bursts
setTimeout(() => register(el, selector, backoff * 1.05), backoff); // recursion with backoff
})
.catch(e => {
console.log(e);