v0.4.1

Author: BNTFryingPan

README.md

@@ -2,16 +2,17 @@
 A music player that has a UI based on the UI of the Super Smash Bros. Ultimate music interface.
 
 # notice
+This issue is fixed as of v0.4.1
 v0.3.8 added a caching feature to the song list for albums, so opening the page for an album will be faster. This may cause issues if you move folders around or add/remove tracks from a folder/album in explorer. If you have any problems, open the folder, and delete the .ssbu-music file, which should clear the cache of the song list. The next time you open that album, the song list will be re-created, which may take a second, depending on how many songs are in that album.
 
 # Known Issues
-v0.3.8
-- Caching (see above)
+Last updated for: v0.4.1
 - Song list is not sorted by track number (its sorted by whatever order it reads files in)
 
 # Current Features
 - Partial Twitch integration
     - Currently can say in chat what you are currently listening to when a user does !song
+    - Can announce when a new song plays automatically
     - See planned features for more
 - Can shuffle music from your default music directory (on windows C:/Users/\<user\>/Music)
 - Automatically sorts them into albums from which they are from, as well as an album that shows songs that are not in albums and an album that lists all songs
@@ -33,24 +34,24 @@ Checked off boxes are currntly being worked on
     - [ ] Playlist support
         - [ ] Will be able to play a playlist
     - [ ] Play songs from YouTube
-- [ ] Custom Playlists
+- [X] Custom Playlists
     - [ ] Includes both local music files and youtube videos in the same playlist
         - [ ] Automatically skip youtube videos when you dont have internet
         - [ ] Option to only play local files or only youtube videos when online
 - [ ] Music Settings per song
     - [ ] Volume
     - [ ] Normalization
     - [ ] more stuff probably
-- [ ] Faster UI, currently its kinda slow, and bad. but it looks good
+- [X] Faster UI. Mostly happy with performance, but inital startup is quite slow and bad
 
 # notes
 Currently only optimized and tested on Windows 10, should work on older versions of windows, known to at least start on Ubuntu, but not tested very much.
 
-Im not creating these as gh issues for now because im not focusing on ubuntu developmenet for now
+Im not creating these as gh issues for now because im not focusing on ubuntu development for now
 Known issues on Ubuntu:
-Fails to install with default package setup (mainly ewc causing issues, as it only works on windows)
-Window icons (close, minimize, maximie) dont render correctly, as the font is windows exclusive as far as i know (Seoge UI)
-Title bar is rendered what appears to be 100% its height below where it should be. (it looks like there is an invisible title bar above it basically, but i dont think thats actually what the issue is)
+- Fails to install with default package setup (mainly ewc causing issues, as it only works on windows)
+- Window icons (close, minimize, maximie) dont render correctly, as the font is windows exclusive as far as i know (Seoge UI)
+- Title bar is rendered what appears to be 100% its height below where it should be.
 
 music might not even play on ubuntu because i didnt have any music on my ubuntu install, and was too lazy to get some.
 

changelog.txt

@@ -1,3 +1,31 @@
+v0.4.1
+Other album will no longer show up if it has no songs.
+Adjusted scrollbar css a bit because i still havent finalized any of the design elements yet pretty much and its all under 
+    active development
+Now saves settings (windows 10 acrylic, and volume slider position)
+Added support for .ogg files
+Fixed trying to open the album you just opened would not do anything.
+Adjusted how the sliders look, and added labels to the sliders
+Adjusted RPC to show version and if the music player is running in dev mode
+Adjusted how the title bar version is shown when in a dev build
+Removed the song list caching feature for now as it very much caused problems if you moved songs around, but i still fixed
+    the issue it was fixing by re-using the parsed metadata that was loaded for all songs when the player starts
+Got some progress on playlists done, however they are still unusable for end-users at this time.
+    Added a button to add a song to a playlist (doesnt work yet)
+    Made playlists actually load and function.
+        By function, i mean it can open a playlist similar to how it opens an album, and it can play songs if any are added
+        It does not load playlists from anywhere currently
+    Playlists will be fully functional for local files by v0.5 (could be sooner)
+Optimized a few things
+    internal function getSongData() will attept to get song data from the All Songs album instead of reading file from disk
+        fixes the issue that caching the song list "fixed" but better, as this will also help in other places too.
+        this also causes less reads and writes on the disk so if you have a hard drive and not an ssd, it should be much
+            faster
+    made some variables that were not supposed to be global not global anymore because memory usage and possible interference
+    Switched to electron-acrylic-window instead of ewc for the acrylic effect. This enables compatability for Vibrancy on OSX
+        This might also improve performance on windows, but i dont know if it does or not
+Started working on a context menu when you right click songs. Does not work yet though, so its hidden
+
 v0.4.0
 Will now load from files defined in Music/folders.ssbu-music
     Lines in that file that start with any of the following characters will be ignored: ['#', '//', '$', '!', '-']

