Support embedded images/albums (closes #41)
This commit is contained in:
video-prize-ranch
parent
3f29e71876
commit
95eaf959b0
5
main.go
5
main.go
|
|
@ -51,16 +51,19 @@ func main() {
|
|||
})
|
||||
|
||||
app.Get("/", pages.HandleFrontpage)
|
||||
app.Get("/:postID.gifv", pages.HandleEmbed)
|
||||
app.Get("/:postID.gifv", pages.HandleGifv)
|
||||
app.Get("/:baseName.:extension", pages.HandleMedia)
|
||||
app.Get("/:postID", pages.HandlePost)
|
||||
app.Get("/:postID/embed", pages.HandleEmbed)
|
||||
app.Get("/a/:postID", pages.HandlePost)
|
||||
app.Get("/a/:postID/embed", pages.HandleEmbed)
|
||||
app.Get("/t/:tag", pages.HandleTag)
|
||||
app.Get("/user/:userID", pages.HandleUser)
|
||||
app.Get("/r/:sub/:postID", pages.HandlePost)
|
||||
app.Get("/user/:userID/cover", pages.HandleUserCover)
|
||||
app.Get("/user/:userID/avatar", pages.HandleUserAvatar)
|
||||
app.Get("/gallery/:postID", pages.HandlePost)
|
||||
app.Get("/gallery/:postID/embed", pages.HandleEmbed)
|
||||
|
||||
app.Listen(utils.Config["addr"].(string) + ":" + utils.Config["port"].(string))
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
package pages
|
||||
|
||||
import (
|
||||
"strings"
|
||||
|
||||
"codeberg.org/video-prize-ranch/rimgo/api"
|
||||
"codeberg.org/video-prize-ranch/rimgo/types"
|
||||
"codeberg.org/video-prize-ranch/rimgo/utils"
|
||||
"github.com/gofiber/fiber/v2"
|
||||
)
|
||||
|
|
@ -10,7 +14,34 @@ func HandleEmbed(c *fiber.Ctx) error {
|
|||
c.Set("Cache-Control", "public,max-age=31557600")
|
||||
c.Set("Content-Security-Policy", "default-src 'none'; media-src 'self'; style-src 'self'; img-src 'self'; font-src 'self'; block-all-mixed-content")
|
||||
|
||||
post, err := types.Album{}, error(nil)
|
||||
switch {
|
||||
case strings.HasPrefix(c.Path(), "/a"):
|
||||
post, err = api.FetchAlbum(c.Params("postID"))
|
||||
case strings.HasPrefix(c.Path(), "/gallery"):
|
||||
post, err = api.FetchPosts(c.Params("postID"))
|
||||
default:
|
||||
post, err = api.FetchMedia(c.Params("postID"))
|
||||
}
|
||||
if post.Id == "" || (err != nil && strings.Contains(err.Error(), "404")) {
|
||||
c.Status(404)
|
||||
return c.Render("errors/404", nil)
|
||||
}
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
|
||||
return c.Render("embed", fiber.Map{
|
||||
"post": post,
|
||||
})
|
||||
}
|
||||
|
||||
func HandleGifv(c *fiber.Ctx) error {
|
||||
utils.SetHeaders(c)
|
||||
c.Set("Cache-Control", "public,max-age=31557600")
|
||||
c.Set("Content-Security-Policy", "default-src 'none'; media-src 'self'; style-src 'self'; img-src 'self'; font-src 'self'; block-all-mixed-content")
|
||||
|
||||
return c.Render("gifv", fiber.Map{
|
||||
"id": c.Params("postID"),
|
||||
})
|
||||
}
|
||||
|
|
@ -2,12 +2,50 @@
|
|||
filter: invert(180deg), hue-rotate(180deg);
|
||||
}
|
||||
|
||||
.postLink {
|
||||
body {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.mediaWrapper {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.media {
|
||||
display: flex;
|
||||
overflow: scroll;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
height: 90vh;
|
||||
}
|
||||
|
||||
.media img, .media video {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.logoContainer {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.rimgoLink {
|
||||
width: 100%;
|
||||
.views {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.postDetails {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.postMeta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 9vh;
|
||||
}
|
||||
|
|
@ -4,22 +4,45 @@
|
|||
<head>
|
||||
{{> partials/head }}
|
||||
|
||||
<link rel="stylesheet" href="/static/fonts/Material-Icons-Outlined.css" />
|
||||
<link rel="stylesheet" href="/static/css/embed.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<video loop poster="/{{id}}.webp" autoplay width="100%">
|
||||
<source src="/{{id}}.webm" type="video/webm" />
|
||||
<source src="/{{id}}.mp4" type="video/mp4" />
|
||||
</video>
|
||||
<div class="postLink">
|
||||
<a href="/{{id}}">
|
||||
<img src="/static/img/rimgo.svg" width="32px" height="32px" class="logo">
|
||||
</a>
|
||||
<a href="/{{id}}" class="rimgoLink">
|
||||
rimgo
|
||||
</a>
|
||||
<a href="/{{id}}.mp4?download=1">download</a>
|
||||
<div class="mediaWrapper">
|
||||
<div class="media">
|
||||
{{#each post.Media}}
|
||||
{{#equal this.Type "image"}}
|
||||
<img src="{{this.Url}}" loading="lazy">
|
||||
{{/equal}}
|
||||
{{#equal this.Type "video"}}
|
||||
<video controls loop>
|
||||
<source type="{{this.MimeType}}" src="{{this.Url}}" />
|
||||
</video>
|
||||
{{/equal}}
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="postMeta">
|
||||
<div class="postDetails">
|
||||
{{#if post.TItle}}
|
||||
<a href="/{{post.Id}}">
|
||||
<h3>{{post.Title}}</h3>
|
||||
</a>
|
||||
{{/if}}
|
||||
<div class="views">
|
||||
<span class="material-icons-outlined" title="Views">visibility</span>
|
||||
<p>{{post.Views}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="logoContainer">
|
||||
<a href="/{{post.Id}}">
|
||||
<img src="/static/img/rimgo.svg" width="32px" height="32px" class="logo">
|
||||
</a>
|
||||
<a href="/{{post.Id}}">
|
||||
rimgo
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
{{> partials/head }}
|
||||
|
||||
<link rel="stylesheet" href="/static/css/embed.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<video loop poster="/{{id}}.webp" autoplay width="100%">
|
||||
<source src="/{{id}}.webm" type="video/webm" />
|
||||
<source src="/{{id}}.mp4" type="video/mp4" />
|
||||
</video>
|
||||
<div class="postMeta">
|
||||
<a href="/{{id}}.mp4?download=1">download</a>
|
||||
<div class="logoContainer">
|
||||
<a href="/{{post.Id}}">
|
||||
<img src="/static/img/rimgo.svg" width="32px" height="32px" class="logo">
|
||||
</a>
|
||||
<a href="/{{post.Id}}">
|
||||
rimgo
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue