From a30c69f9c2c79ae07b32e0b63ab20f36e5d4daaf Mon Sep 17 00:00:00 2001 From: Araozu Date: Tue, 8 Oct 2024 17:40:57 -0500 Subject: [PATCH] feat: Add simple player UI --- src/modules/album/album.templ | 19 ++-- src/modules/album/album_templ.go | 16 +++- src/modules/index/index.go | 2 +- src/modules/index/index.templ | 23 +++-- src/modules/index/index_templ.go | 14 ++- src/utils/utils.go | 5 + src/utils/utils.templ | 72 +++++++++++++- src/utils/utils_templ.go | 159 ++++++++++++++++++++++++++++++- 8 files changed, 276 insertions(+), 34 deletions(-) diff --git a/src/modules/album/album.templ b/src/modules/album/album.templ index 794660b..bb51aeb 100644 --- a/src/modules/album/album.templ +++ b/src/modules/album/album.templ @@ -17,20 +17,19 @@ templ albumTempl(albumId string, album *utils.Album, songs []utils.Song) {

for _, song := range songs { -

+

{ song.Title }

}
- + @utils.MusicPlayer() } } diff --git a/src/modules/album/album_templ.go b/src/modules/album/album_templ.go index fbb7eef..694ecd2 100644 --- a/src/modules/album/album_templ.go +++ b/src/modules/album/album_templ.go @@ -95,9 +95,13 @@ func albumTempl(albumId string, album *utils.Album, songs []utils.Song) templ.Co return templ_7745c5c3_Err } var templ_7745c5c3_Var6 string - templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("on click js playMusic('%s');", song.ID)) + templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("on click js play('%s', '%s', '%s')", + utils.EscapeSingle(song.Title), + utils.EscapeSingle(song.Artist), + song.ID, + )) if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/album/album.templ`, Line: 20, Col: 82} + return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/album/album.templ`, Line: 26, Col: 7} } _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6)) if templ_7745c5c3_Err != nil { @@ -110,7 +114,7 @@ func albumTempl(albumId string, album *utils.Album, songs []utils.Song) templ.Co var templ_7745c5c3_Var7 string templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(song.Title) if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/album/album.templ`, Line: 21, Col: 18} + return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/album/album.templ`, Line: 28, Col: 18} } _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7)) if templ_7745c5c3_Err != nil { @@ -121,7 +125,11 @@ func albumTempl(albumId string, album *utils.Album, songs []utils.Song) templ.Co return templ_7745c5c3_Err } } - _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("") + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = utils.MusicPlayer().Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } diff --git a/src/modules/index/index.go b/src/modules/index/index.go index 918cf5f..17942b5 100644 --- a/src/modules/index/index.go +++ b/src/modules/index/index.go @@ -3,10 +3,10 @@ package index import ( "acide/src/utils" "fmt" - "log" "net/http" "github.com/labstack/echo" + "github.com/labstack/gommon/log" ) func SetupRoutes(g *echo.Group) { diff --git a/src/modules/index/index.templ b/src/modules/index/index.templ index 7f12b52..c9dedb4 100644 --- a/src/modules/index/index.templ +++ b/src/modules/index/index.templ @@ -7,19 +7,18 @@ import ( templ IndexTempl(albums []utils.Album) { @utils.SkeletonTempl() { -
- -

- Random Albums -

-
- for _, album := range albums { - @albumCard(album) - } -
+ +

+ Random Albums +

+
+ for _, album := range albums { + @albumCard(album) + }
+ @utils.MusicPlayer() } } diff --git a/src/modules/index/index_templ.go b/src/modules/index/index_templ.go index 3f6d00e..d55c831 100644 --- a/src/modules/index/index_templ.go +++ b/src/modules/index/index_templ.go @@ -46,7 +46,7 @@ func IndexTempl(albums []utils.Album) templ.Component { }() } ctx = templ.InitializeContext(ctx) - _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("

Random Albums

") + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("

Random Albums

") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -56,7 +56,11 @@ func IndexTempl(albums []utils.Album) templ.Component { return templ_7745c5c3_Err } } - _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
") + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = utils.MusicPlayer().Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -98,7 +102,7 @@ func albumCard(album utils.Album) templ.Component { var templ_7745c5c3_Var4 string templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("/covers/%s", album.ID)) if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/index/index.templ`, Line: 29, Col: 49} + return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/index/index.templ`, Line: 28, Col: 49} } _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4)) if templ_7745c5c3_Err != nil { @@ -120,7 +124,7 @@ func albumCard(album utils.Album) templ.Component { var templ_7745c5c3_Var6 string templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(album.Name) if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/index/index.templ`, Line: 34, Col: 16} + return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/index/index.templ`, Line: 33, Col: 16} } _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6)) if templ_7745c5c3_Err != nil { @@ -133,7 +137,7 @@ func albumCard(album utils.Album) templ.Component { var templ_7745c5c3_Var7 string templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(album.Artist) if templ_7745c5c3_Err != nil { - return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/index/index.templ`, Line: 37, Col: 18} + return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/index/index.templ`, Line: 36, Col: 18} } _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7)) if templ_7745c5c3_Err != nil { diff --git a/src/utils/utils.go b/src/utils/utils.go index b5ad2c2..988c3a4 100644 --- a/src/utils/utils.go +++ b/src/utils/utils.go @@ -5,6 +5,7 @@ import ( "errors" "log" "net/http" + "strings" "github.com/a-h/templ" "github.com/labstack/echo" @@ -59,3 +60,7 @@ func Credentials(c echo.Context) (string, string) { return sessionToken.Value, navidromeUrl.Value } + +func EscapeSingle(s string) string { + return strings.ReplaceAll(s, "'", "\\'") +} diff --git a/src/utils/utils.templ b/src/utils/utils.templ index 3828e23..9b16a72 100644 --- a/src/utils/utils.templ +++ b/src/utils/utils.templ @@ -1,5 +1,7 @@ package utils +import "strconv" + templ SkeletonTempl() { @@ -17,9 +19,77 @@ templ SkeletonTempl() { -
+
{ children... }
} + +templ MusicPlayer() { +
+
+   +
+
+

-

+

-

+
+
+ @playIcon(26) +
+ +
+ +} + +templ playIcon(size int) { + + + +} + +templ skipForwardIcon(size int) { + + + +} diff --git a/src/utils/utils_templ.go b/src/utils/utils_templ.go index 78e5a90..8e2ee23 100644 --- a/src/utils/utils_templ.go +++ b/src/utils/utils_templ.go @@ -8,6 +8,8 @@ package utils import "github.com/a-h/templ" import templruntime "github.com/a-h/templ/runtime" +import "strconv" + func SkeletonTempl() templ.Component { return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context @@ -29,7 +31,7 @@ func SkeletonTempl() templ.Component { templ_7745c5c3_Var1 = templ.NopComponent } ctx = templ.ClearChildren(ctx) - _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("Acide Template
") + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("Acide Template
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -45,4 +47,159 @@ func SkeletonTempl() templ.Component { }) } +func MusicPlayer() templ.Component { + return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { + templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context + if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { + return templ_7745c5c3_CtxErr + } + templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W) + if !templ_7745c5c3_IsBuffer { + defer func() { + templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer) + if templ_7745c5c3_Err == nil { + templ_7745c5c3_Err = templ_7745c5c3_BufErr + } + }() + } + ctx = templ.InitializeContext(ctx) + templ_7745c5c3_Var2 := templ.GetChildren(ctx) + if templ_7745c5c3_Var2 == nil { + templ_7745c5c3_Var2 = templ.NopComponent + } + ctx = templ.ClearChildren(ctx) + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
 

-

-

") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = playIcon(26).Render(ctx, templ_7745c5c3_Buffer) + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + return templ_7745c5c3_Err + }) +} + +func playIcon(size int) templ.Component { + return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { + templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context + if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { + return templ_7745c5c3_CtxErr + } + templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W) + if !templ_7745c5c3_IsBuffer { + defer func() { + templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer) + if templ_7745c5c3_Err == nil { + templ_7745c5c3_Err = templ_7745c5c3_BufErr + } + }() + } + ctx = templ.InitializeContext(ctx) + templ_7745c5c3_Var3 := templ.GetChildren(ctx) + if templ_7745c5c3_Var3 == nil { + templ_7745c5c3_Var3 = templ.NopComponent + } + ctx = templ.ClearChildren(ctx) + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + return templ_7745c5c3_Err + }) +} + +func skipForwardIcon(size int) templ.Component { + return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { + templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context + if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { + return templ_7745c5c3_CtxErr + } + templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W) + if !templ_7745c5c3_IsBuffer { + defer func() { + templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer) + if templ_7745c5c3_Err == nil { + templ_7745c5c3_Err = templ_7745c5c3_BufErr + } + }() + } + ctx = templ.InitializeContext(ctx) + templ_7745c5c3_Var6 := templ.GetChildren(ctx) + if templ_7745c5c3_Var6 == nil { + templ_7745c5c3_Var6 = templ.NopComponent + } + ctx = templ.ClearChildren(ctx) + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + return templ_7745c5c3_Err + }) +} + var _ = templruntime.GeneratedTemplate