From 9d13262b9717ad06a45cc1c3b52a97933cfcacb3 Mon Sep 17 00:00:00 2001
From: Eduard Urbach <e.urbach@gmail.com>
Date: Wed, 22 Nov 2017 12:20:57 +0100
Subject: [PATCH] Calendar improvements

---
 pages/calendar/calendar.pixy    |  7 +++++--
 pages/calendar/calendar.scarlet | 13 +++++++++++--
 scripts/AnimeNotifier.ts        |  6 +++++-
 scripts/DateView.ts             | 21 ++++++++++++++++++---
 4 files changed, 39 insertions(+), 8 deletions(-)

diff --git a/pages/calendar/calendar.pixy b/pages/calendar/calendar.pixy
index 6f698c19..22925d59 100644
--- a/pages/calendar/calendar.pixy
+++ b/pages/calendar/calendar.pixy
@@ -8,5 +8,8 @@ component Calendar(days []*utils.CalendarDay, user *arn.User)
 				.calendar-entries
 					each entry in day.Entries
 						.calendar-entry
-							.calendar-entry-title= entry.Anime.Title.ByUser(user)
-							.calendar-entry-episode= "Ep: " + strconv.Itoa(entry.Episode.Number)
\ No newline at end of file
+							a.ajax(href=entry.Anime.Link())
+								.calendar-entry-title= entry.Anime.Title.ByUser(user)
+							.calendar-entry-info
+								.calendar-entry-time.utc-date-absolute(data-date=entry.Episode.AiringDate.Start)
+								.calendar-entry-episode= "Ep: " + strconv.Itoa(entry.Episode.Number)
\ No newline at end of file
diff --git a/pages/calendar/calendar.scarlet b/pages/calendar/calendar.scarlet
index 89cc1fb5..14363294 100644
--- a/pages/calendar/calendar.scarlet
+++ b/pages/calendar/calendar.scarlet
@@ -12,21 +12,30 @@
 
 .weekday-name
 	text-align center
+	margin-bottom 1rem
 
 .calendar-entries
 	vertical
 
 .calendar-entry
 	ui-element
-	padding 0.75rem 1rem
+	padding 0.5rem 1rem
 	margin-bottom 0.5rem
 	overflow hidden
 
+.calendar-entry-info
+	horizontal
+
 .calendar-entry-title
 	clip-long-text
 
+.calendar-entry-time
+	opacity 0.85
+	font-size 0.9rem
+	flex 1
+
 .calendar-entry-episode
-	opacity 0.75
+	opacity 0.65
 	text-align right
 	font-size 0.9rem
 
diff --git a/scripts/AnimeNotifier.ts b/scripts/AnimeNotifier.ts
index 667a6156..0c748e24 100644
--- a/scripts/AnimeNotifier.ts
+++ b/scripts/AnimeNotifier.ts
@@ -8,7 +8,7 @@ import { Analytics } from "./Analytics"
 import { SideBar } from "./SideBar"
 import { InfiniteScroller } from "./InfiniteScroller"
 import { ServiceWorkerManager } from "./ServiceWorkerManager"
-import { displayAiringDate, displayDate } from "./DateView"
+import { displayAiringDate, displayDate, displayTime } from "./DateView"
 import { findAll, delay, canUseWebP, swapElements } from "./Utils"
 import * as actions from "./Actions"
 import { darkTheme } from "./Actions";
@@ -362,6 +362,10 @@ export class AnimeNotifier {
 		for(let element of findAll("utc-date")) {
 			displayDate(element, now)
 		}
+
+		for(let element of findAll("utc-date-absolute")) {
+			displayTime(element, now)
+		}
 	}
 
 	reloadContent(cached?: boolean) {
diff --git a/scripts/DateView.ts b/scripts/DateView.ts
index 21abfe11..57344439 100644
--- a/scripts/DateView.ts
+++ b/scripts/DateView.ts
@@ -55,7 +55,7 @@ function getRemainingTime(remaining: number): string {
 	if(remainingAbs >= oneSecond) {
 		return plural(Math.round(remaining / oneSecond), " second")
 	}
-	
+
 	return "Just now"
 }
 
@@ -75,7 +75,7 @@ export function displayAiringDate(element: HTMLElement, now: Date) {
 	h = endDate.getHours()
 	m = endDate.getMinutes()
 	let endTime = (h <= 9 ? "0" + h : h) + ":" + (m <= 9 ? "0" + m : m)
-	
+
 	let airingVerb = "will be airing"
 
 	let remaining = startDate.getTime() - now.getTime()
@@ -106,7 +106,7 @@ export function displayDate(element: HTMLElement, now: 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)
 
@@ -118,4 +118,19 @@ export function displayDate(element: HTMLElement, now: Date) {
 	element.innerText = remainingString
 
 	element.title = dayNames[startDate.getDay()] + " " + startTime
+}
+
+export function displayTime(element: HTMLElement, now: Date) {
+	if(element.dataset.date === "") {
+		element.innerText = ""
+		return
+	}
+
+	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)
+
+	element.innerText = startTime
 }
\ No newline at end of file