Use time element
This commit is contained in:
parent
74d8f46b08
commit
ad3ac4d880
@ -10,6 +10,6 @@ component AMVFooter(amv *arn.AMV, user *arn.User)
|
||||
else
|
||||
a(href=amv.Link())= amv.Title.ByUser(user)
|
||||
span posted
|
||||
span.utc-date.no-tip(data-date=amv.Created)
|
||||
time.utc-date.no-tip(datetime=amv.Created)
|
||||
span by
|
||||
a(href=amv.Creator().Link())= amv.Creator().Nick + " "
|
||||
a(href=amv.Creator().Link())= amv.Creator().Nick + " "
|
||||
|
@ -17,7 +17,7 @@ component AnimeListScrollable(animeListItems []*arn.AnimeListItem, viewUser *arn
|
||||
|
||||
.anime-list-item-airing-date
|
||||
if item.Status != arn.AnimeListStatusCompleted && item.Anime().UpcomingEpisode() != nil
|
||||
span.utc-airing-date(data-start-date=item.Anime().UpcomingEpisode().Episode.AiringDate.Start, data-end-date=item.Anime().UpcomingEpisode().Episode.AiringDate.End, data-episode-number=item.Anime().UpcomingEpisode().Episode.Number)
|
||||
time.utc-airing-date(datetime=item.Anime().UpcomingEpisode().Episode.AiringDate.Start, data-end-date=item.Anime().UpcomingEpisode().Episode.AiringDate.End, data-episode-number=item.Anime().UpcomingEpisode().Episode.Number)
|
||||
|
||||
if item.Status != arn.AnimeListStatusCompleted
|
||||
.anime-list-item-episodes
|
||||
|
@ -34,7 +34,7 @@ component Postable(post arn.Postable, user *arn.User, includeReplies bool, showP
|
||||
a.post-action.post-header-action.tip(href=post.Link(), aria-label="Link")
|
||||
RawIcon("link")
|
||||
|
||||
.post-date.utc-date(data-date=post.GetCreated())
|
||||
time.post-date.utc-date(datetime=post.GetCreated())
|
||||
|
||||
.post-content(id="render-" + post.GetID())!= post.HTML()
|
||||
|
||||
|
@ -1,6 +1,6 @@
|
||||
component QuoteFooter(quote *arn.Quote)
|
||||
footer.quote-footer
|
||||
span posted
|
||||
span.utc-date.no-tip(data-date=quote.Created)
|
||||
time.utc-date.no-tip(datetime=quote.Created)
|
||||
span by
|
||||
a(href=quote.Creator().Link())= quote.Creator().Nick
|
||||
a(href=quote.Creator().Link())= quote.Creator().Nick
|
||||
|
@ -34,6 +34,6 @@ component SoundTrackFooter(track *arn.SoundTrack, user *arn.User)
|
||||
else
|
||||
a(href=track.Link())= track.Title.ByUser(user)
|
||||
span posted
|
||||
span.utc-date.no-tip(data-date=track.Created)
|
||||
time.utc-date.no-tip(datetime=track.Created)
|
||||
span by
|
||||
a(href=track.Creator().Link())= track.Creator().Nick + " "
|
||||
|
@ -82,7 +82,7 @@ component ActivityConsumeAnime(activity *arn.ActivityConsumeAnime, user *arn.Use
|
||||
.post-header-info
|
||||
ActivityConsumeAnimeTitle(activity, user)
|
||||
|
||||
.post-date.utc-date(data-date=activity.GetCreated())
|
||||
time.post-date.utc-date(datetime=activity.GetCreated())
|
||||
|
||||
.post-content
|
||||
ActivityConsumeAnimeText(activity, user)
|
||||
|
@ -11,7 +11,8 @@ component ClientErrors(reports []*arn.ClientErrorReport)
|
||||
td
|
||||
each line in strings.Split(report.Stack, "\n")
|
||||
p= line
|
||||
td.utc-date(data-date=report.Created)
|
||||
td
|
||||
time.utc-date(datetime=report.Created)
|
||||
td.edit-log-user
|
||||
if report.CreatedBy != ""
|
||||
Avatar(report.Creator())
|
||||
|
@ -12,7 +12,8 @@ component Crashes(crashes []*arn.Crash)
|
||||
td
|
||||
each line in strings.Split(crash.Stack, "\n")
|
||||
p= line
|
||||
td.utc-date(data-date=crash.Created)
|
||||
td
|
||||
time.utc-date(datetime=crash.Created)
|
||||
td.edit-log-user
|
||||
if crash.CreatedBy != ""
|
||||
Avatar(crash.Creator())
|
||||
|
@ -17,4 +17,5 @@ component GlobalPaymentHistory(payments []*arn.PayPalPayment)
|
||||
a(href=payment.User().Link())= payment.User().Nick
|
||||
td.history-price= payment.Amount
|
||||
td.history-price= payment.Currency
|
||||
td.history-date.utc-date(data-date=payment.Created)
|
||||
td.history-date
|
||||
time.utc-date(datetime=payment.Created)
|
||||
|
@ -21,7 +21,7 @@ component AnimeEpisodes(anime *arn.Anime, episodes []*arn.Episode, episodeToFrie
|
||||
span.episode-title -
|
||||
|
||||
if validate.DateTime(episode.AiringDate.Start)
|
||||
.episode-airing-date-start.utc-airing-date.no-tip(data-start-date=episode.AiringDate.Start, data-end-date=episode.AiringDate.End, data-episode-number=episode.Number)= episode.AiringDate.StartDateHuman()
|
||||
time.episode-airing-date-start.utc-airing-date.no-tip(datetime=episode.AiringDate.Start, data-end-date=episode.AiringDate.End, data-episode-number=episode.Number)= episode.AiringDate.StartDateHuman()
|
||||
|
||||
//- Show friends in reverse order
|
||||
.episode-friends
|
||||
|
@ -36,5 +36,5 @@ component CalendarView(day *utils.CalendarDay, entry *utils.CalendarEntry, user
|
||||
.calendar-entry-info
|
||||
.calendar-entry-title= entry.Anime.Title.ByUser(user)
|
||||
.calendar-entry-time-and-episode
|
||||
.calendar-entry-time.utc-date-absolute(data-date=entry.Episode.AiringDate.Start)
|
||||
.calendar-entry-episode= "Ep: " + strconv.Itoa(entry.Episode.Number)
|
||||
time.calendar-entry-time.utc-date-absolute(datetime=entry.Episode.AiringDate.Start)
|
||||
.calendar-entry-episode= "Ep: " + strconv.Itoa(entry.Episode.Number)
|
||||
|
@ -89,4 +89,4 @@ component EditLogScrollable(entries []*arn.EditLogEntry, user *arn.User)
|
||||
else
|
||||
span.clip-long-text= entry.NewValue
|
||||
|
||||
.edit-log-date.utc-date(data-date=entry.Created)
|
||||
time.edit-log-date.utc-date(datetime=entry.Created)
|
||||
|
@ -35,7 +35,7 @@ component Episode(anime *arn.Anime, episode *arn.Episode, episodeIndex int, uplo
|
||||
|
||||
if validate.DateTime(episode.AiringDate.Start)
|
||||
p.episode-view-airing-date
|
||||
span.utc-airing-date(data-start-date=episode.AiringDate.Start, data-end-date=episode.AiringDate.End, data-episode-number=episode.Number)= episode.AiringDate.StartDateHuman()
|
||||
time.utc-airing-date(datetime=episode.AiringDate.Start, data-end-date=episode.AiringDate.End, data-episode-number=episode.Number)= episode.AiringDate.StartDateHuman()
|
||||
|
||||
footer.footer
|
||||
p Make sure to support the anime you're watching by buying officially released Blu-rays and merchandise.
|
||||
p Make sure to support the anime you're watching by buying officially released Blu-rays and merchandise.
|
||||
|
@ -33,8 +33,8 @@ component Notification(notification *arn.Notification)
|
||||
|
||||
footer.notification-footer
|
||||
p.notification-text= notification.Message
|
||||
.notification-date.utc-date(data-date=notification.Created)
|
||||
time.notification-date.utc-date(datetime=notification.Created)
|
||||
|
||||
if notification.Seen != ""
|
||||
.notification-seen
|
||||
RawIcon("check")
|
||||
RawIcon("check")
|
||||
|
@ -20,12 +20,12 @@ component QuoteMainColumn(quote *arn.Quote, user *arn.User)
|
||||
footer.footer.mountable
|
||||
if quote.EditedBy != ""
|
||||
span Edited
|
||||
span.utc-date(data-date=quote.Edited)
|
||||
time.utc-date(datetime=quote.Edited)
|
||||
span by
|
||||
a(href=quote.Editor().Link())= quote.Editor().Nick
|
||||
else
|
||||
span Posted
|
||||
span.utc-date(data-date=quote.Created)
|
||||
time.utc-date(datetime=quote.Created)
|
||||
span by
|
||||
a(href=quote.Creator().Link())= quote.Creator().Nick
|
||||
span .
|
||||
@ -40,4 +40,4 @@ component QuoteTabs(quote *arn.Quote, user *arn.User)
|
||||
|
||||
component QuoteAnime(anime *arn.Anime, user *arn.User)
|
||||
a.quote-anime-list-item(href=anime.Link(), title=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))
|
||||
img.quote-anime-list-item-image.lazy(data-src=anime.ImageLink("small"), data-webp="true", data-color=anime.AverageColor(), alt=anime.Title.ByUser(user))
|
||||
|
@ -62,7 +62,7 @@ component SettingsExtras(user *arn.User)
|
||||
.widget-section
|
||||
label
|
||||
span Your PRO account expires in
|
||||
span.utc-date(data-date=user.ProExpires)
|
||||
time.utc-date(datetime=user.ProExpires)
|
||||
span .
|
||||
a.button(href="/shop")
|
||||
Icon("star")
|
||||
@ -72,4 +72,4 @@ component SettingsExtras(user *arn.User)
|
||||
label Would you like to make this website more awesome?
|
||||
a.button(href="/support")
|
||||
Icon("star")
|
||||
span Go PRO
|
||||
span Go PRO
|
||||
|
@ -25,4 +25,5 @@ component PurchaseInfo(purchase *arn.Purchase)
|
||||
td= purchase.Item().Name
|
||||
td.history-quantity= purchase.Quantity
|
||||
td.history-price= purchase.Price
|
||||
td.history-date.utc-date(data-date=purchase.Date)
|
||||
td.history-date
|
||||
time.utc-date(datetime=purchase.Date)
|
||||
|
@ -59,12 +59,12 @@ component SoundTrackPage(track *arn.SoundTrack, relatedTracks []*arn.SoundTrack,
|
||||
footer.footer.mountable
|
||||
if track.EditedBy != ""
|
||||
span Edited
|
||||
span.utc-date(data-date=track.Edited)
|
||||
time.utc-date(datetime=track.Edited)
|
||||
span by
|
||||
span= track.Editor().Nick
|
||||
else
|
||||
span Posted
|
||||
span.utc-date(data-date=track.Created)
|
||||
time.utc-date(datetime=track.Created)
|
||||
span by
|
||||
span= track.Creator().Nick
|
||||
|
||||
|
@ -59,13 +59,13 @@ function getRemainingTime(remaining: number): string {
|
||||
return "Just now"
|
||||
}
|
||||
|
||||
export function displayAiringDate(element: HTMLElement, now: Date) {
|
||||
if(!element.dataset.startDate || !element.dataset.endDate) {
|
||||
export function displayAiringDate(element: HTMLTimeElement, now: Date) {
|
||||
if(!element.dateTime || !element.dataset.endDate) {
|
||||
element.textContent = ""
|
||||
return
|
||||
}
|
||||
|
||||
const startDate = new Date(element.dataset.startDate)
|
||||
const startDate = new Date(element.dateTime)
|
||||
const endDate = new Date(element.dataset.endDate)
|
||||
|
||||
let h = startDate.getHours()
|
||||
@ -102,13 +102,13 @@ export function displayAiringDate(element: HTMLElement, now: Date) {
|
||||
}
|
||||
}
|
||||
|
||||
export function displayDate(element: HTMLElement, now: Date) {
|
||||
if(!element.dataset.date) {
|
||||
export function displayDate(element: HTMLTimeElement, now: Date) {
|
||||
if(!element.dateTime) {
|
||||
element.textContent = ""
|
||||
return
|
||||
}
|
||||
|
||||
const startDate = new Date(element.dataset.date)
|
||||
const startDate = new Date(element.dateTime)
|
||||
|
||||
const h = startDate.getHours()
|
||||
const m = startDate.getMinutes()
|
||||
@ -133,13 +133,13 @@ export function displayDate(element: HTMLElement, now: Date) {
|
||||
}
|
||||
}
|
||||
|
||||
export function displayTime(element: HTMLElement) {
|
||||
if(!element.dataset.date) {
|
||||
export function displayTime(element: HTMLTimeElement) {
|
||||
if(!element.dateTime) {
|
||||
element.textContent = ""
|
||||
return
|
||||
}
|
||||
|
||||
const startDate = new Date(element.dataset.date)
|
||||
const startDate = new Date(element.dateTime)
|
||||
|
||||
const h = startDate.getHours()
|
||||
const m = startDate.getMinutes()
|
||||
|
@ -17,13 +17,16 @@ export default class Diff {
|
||||
static mutations: MutationQueue = new MutationQueue()
|
||||
|
||||
// innerHTML will diff the element with the given HTML string and apply DOM mutations.
|
||||
static innerHTML(aRoot: HTMLElement, html: string): Promise<void> {
|
||||
static innerHTML(aRoot: HTMLElement, html: string) {
|
||||
const container = document.createElement("main")
|
||||
container.innerHTML = html
|
||||
|
||||
return new Promise((resolve, _) => {
|
||||
Diff.childNodes(aRoot, container)
|
||||
this.mutations.wait(resolve)
|
||||
|
||||
this.mutations.wait(() => {
|
||||
resolve(null)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
@ -34,7 +37,10 @@ export default class Diff {
|
||||
rootContainer.innerHTML = html.replace("<!DOCTYPE html>", "")
|
||||
|
||||
Diff.childNodes(aRoot.getElementsByTagName("body")[0], rootContainer.getElementsByTagName("body")[0])
|
||||
this.mutations.wait(resolve)
|
||||
|
||||
this.mutations.wait(() => {
|
||||
resolve(null)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
@ -82,9 +88,7 @@ export default class Diff {
|
||||
|
||||
const removeAttributes: Attr[] = []
|
||||
|
||||
for(let x = 0; x < elemA.attributes.length; x++) {
|
||||
const attrib = elemA.attributes[x]
|
||||
|
||||
for(const attrib of elemA.attributes) {
|
||||
if(attrib.specified) {
|
||||
if(!elemB.hasAttribute(attrib.name) && !Diff.persistentAttributes.has(attrib.name)) {
|
||||
removeAttributes.push(attrib)
|
||||
@ -98,9 +102,7 @@ export default class Diff {
|
||||
}
|
||||
})
|
||||
|
||||
for(let x = 0; x < elemB.attributes.length; x++) {
|
||||
const attrib = elemB.attributes[x]
|
||||
|
||||
for(const attrib of elemB.attributes) {
|
||||
if(!attrib.specified) {
|
||||
continue
|
||||
}
|
||||
|
@ -39,10 +39,10 @@ export default class MutationQueue {
|
||||
}
|
||||
|
||||
private mutateAll() {
|
||||
const start = performance.now()
|
||||
const start = Date.now()
|
||||
|
||||
for(let i = 0; i < this.mutations.length; i++) {
|
||||
if(performance.now() - start > timeCapacity) {
|
||||
if(Date.now() - start > timeCapacity) {
|
||||
this.mutations = this.mutations.slice(i)
|
||||
window.requestAnimationFrame(() => this.mutateAll())
|
||||
return
|
||||
|
@ -2,6 +2,4 @@ mixin media-footer
|
||||
text-align center
|
||||
margin-top 0.4rem
|
||||
font-size 0.9em
|
||||
|
||||
span
|
||||
color hsla(text-color-h, text-color-s, text-color-l, 0.65)
|
||||
color hsla(text-color-h, text-color-s, text-color-l, 0.65)
|
||||
|
Loading…
Reference in New Issue
Block a user