web/notify.moe
Code Issues Pull Requests Activity

Improved editor list display

Browse Source
This commit is contained in:
Eduard Urbach 2018-03-22 20:15:21 +01:00
parent f7d58fd4e9
commit fca33e240c
16 changed files with 71 additions and 93 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
layout/sidebar/audioplayer.scarlet
View File

@ -14,8 +14,8 @@
margin-top 0.8rem margin-top 0.8rem
#audio-player-anime-link #audio-player-anime-link
width 142px width anime-image-medium-width
height 142px height anime-image-medium-width
overflow-y hidden overflow-y hidden
border-radius 3px border-radius 3px
opacity 0.75 opacity 0.75

17
mixins/AnimeEditorList.pixy
View File

@ -1,15 +1,14 @@
component AnimeEditorListFull(title string, missing []*arn.Anime, count int, pageURI string, generateSearchLink func(*arn.Anime) string) component AnimeEditorListFull(title string, missing []*arn.Anime, count int, pageURI string, generateSearchLink func(*arn.Anime) string)
EditorTabs(pageURI) EditorTabs(pageURI)
h1.editor-list-title.mountable= title h1.editor-list-page-title.mountable= title
.footer.editor-list-entry-count.mountable= strconv.Itoa(count) + " anime" .footer.editor-list-entry-count.mountable= strconv.Itoa(count) + " anime"
AnimeEditorList(missing, pageURI, generateSearchLink) AnimeEditorList(missing, pageURI, generateSearchLink)
component AnimeEditorList(animes []*arn.Anime, pageURI string, generateSearchLink func(*arn.Anime) string) component AnimeEditorList(animes []*arn.Anime, pageURI string, generateSearchLink func(*arn.Anime) string)
table table.editor-list
thead thead
tr.mountable tr.mountable
th(title="Popularity") Pop. th Score
th Image
th Title th Title
th Type th Type
th Year th Year
@ -19,15 +18,15 @@ component AnimeEditorList(animes []*arn.Anime, pageURI string, generateSearchLin
tbody tbody
each anime in animes each anime in animes
tr.mountable tr.mountable
td= anime.Popularity.Total() td= anime.ScoreHumanReadable()
td td
img.anime-list-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.Canonical) a(href=anime.Link(), target="_blank", rel="noopener")
td img.anime-list-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.Canonical)
a(href=anime.Link(), target="_blank", rel="noopener")= anime.Title.Canonical span= anime.Title.Canonical
td= anime.Type td= anime.Type
td td
if len(anime.StartDate) >= 4 if len(anime.StartDate) >= 4
a.ajax(href=pageURI + "/" + anime.StartDate[:4])= anime.StartDate[:4] a.ajax(href=strings.TrimPrefix(pageURI, "/_") + "/" + anime.StartDate[:4])= anime.StartDate[:4]
if generateSearchLink != nil if generateSearchLink != nil
td td

2
pages/animelist/animelist.scarlet
View File

@ -24,7 +24,7 @@
.anime-list-item-image-container .anime-list-item-image-container
padding 0 padding 0
width 39px width anime-image-tiny-width
.anime-list-item-image-link .anime-list-item-image-link
display flex display flex

6
pages/editor/editor.scarlet
View File

@ -1,6 +1,10 @@
.editor-list-title .editor-list-page-title
margin-bottom 0 margin-bottom 0
.editor-list
img
margin-right 1rem
.editor-list-entry-count .editor-list-entry-count
margin-top 0 margin-top 0

20
pages/editor/anilist.go → pages/editor/filteranime/anilist.go
View File

