add save playlist feature

NOTES.md

@@ -48,7 +48,7 @@
   - [x] Show current playlists
   - [x] `Replace` current queue with playlist button
   - [x] `Attach` playlist to current queue button
-  - [ ] `Save` current queue as playlist button
+  - [x] `Save` current queue as playlist button
     - [x] Show dialog
   - [x] `Delete` selected playlist button
     
@@ -81,8 +81,6 @@
   - [x] GET `/api/queue/attach/:playlist_name`
   - [ ] `/api/list_database/:path`
   - [x] GET `/api/playlists`
+  - [x] POST `/api/playlists/:name`
   - [x] GET `/api/playlists/:name`
   - [x] DELETE `/api/playlists/:name`
-  - [ ] `/api/save_playlist`
-  - [ ] `/api/delete_playlist`
-

mpd.go

@@ -367,10 +367,28 @@ func deletePlaylist(c echo.Context) error {
 
 	err = conn.PlaylistRemove(name)
 	if err != nil {
-		c.Logger().Error(fmt.Sprintf("Couldn't delete playlist %s", name))
 		c.Logger().Error(err)
 		return c.String(http.StatusBadRequest, err.Error())
 	}
 
 	return c.JSON(http.StatusNoContent, "")
 }
+
+func savePlaylist(c echo.Context) error {
+	// Connect to MPD server
+	conn, err := mpd.Dial("tcp", "localhost:6600")
+	if err != nil {
+		c.Logger().Error(err)
+	}
+	defer conn.Close()
+
+	name := c.Param("name")
+
+	err = conn.PlaylistSave(name)
+	if err != nil {
+		c.Logger().Error(err)
+		return c.String(http.StatusBadRequest, err.Error())
+	}
+
+	return c.JSON(http.StatusCreated, "")
+}

server.go

@@ -95,6 +95,7 @@ func main() {
 	g.GET("/queue/attach/:playlist_name", attachPlaylist)
 
 	g.GET("/playlists", listPlaylists)
+	g.POST("/playlists/:name", savePlaylist)
 	g.GET("/playlists/:name", listPlaylist)
 	g.DELETE("/playlists/:name", deletePlaylist)
 

static/index.js

@@ -7,7 +7,7 @@ const VOLUME_STEP = 5;
 
 const dialog_save_playlist = document.getElementById("save-playlist");
 const control_playlist_name = document.getElementById("control-playlist-name");
-const dialog_save_playlist_submit = document.querySelector("#save-playlist button");
+const dialog_save_playlist_submit = document.querySelector("#save-playlist form button");
 const dialog_save_playlist_close = document.querySelector("#save-playlist .close");
 
 const connection_state = document.getElementById("connection-state");
@@ -144,10 +144,12 @@ tab_playlists.addEventListener("click", () => {
   }
 });
 
+// Show "Save playlist" modal
 control_save_playlist.addEventListener("click", () => {
   dialog_save_playlist.showModal()
 });
 
+// Close "Save playlist" modal
 dialog_save_playlist_close.addEventListener("click", () => {
   dialog_save_playlist.close()
 });
@@ -174,10 +176,14 @@ control_attach_playlist.addEventListener("click", () => {
   });
 });
 
+// Save current queue as new playlist and refresh playlist list
 dialog_save_playlist_submit.addEventListener("click", () => {
-  fetch(`${API_URL}/playlists`, {method: "PUT"}).then(async r => {
+  fetch(`${API_URL}/playlists/${control_playlist_name.value}`, {method: "POST"}).then(async r => {
     if (r.status === 201) {
       console.log(`Playlist "${control_playlist_name.value}" saved`)
+      refreshPlaylists()
+    } else {
+      console.error(`API returned ${r.status}: ${r.statusText}`);
     }
   });
 });