Merge pull request #17 from AwesomeNinjaKittens/feature/apicontrols/u…

…nload Feature/apicontrols/unload
DaWoody · Oct 23, 2016 · b620cb6 · b620cb6
2 parents 454db1b + 141baf3
commit b620cb6
Show file tree

Hide file tree

Showing 25 changed files with 638 additions and 139 deletions.
diff --git a/README.md b/README.md
@@ -3,13 +3,16 @@
 ***
 ![Free Video Player - The Free HTML5 Video Player](http://www.freevideoplayer.org/images/free-video-player-logo.png)
 ***
-### Now on <img src="https://www.npmjs.com/static/npm.png" width="75"> 
+### Now on <a href="https://www.npmjs.com/package/free-video-player"><img src="https://www.npmjs.com/static/npm.png" width="75"></a> 
 ***
 ```npm install free-video-player```
 ***
 ##Version information
 ***
 
+* Version 0.9.7 - ALPHA
+    * Added ```API``` call ```unload``` which unloads an asset and aborts buffering of streams and such, also updated and fixed splash image and background of player when unloading or when try calling the ```load``` method with a non valid url value.
+
 * Version 0.9.6 - ALPHA
     * Fixes with documentation a bit and README.
 
@@ -75,7 +78,7 @@ To see a list of todos and current issues, see our issue tracker in the github r
 
 ##Installation
 ***
-To use the Free Video Player, you could either download it from <a href="https://nodejs.org/en/"><img src="https://www.npmjs.com/static/npm.png" width="75"></a> with **npm install free-video-player** if you are running something like *Wepback*, or other buildtools with [Node.js](https://nodejs.org/en/),
+To use the Free Video Player, you could either download it from <a href="https://www.npmjs.com/package/free-video-player"><img src="https://www.npmjs.com/static/npm.png" width="75"></a> with **npm install free-video-player** if you are running something like *Wepback*, or other buildtools with [Node.js](https://nodejs.org/en/),
 then you could either use something like
 
 ```javascript
@@ -258,16 +261,17 @@ var freeVideoPlayerOptionalConfigurationObject = {
 var player = freeVideoPlayer(freeVideoPlayerOptionalConfigurationObject);
 
 //Now there are a number of public methods available
-//For instance
-
-//load
-player.load(videoUrl, optionalConfigurationObject);
-
 //There are a number of methods that normally
 //also are accessible from the Video Controls section that per default is generated by the Free Video Player class
 //but these methods can also be accessed directly through the API, methods include things such as play, pause, seek (used by progress-slider), setVolume etc.
 //Below we are giving some examples of these API methods. The optionalConfigurationObject contains information such as an alternate videoSplashImage
 
+//load
+player.load(videoUrl, optionalConfigurationObject);
+
+//Unload
+player.unload();
+
 //play
 player.play();
 

diff --git a/free_videoplayer_components/free_video_player/free.video.player.js b/free_videoplayer_components/free_video_player/free.video.player.js
@@ -3,7 +3,6 @@
  * @author Johan Wedfelt
  * @license GPLv3, see  {@link http://www.gnu.org/licenses/gpl-3.0.en.html| http://www.gnu.org/licenses/gpl-3.0.en.html}
  * @description A cool open source html5 video library to use when want to play both regular HTML5 content such as mp4, webm but also for adaptive streaming formats such as DASH for instance, Requires the xml2json library to work. Check out more @ {@link http://www.freevideoplayer.org| FreeVideoPlayer.org}
- * @version 0.9.0
  * @param {object} initiationObject - The initiation object containing information about how to configure the Free Video Player
  */
 var freeVideoPlayer = function(initiationObject){
@@ -16,7 +15,7 @@ var freeVideoPlayer = function(initiationObject){
     var that = {},
         moduleName = 'FREE VIDEO PLAYER',
         isModuleValue = false,
-        moduleVersion = '0.9.6',
+        moduleVersion = '0.9.7',
         videoPlayerNameCss = 'free-video-player',
         base64encodedImage = freeVideoPlayerModulesNamespace.freeVideoPlayerDefaultSplashImage,
         xml2json = new freeVideoPlayerModulesNamespace.X2JS(),
@@ -130,14 +129,20 @@ var freeVideoPlayer = function(initiationObject){
      */
     var load = function(videoUrl, optionalConfigurationObject){
         //This method will understand
-        var streamType = _returnStreamTypeBasedOnVideoUrl(videoUrl);
+        var streamType = videoUrl ? _returnStreamTypeBasedOnVideoUrl(videoUrl) : 'not-a-valid-video-url';
         //Lets clear the video container first
         _clearVideo();
 
         //Lets set background of videoPlayer instance
         //and make it sweet ;)
         that._videoWrapper = document.querySelector('.' + videoWrapperClassName);
-        that._videoWrapper.setAttribute('style', 'background:' + settingsObject.videoWrapperBackgroundColor + ';');
+        //Lets create a style string so we can show the background and default image in case we can not load and asset
+        var styleString =   'background-image:url("' +  base64encodedImage + '");' +
+                            'background-color:' + settingsObject.videoWrapperBackgroundColor + ';' +
+                            'background-repeat:no-repeat;' +
+                            'background-position: center;';
+
+        that._videoWrapper.setAttribute('style', styleString);
 
         //var className = that._videoWrapper.getAttribute('class');
         //that._videoWrapper.setAttribute('class', className + ' free-video-player-paused');
@@ -250,7 +255,9 @@ var freeVideoPlayer = function(initiationObject){
     };
 
     /**
-     * This method loads the mpd and then utilizes a set of methods to parse through the MPD, adding data to
+     * @function
+     * @name _loadMpd
+     * @description This method loads the mpd and then utilizes a set of methods to parse through the MPD, adding data to
      * a scoped variable called currentVideoObject and then also firing away and starts the video
      * @private
      * @param {string} mpdUrl
@@ -334,6 +341,18 @@ var freeVideoPlayer = function(initiationObject){
         });
     };
 
+    /**
+     * @function
+     * @description This is the main unload method, it calls the internal method _unload to stop videos, clear containers etc
+     * @name unload
+     * @public
+     */
+    var unload = function(){
+        console.log('Cleared the video?');
+        //Lets clear the video container first
+        _clearVideo();
+    };
+
     /**
      * @function
      * @description A return method that could be public to return the current video's subtitle infor in
@@ -674,6 +693,7 @@ var freeVideoPlayer = function(initiationObject){
 
     //Loading
     that.load = load;
+    that.unload = unload;
 
     //Player methods
     that.pause = pause;

diff --git a/free_videoplayer_components/modules/free.video.player.adaptive.stream.js b/free_videoplayer_components/modules/free.video.player.adaptive.stream.js
@@ -19,7 +19,7 @@ freeVideoPlayerModulesNamespace.freeVideoPlayerAdaptiveStream = function(setting
         settingsObject = settingsObject,
         isModuleValue = true,
         moduleName = 'ADAPTIVE STREAMING',
-        moduleVersion = '0.9.1',
+        moduleVersion = '0.9.2',
         currentVideoObject = {},
         adaptiveBitrateAlgorithmValue = new Map();
         currentVideoObject.streamObject = _returnClearCurrentVideoStreamObject();
@@ -125,6 +125,11 @@ freeVideoPlayerModulesNamespace.freeVideoPlayerAdaptiveStream = function(setting
             var sourceCloseEvent = new Event('sourceclose', {"bubbles":false, "cancelable":false});
             that._mediaSource.dispatch(sourceCloseEvent);
             //currentVideoObject.streamObject.sourceBuffers = [];
+
+            //Also lets set the key to not keeping appending data here,
+            //This is done finally after we done the proper methods and callback according to the MSE object
+            _setVideoStreamShouldAppend(false);
+
         } catch(e){
             var messageObject = {};
                 messageObject.message = 'Could not abort source buffers, check accessibility';
@@ -216,7 +221,12 @@ freeVideoPlayerModulesNamespace.freeVideoPlayerAdaptiveStream = function(setting
         mpdObject ?  currentVideoObject.streamObject.mpdObject = mpdObject : adaptiveVideoObject.mpdObject = {};
         hlsObject ?  currentVideoObject.streamObject.hlsObject = hlsObject : adaptiveVideoObject.hlsObject = {};
 
+        //Set current video stream state to true so segments can append
+        //when we have created the videoElements and the segment queu being appended.
+        _setVideoStreamShouldAppend(true);
+        //Lets initiate the media source
         _initiateMediaSource();
+        //Lets create the video element and append it to the wrapper
         _createVideoElementAndAppendToWrapper(videoWrapperClassName, optionalConfigurationObject);
         _createMediaSourceStream(currentVideoObject.streamObject.streamBaseUrl, optionalConfigurationObject);
         _addEventListenersToMediaSource();
@@ -499,18 +509,20 @@ freeVideoPlayerModulesNamespace.freeVideoPlayerAdaptiveStream = function(setting
                         messagesModule.printOutLine('THE BASE URL SET BY THE ALGORITHM IS THIS..' + baseUrl + ' .. with type ' + typeOfStream);
                     }
 
-                    setTimeout(function(){
-                        _appendData(sourceBuffer,
-                            currentVideoObject.streamObject.streamBaseUrl +
-                            baseUrl +
-                            segmentPrefix +
-                            sourceCount +
-                            segmentEnding,
-                            mimeType);
-                    }, sourceBufferWaitBeforeNewAppendInMiliseconds);
-
-                    _checkBuffers(streamDurationInSeconds);
-
+                    if(videoStreamShouldAppend()){
+                        setTimeout(function(){
+                            _appendData(sourceBuffer,
+                                currentVideoObject.streamObject.streamBaseUrl +
+                                baseUrl +
+                                segmentPrefix +
+                                sourceCount +
+                                segmentEnding,
+                                mimeType);
+                        }, sourceBufferWaitBeforeNewAppendInMiliseconds);
+
+                        //Here we are checking the buffers
+                        _checkBuffers(streamDurationInSeconds);
+                    }
                 });
 
                 console.log('source buffer ' + index + ' mode: ' + sourceBuffer.mode );
@@ -533,6 +545,12 @@ freeVideoPlayerModulesNamespace.freeVideoPlayerAdaptiveStream = function(setting
         //}, 2000);
     };
 
+
+
+
+
+
+
     //  ########################
     //  #### BUFFER METHODS ####
     //  ########################
@@ -716,7 +734,9 @@ freeVideoPlayerModulesNamespace.freeVideoPlayerAdaptiveStream = function(setting
     };
 
     /**
-     * A method to return a resetd currentVideoStreamObject, new parameters, cleared and such
+     * @function
+     * @name _returnClearCurrentVideoStreamObject
+     * @description A method to return a resetd currentVideoStreamObject, new parameters, cleared and such
      * @returns {{bitrateSwitchTimerSegmentAppendTime: number, currentVideoBitrateIndex: number, sourceBuffers: Array, mpdObject: {}, hlsObject: {}, adaptiveStreamBitrateObjectMap: Map, currentVideoBaseUrl: string, streamBaseUrl: string}}
      * @private
      */
@@ -730,11 +750,34 @@ freeVideoPlayerModulesNamespace.freeVideoPlayerAdaptiveStream = function(setting
             adaptiveStreamBitrateObjectMap: new Map(),
             //used for the adaptive bitrate algo, should probably be refactored later
             currentVideoBaseUrl:'auto',
-            streamBaseUrl:''
+            streamBaseUrl:'',
+            streamShouldAppend:false
         };
         return returnObject;
     }
 
+    /**
+     * @function
+     * @name videoStreamShouldAppend
+     * @description This method returns the state of the current stream, is the stream active and appending segments or not
+     * @returns {boolean}
+     * @public
+     */
+    function videoStreamShouldAppend(){
+        return currentVideoObject.streamObject.streamShouldAppend;
+    }
+
+    /**
+     * @function
+     * @name _setVideoStreamShouldAppend
+     * @description This method sets the current stream state, when set this can be used to stop segments being added to a appending method for segments
+     * @private
+     */
+    function _setVideoStreamShouldAppend(boolean){
+        currentVideoObject.streamObject.streamShouldAppend = boolean;
+        return true;
+    }
+
     //  #########################
     //  #### BITRATE METHODS ####
     //  #########################
@@ -926,6 +969,8 @@ freeVideoPlayerModulesNamespace.freeVideoPlayerAdaptiveStream = function(setting
     //currentVideoObject methods
     that.addStreamBaseUrl = addStreamBaseUrl;
     that.clearCurrentVideoStreamObject = clearCurrentVideoStreamObject;
+    that.videoStreamShouldAppend = videoStreamShouldAppend;
+    //that.setCurrentVideoStreamState = setCurrentVideoStreamState;
 
     //Media Source Extension methods
     that.loadDashMediaWithMediaSourceExtension = loadDashMediaWithMediaSourceExtension;

diff --git a/free_videoplayer_components/npm_registry_package_json/package.json b/free_videoplayer_components/npm_registry_package_json/package.json
@@ -1,6 +1,6 @@
 {
   "name": "free-video-player",
-  "version": "0.9.6",
+  "version": "0.9.7",
   "description": "An open source html5 video streaming player for web-applications run in web-browsers",
   "main": "./free.video.player.full.js",
   "scripts": {

diff --git a/free_videoplayer_components/readme/readme-base.md b/free_videoplayer_components/readme/readme-base.md
@@ -27,7 +27,7 @@ To see a list of todos and current issues, see our issue tracker in the github r
 
 ##Installation
 ***
-To use the Free Video Player, you could either download it from <a href="https://nodejs.org/en/"><img src="https://www.npmjs.com/static/npm.png" width="75"></a> with **npm install free-video-player** if you are running something like *Wepback*, or other buildtools with [Node.js](https://nodejs.org/en/),
+To use the Free Video Player, you could either download it from <a href="https://www.npmjs.com/package/free-video-player"><img src="https://www.npmjs.com/static/npm.png" width="75"></a> with **npm install free-video-player** if you are running something like *Wepback*, or other buildtools with [Node.js](https://nodejs.org/en/),
 then you could either use something like
 
 ```javascript
@@ -210,16 +210,17 @@ var freeVideoPlayerOptionalConfigurationObject = {
 var player = freeVideoPlayer(freeVideoPlayerOptionalConfigurationObject);
 
 //Now there are a number of public methods available
-//For instance
-
-//load
-player.load(videoUrl, optionalConfigurationObject);
-
 //There are a number of methods that normally
 //also are accessible from the Video Controls section that per default is generated by the Free Video Player class
 //but these methods can also be accessed directly through the API, methods include things such as play, pause, seek (used by progress-slider), setVolume etc.
 //Below we are giving some examples of these API methods. The optionalConfigurationObject contains information such as an alternate videoSplashImage
 
+//load
+player.load(videoUrl, optionalConfigurationObject);
+
+//Unload
+player.unload();
+
 //play
 player.play();
 

diff --git a/free_videoplayer_components/readme/readme-header.md b/free_videoplayer_components/readme/readme-header.md
@@ -3,7 +3,7 @@
 ***
 ![Free Video Player - The Free HTML5 Video Player](http://www.freevideoplayer.org/images/free-video-player-logo.png)
 ***
-### Now on <img src="https://www.npmjs.com/static/npm.png" width="75"> 
+### Now on <a href="https://www.npmjs.com/package/free-video-player"><img src="https://www.npmjs.com/static/npm.png" width="75"></a> 
 ***
 ```npm install free-video-player```
 ***
diff --git a/free_videoplayer_components/readme/readme-version.md b/free_videoplayer_components/readme/readme-version.md
@@ -1,6 +1,9 @@
 ##Version information
 ***
 
+* Version 0.9.7 - ALPHA
+    * Added ```API``` call ```unload``` which unloads an asset and aborts buffering of streams and such, also updated and fixed splash image and background of player when unloading or when try calling the ```load``` method with a non valid url value.
+
 * Version 0.9.6 - ALPHA
     * Fixes with documentation a bit and README.