From 63a5b02c0ea8e1740dd3b607d61ae26fdaab0f0a Mon Sep 17 00:00:00 2001 From: Eduard Urbach Date: Mon, 19 Jun 2017 20:59:02 +0200 Subject: [PATCH] Added basic anime list item view --- main.go | 2 + mixins/Input.pixy | 14 +++++++ pages/anime/anime.go | 8 +++- pages/anime/anime.pixy | 15 ++++--- pages/anime/anime.scarlet | 4 +- pages/animelistitem/animelistitem.go | 51 +++++++++++++++++++++++ pages/animelistitem/animelistitem.pixy | 12 ++++++ pages/animelistitem/animelistitem.scarlet | 7 ++++ pages/profile/profile.pixy | 2 +- pages/settings/settings.pixy | 7 +--- styles/forms.scarlet | 23 ++++++++-- styles/headers.scarlet | 4 ++ styles/light-button.scarlet | 7 +--- 13 files changed, 131 insertions(+), 25 deletions(-) create mode 100644 mixins/Input.pixy create mode 100644 pages/animelistitem/animelistitem.go create mode 100644 pages/animelistitem/animelistitem.pixy create mode 100644 pages/animelistitem/animelistitem.scarlet diff --git a/main.go b/main.go index fa4e6a95..56907ea9 100644 --- a/main.go +++ b/main.go @@ -11,6 +11,7 @@ import ( "github.com/animenotifier/notify.moe/pages/admin" "github.com/animenotifier/notify.moe/pages/airing" "github.com/animenotifier/notify.moe/pages/anime" + "github.com/animenotifier/notify.moe/pages/animelistitem" "github.com/animenotifier/notify.moe/pages/awards" "github.com/animenotifier/notify.moe/pages/dashboard" "github.com/animenotifier/notify.moe/pages/forum" @@ -50,6 +51,7 @@ func main() { app.Ajax("/posts/:id", posts.Get) app.Ajax("/user/:nick", profile.Get) app.Ajax("/user/:nick/threads", profile.GetThreadsByUser) + app.Ajax("/user/:nick/animelist/:id", animelistitem.Get) app.Ajax("/settings", settings.Get) app.Ajax("/admin", admin.Get) app.Ajax("/users", users.Get) diff --git a/mixins/Input.pixy b/mixins/Input.pixy new file mode 100644 index 00000000..bbbbebf6 --- /dev/null +++ b/mixins/Input.pixy @@ -0,0 +1,14 @@ +component InputText(id string, value string, label string, placeholder string) + .widget-input + label(for=id)= label + ":" + input.widget-element(id=id, type="text", value=value, placeholder=placeholder) + +component InputTextArea(id string, value string, label string, placeholder string) + .widget-input + label(for=id)= label + ":" + textarea.widget-element(id=id, value=value, placeholder=placeholder) + +component InputNumber(id string, value int, label string, placeholder string, min int, max int) + .widget-input + label(for=id)= label + ":" + input.widget-element(id=id, type="number", value=value, min=min, max=max, placeholder=placeholder) \ No newline at end of file diff --git a/pages/anime/anime.go b/pages/anime/anime.go index f1389b38..e10bb0f1 100644 --- a/pages/anime/anime.go +++ b/pages/anime/anime.go @@ -1,19 +1,23 @@ package anime import ( + "net/http" + "github.com/aerogo/aero" "github.com/animenotifier/arn" "github.com/animenotifier/notify.moe/components" + "github.com/animenotifier/notify.moe/utils" ) // Get anime page. func Get(ctx *aero.Context) string { id := ctx.Get("id") + user := utils.GetUser(ctx) anime, err := arn.GetAnime(id) if err != nil { - return ctx.Error(404, "Anime not found", err) + return ctx.Error(http.StatusNotFound, "Anime not found", err) } - return ctx.HTML(components.Anime(anime)) + return ctx.HTML(components.Anime(anime, user)) } diff --git a/pages/anime/anime.pixy b/pages/anime/anime.pixy index f27c26ca..91b96e65 100644 --- a/pages/anime/anime.pixy +++ b/pages/anime/anime.pixy @@ -1,8 +1,8 @@ -component Anime(anime *arn.Anime) +component Anime(anime *arn.Anime, user *arn.User) .anime-header(data-id=anime.ID) if anime.Image.Small != "" .anime-image-container - img.anime-cover-image(src=anime.Image.Small, alt=anime.Title.Romaji) + img.anime-cover-image(src=anime.Image.Small, alt=anime.Title.Canonical) .space @@ -13,13 +13,18 @@ component Anime(anime *arn.Anime) //- span.second-title(title=anime.Title.English !== anime.Title.Romaji ? anime.Title.English : null)= anime.Title.Romaji //- else if anime.Title.Japanese != anime.Title.Canonical - a.anime-alternative-title(href="http://jisho.org/search/" + anime.Title.Japanese, target="_blank", title="Look up reading on jisho.org", rel="nofollow")= anime.Title.Japanese + .anime-alternative-title + a(href="http://jisho.org/search/" + anime.Title.Japanese, target="_blank", title="Look up reading on jisho.org", rel="nofollow")= anime.Title.Japanese //- h3.anime-section-name.anime-summary-header Summary p.anime-summary= anime.Summary - .anime-actions - a.light-button.action-button(href="#") Add to collection + if user != nil + .anime-actions + if user.AnimeList().Contains(anime.ID) + a.button.ajax(href="/+" + user.Nick + "/animelist/" + anime.ID) View in collection + else + button Add to collection h3.anime-section-name Ratings .anime-rating-categories diff --git a/pages/anime/anime.scarlet b/pages/anime/anime.scarlet index 6870f9ec..ba6fdfc4 100644 --- a/pages/anime/anime.scarlet +++ b/pages/anime/anime.scarlet @@ -39,12 +39,14 @@ .anime-alternative-title font-size 0.9em margin-bottom 0.5rem - color rgba(60, 60, 60, 0.5) !important + a + color rgba(60, 60, 60, 0.5) !important .anime-actions horizontal justify-content center margin content-padding 0 + z-index 10 > 900px .anime-actions diff --git a/pages/animelistitem/animelistitem.go b/pages/animelistitem/animelistitem.go new file mode 100644 index 00000000..85e891c1 --- /dev/null +++ b/pages/animelistitem/animelistitem.go @@ -0,0 +1,51 @@ +package animelistitem + +import ( + "net/http" + + "github.com/aerogo/aero" + "github.com/animenotifier/arn" + "github.com/animenotifier/notify.moe/components" +) + +// Get anime page. +func Get(ctx *aero.Context) string { + // user := utils.GetUser(ctx) + + nick := ctx.Get("nick") + viewUser, err := arn.GetUserByNick(nick) + + if err != nil { + return ctx.Error(http.StatusNotFound, "User not found", err) + } + + animeList := viewUser.AnimeList() + + if animeList == nil { + return ctx.Error(http.StatusNotFound, "Anime list not found", err) + } + + animeID := ctx.Get("id") + item := animeList.Find(animeID) + + if item == nil { + return ctx.Error(http.StatusNotFound, "List item not found", err) + } + + anime := item.Anime() + + return ctx.HTML(components.AnimeListItem(item, anime)) +} + +// t := reflect.TypeOf(item).Elem() +// v := reflect.ValueOf(item).Elem() + +// for i := 0; i < t.NumField(); i++ { +// fieldInfo := t.Field(i) + +// if fieldInfo.Anonymous || unicode.IsLower([]rune(fieldInfo.Name)[0]) { +// continue +// } + +// fmt.Println(fieldInfo.Name, v.Field(i).Interface()) +// } diff --git a/pages/animelistitem/animelistitem.pixy b/pages/animelistitem/animelistitem.pixy new file mode 100644 index 00000000..9f18db52 --- /dev/null +++ b/pages/animelistitem/animelistitem.pixy @@ -0,0 +1,12 @@ +component AnimeListItem(item *arn.AnimeListItem, anime *arn.Anime) + .widgets + .widget.anime-list-item-view + h2 + a.ajax(href=anime.Link())= anime.Title.Canonical + + if anime.EpisodeCount == 0 + InputNumber("episodes", item.Episodes, "Episodes", "Number of episodes you watched", 0, 10000) + else + InputNumber("episodes", item.Episodes, "Episodes", "Number of episodes you watched", 0, anime.EpisodeCount) + + InputTextArea("notes", item.Notes, "Notes", "Notes") \ No newline at end of file diff --git a/pages/animelistitem/animelistitem.scarlet b/pages/animelistitem/animelistitem.scarlet new file mode 100644 index 00000000..459e3881 --- /dev/null +++ b/pages/animelistitem/animelistitem.scarlet @@ -0,0 +1,7 @@ +.anime-list-item-view + textarea + height 10rem + +.anime-list-item-view-image + max-width 55px + margin-bottom 1rem \ No newline at end of file diff --git a/pages/profile/profile.pixy b/pages/profile/profile.pixy index fd4c67a7..77848934 100644 --- a/pages/profile/profile.pixy +++ b/pages/profile/profile.pixy @@ -57,7 +57,7 @@ component Profile(viewUser *arn.User, user *arn.User, animeList *arn.AnimeList, p No anime in the collection. else each item in animeList.Items - a.anime-list-item.ajax(href=item.Anime().Link(), title=item.Anime().Title.Canonical + " (" + toString(item.Episode) + " / " + arn.EpisodesToString(item.Anime().EpisodeCount) + ")") + a.anime-list-item.ajax(href="/+" + viewUser.Nick + "/animelist/" + item.Anime().ID, title=item.Anime().Title.Canonical + " (" + toString(item.Episodes) + " / " + arn.EpisodesToString(item.Anime().EpisodeCount) + ")") img.anime-cover-image.anime-list-item-image(src=item.Anime().Image.Tiny, alt=item.Anime().Title.Canonical) .profile-category diff --git a/pages/settings/settings.pixy b/pages/settings/settings.pixy index d67fe41d..c3c196aa 100644 --- a/pages/settings/settings.pixy +++ b/pages/settings/settings.pixy @@ -17,9 +17,4 @@ component Settings(user *arn.User) InputText("accounts.anilist.nick", user.Accounts.AniList.Nick, "AniList", "Your username on anilist.co") InputText("accounts.myanimelist.nick", user.Accounts.MyAnimeList.Nick, "MyAnimeList", "Your username on myanimelist.net") - InputText("accounts.kitsu.nick", user.Accounts.Kitsu.Nick, "Kitsu", "Your username on kitsu.io") - -component InputText(id string, value string, label string, placeholder string) - .widget-input - label(for=id)= label + ":" - input.widget-element(id=id, type="text", value=value, placeholder=placeholder) \ No newline at end of file + InputText("accounts.kitsu.nick", user.Accounts.Kitsu.Nick, "Kitsu", "Your username on kitsu.io") \ No newline at end of file diff --git a/styles/forms.scarlet b/styles/forms.scarlet index 49d05b47..daf01b06 100644 --- a/styles/forms.scarlet +++ b/styles/forms.scarlet @@ -20,11 +20,21 @@ input, textarea :disabled ui-disabled -button, select +button, .button ui-element - max-width 600px - padding 0.6rem 1rem - margin 0 auto + font-size 1rem + line-height 1rem + padding 0.75rem 1rem + color link-color + + :hover + cursor pointer + color white + background-color link-hover-color + + :active + transform translateY(3px) + // box-shadow 0 0 2px white, 0 -2px 5px rgba(0, 0, 0, 0.08) inset // :active // background-color black @@ -34,6 +44,11 @@ button, select // // box-shadow 0 0 6px alpha(mainColor, 20%) // border 1px solid main-color +// select +// ui-element +// font-size 1rem +// padding 0.5em 1em + label width 100% padding 0.5rem 0 diff --git a/styles/headers.scarlet b/styles/headers.scarlet index 4ae49efe..1a2d55c4 100644 --- a/styles/headers.scarlet +++ b/styles/headers.scarlet @@ -13,5 +13,9 @@ h3 text-align left margin-top 0.6em +h2 + a + color text-color + .page-title display none \ No newline at end of file diff --git a/styles/light-button.scarlet b/styles/light-button.scarlet index 2698d38e..23308078 100644 --- a/styles/light-button.scarlet +++ b/styles/light-button.scarlet @@ -11,9 +11,4 @@ :hover color white !important - background-color link-hover-color - -.action-button - ui-element - font-size 1rem - text-align center \ No newline at end of file + background-color link-hover-color \ No newline at end of file