web/notify.moe
Code Issues Pull Requests Activity

Improved image loading

Browse Source
This commit is contained in:
Eduard Urbach
2018-03-20 22:39:21 +01:00
parent 858aec9719
commit 35f694bcda
18 changed files with 32 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
pages/anime/anime.pixy
View File

@ -8,7 +8,7 @@ component Anime(anime *arn.Anime, listItem *arn.AnimeListItem, tracks []*arn.Sou
component AnimeMainColumn(anime *arn.Anime, listItem *arn.AnimeListItem, tracks []*arn.SoundTrack, episodes []*arn.AnimeEpisode, user *arn.User)
.anime-header(data-id=anime.ID)
a.anime-image-container.mountable(href=anime.ImageLink("original"), target="_blank")
img.anime-cover-image.lazy(data-src=anime.ImageLink("large"), data-webp="true", data-color=anime.Image.AverageColor, alt=anime.Title.ByUser(user))
img.anime-cover-image.lazy(data-src=anime.ImageLink("large"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.ByUser(user))
.space
@ -149,7 +149,7 @@ component AnimeRelations(anime *arn.Anime, user *arn.User)
.anime-relations
each relation in anime.Relations().Items
a.anime-relation.mountable.ajax(href=relation.Anime().Link(), title=relation.Anime().Title.ByUser(user), data-mountable-type="relation")
img.anime-relation-image.lazy(data-src=relation.Anime().ImageLink("small"), data-webp="true", alt=relation.Anime().Title.ByUser(user))
img.anime-relation-image.lazy(data-src=relation.Anime().ImageLink("small"), data-webp="true", data-color=relation.Anime().AverageColor(), alt=relation.Anime().Title.ByUser(user))
.anime-relation-type= relation.HumanReadableType()
.anime-relation-year
if relation.Anime().StartDate != ""

2
pages/calendar/calendar.pixy
View File

@ -12,7 +12,7 @@ component Calendar(days []*utils.CalendarDay, user *arn.User)
.calendar-entries
each entry in day.Entries
a.calendar-entry.mountable.ajax(href=entry.Anime.Link(), data-mountable-type=day.Name, data-added=entry.Added)
img.calendar-entry-image.lazy(data-src=entry.Anime.ImageLink("small"), data-webp="true", alt=entry.Anime.Title.ByUser(user))
img.calendar-entry-image.lazy(data-src=entry.Anime.ImageLink("small"), data-webp="true", data-color=entry.Anime.AverageColor(), alt=entry.Anime.Title.ByUser(user))
.calendar-entry-info
.calendar-entry-title= entry.Anime.Title.ByUser(user)
.calendar-entry-time-and-episode

2
pages/character/character.pixy
View File

@ -14,7 +14,7 @@ component CharacterDetails(character *arn.Character, characterAnime []*arn.Anime
.character-anime
each anime in characterAnime
a.character-anime-item.ajax(href=anime.Link(), title=anime.Title.ByUser(user))
img.character-anime-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", alt=anime.Title.ByUser(user))
img.character-anime-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.ByUser(user))
if len(quotes) >0
h3 Quotes

2
pages/company/company.pixy
View File

@ -43,7 +43,7 @@ component CompanyAnime(label string, animes []*arn.Anime, user *arn.User)
.company-anime.mountable
each anime in animes
a.company-anime-item.ajax(href=anime.Link(), title=anime.Title.ByUser(user))
img.company-anime-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", alt=anime.Title.ByUser(user))
img.company-anime-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.ByUser(user))
component CompanyTabs(company *arn.Company, user *arn.User)
.tabs

2
pages/compare/animelist.pixy
View File

@ -20,7 +20,7 @@ component CompareAnimeList(a *arn.User, b *arn.User, countA int, countB int, com
tr.anime-list-item.mountable
td.anime-list-item-image-container
a.ajax(href=comparison.Anime.Link())
img.anime-list-item-image.lazy(data-src=comparison.Anime.ImageLink("small"), data-webp="true", alt=comparison.Anime.Title.ByUser(user))
img.anime-list-item-image.lazy(data-src=comparison.Anime.ImageLink("small"), data-webp="true", data-color=comparison.Anime.AverageColor(), alt=comparison.Anime.Title.ByUser(user))
td.anime-list-item-name
a.ajax(href=comparison.Anime.Link())= comparison.Anime.Title.ByUser(user)

2
pages/editanime/images.pixy
View File

@ -12,4 +12,4 @@ component EditAnimeImages(anime *arn.Anime)
InputImage("anime-image-input", "File", "/api/upload/anime/" + anime.ID + "/image")
.anime-image-container
img#anime-image-input-preview.anime-cover-image.lazy(data-src=anime.ImageLink("large"), data-webp="true", alt="Anime image")
img#anime-image-input-preview.anime-cover-image.lazy(data-src=anime.ImageLink("large"), data-webp="true", data-color=anime.AverageColor(), alt="Anime image")

2
pages/editor/mal.pixy
View File

@ -8,7 +8,7 @@ component CompareMAL(comparisons []*utils.MALComparison, year string, status str
.data-comparison.mountable
.data-comparison-header
a.data-comparison-image-container(href=comparison.Anime.Link(), target="_blank")
img.data-comparison-image.lazy(data-src=comparison.Anime.ImageLink("small"), data-webp="true", alt=comparison.Anime.Title.ByUser(user))
img.data-comparison-image.lazy(data-src=comparison.Anime.ImageLink("small"), data-webp="true", data-color=comparison.Anime.AverageColor(), alt=comparison.Anime.Title.ByUser(user))
.data-comparison-title
a(href=comparison.Anime.Link(), target="_blank")= comparison.Anime.Title.Canonical

2
pages/episode/episode.pixy
View File

@ -3,7 +3,7 @@ component AnimeEpisode(anime *arn.Anime, episode *arn.AnimeEpisode, user *arn.Us
.episode-view-image-container
a.ajax(href=anime.Link(), title=anime.Title.ByUser(user))
img.anime-cover-image.lazy(data-src=anime.ImageLink("large"), data-webp="true", alt=anime.Title.ByUser(user))
img.anime-cover-image.lazy(data-src=anime.ImageLink("large"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.ByUser(user))
h3.episode-view-number= "Episode " + strconv.Itoa(episode.Number)

2
pages/profile/profile.pixy
View File

@ -8,7 +8,7 @@ component Profile(viewUser *arn.User, user *arn.User, animeList *arn.AnimeList,
each item in animeList.Items
if item.Status == arn.AnimeListStatusWatching || item.Status == arn.AnimeListStatusCompleted
a.profile-watching-list-item.ajax(href=item.Anime().Link(), title=item.Anime().Title.ByUser(user) + " (" + toString(item.Episodes) + " / " + arn.EpisodesToString(item.Anime().EpisodeCount) + ")")
img.profile-watching-list-item-image.lazy(data-src=item.Anime().ImageLink("small"), data-webp="true", data-color=item.Anime().Image.AverageColor, alt=item.Anime().Title.ByUser(user))
img.profile-watching-list-item-image.lazy(data-src=item.Anime().ImageLink("small"), data-webp="true", data-color=item.Anime().AverageColor(), alt=item.Anime().Title.ByUser(user))
.footer
.buttons

2
pages/quote/quote.pixy
View File

@ -58,4 +58,4 @@ component QuoteTabs(quote *arn.Quote, user *arn.User)
component QuoteAnime(anime *arn.Anime, user *arn.User)
a.quote-anime-list-item.ajax(href=anime.Link(), title=anime.Title.ByUser(user))
img.quote-anime-list-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", alt=anime.Title.ByUser(user))
img.quote-anime-list-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.ByUser(user))

2
pages/search/search.pixy
View File

@ -65,7 +65,7 @@ component AnimeSearchResults(animes []*arn.Anime)
.profile-watching-list.anime-search
each anime in animes
a.profile-watching-list-item.mountable.ajax(href=anime.Link(), title=anime.Title.Canonical, data-mountable-type="anime")
img.anime-cover-image.anime-search-result.lazy(data-src=anime.ImageLink("small"), data-webp="true", alt=anime.Title.Canonical)
img.anime-cover-image.anime-search-result.lazy(data-src=anime.ImageLink("small"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.Canonical)
component CharacterSearchResults(characters []*arn.Character)
if len(characters) == 0

2
pages/soundtrack/soundtrack.pixy
View File

@ -26,7 +26,7 @@ component SoundTrackPage(track *arn.SoundTrack, user *arn.User)
.soundtrack-anime-list
each anime in track.Anime()
a.soundtrack-anime-list-item.ajax(href=anime.Link(), title=anime.Title.ByUser(user))
img.soundtrack-anime-list-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", alt=anime.Title.ByUser(user))
img.soundtrack-anime-list-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.ByUser(user))
if len(track.Links) > 0
.widget.mountable