index.html

@@ -45,6 +45,8 @@
             <audio id="song">ok boomer</audio>
         </div>
 
+        <div id="context-menu" style="display: none; top: 0; left: 0;">this is the context menu</div>
+
         <header id="titlebar">
             <div id="drag-region">
 
@@ -84,7 +86,7 @@
             <div id='top-settings' style='display: none'>
                 <table>
                     <tr>
-                        <td>Enable Windows 10 Acrylic Background</td>
+                        <td>Enable Vibrancy (Windows and OSX only)</td>
                         <td><input id="settings-acrylic" type="checkbox" checked></td>
                     </tr>
                     <tr>
@@ -135,15 +137,22 @@
 
                 <div id="album-info-header">
                     <img id="album-info-header-img" class="album-logo" src='./assets/other-album.png' height="100%">
-                    <div id="album-info-header-thing"><span id="album-info-header-thing-text">asdf</span></div>
+                    <div id="album-info-header-thing"><span id="album-info-header-thing-text"></span></div>
                 </div>
 
                 <div id='list-container'>
                     <input id="list-container-scrollbar" type="range" step="1">
                     <div class="list-spacer"></div>
-                    <div id="song-list" style="display: none">
-                        <table id='song-list-t'>
-                            <tbody id='song-list-tbody'>
+                    <div id="song-list" class="song-list" style="display: none">
+                        <table id='song-list-t' class="song-list-t">
+                            <tbody id='song-list-tbody' class="song-list-tbody">
+                                <tr><td></td><td>0</td><td>Example Song</td><td>0:00</td></tr>
+                            </tbody>
+                        </table>
+                    </div>
+                    <div id="pl-song-list" class="song-list" style="display: none">
+                        <table id='pl-song-list-t' class="song-list-t">
+                            <tbody id='pl-song-list-tbody' class="song-list-tbody">
                                 <tr><td></td><td>0</td><td>Example Song</td><td>0:00</td></tr>
                             </tbody>
                         </table>
@@ -239,7 +248,8 @@
                 </div>
                 <div id='song-info'>
                     <input type="button" onclick="toggleSongInfoModal()" value="Song Info" id="song-info-button">
-                    <div id="advanced-song-info-modal" style="display: none">
+                    <input type="button" onclick="openAddToPlaylistMenu()" value="Add To Playlist" id="song-info-atp-button">
+                    <div id="advanced-song-info-modal" style="display: none;z-index:10">
                         <input type="button" onclick="toggleSongInfoModal(false)" value="Back" id="song-info-close">
                         <span id="song-info-title2">title - album - artist</span><br>
                         <span id="song-info-genre">genre - comment</span><br>
@@ -253,16 +263,16 @@
                 </div>
                 <div id='song-controls'>
                     <div id='song-sliders'>
-                        <input type="range" step="0.000001" value=1 max=1 min=0 id="now-playing-volume-slider" oninput="updateVolume()" class="seek-slider"><br>
-                        <input type="range" step="0.000001" id="now-playing-seek-slider" oninput="updateSongProgressFromBar()" class="song-progress seek-slider">
+                        <span>volume</span><input type="range" step="0.000001" value=1 max=1 min=0 id="now-playing-volume-slider" oninput="updateVolume()" class="seek-slider"><br>
+                        <span>seek</span><input type="range" step="0.000001" id="now-playing-seek-slider" oninput="updateSongProgressFromBar()" class="song-progress seek-slider">
                     </div>
                     <div id='song-buttons'>
                         <button id="np-prev"    onclick="prevSong()"><img src="./assets/skip.png" style='transform: scaleX(-1);'></button>
                         <button id="np-pause"   onclick="pauseSong()"><img id="np-pause-img" src="./assets/play.png"></button>
                         <button id="np=next"    onclick="nextSong()"><img src="./assets/skip.png"></button>
                         <button id="np-shuffle" onclick="shuffleSongs()"><img src="./assets/unknown.png"></button>
                     </div>
-                    <div id='shuffle-state'>Random</div>
+                    <div id='shuffle-state'>Shuffle All</div>
                 </div>
                 <canvas id='visualizer-canvas'></canvas>
             </div>

