From 6eaca92ab893fc94b0ff89a4ded99479a09fcd94 Mon Sep 17 00:00:00 2001 From: Eduard Urbach Date: Wed, 21 Nov 2018 18:12:29 +0900 Subject: [PATCH] Improved group page design --- mixins/Comments.pixy | 2 +- pages/activity/activity.scarlet | 3 -- pages/group/edit.go | 8 ++++- pages/group/{forum.go => feed.go} | 13 ++++++-- pages/group/feed.pixy | 17 +++++++++++ pages/group/forum.pixy | 4 --- pages/group/group.pixy | 42 -------------------------- pages/group/group.scarlet | 12 +------- pages/group/{group.go => info.go} | 17 +++++------ pages/group/info.pixy | 19 ++++++++++++ pages/group/info.scarlet | 2 ++ pages/group/members.go | 30 ++++++++++++++++++ pages/group/members.pixy | 12 ++++++++ pages/group/opengraph.go | 16 ++++++++++ pages/group/tabs.pixy | 8 +++++ pages/index/grouproutes/grouproutes.go | 5 +-- pages/profile/profile.pixy | 3 -- pages/profile/profile.scarlet | 7 ----- pages/users/users.pixy | 2 +- 19 files changed, 135 insertions(+), 87 deletions(-) rename pages/group/{forum.go => feed.go} (58%) create mode 100644 pages/group/feed.pixy delete mode 100644 pages/group/forum.pixy delete mode 100644 pages/group/group.pixy rename pages/group/{group.go => info.go} (55%) create mode 100644 pages/group/info.pixy create mode 100644 pages/group/info.scarlet create mode 100644 pages/group/members.go create mode 100644 pages/group/members.pixy create mode 100644 pages/group/opengraph.go create mode 100644 pages/group/tabs.pixy diff --git a/mixins/Comments.pixy b/mixins/Comments.pixy index 5ae53376..68605deb 100644 --- a/mixins/Comments.pixy +++ b/mixins/Comments.pixy @@ -5,7 +5,7 @@ component Comments(parent arn.PostParent, user *arn.User) if arn.IsLocked(parent) footer.footer.mountable p.text-center= "This " + strings.ToLower(reflect.TypeOf(parent).Elem().Name()) + " is locked." - else + else if parent.TypeName() != "Group" || parent.(*arn.Group).FindMember(user.ID) != nil NewPostArea(parent, user, "Comment") if user == nil && parent.CountPosts() == 0 diff --git a/pages/activity/activity.scarlet b/pages/activity/activity.scarlet index e0cb496c..194d72b6 100644 --- a/pages/activity/activity.scarlet +++ b/pages/activity/activity.scarlet @@ -12,9 +12,6 @@ .activity-header horizontal -.activity-user - display none - .activity-parent flex 1 diff --git a/pages/group/edit.go b/pages/group/edit.go index e1cd2147..d5507549 100644 --- a/pages/group/edit.go +++ b/pages/group/edit.go @@ -20,6 +20,12 @@ func Edit(ctx *aero.Context) string { return ctx.Error(http.StatusNotFound, "Track not found", err) } + var member *arn.GroupMember + + if user != nil { + member = group.FindMember(user.ID) + } + ctx.Data = &arn.OpenGraph{ Tags: map[string]string{ "og:title": group.Name, @@ -28,5 +34,5 @@ func Edit(ctx *aero.Context) string { }, } - return ctx.HTML(components.GroupTabs(group, user) + editform.Render(group, "Edit group", user)) + return ctx.HTML(components.GroupTabs(group, member, user) + editform.Render(group, "Edit group", user)) } diff --git a/pages/group/forum.go b/pages/group/feed.go similarity index 58% rename from pages/group/forum.go rename to pages/group/feed.go index 26794a61..765405c2 100644 --- a/pages/group/forum.go +++ b/pages/group/feed.go @@ -9,8 +9,8 @@ import ( "github.com/animenotifier/notify.moe/utils" ) -// Forum ... -func Forum(ctx *aero.Context) string { +// Feed shows the group front page. +func Feed(ctx *aero.Context) string { user := utils.GetUser(ctx) id := ctx.Get("id") group, err := arn.GetGroup(id) @@ -19,5 +19,12 @@ func Forum(ctx *aero.Context) string { return ctx.Error(http.StatusNotFound, "Group not found", err) } - return ctx.HTML(components.GroupForum(group, user)) + var member *arn.GroupMember + + if user != nil { + member = group.FindMember(user.ID) + } + + ctx.Data = getOpenGraph(ctx, group) + return ctx.HTML(components.GroupFeed(group, member, user)) } diff --git a/pages/group/feed.pixy b/pages/group/feed.pixy new file mode 100644 index 00000000..e134b72d --- /dev/null +++ b/pages/group/feed.pixy @@ -0,0 +1,17 @@ +component GroupFeed(group *arn.Group, member *arn.GroupMember, user *arn.User) + GroupTabs(group, member, user) + + .group-header + if group.Name != "" + h1.group-page-name.mountable= group.Name + else + h1.group-page-name.mountable untitled + + if group.Tagline != "" + p.group-page-tagline.mountable= group.Tagline + else + p.group-page-tagline.mountable no tagline yet + + .group-view + .group-feed + Comments(group, user) diff --git a/pages/group/forum.pixy b/pages/group/forum.pixy deleted file mode 100644 index c36b1339..00000000 --- a/pages/group/forum.pixy +++ /dev/null @@ -1,4 +0,0 @@ -component GroupForum(group *arn.Group, user *arn.User) - GroupTabs(group, user) - - h1 Forum \ No newline at end of file diff --git a/pages/group/group.pixy b/pages/group/group.pixy deleted file mode 100644 index 839cedf0..00000000 --- a/pages/group/group.pixy +++ /dev/null @@ -1,42 +0,0 @@ -component Group(group *arn.Group, user *arn.User) - GroupTabs(group, user) - - .group-header - if group.Name != "" - h1.group-page-name.mountable= group.Name - else - h1.group-page-name.mountable untitled - - if group.Tagline != "" - p.group-page-tagline.mountable= group.Tagline - else - p.group-page-tagline.mountable no tagline yet - - .group-view - .group-sidebar.mountable - if group.Description != "" - .group-sidebar-section - h3 Description - .group-description!= markdown.Render(group.Description) - - if group.Rules != "" - .group-sidebar-section - h3 Rules - .group-rules!= markdown.Render(group.Rules) - - .group-sidebar-section - h3 Members - .user-avatars.group-members - each member in group.Members - Avatar(member.User()) - - .group-feed - Comments(group, user) - -component GroupTabs(group *arn.Group, user *arn.User) - .tabs - Tab("Group", "users", group.Link()) - //- Tab("Forum", "comment", group.Link() + "/forum") - - if user != nil && group.FindMember(user.ID) != nil && group.FindMember(user.ID).Role == "founder" - Tab("Edit", "pencil", group.Link() + "/edit") \ No newline at end of file diff --git a/pages/group/group.scarlet b/pages/group/group.scarlet index a4de6b38..6d4fb10e 100644 --- a/pages/group/group.scarlet +++ b/pages/group/group.scarlet @@ -1,7 +1,7 @@ .group-view horizontal-wrap width 100% - max-width 1000px + max-width 900px margin 0 auto < 1100px @@ -10,16 +10,6 @@ .group-feed flex 1 - padding 0 1rem - -.group-sidebar - flex-basis 300px - max-width 300px - -.group-sidebar-section - ui-element - padding 0.5rem 1rem - margin-bottom content-padding .group-members margin-bottom 0.5rem diff --git a/pages/group/group.go b/pages/group/info.go similarity index 55% rename from pages/group/group.go rename to pages/group/info.go index 2aa7a2e5..0ec32855 100644 --- a/pages/group/group.go +++ b/pages/group/info.go @@ -9,8 +9,8 @@ import ( "github.com/animenotifier/notify.moe/utils" ) -// Get ... -func Get(ctx *aero.Context) string { +// Info shows the group information page. +func Info(ctx *aero.Context) string { user := utils.GetUser(ctx) id := ctx.Get("id") group, err := arn.GetGroup(id) @@ -19,13 +19,12 @@ func Get(ctx *aero.Context) string { return ctx.Error(http.StatusNotFound, "Group not found", err) } - ctx.Data = &arn.OpenGraph{ - Tags: map[string]string{ - "og:title": group.Name, - "og:url": "https://" + ctx.App.Config.Domain + group.Link(), - "og:site_name": "notify.moe", - }, + var member *arn.GroupMember + + if user != nil { + member = group.FindMember(user.ID) } - return ctx.HTML(components.Group(group, user)) + ctx.Data = getOpenGraph(ctx, group) + return ctx.HTML(components.GroupInfo(group, member, user)) } diff --git a/pages/group/info.pixy b/pages/group/info.pixy new file mode 100644 index 00000000..b1cecd9d --- /dev/null +++ b/pages/group/info.pixy @@ -0,0 +1,19 @@ +component GroupInfo(group *arn.Group, member *arn.GroupMember, user *arn.User) + GroupTabs(group, member, user) + h1.page-title= fmt.Sprintf("%s - Info", group.Name) + + .group-view + if group.Description != "" + .group-info-section + h3.mountable Description + .group-description.mountable!= markdown.Render(group.Description) + + if group.Rules != "" + .group-info-section + h3.mountable Rules + .group-rules.mountable!= markdown.Render(group.Rules) + + .group-info-section + h3.mountable Founder + .user-avatars.group-founder.mountable + Avatar(group.Creator()) \ No newline at end of file diff --git a/pages/group/info.scarlet b/pages/group/info.scarlet new file mode 100644 index 00000000..7d80c43f --- /dev/null +++ b/pages/group/info.scarlet @@ -0,0 +1,2 @@ +.group-info-section + margin-bottom content-padding \ No newline at end of file diff --git a/pages/group/members.go b/pages/group/members.go new file mode 100644 index 00000000..a0a1a7eb --- /dev/null +++ b/pages/group/members.go @@ -0,0 +1,30 @@ +package group + +import ( + "net/http" + + "github.com/aerogo/aero" + "github.com/animenotifier/arn" + "github.com/animenotifier/notify.moe/components" + "github.com/animenotifier/notify.moe/utils" +) + +// Members shows the group members. +func Members(ctx *aero.Context) string { + user := utils.GetUser(ctx) + id := ctx.Get("id") + group, err := arn.GetGroup(id) + + if err != nil { + return ctx.Error(http.StatusNotFound, "Group not found", err) + } + + var member *arn.GroupMember + + if user != nil { + member = group.FindMember(user.ID) + } + + ctx.Data = getOpenGraph(ctx, group) + return ctx.HTML(components.GroupMembers(group, member, user)) +} diff --git a/pages/group/members.pixy b/pages/group/members.pixy new file mode 100644 index 00000000..133f62f2 --- /dev/null +++ b/pages/group/members.pixy @@ -0,0 +1,12 @@ +component GroupMembers(group *arn.Group, member *arn.GroupMember, user *arn.User) + GroupTabs(group, member, user) + h1.page-title= fmt.Sprintf("%s - Members", group.Name) + + .user-avatars.group-members.mountable + each member in group.Members + Avatar(member.User()) + + .buttons + button.mountable + Icon("user-plus") + span= fmt.Sprintf("Join %s", group.Name) \ No newline at end of file diff --git a/pages/group/opengraph.go b/pages/group/opengraph.go new file mode 100644 index 00000000..04bb8708 --- /dev/null +++ b/pages/group/opengraph.go @@ -0,0 +1,16 @@ +package group + +import ( + "github.com/aerogo/aero" + "github.com/animenotifier/arn" +) + +func getOpenGraph(ctx *aero.Context, group *arn.Group) *arn.OpenGraph { + return &arn.OpenGraph{ + Tags: map[string]string{ + "og:title": group.Name, + "og:url": "https://" + ctx.App.Config.Domain + group.Link(), + "og:site_name": "notify.moe", + }, + } +} diff --git a/pages/group/tabs.pixy b/pages/group/tabs.pixy new file mode 100644 index 00000000..29baadd2 --- /dev/null +++ b/pages/group/tabs.pixy @@ -0,0 +1,8 @@ +component GroupTabs(group *arn.Group, member *arn.GroupMember, user *arn.User) + .tabs + Tab("Posts", "comment", group.Link()) + Tab("Info", "info-circle", group.Link() + "/info") + Tab("Members", "globe", group.Link() + "/members") + + if member != nil && member.Role == "founder" + Tab("Edit", "pencil", group.Link() + "/edit") \ No newline at end of file diff --git a/pages/index/grouproutes/grouproutes.go b/pages/index/grouproutes/grouproutes.go index 895b44e7..3bca2e40 100644 --- a/pages/index/grouproutes/grouproutes.go +++ b/pages/index/grouproutes/grouproutes.go @@ -10,7 +10,8 @@ import ( func Register(l *layout.Layout) { // Groups l.Page("/groups", groups.Get) - l.Page("/group/:id", group.Get) + l.Page("/group/:id", group.Feed) + l.Page("/group/:id/info", group.Info) + l.Page("/group/:id/members", group.Members) l.Page("/group/:id/edit", group.Edit) - l.Page("/group/:id/forum", group.Forum) } diff --git a/pages/profile/profile.pixy b/pages/profile/profile.pixy index aecaf0f0..b0216622 100644 --- a/pages/profile/profile.pixy +++ b/pages/profile/profile.pixy @@ -28,9 +28,6 @@ component Profile(viewUser *arn.User, user *arn.User, animeList *arn.AnimeList, each character in characters .mountable(data-mountable-type="character") CharacterSmall(character, user) - //- a.profile-favorite-character.tip.mountable(href=character.Link(), aria-label=character.Name.ByUser(user), data-mountable-type="favorite-anime") - //- img.profile-favorite-character-image.lazy(data-src=character.ImageLink("small"), data-webp=true, alt=character.Name.ByUser(user)) - //- Posts .profile-column.profile-activity.mountable(data-mountable-type="column") .profile-section diff --git a/pages/profile/profile.scarlet b/pages/profile/profile.scarlet index 187e463d..a3566697 100644 --- a/pages/profile/profile.scarlet +++ b/pages/profile/profile.scarlet @@ -95,13 +95,6 @@ const profile-image-size = 280px grid-gap 0.5rem justify-content space-evenly -// .profile-favorite-character -// margin 0.25rem - -// .profile-favorite-character-image - -// border-radius ui-element-border-radius - > 740px .profile-head horizontal diff --git a/pages/users/users.pixy b/pages/users/users.pixy index 4bcb45ca..3a49a931 100644 --- a/pages/users/users.pixy +++ b/pages/users/users.pixy @@ -8,7 +8,7 @@ component Users(users []*arn.User, url string) component UsersByCountry(users []*arn.User, countryName string) if len(users) == 0 - p.no-data.mountable= "Seems like there are no users in " + stringutils.Capitalize(countryName) + p.no-data.mountable= "Seems like there are no active users in " + stringutils.Capitalize(countryName) else h1= "Users in " + users[0].Location.CountryName