Started working on episode pages

pages/anime/anime.pixy

@@ -28,7 +28,7 @@ component AnimeMainColumn(anime *arn.Anime, tracks []*arn.SoundTrack, episodes [
 	AnimeCharacters(anime)
 	AnimeRelations(anime, user)
 	AnimeTracks(anime, tracks)
-	AnimeEpisodes(episodes, user)
+	AnimeEpisodes(anime, episodes, user)
 
 component AnimeSideColumn(anime *arn.Anime, friends []*arn.User, listItems map[*arn.User]*arn.AnimeListItem, user *arn.User)
 	AnimeTrailer(anime)

pages/anime/episode.scarlet

@@ -4,18 +4,21 @@
 > 700px
 	.episodes
 		horizontal-wrap
+		justify-content space-around
 
 .episode
-	ui-element
 	vertical
-	button-hover
 	flex 0
-	flex-basis 150px
+	flex-basis 200px
 	margin 0.5rem
 	padding 0.5rem
+	overflow hidden
+	border-radius ui-element-border-radius
+	color text-color
 
-	// :hover
+	:hover
-	// 	background-color table-row-hover-background
+		color text-color
+		background-color reverse-light-hover-color
 
 .episode-number
 	display flex
@@ -33,13 +36,9 @@
 .episode-airing-date-start
 	display flex
 	justify-content center
-	font-size 0.8rem
+	font-size 0.7rem
 	opacity 0.6
 
-< 800px
-	.episode-airing-date-start
-		display none
-
 < 320px
 	.episode-actions
 		display none

pages/anime/episodes.go

@@ -21,5 +21,5 @@ func Episodes(ctx *aero.Context) string {
 		return ctx.Error(http.StatusNotFound, "Anime not found", err)
 	}
 
-	return ctx.HTML(components.AnimeEpisodes(anime.Episodes().Items, user))
+	return ctx.HTML(components.AnimeEpisodes(anime, anime.Episodes().Items, user))
 }

pages/anime/episodes.pixy

@@ -1,24 +1,23 @@
-component AnimeEpisodes(episodes []*arn.AnimeEpisode, user *arn.User)
+component AnimeEpisodes(anime *arn.Anime, episodes []*arn.AnimeEpisode, user *arn.User)
 	if len(episodes) > 0
 		.anime-section.mountable
 			h3.anime-section-name Episodes
 			.episodes
 				each episode in episodes
-					.episode.mountable(data-mountable-type="episode")
+					a.episode.ajax.mountable(href=anime.Link() + "/episode/" + strconv.Itoa(episode.Number), data-mountable-type="episode")
 						.episode-number
 							if episode.Number != -1
 								span= episode.Number
 						
-						.episode-title= episode.Title.Japanese
+						.episode-title
-							//- if episode.Title.Japanese != ""
+							if episode.Title.Japanese != ""
-							//- 	Japanese(episode.Title.Japanese)
+								span= episode.Title.Japanese
-							//- else
+							else
-							//- 	span -
+								span -
 						
 						if validator.IsValidDate(episode.AiringDate.Start)
 							.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()
 			
-			
 			//- table.episodes
 			//- 	tbody
 			//- 		each episode in episodes

pages/episode/episode.go

@@ -0,0 +1,43 @@
+package episode
+
+import (
+	"net/http"
+
+	"github.com/aerogo/aero"
+	"github.com/animenotifier/arn"
+	"github.com/animenotifier/notify.moe/components"
+	"github.com/animenotifier/notify.moe/utils"
+)
+
+// Get renders the anime episode.
+func Get(ctx *aero.Context) string {
+	user := utils.GetUser(ctx)
+	id := ctx.Get("id")
+	episodeNumber, err := ctx.GetInt("episode-number")
+
+	if err != nil {
+		return ctx.Error(http.StatusBadRequest, "Episode is not a number", err)
+	}
+
+	// Get anime
+	anime, err := arn.GetAnime(id)
+
+	if err != nil {
+		return ctx.Error(http.StatusNotFound, "Anime not found", err)
+	}
+
+	// Get anime episodes
+	animeEpisodes, err := arn.GetAnimeEpisodes(id)
+
+	if err != nil {
+		return ctx.Error(http.StatusNotFound, "Anime episodes not found", err)
+	}
+
+	episode := animeEpisodes.Find(episodeNumber)
+
+	if episode == nil {
+		return ctx.Error(http.StatusNotFound, "Anime episode not found", nil)
+	}
+
+	return ctx.HTML(components.AnimeEpisode(anime, episode, user))
+}

pages/episode/episode.pixy

@@ -0,0 +1,9 @@
+component AnimeEpisode(anime *arn.Anime, episode *arn.AnimeEpisode, user *arn.User)
+	h1= episode.Title.Japanese
+	p
+		a.ajax(href=anime.Link(), title=anime.Title.ByUser(user))
+			img(src=anime.Image("medium"), alt=anime.Title.ByUser(user))
+		
+		if validator.IsValidDate(episode.AiringDate.Start)
+			.utc-airing-date(data-start-date=episode.AiringDate.Start, data-end-date=episode.AiringDate.End, data-episode-number=episode.Number)= episode.AiringDate.StartDateHuman()
+	

pages/index.go

@@ -21,6 +21,7 @@ import (
 	"github.com/animenotifier/notify.moe/pages/editanime"
 	"github.com/animenotifier/notify.moe/pages/editor"
 	"github.com/animenotifier/notify.moe/pages/embed"
+	"github.com/animenotifier/notify.moe/pages/episode"
 	"github.com/animenotifier/notify.moe/pages/explore"
 	"github.com/animenotifier/notify.moe/pages/forum"
 	"github.com/animenotifier/notify.moe/pages/genre"
@@ -95,6 +96,7 @@ func Configure(app *aero.Application) {
 	l.Page("/anime/:id/characters", anime.Characters)
 	l.Page("/anime/:id/tracks", anime.Tracks)
 	l.Page("/anime/:id/edit", editanime.Get)
+	l.Page("/anime/:id/episode/:episode-number", episode.Get)
 
 	// Characters
 	l.Page("/character/:id", character.Get)