From c42aee73086b73a05914eb0d4597bc323fa9393d Mon Sep 17 00:00:00 2001 From: IrosTheBeggar Date: Wed, 29 Mar 2017 02:29:57 -0400 Subject: [PATCH] Cleaned up the web player API --- README.md | 2 +- docs/web_player.md | 5 +++- public/js/mstream.js | 11 ++++++--- public/js/mstream.player.js | 31 ++++++++++-------------- public/js/mstream.vue-player-controls.js | 4 +-- public/mstream.html | 2 +- public/shared.html | 18 ++++++-------- 7 files changed, 35 insertions(+), 38 deletions(-) diff --git a/README.md b/README.md index 039aa47..5c71242 100644 --- a/README.md +++ b/README.md @@ -31,7 +31,7 @@ mStream Express is a special version of the server that comes with all the depen [Download it from our website](http://www.mstream.io/mstream-express) -![mStream Express UI](public/img/designs/mstream-express.png) +![mStream Express UI](public/img/designs/mstream-express.png | width=386) #### Install From Source diff --git a/docs/web_player.md b/docs/web_player.md index c6d2f77..4ebfdd8 100644 --- a/docs/web_player.md +++ b/docs/web_player.md @@ -21,15 +21,18 @@ You can now access the mStream Player through the `MSTREAM` object ## The audioData object -When adding a song to the queue you add it in an object form. The object must contain the `filepath` key in order for it to work +When adding a song to the queue you add it in an object form. The object must contain the `url` key in order for it to work with the player. The webapp also uses the `filepath` key for a few other functions, but it's not necessary for the player to work. + ``` { + url: "vPath/path/to/song.mp3?toke=xxx", filepath: "path/to/song.mp3" } ``` You can store metadata in this object. The structure of the metadata does not matter since it is not used by this library. audioData objects are added to the queue unmodified. This way when you retrieve an object in your view code, you can pull the metadata out exactly the way you stored it + ## API **`addSong(audioData)`** diff --git a/public/js/mstream.js b/public/js/mstream.js index 771b5e1..b72f750 100755 --- a/public/js/mstream.js +++ b/public/js/mstream.js @@ -356,7 +356,10 @@ $(document).ready(function(){ file_location = file_location + '?token=' + accessKey; } - MSTREAM.addSong(file_location, false, raw_location); + MSTREAM.addSong({ + url: file_location, + filepath: raw_location + }); } @@ -611,7 +614,7 @@ $('#search-explorer').on('click', function(){ var stuff = []; for (let i = 0; i < MSTREAM.playlist.length; i++) { //Do something - stuff.push(MSTREAM.playlist[i].rawLocation); + stuff.push(MSTREAM.playlist[i].filepath); } @@ -677,7 +680,7 @@ $('#search-explorer').on('click', function(){ var stuff = []; for (let i = 0; i < MSTREAM.playlist.length; i++) { //Do something - stuff.push(MSTREAM.playlist[i].rawLocation); + stuff.push(MSTREAM.playlist[i].filepath); } @@ -822,7 +825,7 @@ $("#filelist").on('click', '.playlistz', function() { //loop through array and add each file to the playlist var downloadFiles = []; for (let i = 0; i < MSTREAM.playlist.length; i++) { - downloadFiles.push(MSTREAM.playlist[i].rawLocation); + downloadFiles.push(MSTREAM.playlist[i].filepath); } var downloadJOSN = JSON.stringify(downloadFiles); diff --git a/public/js/mstream.player.js b/public/js/mstream.player.js index 60ae11a..7afdb4d 100644 --- a/public/js/mstream.player.js +++ b/public/js/mstream.player.js @@ -10,22 +10,17 @@ var MSTREAM = (function () { mstreamModule.playlist = []; - // The songObject looks like this + // The audioData looks like this // var song = { - // "filepath":"path/to/song", - // "artist":"CCC", - // "album":"GGG", - // "name":" song name" - // "album-art":"path/to/art" + // "url":"vPath/path/to/song.mp3?token=xxx", + // "filepath": "path/to/song.mp3" // } - mstreamModule.addSong = function(filepath, metadata = false, rawLocation = false){ - // TODO: Rename filepath to url, since that what it really is - var song = { - filepath:filepath, - rawLocation:rawLocation + mstreamModule.addSong = function(audioData){ + if(!audioData.url || audioData.url == false){ + return false; } // Handle shuffle @@ -34,7 +29,7 @@ var MSTREAM = (function () { shuffleCache.splice(pos, 0, song); } - return addSongToPlaylist(song); + return addSongToPlaylist(audioData); } function addSongToPlaylist(song){ @@ -107,13 +102,13 @@ var MSTREAM = (function () { } // TODO: Log Failures - mstreamModule.removeSongAtPosition = function(position, sanityCheckFilepath = false){ + mstreamModule.removeSongAtPosition = function(position, sanityCheckUrl = false){ // Check that position is filled if (position > mstreamModule.playlist.length || position < 0) { return false; } - // If sanityCheckFilepath, check that filepaths are the same - if(sanityCheckFilepath && sanityCheckFilepath != mstreamModule.playlist[position].filepath){ + // If sanityCheckUrl, check that url are the same + if(sanityCheckUrl && sanityCheckUrl != mstreamModule.playlist[position].url){ return false; } @@ -507,12 +502,12 @@ var MSTREAM = (function () { function setMedia(song, player, play){ - if(song.filepath.indexOf('.flac') !== -1 && Howler.codecs('flac') === false ){ + if(song.url.indexOf('.flac') !== -1 && Howler.codecs('flac') === false ){ // Set via aurora player.playerType = 'aurora'; - player.playerObject = AV.Player.fromURL(song.filepath); + player.playerObject = AV.Player.fromURL(song.url); player.playerObject.on("end", function() { callMeOnStreamEnd(); }, false); @@ -536,7 +531,7 @@ var MSTREAM = (function () { player.playerType = 'howler'; player.playerObject = new Howl({ - src: [song.filepath], + src: [song.url], html5: true, // Force to HTML5. Otherwise streaming will suck // onplay: function() { }, onload: function() { diff --git a/public/js/mstream.vue-player-controls.js b/public/js/mstream.vue-player-controls.js index 866614c..4fd4c69 100644 --- a/public/js/mstream.vue-player-controls.js +++ b/public/js/mstream.vue-player-controls.js @@ -91,8 +91,8 @@ var VUEPLAYER = function() { return '\u00A0\u00A0\u00A0Welcome To mStream!\u00A0\u00A0\u00A0'; } - // Use rawLocation instead - var filepathArray = currentSong.rawLocation.split("/"); + // Use filepath instead + var filepathArray = currentSong.filepath.split("/"); return '\u00A0\u00A0\u00A0' + filepathArray[filepathArray.length-1] + '\u00A0\u00A0\u00A0'; } diff --git a/public/mstream.html b/public/mstream.html index 1ac5c38..6c99682 100755 --- a/public/mstream.html +++ b/public/mstream.html @@ -278,7 +278,7 @@
-
+
diff --git a/public/shared.html b/public/shared.html index b273c08..cb76813 100644 --- a/public/shared.html +++ b/public/shared.html @@ -82,7 +82,12 @@ // Get playlist for (var i = 0; i < playlist.length; i++) { - MSTREAM.addSong(vpath + '/' + playlist[i] + '?token=' + decoded.token, false, playlist[i] ); + MSTREAM.addSong( + { + url: vpath + '/' + playlist[i] + '?token=' + decoded.token, + filepath: playlist[i] + } + ); } @@ -96,15 +101,6 @@ } - // MSTREAM.addSong('/Darn Coyotes - See You in Hell- I Guess/Darn Coyotes - See You in Hell, I Guess - 02 We Oughtta Make Like Antelope and Split.mp3', false, '/Darn Coyotes - See You in Hell- I Guess/Darn Coyotes - See You in Hell, I Guess - 02 We Oughtta Make Like Antelope and Split.mp3'); - // MSTREAM.addSong('/Darn Coyotes - See You in Hell- I Guess/Darn Coyotes - See You in Hell, I Guess - 06 We Are Not the Friends You Are Looking For.mp3', false, '/Darn Coyotes - See You in Hell- I Guess/Darn Coyotes - See You in Hell, I Guess - 06 We Are Not the Friends You Are Looking For.mp3'); - // MSTREAM.addSong('/TV Torso - Clear Lake Strangler (1)/TV Torso - Clear Lake Strangler - 02 Prismatic Ideation.flac', false, '/TV Torso - Clear Lake Strangler (1)/TV Torso - Clear Lake Strangler - 02 Prismatic Ideation.flac'); - // MSTREAM.addSong('/Darn Coyotes - See You in Hell- I Guess/Darn Coyotes - See You in Hell, I Guess - 02 We Oughtta Make Like Antelope and Split.mp3', false, '/Darn Coyotes - See You in Hell- I Guess/Darn Coyotes - See You in Hell, I Guess - 02 We Oughtta Make Like Antelope and Split.mp3'); - // MSTREAM.addSong('/Darn Coyotes - See You in Hell- I Guess/Darn Coyotes - See You in Hell, I Guess - 06 We Are Not the Friends You Are Looking For.mp3', false, '/Darn Coyotes - See You in Hell- I Guess/Darn Coyotes - See You in Hell, I Guess - 06 We Are Not the Friends You Are Looking For.mp3'); - // MSTREAM.addSong('/Darn Coyotes - See You in Hell- I Guess/Darn Coyotes - See You in Hell, I Guess - 02 We Oughtta Make Like Antelope and Split.mp3', false, '/Darn Coyotes - See You in Hell- I Guess/Darn Coyotes - See You in Hell, I Guess - 02 We Oughtta Make Like Antelope and Split.mp3'); - // - - @@ -133,7 +129,7 @@
-
+