@ -1,8 +1,6 @@
package editor package filteranime
import ( import (
"sort"
"github.com/aerogo/aero" "github.com/aerogo/aero"
"github.com/animenotifier/arn" "github.com/animenotifier/arn"
"github.com/animenotifier/notify.moe/components" "github.com/animenotifier/notify.moe/components"
@ -27,19 +25,7 @@ func AniList(ctx *aero.Context) string {
return anime.GetMapping("anilist/anime") == "" return anime.GetMapping("anilist/anime") == ""
}) })
sort.Slice(missing, func(i, j int) bool { arn.SortAnimeByQuality(missing)
a := missing[i]
b := missing[j]
aPop := a.Popularity.Total()
bPop := b.Popularity.Total()
if aPop == bPop {
return a.Title.Canonical < b.Title.Canonical
}
return aPop > bPop
})
count := len(missing) count := len(missing)
@ -48,7 +34,7 @@ func AniList(ctx *aero.Context) string {
} }
return ctx.HTML(components.AnimeEditorListFull( return ctx.HTML(components.AnimeEditorListFull(
"Anime without Anilist links", "Anime without Anilist mappings",
missing, missing,
count, count,
ctx.URI(), ctx.URI(),

18
pages/editor/genres.go → pages/editor/filteranime/genres.go
View File

@ -1,8 +1,6 @@
package editor package filteranime
import ( import (
"sort"
"github.com/aerogo/aero" "github.com/aerogo/aero"
"github.com/animenotifier/arn" "github.com/animenotifier/arn"
"github.com/animenotifier/notify.moe/components" "github.com/animenotifier/notify.moe/components"
@ -27,19 +25,7 @@ func Genres(ctx *aero.Context) string {
return len(anime.Genres) == 0 return len(anime.Genres) == 0
}) })
sort.Slice(missing, func(i, j int) bool { arn.SortAnimeByQuality(missing)
a := missing[i]
b := missing[j]
aPop := a.Popularity.Total()
bPop := b.Popularity.Total()
if aPop == bPop {
return a.Title.Canonical < b.Title.Canonical
}
return aPop > bPop
})
count := len(missing) count := len(missing)

2
pages/editor/lowresimages.go → pages/editor/filteranime/lowresimages.go
View File

@ -1,4 +1,4 @@
package editor package filteranime
import ( import (
"github.com/aerogo/aero" "github.com/aerogo/aero"

20
pages/editor/shoboi.go → pages/editor/filteranime/shoboi.go
View File

@ -1,8 +1,6 @@
package editor package filteranime
import ( import (
"sort"
"github.com/aerogo/aero" "github.com/aerogo/aero"
"github.com/animenotifier/arn" "github.com/animenotifier/arn"
"github.com/animenotifier/notify.moe/components" "github.com/animenotifier/notify.moe/components"
@ -27,19 +25,7 @@ func Shoboi(ctx *aero.Context) string {
return anime.GetMapping("shoboi/anime") == "" return anime.GetMapping("shoboi/anime") == ""
}) })
sort.Slice(missing, func(i, j int) bool { arn.SortAnimeByQuality(missing)
a := missing[i]
b := missing[j]
aPop := a.Popularity.Total()
bPop := b.Popularity.Total()
if aPop == bPop {
return a.Title.Canonical < b.Title.Canonical
}
return aPop > bPop
})
count := len(missing) count := len(missing)
@ -48,7 +34,7 @@ func Shoboi(ctx *aero.Context) string {
} }
return ctx.HTML(components.AnimeEditorListFull( return ctx.HTML(components.AnimeEditorListFull(
"Anime without Shoboi links", "Anime without Shoboi mappings",
missing, missing,
count, count,
ctx.URI(), ctx.URI(),

4
pages/editor/filtercompanies/filtercompanies.pixy
View File

@ -1,9 +1,9 @@
component CompaniesEditorList(companies []*arn.Company, count int, url string) component CompaniesEditorList(companies []*arn.Company, count int, url string)
EditorTabs(url) EditorTabs(url)
h1.editor-list-title.mountable Companies without a description h1.editor-list-page-title.mountable Companies without a description
.footer.editor-list-entry-count.mountable= strconv.Itoa(count) + " companies" .footer.editor-list-entry-count.mountable= strconv.Itoa(count) + " companies"
table table.editor-list
thead thead
tr.mountable tr.mountable
th Name th Name

4
pages/genres/genres.scarlet
View File

@ -6,8 +6,8 @@
flip-card flip-card
.genre-squared .genre-squared
width 142px width anime-image-medium-width
height 142px height anime-image-medium-width
.genre-text .genre-text
grid-text grid-text

31
pages/index.go
View File

@ -22,6 +22,7 @@ import (
"github.com/animenotifier/notify.moe/pages/editanime" "github.com/animenotifier/notify.moe/pages/editanime"
"github.com/animenotifier/notify.moe/pages/editlog" "github.com/animenotifier/notify.moe/pages/editlog"
"github.com/animenotifier/notify.moe/pages/editor" "github.com/animenotifier/notify.moe/pages/editor"
"github.com/animenotifier/notify.moe/pages/editor/filteranime"
"github.com/animenotifier/notify.moe/pages/editor/filtercompanies" "github.com/animenotifier/notify.moe/pages/editor/filtercompanies"
"github.com/animenotifier/notify.moe/pages/embed" "github.com/animenotifier/notify.moe/pages/embed"
"github.com/animenotifier/notify.moe/pages/episode" "github.com/animenotifier/notify.moe/pages/episode"
@ -248,21 +249,21 @@ func Configure(app *aero.Application) {
l.Page("/editor", editor.Get) l.Page("/editor", editor.Get)
// Editor - Anime // Editor - Anime
l.Page("/editor/anime/missing/anilist", editor.AniList) l.Page("/editor/anime/missing/anilist", filteranime.AniList)
l.Page("/editor/anime/missing/anilist/:year", editor.AniList) l.Page("/editor/anime/missing/anilist/:year", filteranime.AniList)
l.Page("/editor/anime/missing/anilist/:year/:type", editor.AniList) l.Page("/editor/anime/missing/anilist/:year/:type", filteranime.AniList)
l.Page("/editor/anime/missing/shoboi", editor.Shoboi) l.Page("/editor/anime/missing/shoboi", filteranime.Shoboi)
l.Page("/editor/anime/missing/shoboi/:year", editor.Shoboi) l.Page("/editor/anime/missing/shoboi/:year", filteranime.Shoboi)
l.Page("/editor/anime/missing/shoboi/:year/:type", editor.Shoboi) l.Page("/editor/anime/missing/shoboi/:year/:type", filteranime.Shoboi)
l.Page("/editor/anime/missing/genres", editor.Genres) l.Page("/editor/anime/missing/genres", filteranime.Genres)
l.Page("/editor/anime/missing/genres/:year", editor.Genres) l.Page("/editor/anime/missing/genres/:year", filteranime.Genres)
l.Page("/editor/anime/missing/genres/:year/:type", editor.Genres) l.Page("/editor/anime/missing/genres/:year/:type", filteranime.Genres)
l.Page("/editor/anime/lowresimage", editor.LowResolutionAnimeImages) l.Page("/editor/anime/lowresimage", filteranime.LowResolutionAnimeImages)
l.Page("/editor/anime/lowresimage/:year", editor.LowResolutionAnimeImages) l.Page("/editor/anime/lowresimage/:year", filteranime.LowResolutionAnimeImages)
l.Page("/editor/anime/lowresimage/:year/:type", editor.LowResolutionAnimeImages) l.Page("/editor/anime/lowresimage/:year/:type", filteranime.LowResolutionAnimeImages)
l.Page("/editor/anime/ultralowresimage", editor.UltraLowResolutionAnimeImages) l.Page("/editor/anime/ultralowresimage", filteranime.UltraLowResolutionAnimeImages)
l.Page("/editor/anime/ultralowresimage/:year", editor.UltraLowResolutionAnimeImages) l.Page("/editor/anime/ultralowresimage/:year", filteranime.UltraLowResolutionAnimeImages)
l.Page("/editor/anime/ultralowresimage/:year/:type", editor.UltraLowResolutionAnimeImages) l.Page("/editor/anime/ultralowresimage/:year/:type", filteranime.UltraLowResolutionAnimeImages)
// Editor - MALdiff // Editor - MALdiff
l.Page("/editor/anime/maldiff", editor.CompareMAL) l.Page("/editor/anime/maldiff", editor.CompareMAL)

4
pages/search/search.scarlet
View File

@ -7,8 +7,8 @@
horizontal-wrap horizontal-wrap
.anime-search-result .anime-search-result
width 55px !important width anime-image-small-width !important
height 78px !important height anime-image-small-height !important
.forum-search-results .forum-search-results
horizontal-wrap horizontal-wrap

4
pages/soundtracks/soundtracks.scarlet
View File

@ -131,6 +131,6 @@ animation change-color
display block display block
.soundtrack-anime-image .soundtrack-anime-image
width 142px width anime-image-medium-width
height 200px height anime-image-medium-height
object-fit cover object-fit cover

5
styles/grid.scarlet
View File

@ -5,8 +5,9 @@ mixin grid
mixin grid-cell mixin grid-cell
position relative position relative
width 142px width anime-image-medium-width
height 200px height anime-image-medium-height
max-width anime-image-medium-width
// min-width 90px // min-width 90px
// min-height 127px // min-height 127px
border-radius 3px border-radius 3px

9
styles/include/config.scarlet
View File

@ -101,6 +101,15 @@ const content-line-height = 1.7em
const typography-margin = 0.4rem const typography-margin = 0.4rem
// Sizes // Sizes
const anime-image-tiny-width = 39px
const anime-image-tiny-height = 39px
const anime-image-small-width = 55px
const anime-image-small-height = 78px
const anime-image-medium-width = 142px
const anime-image-medium-height = 200px
const anime-image-large-width = 250px const anime-image-large-width = 250px
const anime-image-large-height = 350px const anime-image-large-height = 350px

14
styles/include/mixins.scarlet
View File

@ -63,16 +63,22 @@ mixin anime-generic-item-image
filter saturate(1.3) filter saturate(1.3)
mixin anime-mini-item-image mixin anime-mini-item-image
width 55px !important width anime-image-small-width !important
height 78px !important height anime-image-small-height !important
anime-generic-item-image anime-generic-item-image
// Make it easier for the browser to layout by specifying max-width as well
max-width anime-image-small-width
mixin anime-list-item-image mixin anime-list-item-image
width 39px width anime-image-tiny-width
height 39px height anime-image-tiny-height
border-radius 2px border-radius 2px
object-fit cover object-fit cover
// Make it easier for the browser to layout by specifying max-width as well
max-width anime-image-tiny-width
mixin sidebar mixin sidebar
vertical vertical
margin-left 0 margin-left 0