Added timestamps to forum

This commit is contained in:
Eduard Urbach 2017-07-07 17:16:40 +02:00
parent b9c64a52b3
commit 17c9499601
7 changed files with 44 additions and 55 deletions

View File

@ -22,6 +22,8 @@ component Postable(post arn.Postable, user *arn.User, highlightAuthorID string)
a.button.post-cancel-edit.action(data-action="editPost", data-trigger="click", data-id=post.ID())
Icon("close")
span Cancel
.post-date.utc-date(data-date=post.Created())
.post-toolbar(id="toolbar-" + post.ID())
.spacer

View File

@ -161,7 +161,7 @@ component Anime(anime *arn.Anime, tracks []*arn.SoundTrack, user *arn.User, epis
td.episode-actions
a(href="https://translate.google.com/#ja/en/" + episode.Title.Japanese, target="_blank", rel="noopener")
RawIcon("google")
td.episode-airing-date-start.utc-date(data-start-date=episode.AiringDate.Start, data-end-date=episode.AiringDate.End, data-episode-number=episode.Number)= episode.AiringDate.StartDateHuman()
td.episode-airing-date-start.utc-airing-date(data-start-date=episode.AiringDate.Start, data-end-date=episode.AiringDate.End, data-episode-number=episode.Number)= episode.AiringDate.StartDateHuman()
//- h3.anime-section-name Reviews
//- p Coming soon.

View File

@ -55,7 +55,7 @@ component AnimeList(animeList *arn.AnimeList, viewUser *arn.User, user *arn.User
a.ajax(href=item.Link(animeList.User().Nick))= item.Anime().Title.Canonical
td.anime-list-item-airing-date
if item.Anime().UpcomingEpisode() != nil
span.utc-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)
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)
td.anime-list-item-episodes
.anime-list-item-episodes-watched
.action(contenteditable=utils.SameUser(user, viewUser), data-field="Episodes", data-type="number", data-trigger="focusout", data-action="save")= item.Episodes

View File

@ -13,7 +13,7 @@ component Dashboard(schedule []*arn.UpcomingEpisode, posts []arn.Postable, sound
Icon("calendar-o")
.schedule-item-title= schedule[i].Anime.Title.Canonical
.spacer
.schedule-item-date.utc-date(data-start-date=schedule[i].Episode.AiringDate.Start, data-end-date=schedule[i].Episode.AiringDate.End, data-episode-number=schedule[i].Episode.Number)
.schedule-item-date.utc-airing-date(data-start-date=schedule[i].Episode.AiringDate.Start, data-end-date=schedule[i].Episode.AiringDate.End, data-episode-number=schedule[i].Episode.Number)
else
.widget-element
.widget-element-text

View File

@ -1,6 +1,6 @@
import { Application } from "./Application"
import { Diff } from "./Diff"
import { displayLocalDate } from "./DateView"
import { displayAiringDate, displayDate } from "./DateView"
import { findAll, delay } from "./Utils"
import { MutationQueue } from "./MutationQueue"
import * as actions from "./Actions"
@ -148,8 +148,12 @@ export class AnimeNotifier {
displayLocalDates() {
const now = new Date()
for(let element of findAll("utc-airing-date")) {
displayAiringDate(element, now)
}
for(let element of findAll("utc-date")) {
displayLocalDate(element, now)
displayDate(element, now)
}
}

View File

@ -59,7 +59,7 @@ function getRemainingTime(remaining: number): string {
return "Just now"
}
export function displayLocalDate(element: HTMLElement, now: Date) {
export function displayAiringDate(element: HTMLElement, now: Date) {
let startDate = new Date(element.dataset.startDate)
let endDate = new Date(element.dataset.endDate)
@ -73,9 +73,6 @@ export function displayLocalDate(element: HTMLElement, now: Date) {
let airingVerb = "will be airing"
// let dayInfo = dayNames[startDate.getDay()] + ", " + monthNames[startDate.getMonth()] + " " + startDate.getDate()
let remaining = startDate.getTime() - now.getTime()
let remainingString = getRemainingTime(remaining)
@ -86,55 +83,29 @@ export function displayLocalDate(element: HTMLElement, now: Date) {
element.innerText = remainingString
// let remainingString = seconds + plural(seconds, 'second')
// let days = seconds / (60 * )
// if(Math.abs(days) >= 1) {
// remainingString = plural(days, 'day')
// } else {
// let hours = arn.inHours(now, timeStamp)
// if(Math.abs(hours) >= 1) {
// remainingString = plural(hours, 'hour')
// } else {
// let minutes = arn.inMinutes(now, timeStamp)
// if(Math.abs(minutes) >= 1) {
// remainingString = plural(minutes, 'minute')
// } else {
// let seconds = arn.inSeconds(now, timeStamp)
// remainingString = plural(seconds, 'second')
// }
// }
// }
// if(isNaN(oneHour)) {
// element.style.opacity = "0"
// return
// }
// switch(Math.floor(dayDifference)) {
// case 0:
// element.innerText = "Today"
// break
// case 1:
// element.innerText = "Tomorrow"
// break
// case -1:
// element.innerText = "Yesterday"
// break
// default:
// let text = Math.abs(dayDifference) + " days"
// if(dayDifference < 0) {
// text += " ago"
// airingVerb = "aired"
// } else {
// element.innerText = text
// }
// }
if(remaining < 0) {
airingVerb = "aired"
}
element.title = "Episode " + element.dataset.episodeNumber + " " + airingVerb + " " + dayNames[startDate.getDay()] + " from " + startTime + " - " + endTime
}
export function displayDate(element: HTMLElement, now: Date) {
let startDate = new Date(element.dataset.date)
let h = startDate.getHours()
let m = startDate.getMinutes()
let startTime = (h <= 9 ? "0" + h : h) + ":" + (m <= 9 ? "0" + m : m)
let remaining = startDate.getTime() - now.getTime()
let remainingString = getRemainingTime(remaining)
// Add "ago" if the date is in the past
if(remainingString.startsWith("-")) {
remainingString = remainingString.substring(1) + " ago"
}
element.innerText = remainingString
element.title = dayNames[startDate.getDay()] + " " + startTime
}

View File

@ -41,6 +41,9 @@ post-content-padding-y = 0.75rem
:hover
.post-toolbar
opacity 1
.post-date
opacity 0.25
.thread-content
horizontal
@ -119,6 +122,15 @@ post-content-padding-y = 0.75rem
.post-text-input
min-height 200px
.post-date
position absolute
right -1rem
top 0.25rem
white-space nowrap
opacity 0
transform translateX(100%)
default-transition
// Old
// #posts