Added image upload for groups
This commit is contained in:
@ -17,7 +17,7 @@ func Edit(ctx *aero.Context) string {
|
||||
user := utils.GetUser(ctx)
|
||||
|
||||
if err != nil {
|
||||
return ctx.Error(http.StatusNotFound, "Track not found", err)
|
||||
return ctx.Error(http.StatusNotFound, "Group not found", err)
|
||||
}
|
||||
|
||||
var member *arn.GroupMember
|
||||
@ -26,13 +26,24 @@ func Edit(ctx *aero.Context) string {
|
||||
member = group.FindMember(user.ID)
|
||||
}
|
||||
|
||||
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",
|
||||
},
|
||||
}
|
||||
|
||||
return ctx.HTML(components.GroupTabs(group, member, user) + editform.Render(group, "Edit group", user))
|
||||
}
|
||||
|
||||
// EditImage renders the form to edit the group images.
|
||||
func EditImage(ctx *aero.Context) string {
|
||||
id := ctx.Get("id")
|
||||
group, err := arn.GetGroup(id)
|
||||
user := utils.GetUser(ctx)
|
||||
|
||||
if err != nil {
|
||||
return ctx.Error(http.StatusNotFound, "Group not found", err)
|
||||
}
|
||||
|
||||
var member *arn.GroupMember
|
||||
|
||||
if user != nil {
|
||||
member = group.FindMember(user.ID)
|
||||
}
|
||||
|
||||
return ctx.HTML(components.EditGroupImage(group, member, user))
|
||||
}
|
||||
|
@ -1,20 +1,12 @@
|
||||
.group-view
|
||||
horizontal-wrap
|
||||
vertical
|
||||
width 100%
|
||||
max-width 900px
|
||||
margin 0 auto
|
||||
|
||||
< 1100px
|
||||
.group-view
|
||||
vertical
|
||||
|
||||
.group-feed
|
||||
flex 1
|
||||
|
||||
.group-members
|
||||
margin-bottom 0.5rem
|
||||
justify-content flex-start
|
||||
|
||||
.group-header
|
||||
margin-bottom content-padding
|
||||
|
||||
|
15
pages/group/image.pixy
Normal file
15
pages/group/image.pixy
Normal file
@ -0,0 +1,15 @@
|
||||
component EditGroupImage(group *arn.Group, member *arn.GroupMember, user *arn.User)
|
||||
GroupTabs(group, member, user)
|
||||
|
||||
.widget-form
|
||||
h1.mountable Edit group image
|
||||
|
||||
.widget.mountable(data-api="/api/group/" + group.ID)
|
||||
h3.widget-title
|
||||
Icon("picture-o")
|
||||
span Image
|
||||
|
||||
InputFileUpload("group-image-input", "File", "image", "/api/upload/group/" + group.ID + "/image")
|
||||
|
||||
.group-image-container.mountable
|
||||
img.group-image.group-image-input-preview.lazy(data-src=group.ImageLink("small"), data-webp="true", data-color=group.AverageColor(), alt="Group image")
|
14
pages/group/image.scarlet
Normal file
14
pages/group/image.scarlet
Normal file
@ -0,0 +1,14 @@
|
||||
.group-image-container
|
||||
vertical
|
||||
align-items center
|
||||
|
||||
.group-image
|
||||
flex-shrink 0
|
||||
width 70px
|
||||
height 70px
|
||||
margin-right 1rem
|
||||
border-radius ui-element-border-radius
|
||||
object-fit cover
|
||||
|
||||
.group-image-input-preview
|
||||
margin 0
|
@ -12,6 +12,14 @@ component GroupInfo(group *arn.Group, member *arn.GroupMember, user *arn.User)
|
||||
.group-info-section
|
||||
h3.mountable Rules
|
||||
.group-rules.mountable!= markdown.Render(group.Rules)
|
||||
|
||||
if len(group.Tags) > 0
|
||||
.group-info-section
|
||||
h3.mountable Tags
|
||||
|
||||
.tags.group-tags.mountable
|
||||
each tag in group.Tags
|
||||
.tag= tag
|
||||
|
||||
.group-info-section
|
||||
h3.mountable Founder
|
||||
|
@ -1,2 +1,5 @@
|
||||
.group-info-section
|
||||
margin-bottom content-padding
|
||||
margin-bottom content-padding
|
||||
|
||||
.group-founder
|
||||
justify-content flex-start !important
|
@ -9,4 +9,4 @@ component GroupMembers(group *arn.Group, member *arn.GroupMember, user *arn.User
|
||||
.buttons
|
||||
button.mountable
|
||||
Icon("user-plus")
|
||||
span= fmt.Sprintf("Join %s", group.Name)
|
||||
span= fmt.Sprintf(`Join "%s"`, group.Name)
|
2
pages/group/members.scarlet
Normal file
2
pages/group/members.scarlet
Normal file
@ -0,0 +1,2 @@
|
||||
.group-members
|
||||
margin-bottom content-padding
|
@ -5,4 +5,5 @@ component GroupTabs(group *arn.Group, member *arn.GroupMember, user *arn.User)
|
||||
Tab("Members", "globe", group.Link() + "/members")
|
||||
|
||||
if member != nil && member.Role == "founder"
|
||||
Tab("Edit", "pencil", group.Link() + "/edit")
|
||||
Tab("Edit", "pencil", group.Link() + "/edit")
|
||||
Tab("Edit image", "image", group.Link() + "/edit/image")
|
@ -18,7 +18,7 @@ component Groups(groups []*arn.Group, groupsPerPage int, user *arn.User)
|
||||
#load-more-target.groups
|
||||
each group in groups
|
||||
a.group.mountable(href=group.Link())
|
||||
img.group-image.lazy(data-src=group.ImageURL(), alt=group.Name)
|
||||
img.group-image.lazy(data-src=group.ImageLink("small"), data-webp="true", data-color=group.AverageColor(), alt=group.Name)
|
||||
|
||||
.group-info
|
||||
h3.group-name= group.Name
|
||||
|
@ -4,8 +4,11 @@ const group-padding-x = 0.75rem
|
||||
.groups
|
||||
display grid
|
||||
grid-gap content-padding-half
|
||||
// grid-template-columns repeat(auto-fill, min(100%, 520px))
|
||||
// justify-content center
|
||||
|
||||
> 600px
|
||||
.groups
|
||||
grid-template-columns repeat(auto-fit, 520px)
|
||||
justify-content center
|
||||
|
||||
.group
|
||||
horizontal
|
||||
@ -21,21 +24,18 @@ const group-padding-x = 0.75rem
|
||||
background-color theme-black
|
||||
text-shadow none
|
||||
|
||||
.group-image
|
||||
width 70px
|
||||
height 70px
|
||||
margin-right 1rem
|
||||
border-radius ui-element-border-radius
|
||||
|
||||
.group-info
|
||||
vertical
|
||||
overflow hidden
|
||||
|
||||
.group-name
|
||||
horizontal
|
||||
align-items center
|
||||
// horizontal
|
||||
// align-items center
|
||||
clip-long-text
|
||||
|
||||
.group-tagline
|
||||
opacity 0.6
|
||||
clip-long-text
|
||||
|
||||
.group-member-count
|
||||
position absolute
|
||||
|
@ -14,4 +14,5 @@ func Register(l *layout.Layout) {
|
||||
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/edit/image", group.EditImage)
|
||||
}
|
||||
|
@ -3,7 +3,7 @@ const inventory-slot-size = 64px
|
||||
.inventory
|
||||
display grid
|
||||
grid-gap 0.25rem
|
||||
grid-template-columns repeat(auto-fit, inventory-slot-size)
|
||||
grid-template-columns repeat(auto-fill, inventory-slot-size)
|
||||
grid-auto-rows inventory-slot-size
|
||||
justify-content center
|
||||
width 100%
|
||||
|
Reference in New Issue
Block a user