play/pause works
This commit is contained in:
		
							parent
							
								
									83297238c2
								
							
						
					
					
						commit
						671bcd300f
					
				
					 4 changed files with 24 additions and 22 deletions
				
			
		
							
								
								
									
										8
									
								
								NOTES.md
									
										
									
									
									
								
							
							
						
						
									
										8
									
								
								NOTES.md
									
										
									
									
									
								
							|  | @ -7,13 +7,13 @@ | |||
|   - [ ] Display config dialog (is this even needed?) | ||||
|   - [x] `Update DB` button | ||||
|     - [x] Disable if running update is detected | ||||
|   - [ ] `Previous Track` button | ||||
|   - [ ] `Next Track` button | ||||
|   - [x] `Previous Track` button | ||||
|   - [x] `Next Track` button | ||||
|   - [x] `Stop` button | ||||
|   - [x] `Play` button | ||||
|     - [ ] `Pause` button | ||||
|     - [x] `Pause` button | ||||
|   - [x] Track seeker | ||||
|   - [ ] `Repeat` toggle | ||||
|   - [x] `Repeat` toggle | ||||
|   - [ ] `Shuffle` toggle | ||||
|   - [ ] xfade | ||||
|     - [ ] decrease | ||||
|  |  | |||
|  | @ -124,7 +124,7 @@ func wsServe(c echo.Context) error { | |||
| 				c.Logger().Error(err) | ||||
| 				break | ||||
| 			} else { | ||||
| 				log.Println(msg) | ||||
| 				// log.Print(msg) | ||||
| 				if strings.ToLower(msg) == "#status" { | ||||
| 					status, err := mpdConn.Status() | ||||
| 					if err != nil { | ||||
|  |  | |||
							
								
								
									
										30
									
								
								static/controls.js
									
										
									
									
										vendored
									
									
								
							
							
						
						
									
										30
									
								
								static/controls.js
									
										
									
									
										vendored
									
									
								
							|  | @ -1,3 +1,5 @@ | |||
| // Configuration
 | ||||
| 
 | ||||
| const API_URL = `${document.location.protocol}//${document.location.host}/api`; | ||||
| const VOLUME_STEP = 5; | ||||
| 
 | ||||
|  | @ -130,21 +132,21 @@ control_update_db.addEventListener("click", e => { | |||
| }); | ||||
| control_previous.addEventListener("click", e => { | ||||
|   fetch(`${API_URL}/previous_track`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
| }); | ||||
| control_play_pause.addEventListener("click", e => { | ||||
|   if (e.target.innerHTML === "⏵︎") {  // TODO: check is never true
 | ||||
|   if (e.target.innerHTML === "⏸︎") {  // pause  // TODO: check is never true
 | ||||
|     fetch(`${API_URL}/pause`).then(async r => { | ||||
|       if (200 >= r.status < 300) { | ||||
|       if (r.status >= 400) { | ||||
|         console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|       } | ||||
|     }); | ||||
|   } else {  // Pause
 | ||||
|     fetch(`${API_URL}/play`).then(async r => { | ||||
|       if (200 >= r.status < 300) { | ||||
|       if (r.status >= 400) { | ||||
|         console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|       } | ||||
|     }); | ||||
|  | @ -152,21 +154,21 @@ control_play_pause.addEventListener("click", e => { | |||
| }); | ||||
| control_stop.addEventListener("click", e => { | ||||
|   fetch(`${API_URL}/stop`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
| }); | ||||
| control_next.addEventListener("click", e => { | ||||
|   fetch(`${API_URL}/next_track`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
| }); | ||||
| control_progress.addEventListener("change", e => { | ||||
|   fetch(`${API_URL}/seek/${e.target.value}`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
|  | @ -180,7 +182,7 @@ control_repeat.addEventListener("click", e => { | |||
|     e.target.dataset.state = "on"; | ||||
|   } | ||||
|   fetch(`${API_URL}/repeat`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
|  | @ -194,7 +196,7 @@ control_shuffle.addEventListener("click", e => { | |||
|     e.target.dataset.state = "on"; | ||||
|   } | ||||
|   fetch(`${API_URL}/random`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
|  | @ -202,7 +204,7 @@ control_shuffle.addEventListener("click", e => { | |||
| control_xfade_minus.addEventListener("click", e => { | ||||
|   // TODO: not yet implemented
 | ||||
|   fetch(`${API_URL}/xfade`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
|  | @ -210,7 +212,7 @@ control_xfade_minus.addEventListener("click", e => { | |||
| control_xfade_plus.addEventListener("click", e => { | ||||
|   // TODO: not yet implemented
 | ||||
|   fetch(`${API_URL}/xfade`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
|  | @ -218,7 +220,7 @@ control_xfade_plus.addEventListener("click", e => { | |||
| control_volume_up.addEventListener("click", e => { | ||||
|   const v = Math.min(parseInt(control_volume.value) + VOLUME_STEP, 100); | ||||
|   fetch(`${API_URL}/volume/${v}`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
|  | @ -228,7 +230,7 @@ control_volume_up.addEventListener("click", e => { | |||
| control_volume_down.addEventListener("click", e => { | ||||
|   const v = Math.max(parseInt(control_volume.value) - VOLUME_STEP, 0); | ||||
|   fetch(`${API_URL}/volume/${v}`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
|  | @ -236,7 +238,7 @@ control_volume_down.addEventListener("click", e => { | |||
| }); | ||||
| control_volume.addEventListener("change", e => { | ||||
|   fetch(`${API_URL}/volume/${e.target.value}`).then(async r => { | ||||
|     if (200 >= r.status < 300) { | ||||
|     if (r.status >= 400) { | ||||
|       console.error(`API returned ${r.status}: ${r.statusText}`); | ||||
|     } | ||||
|   }); | ||||
|  |  | |||
|  | @ -13,21 +13,21 @@ function addSongToQueue(song) { | |||
|   length.innerText = song.length; | ||||
|   const actions = document.createElement("td"); | ||||
|   actions.classList.add("actions"); | ||||
|   // TODO: maybe use a instead of button?
 | ||||
|   // TODO: maybe use `a` instead of `button`?
 | ||||
|   const moveUp = document.createElement("button"); | ||||
|   moveUp.classList.add("borderless"); | ||||
|   moveUp.innerHTML = "🔺"; // 🔺 Red Triangle Pointed Down
 | ||||
|   moveUp.addEventListener("click", event => { | ||||
|     console.log(`DEBUG: move song ${song.id} up`); | ||||
|   }); | ||||
|   // TODO: maybe use a instead of button?
 | ||||
|   // TODO: maybe use `a` instead of `button`?
 | ||||
|   const moveDown = document.createElement("button"); | ||||
|   moveDown.classList.add("borderless"); | ||||
|   moveDown.innerHTML = "$#x1F53B;"; // 🔻 Red Triangle Pointed Up
 | ||||
|   moveDown.addEventListener("click", event => { | ||||
|     console.log(`DEBUG: move song ${song.id} down`); | ||||
|   }); | ||||
|   // TODO: maybe use a instead of button?
 | ||||
|   // TODO: maybe use `a` instead of `button`?
 | ||||
|   const remove = document.createElement("button"); | ||||
|   remove.classList.add("borderless"); | ||||
|   remove.innerHTML = "$#x274C;"; // ❌ Cross mark; 🗑️ Wastebasket
 | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue