updated: most edit menu things working

diff --git a/public/css/index.css b/public/css/index.css
index 4d4fbe7074e73c00fa85011fc6a96358a19dea1b..4dcfc54ac11cdf644c41142bbdf17e851abb60a2 100644 (file)
--- a/public/css/index.css
+++ b/public/css/index.css
@@ -41,9 +41,16 @@
        background-color: rgb(240, 240, 240);
        width: 50vw;
 
+       display: none;
+
        #innerEditMenu {
                padding: 30px;
        }
 
+       input {
+               margin: 5px;
+       }
+
+
 }
 

diff --git a/public/index.html b/public/index.html
index a87cf21206ad909be47d3eafee86036c79c1d084..29164c0403486b5fe87260e6852f3b1962a266eb 100644 (file)
--- a/public/index.html
+++ b/public/index.html
@@ -25,21 +25,26 @@
                </div>
        </body>
 
-       <script type="text/javascript" src="/js/index.js"></script>
 
        <div id="editMenu">
                <div id="innerEditMenu">
                        <h1>Song Title</h1>
                        <p id="editMenuSongKey">Key:</p>
-                       <input placeholder="Arist Names (~) separated...">Artist Names</input><br>
-                       <input placeholder="Track Name...">Track Name</input><br>
-                       <input placeholder="URL of complete song...">TrackViewURL</input><br>
-                       <input placeholder="The URL of the song preview">PreviewURL</input><br>
-                       <input placeholder="60 pixel size URL...">ArtworkURL60</input><br>
-                       <input placeholder="100 pixel size URL...">ArtworkURL100</input><br>
-                       <input placeholder="Artist Names as to be displayed...">DisplayArtistNames</input><br>
-                       <input placeholder="Track Name as to be displayed...">DisplayTrackName</input>
+                       <input id="editMenuArtistName" placeholder="Arist Names (~) separated...">Artist Names</input><br>
+                       <input id="editMenuTrackName" placeholder="Track Name...">Track Name</input><br>
+                       <input id="editMenuTrackViewURL" placeholder="URL of complete song...">TrackViewURL</input><br>
+                       <input id="editMenuPreviewURL" placeholder="The URL of the song preview">PreviewURL</input><br>
+                       <input id="editMenuArtworkURL60" placeholder="60 pixel size URL...">ArtworkURL60</input><br>
+                       <input id="editMenuArtworkURL100" placeholder="100 pixel size URL...">ArtworkURL100</input><br>
+                       <input id="editMenuDisplayArtistNames" placeholder="Artist Names as to be displayed...">DisplayArtistNames</input><br>
+                       <input id="editMenuDisplayTrackName" placeholder="Track Name as to be displayed...">DisplayTrackName</input>
+
+                       <br>
+                       <button onclick="closeEditMenu()" id="editMenuCloseButton">Close</button>
+                       <button onclick="" id="editMenuUpdateButton">Update</button>
                </div>
        </div>
+
+       <script type="text/javascript" src="/js/index.js"></script>
 </html>
 

diff --git a/public/js/index.js b/public/js/index.js
index 2702c3d5075eb03ef8f62888fef9a9d83e2d7f16..653013f8e717bd191f461c8c1c605f698c3fa87e 100644 (file)
--- a/public/js/index.js
+++ b/public/js/index.js
@@ -26,7 +26,7 @@ let innerSongList = document.getElementById("innerSongList")
 <div songId="[ID OF SONG (just number)]" id="SONG:XX" class="songElement">
        <p class="songElementCheck">✅</p> // or false
        <img></img> // HERE WOULD GO THE IMAGE
-       <button>EDIT</button>
+       <button onclick="openEditMenu(this.parentElement.songId)">EDIT</button>
        <p class="songElementName">SONG NAME</p>
        <p class="songElementBy">by</p>
        <p class="songElementArtist">ARTIST NAME</p>
@@ -63,6 +63,7 @@ function NewSongElement(exists, songName, artistName, imageUrl, id) {
 
        let editButton = document.createElement("button")
        editButton.innerText = "Edit"
+       editButton.addEventListener("click", function() { openEditMenu(wrapper.songId) })
        
        let idP = document.createElement("p")
        idP.innerText = id
@@ -196,18 +197,49 @@ songFilterInDB.oninput = (event) => {updateSongListWithFilter(event)}
  * (this should also close when clicking outside obviously)
  **/
 
+let editMenu = document.getElementById("editMenu")
+
+let editMenuSongKey = document.getElementById("editMenuSongKey")
+let editMenuArtistName = document.getElementById("editMenuArtistName")
+let editMenuTrackName = document.getElementById("editMenuTrackName")
+let editMenuTrackViewURL = document.getElementById("editMenuTrackViewURL")
+let editMenuPreviewURL = document.getElementById("editMenuPreviewURL")
+let editMenuArtworkURL60 = document.getElementById("editMenuArtworkURL60")
+let editMenuArtworkURL100 = document.getElementById("editMenuArtworkURL100") 
+let editMenuDisplayArtistNames = document.getElementById("editMenuDisplayArtistNames")
+let editMenuDisplayTrackName = document.getElementById("editMenuDisplayTrackName")
+
+
+function openEditMenu(songId) {
+       console.log("songid", songId)
+
+       let song = songList.find((v, _1, _2) => { return v.Key.replace("song:", "") == songId })
+       openEditMenuWithSong(song)
+}
+
+
 /**
  *
  **/
-function openEditMenu() {
-
+function openEditMenuWithSong(song) {
+       editMenu.style.display = "block";
+
+       editMenuSongKey.value = song.Key
+       editMenuArtistName.value = song.ArtistName
+       editMenuTrackName.value = song.TrackName
+       editMenuTrackViewURL.value = song.TrackViewURL
+       editMenuPreviewURL.value = song.PreviewURL
+       editMenuArtworkURL60.value = song.ArtworkURL60
+       editMenuArtworkURL100.value = song.ArtworkURL100
+       editMenuDisplayArtistNames.value = song.DisplayArtistNames
+       editMenuDisplayTrackName.value = song.DisplayTrackName
 }
 
 /**
  *
  **/
 function closeEditMenu() {
-
+       editMenu.style.display = "none";
 }
 
 /**

diff --git a/songmanager b/songmanager
index a76bf0a408002e10629affbe7db1d36f13a5a6fa..efd5226de1363b753aa7e7791644c1d0a77133b5 100755 (executable)
Binary files a/songmanager and b/songmanager differ