js/albums.js

@@ -1,5 +1,4 @@
 async function openAlbum(albumName) {
-    console.log(nowPlaying['openedAlbum'])
     var path = "null";
     for (song in songs[albumName]['songs']) {
         path = songs[albumName]['songs'][song][0]['folder']
@@ -16,21 +15,15 @@ async function openAlbum(albumName) {
     }
 
     if (nowPlaying['openedAlbum'] != albumName) {
-        let attemptedLoad = loadAlbumHtmlFromFile(path, albumName);
-        if (attemptedLoad != false) {
-            document.getElementById('song-list-tbody').innerHTML = attemptedLoad;
-            hideAlbumLayer()
-        }
         let updatedHTML = "";
         for (song in songs[albumName]["songs"]) {
             updatedHTML += await createSongListEntryFromSongData(songs[albumName]['songs'][song][0]['fileLocation']);
         }
-        saveAlbumHtmlToFile(path, albumName, updatedHTML)
 
-        if (attemptedLoad === false) {
-            document.getElementById('song-list-tbody').innerHTML = updatedHTML;
-            hideAlbumLayer()
-        }
+        document.getElementById('song-list-tbody').innerHTML = updatedHTML;
+        hideAlbumLayer()
+    } else {
+        hideAlbumLayer()
     }
 
 
@@ -43,7 +36,6 @@ async function openAlbum(albumName) {
 async function loadAlbums() {
     var albList = document.getElementById('album-list');
     albList.innerHTML = ""
-    //console.log(JSON.stringify(songs))
     for (var alb in songs) {
         if (songs[alb]["extraText"]) {
             var extraText = songs[alb]["extraText"]
@@ -52,10 +44,12 @@ async function loadAlbums() {
             var extraText = ""
             var classes = "album select-hover-anim hide-text"
         }
-        //console.log(alb)
-        //console.log("<div class='album select-hover-anim' style='background-image:" + songs[alb]['albumArt'] + "></div>");
-        albList.innerHTML += "<button type='button' value='" + extraText + "' class='" + classes + "' onclick='openAlbum(\"" + alb + "\")' style='background-image:url(" + songs[alb]['albumArt'] + ")'>" + extraText + "</button>";
-        //console.log(albList.innerHTML);
+        albList.innerHTML += "<button type='button' id='album-list-album-" + alb.toLowerCase() + "' value='" + extraText + "' class='" + classes + "' onclick='openAlbum(\"" + alb + "\")' style='background-image:url(" + songs[alb]['albumArt'] + ")'>" + extraText + "</button>";
+    }
+    if (songs['Other']['songCount'] === 0) {
+        document.getElementById("album-list-album-other").style.display = "none";
+    } else {
+        document.getElementById("album-list-album-other").style.display = "block";
     }
     return true;
 }

js/folder-data.js

@@ -33,8 +33,8 @@ function parseFolderData(dir) {
     return parseFolderDataFile(folderFile);
 }
 
-function saveAlbumHtmlToFile(path, album, html) {
-    console.log(path + ", " + album)
+/*function saveAlbumHtmlToFile(path, album, html) {
+    //console.log(path + ", " + album)
     if (album == "All Songs" || album == "Other") path = platFolders.getMusicFolder();
     let f = parseFolderDataFile(path + "/" + getDataFileName());
     if (!f['albums'][album]) {
@@ -52,7 +52,7 @@ function loadAlbumHtmlFromFile(path, album) {
     } else {
         return f['albums'][album]['html']
     }
-}
+}*/
 
 function parseFolderDataFile(path) {
     if (fs.existsSync(path)) {
@@ -67,4 +67,21 @@ function parseFolderDataFile(path) {
 
 function saveFolderDataFile(path, data) {
     fs.writeFileSync(path + "/" + getDataFileName(), JSON.stringify(data))
+}
+
+function readSettingsFile() {
+    if (fs.existsSync(platFolders.getMusicFolder() + "/settings.ssbu-music")) {
+        return JSON.parse(fs.readFileSync(platFolders.getMusicFolder() + "/settings.ssbu-music"))
+    } else {
+        fs.writeFileSync(platFolders.getMusicFolder() + "/settings.ssbu-music", JSON.stringify(userSettings))
+        return userSettings
+    }
+}
+
+function saveSettingsFile() {
+    fs.writeFileSync(platFolders.getMusicFolder() + "/settings.ssbu-music", JSON.stringify(userSettings))
+}
+
+function loadSettings() {
+    userSettings = readSettingsFile()
 }