diff --git a/pages/animelist/animelist.go b/pages/animelist/animelist.go index 3f9df413..c5daf656 100644 --- a/pages/animelist/animelist.go +++ b/pages/animelist/animelist.go @@ -28,5 +28,5 @@ func Get(ctx *aero.Context) string { animeList.PrefetchAnime() animeList.Sort() - return ctx.HTML(components.AnimeLists(animeList.SplitByStatus(), animeList.User(), user)) + return ctx.HTML(components.AnimeLists(animeList.SplitByStatus(), animeList.User(), user, ctx.URI())) } diff --git a/pages/animelist/animelist.pixy b/pages/animelist/animelist.pixy index 23b04269..7e33b3e2 100644 --- a/pages/animelist/animelist.pixy +++ b/pages/animelist/animelist.pixy @@ -1,5 +1,5 @@ -component AnimeLists(animeLists map[string]*arn.AnimeList, viewUser *arn.User, user *arn.User) - ProfileHeader(viewUser, user) +component AnimeLists(animeLists map[string]*arn.AnimeList, viewUser *arn.User, user *arn.User, uri string) + ProfileHeader(viewUser, user, uri) h2.page-title.anime-list-owner= viewUser.Nick + "'s collection" @@ -49,8 +49,8 @@ component AnimeList(animeList *arn.AnimeList, viewUser *arn.User, user *arn.User if user != nil th.anime-list-item-actions Actions tbody - for i, item := range animeList.Items - tr(class=utils.ItemCSSClass(animeList, i), title=item.Notes, data-api="/api/animelist/" + animeList.UserID + "/update/" + item.AnimeID) + each item in animeList.Items + tr.anime-list-item.mountable(title=item.Notes, data-api="/api/animelist/" + animeList.UserID + "/update/" + item.AnimeID) td.anime-list-item-name a.ajax(href=item.Link(animeList.User().Nick))= item.Anime().Title.Canonical td.anime-list-item-airing-date diff --git a/pages/animelist/animelist.scarlet b/pages/animelist/animelist.scarlet index 5222ae79..e47f72aa 100644 --- a/pages/animelist/animelist.scarlet +++ b/pages/animelist/animelist.scarlet @@ -71,4 +71,7 @@ < 1100px .anime-list-item-rating - display none \ No newline at end of file + display none + +.fill-screen + min-height calc(100vh - nav-height - content-padding * 2 - 1rem - 43px - 23px) \ No newline at end of file diff --git a/pages/animelist/status.go b/pages/animelist/status.go index 0db10e03..cf66fd4a 100644 --- a/pages/animelist/status.go +++ b/pages/animelist/status.go @@ -19,7 +19,7 @@ func FilterByStatus(status string) aero.Handle { return response } - return ctx.HTML(components.AnimeListFilteredByStatus(list, list.User(), user)) + return ctx.HTML(components.AnimeListFilteredByStatus(list, list.User(), user, status, ctx.URI())) } } diff --git a/pages/animelist/watching.pixy b/pages/animelist/status.pixy similarity index 54% rename from pages/animelist/watching.pixy rename to pages/animelist/status.pixy index 6073b83f..4b30fa3b 100644 --- a/pages/animelist/watching.pixy +++ b/pages/animelist/status.pixy @@ -1,8 +1,9 @@ -component AnimeListFilteredByStatus(animeList *arn.AnimeList, viewUser *arn.User, user *arn.User) - ProfileHeader(viewUser, user) +component AnimeListFilteredByStatus(animeList *arn.AnimeList, viewUser *arn.User, user *arn.User, status string, uri string) + ProfileHeader(viewUser, user, uri) if len(animeList.Items) == 0 p.no-data.mountable= viewUser.Nick + " hasn't added any anime to this list yet." else - .anime-list-container + .anime-list-container.fill-screen + h3.status-name= arn.ListItemStatusName(status) AnimeList(animeList, viewUser, user) \ No newline at end of file diff --git a/pages/profile/posts.go b/pages/profile/posts.go index d2668f45..c4fa922c 100644 --- a/pages/profile/posts.go +++ b/pages/profile/posts.go @@ -35,6 +35,6 @@ func GetPostsByUser(ctx *aero.Context) string { postables[i] = arn.ToPostable(post) } - return ctx.HTML(components.LatestPosts(postables, viewUser, utils.GetUser(ctx))) + return ctx.HTML(components.LatestPosts(postables, viewUser, utils.GetUser(ctx), ctx.URI())) } diff --git a/pages/profile/posts.pixy b/pages/profile/posts.pixy index e6a4e9de..6db5da81 100644 --- a/pages/profile/posts.pixy +++ b/pages/profile/posts.pixy @@ -1,5 +1,5 @@ -component LatestPosts(postables []arn.Postable, viewUser *arn.User, user *arn.User) - ProfileHeader(viewUser, user) +component LatestPosts(postables []arn.Postable, viewUser *arn.User, user *arn.User, uri string) + ProfileHeader(viewUser, user, uri) if len(postables) > 0 h2.page-title= len(postables), " latest posts by ", postables[0].Author().Nick diff --git a/pages/profile/profile.go b/pages/profile/profile.go index a06deee9..f809b69b 100644 --- a/pages/profile/profile.go +++ b/pages/profile/profile.go @@ -1,6 +1,8 @@ package profile import ( + "sort" + "github.com/aerogo/aero" "github.com/aerogo/flow" "github.com/animenotifier/arn" @@ -36,7 +38,12 @@ func Profile(ctx *aero.Context, viewUser *arn.User) string { }, func() { animeList = viewUser.AnimeList() animeList.PrefetchAnime() + + // Sort by rating + sort.Slice(animeList.Items, func(i, j int) bool { + return animeList.Items[i].Rating.Overall > animeList.Items[j].Rating.Overall + }) }) - return ctx.HTML(components.Profile(viewUser, user, animeList, threads, posts, tracks)) + return ctx.HTML(components.Profile(viewUser, user, animeList, threads, posts, tracks, ctx.URI())) } diff --git a/pages/profile/profile.pixy b/pages/profile/profile.pixy index 9e245cb2..0cfce420 100644 --- a/pages/profile/profile.pixy +++ b/pages/profile/profile.pixy @@ -1,4 +1,4 @@ -component ProfileHeader(viewUser *arn.User, user *arn.User) +component ProfileHeader(viewUser *arn.User, user *arn.User, uri string) .profile img.profile-cover(src=viewUser.CoverImageURL(), alt="Cover image") @@ -44,9 +44,9 @@ component ProfileHeader(viewUser *arn.User, user *arn.User) Icon("rocket") span= arn.Capitalize(viewUser.Role) - ProfileNavigation(viewUser) + ProfileNavigation(viewUser, uri) -component ProfileNavigation(viewUser *arn.User) +component ProfileNavigation(viewUser *arn.User, uri string) .buttons.tabs a.button.tab.action(href="/+" + viewUser.Nick, data-action="diff", data-trigger="click") Icon("th") @@ -68,32 +68,33 @@ component ProfileNavigation(viewUser *arn.User) Icon("music") span.tab-text Tracks - //- StatusTabs("/+" + viewUser.Nick + "/animelist") + //- if strings.Contains(uri, "/animelist") + //- StatusTabs("/+" + viewUser.Nick + "/animelist") component StatusTabs(urlPrefix string) - .buttons.tabs - a.button.tab.action(href=urlPrefix + "/watching", data-action="diff", data-trigger="click") + .buttons.tabs.status-tabs + a.button.status-tab.action(href=urlPrefix + "/watching", data-action="diff", data-trigger="click") Icon("play") span.tab-text Watching - a.button.tab.action(href=urlPrefix + "/completed", data-action="diff", data-trigger="click") + a.button.status-tab.action(href=urlPrefix + "/completed", data-action="diff", data-trigger="click") Icon("check") span.tab-text Completed - a.button.tab.action(href=urlPrefix + "/planned", data-action="diff", data-trigger="click") + a.button.status-tab.action(href=urlPrefix + "/planned", data-action="diff", data-trigger="click") Icon("forward") span.tab-text Planned - a.button.tab.action(href=urlPrefix + "/hold", data-action="diff", data-trigger="click") + a.button.status-tab.action(href=urlPrefix + "/hold", data-action="diff", data-trigger="click") Icon("pause") span.tab-text On Hold - a.button.tab.action(href=urlPrefix + "/dropped", data-action="diff", data-trigger="click") + a.button.status-tab.action(href=urlPrefix + "/dropped", data-action="diff", data-trigger="click") Icon("stop") span.tab-text Dropped -component Profile(viewUser *arn.User, user *arn.User, animeList *arn.AnimeList, threads []*arn.Thread, posts []*arn.Post, tracks []*arn.SoundTrack) - ProfileHeader(viewUser, user) +component Profile(viewUser *arn.User, user *arn.User, animeList *arn.AnimeList, threads []*arn.Thread, posts []*arn.Post, tracks []*arn.SoundTrack, uri string) + ProfileHeader(viewUser, user, uri) if len(animeList.Items) == 0 p.no-data.mountable= viewUser.Nick + " hasn't added any anime yet." diff --git a/pages/profile/threads.go b/pages/profile/threads.go index b886c6bd..ef7fc169 100644 --- a/pages/profile/threads.go +++ b/pages/profile/threads.go @@ -27,5 +27,5 @@ func GetThreadsByUser(ctx *aero.Context) string { threads = threads[:maxThreads] } - return ctx.HTML(components.ProfileThreads(threads, viewUser, utils.GetUser(ctx))) + return ctx.HTML(components.ProfileThreads(threads, viewUser, utils.GetUser(ctx), ctx.URI())) } diff --git a/pages/profile/threads.pixy b/pages/profile/threads.pixy index daad69f8..2899cd14 100644 --- a/pages/profile/threads.pixy +++ b/pages/profile/threads.pixy @@ -1,5 +1,5 @@ -component ProfileThreads(threads []*arn.Thread, viewUser *arn.User, user *arn.User) - ProfileHeader(viewUser, user) +component ProfileThreads(threads []*arn.Thread, viewUser *arn.User, user *arn.User, uri string) + ProfileHeader(viewUser, user, uri) if len(threads) == 0 p.no-data.mountable= viewUser.Nick + " hasn't written any threads yet." diff --git a/pages/profile/tracks.go b/pages/profile/tracks.go index abf825a1..2b723403 100644 --- a/pages/profile/tracks.go +++ b/pages/profile/tracks.go @@ -27,6 +27,6 @@ func GetSoundTracksByUser(ctx *aero.Context) string { arn.SortSoundTracksLatestFirst(tracks) - return ctx.HTML(components.TrackList(tracks, viewUser, user)) + return ctx.HTML(components.TrackList(tracks, viewUser, user, ctx.URI())) } diff --git a/pages/profile/tracks.pixy b/pages/profile/tracks.pixy index 3adc47ee..ae49399b 100644 --- a/pages/profile/tracks.pixy +++ b/pages/profile/tracks.pixy @@ -1,5 +1,5 @@ -component TrackList(tracks []*arn.SoundTrack, viewUser *arn.User, user *arn.User) - ProfileHeader(viewUser, user) +component TrackList(tracks []*arn.SoundTrack, viewUser *arn.User, user *arn.User, uri string) + ProfileHeader(viewUser, user, uri) h2.page-title= "Tracks added by " + viewUser.Nick diff --git a/pages/profile/watching.scarlet b/pages/profile/watching.scarlet index 8c96643a..009c9d0e 100644 --- a/pages/profile/watching.scarlet +++ b/pages/profile/watching.scarlet @@ -10,6 +10,15 @@ height 78px !important border-radius 2px +// .status-tabs +// position fixed +// top 4.6rem +// right 1.6rem +// flex-direction column + +// .status-tab +// font-size 0.9rem + // < 380px // .profile-watching-list // justify-content center \ No newline at end of file diff --git a/scripts/Actions.ts b/scripts/Actions.ts index 875765a8..b5aafabc 100644 --- a/scripts/Actions.ts +++ b/scripts/Actions.ts @@ -83,7 +83,7 @@ export function diff(arn: AnimeNotifier, element: HTMLElement) { let url = element.dataset.url || (element as HTMLAnchorElement).getAttribute("href") arn.diff(url).then(() => { - const duration = 300.0 + const duration = 250.0 const steps = 60 const interval = duration / steps const fullSin = Math.PI / 2 diff --git a/scripts/AnimeNotifier.ts b/scripts/AnimeNotifier.ts index f76afcdd..57fe38ea 100644 --- a/scripts/AnimeNotifier.ts +++ b/scripts/AnimeNotifier.ts @@ -225,9 +225,11 @@ export class AnimeNotifier { modifyDelayed(className: string, func: (element: HTMLElement) => void) { const delay = 20 + const maxDelay = 1000 let time = 0 let start = Date.now() + let maxTime = start + maxDelay let collection = document.getElementsByClassName(className) let mutations = [] @@ -245,6 +247,10 @@ export class AnimeNotifier { time = mountableTypes[type] = start } + if(time > maxTime) { + time = maxTime + } + mutations.push({ element, time @@ -276,7 +282,7 @@ export class AnimeNotifier { diff(url: string) { if(url == this.app.currentPath) { - return + return Promise.reject(null) } let request = fetch("/_" + url, { @@ -292,7 +298,7 @@ export class AnimeNotifier { // Delay by transition-speed return delay(300).then(() => { - request + return request .then(html => this.app.setContent(html, true)) .then(() => this.app.markActiveLinks()) .then(() => this.app.emit("DOMContentLoaded")) diff --git a/styles/base.scarlet b/styles/base.scarlet index 2f16d1a9..3421b8bd 100644 --- a/styles/base.scarlet +++ b/styles/base.scarlet @@ -29,12 +29,6 @@ a // &.active // color link-active-color -strong - font-weight bold - -em - font-style italic - img backface-visibility hidden diff --git a/styles/include/config.scarlet b/styles/include/config.scarlet index 14decf4c..9621f35a 100644 --- a/styles/include/config.scarlet +++ b/styles/include/config.scarlet @@ -64,4 +64,5 @@ nav-height = 3.11rem // Timings fade-speed = 200ms -transition-speed = 250ms \ No newline at end of file +transition-speed = 250ms +mountable-transition-speed = 400ms diff --git a/styles/mountable.scarlet b/styles/mountable.scarlet index 6fb00d36..78becc67 100644 --- a/styles/mountable.scarlet +++ b/styles/mountable.scarlet @@ -1,5 +1,3 @@ -mountable-transition-speed = 400ms - .mountable opacity 0 transform translateY(0.85rem) diff --git a/styles/typography.scarlet b/styles/typography.scarlet index 81c3b08e..19ee435a 100644 --- a/styles/typography.scarlet +++ b/styles/typography.scarlet @@ -11,6 +11,18 @@ h2 margin-top content-padding margin-bottom content-padding +strong + font-weight bold + +em + font-style italic + +hr + border none + border-bottom 1px solid text-color + opacity 0.1 + margin-bottom content-padding + p > img max-width 100% border-radius 3px