feat: Play songs

This commit is contained in:
Araozu 2024-10-08 09:49:43 -05:00
parent 9b5948c2a9
commit 633d481866
5 changed files with 33 additions and 6 deletions

4
public/js/howler.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -17,11 +17,20 @@ templ albumTempl(albumId string, album *utils.Album, songs []utils.Song) {
</p>
<div class="text-left">
for _, song := range songs {
<p class="py-2 px-4">
<p class="py-2 px-4" _={ fmt.Sprintf("on click js playMusic('%s');", song.ID) }>
{ song.Title }
</p>
}
</div>
</div>
<script>
function playMusic(songId) {
const sound = new Howl({
src: [`https://navidrome.araozu.dev/rest/stream.view?id=${songId}&v=1.13.0&c=music-to-go&u=fernando&s=49805d&t=4148cd1c83ae1bd01334facf4e70a947`],
html5: true,
});
sound.play();
}
</script>
}
}

View File

@ -90,16 +90,29 @@ func albumTempl(albumId string, album *utils.Album, songs []utils.Song) templ.Co
return templ_7745c5c3_Err
}
for _, song := range songs {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<p class=\"py-2 px-4\">")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<p class=\"py-2 px-4\" _=\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var6 string
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(song.Title)
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf("on click js playMusic('%s');", song.ID))
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `src/modules/album/album.templ`, Line: 20, Col: 82}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
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
}
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}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -108,7 +121,7 @@ func albumTempl(albumId string, album *utils.Album, songs []utils.Song) templ.Co
return templ_7745c5c3_Err
}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div>")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div><script>\n\t\tfunction playMusic(songId) {\n\t\t\tconst sound = new Howl({\n\t\t\t\tsrc: [`https://navidrome.araozu.dev/rest/stream.view?id=${songId}&v=1.13.0&c=music-to-go&u=fernando&s=49805d&t=4148cd1c83ae1bd01334facf4e70a947`],\n\t\t\t\thtml5: true,\n\t\t\t});\n\t\t\tsound.play();\n\t\t}\n\t\t</script>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}

View File

@ -13,6 +13,7 @@ templ SkeletonTempl() {
<link href="https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"/>
<script src="/public/js/htmx.min.js" defer></script>
<script src="/public/js/_hyperscript.min.js" defer></script>
<script src="/public/js/howler.min.js" defer></script>
<script src="https://unpkg.com/htmx-ext-response-targets@2.0.0/response-targets.js" defer></script>
</head>
<body>

View File

@ -29,7 +29,7 @@ func SkeletonTempl() templ.Component {
templ_7745c5c3_Var1 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!doctype html><html lang=\"es\"><head><meta charset=\"utf-8\"><title>Acide Template</title><link href=\"/public/css/output.css\" rel=\"stylesheet\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"><link rel=\"preconnect\" href=\"https://fonts.googleapis.com\"><link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin><link href=\"https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&amp;display=swap\" rel=\"stylesheet\"><script src=\"/public/js/htmx.min.js\" defer></script><script src=\"/public/js/_hyperscript.min.js\" defer></script><script src=\"https://unpkg.com/htmx-ext-response-targets@2.0.0/response-targets.js\" defer></script></head><body><main>")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!doctype html><html lang=\"es\"><head><meta charset=\"utf-8\"><title>Acide Template</title><link href=\"/public/css/output.css\" rel=\"stylesheet\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"><link rel=\"preconnect\" href=\"https://fonts.googleapis.com\"><link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin><link href=\"https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&amp;display=swap\" rel=\"stylesheet\"><script src=\"/public/js/htmx.min.js\" defer></script><script src=\"/public/js/_hyperscript.min.js\" defer></script><script src=\"/public/js/howler.min.js\" defer></script><script src=\"https://unpkg.com/htmx-ext-response-targets@2.0.0/response-targets.js\" defer></script></head><body><main>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}