From 56e131d2554ee16e2679641d04e64207db8cd583 Mon Sep 17 00:00:00 2001
From: Sascha Kluger <frankyghost@googlemail.com>
Date: Sun, 17 Nov 2013 20:14:47 +0100
Subject: [PATCH] DVR support

---
 CHANGELOG.md                          | 20 ++++++++++++
 src/controller/projekktor.js          | 14 +++++---
 src/models/player.audio.video.js      | 18 +++++-----
 src/models/player.audio.video.osmf.js | 47 ++++++++++++++++++++++-----
 src/models/player.js                  |  6 +++-
 src/plugins/projekktor.controlbar.js  | 41 +++++++++++++++++++++--
 6 files changed, 119 insertions(+), 27 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index a39ff6c..2b1d31d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,26 @@
 PROJEKKTOR - simply mighty <video>
 http://www.projekktor.com
 
+
+V1.3.04
+=======
+
+  additions:
+  * [model:OSMF] added DVR support
+  * [plugin:controlbar] added "go live" button
+  * [plugin:controlbar] scrubber tooltip know shows relative time on DVR
+  
+  fixes:
+  * [core] proper restore of user quality prefs for dynamic streams
+
+
+V1.3.03
+=======
+
+  fixes:
+  * [core] improper request for undefined poster images removed
+
+
 V1.3.02
 =======
 
diff --git a/src/controller/projekktor.js b/src/controller/projekktor.js
index 6e6592b..ef93e08 100644
--- a/src/controller/projekktor.js
+++ b/src/controller/projekktor.js
@@ -687,7 +687,13 @@ projekktor = $p = function() {
                     this._addGUIListeners();                      
                 }
                 break;
-                
+                                          
+            case 'streamTypeChange':
+                if (value=='dvr') {
+                    this.getDC().addClass(this.getNS() + 'dvr');
+                }
+                this._promote(type, value);
+                break;
             default:                    
                 this._promote(type, value);
                 break;                
@@ -1855,10 +1861,10 @@ projekktor = $p = function() {
             this.media[this._currentItem].errorCode = 8;
         } else {
             // apply item specific class(es) to player
-            if (this.getConfig('className', null)!=null) 
+            if (this.getConfig('className', null)!=null) {
                 this.getDC().addClass(this.getNS() + this.getConfig('className'))
-                    
-                this.getDC().addClass(this.getNS() + (this.getConfig('streamType') || 'http') );
+            }
+            this.getDC().addClass(this.getNS() + (this.getConfig('streamType') || 'http') );
                 
             if (!$p.utils.cssTransitions()) this.getDC().addClass('notransitions')
             if (this.getIsMobileClient()) this.getDC().addClass('mobile')
diff --git a/src/models/player.audio.video.js b/src/models/player.audio.video.js
index d7f1810..c23f119 100644
--- a/src/models/player.audio.video.js
+++ b/src/models/player.audio.video.js
@@ -39,6 +39,7 @@ $p.newModel({
         loadstart:      null        
     },    
     
+    isGingerbread: false,
     isGingerbread: false,
     allowRandomSeek: false,
     videoWidth: 0,
@@ -48,10 +49,8 @@ $p.newModel({
     
     init: function() {                 
         var ua = navigator.userAgent;
-        if( ua.indexOf("Android") >= 0 )
-        {
-          if (parseFloat(ua.slice(ua.indexOf("Android")+8)) < 3)
-          {
+        if( ua.indexOf("Android") >= 0 ) {
+          if (parseFloat(ua.slice(ua.indexOf("Android")+8)) < 3) {
             this.isGingerbread = true;
           }
         }
@@ -60,14 +59,13 @@ $p.newModel({
     
     
     applyMedia: function(destContainer) {
-
         if ($('#'+this.pp.getMediaId()+"_html").length===0) {
             this.wasPersistent = false;
             destContainer.html('').append(
                 $('<video/>')
                 .attr({
                     "id": this.pp.getMediaId()+"_html",         
-                    "poster": (this.pp.getIsMobileClient('ANDROID')) ? this.getPoster() : $p.utils.imageDummy(),
+                    "poster": $p.utils.imageDummy(),
                     "loop": false,
                     "autoplay": false,
                     "x-webkit-airplay": "allow"
@@ -103,7 +101,7 @@ $p.newModel({
             var src = $('<source/>');            
             src.attr('src', this.src);
             if (!ref.isGingerbread) {
-                src.attr('type', this.type);
+                src.attr('type', this.originalType );
             }
             src.appendTo(ref.mediaElement);
         });
@@ -332,9 +330,9 @@ $p.newModel({
     iosVersion: 4,    
     iLove: [
         {ext:'m3u8', type:'application/mpegURL', platform: ['ios', 'android'], streamType: ['http','httpVideo', 'httpVideoLive']},
-        {ext:'m3u', type:'application/mpegURL', platform: ['ios', 'android'], streamType: ['http', 'httpVideo', 'httpVideoLive']},     
-        // {ext:'m3u8', type:'vnd.apple.mpegURL', platform:'ios'},
-        // {ext:'m3u', type:'vnd.apple.mpegURL', platform:'ios'},
+        {ext:'m3u', type:'application/mpegURL', platform: ['ios', 'android'], streamType: ['http', 'httpVideo', 'httpVideoLive']},
+        {ext:'m3u8', type:'application/vnd.apple.mpegURL', platform: ['ios', 'android'], streamType: ['http','httpVideo', 'httpVideoLive']},
+        {ext:'m3u', type:'application/vnd.apple.mpegURL', platform: ['ios', 'android'], streamType: ['http', 'httpVideo', 'httpVideoLive']},             
         {ext:'ts', type:'video/MP2T', platforms: ['ios' ,'android'], streamType: ['http', 'httpVideo', 'httpVideoLive']}        
     ]
 }, 'VIDEO');
diff --git a/src/models/player.audio.video.osmf.js b/src/models/player.audio.video.osmf.js
index ca70afe..62109ad 100644
--- a/src/models/player.audio.video.osmf.js
+++ b/src/models/player.audio.video.osmf.js
@@ -23,8 +23,8 @@ $p.newModel({
         {ext:'f4v', type:'video/mp4', platform:'flash', streamType: ['*']},
         {ext:'mov', type:'video/quicktime', platform:'flash', streamType: ['*']},
         {ext:'m4v', type:'video/mp4', platform:'flash', fixed: true, streamType: ['*']},
-        {ext:'f4m', type:'application/f4m+xml', platform:'flash', fixed: true, streamType: ['*']},
-        {ext:'m3u8', type:'application/mpegURL', platform:'flash', fixed: true, streamType: ['*']}        
+        {ext:'f4m', type:'application/f4m+xml', platform:'flash', fixed: true, streamType: ['*']}
+        // {ext:'m3u8', type:'application/mpegURL', platform:'flash', fixed: true, streamType: ['*']}        
     ],
 
     hasGUI: false,    
@@ -35,6 +35,7 @@ $p.newModel({
     availableQualities: {},
     
     _isStream: false,
+    _isDVR: false,
     _isMuted: false,
     _isStarted: false,
     _qualitySwitching: false,
@@ -87,6 +88,7 @@ $p.newModel({
                 playButtonOverlay: false,
                 // showVideoInfoOverlayOnStartUp: true,
                 // dvrSnapToLiveClockOffset: "5",
+                autoDynamicStreamSwitch: false,
                 bufferingOverlay: false,
                 javascriptCallbackFunction: 'window.projekktorOSMFReady'+this.pp.getId()               
             }, this.pp.getConfig('OSMFVars'))
@@ -170,7 +172,10 @@ $p.newModel({
         this.timeListener({position: this.media.position, duration: value || 0 });
     },
     
-    OSMF_currentTimeChange: function(value) {    
+    OSMF_currentTimeChange: function(value) {
+        if (this._isDVR) {
+            this.sendUpdate('isLive', (value+20 >= this.media.duration)); // 20 => default dvr buffer of SMP
+        }
         this.timeListener({position: value, duration: this.media.duration || 0 });
     },
     
@@ -201,14 +206,31 @@ $p.newModel({
         }
     },
     
-    /* catching playStateChange and playerStateChange */
+    /* catching playStateChange and playerStateChange and playerStateChange aaaand... and playerStateChange */
     OSMF_playerStateChange: function(state) {
+        var ref = this;
+        
+        // getIsDVR & getIsDVRLive seem to be broken - workaround:
+        if (!this._isDVR && this.mediaElement.get(0).getStreamType()=='dvr') {
+            this._isDVR = true;
+            this.sendUpdate('streamTypeChange', 'dvr');
+        }
+
         switch(state) {
             case 'playing':
                 this.playingListener();
                 break;
             case 'paused':            
                 this.pauseListener();
+                if (this._isDVR) {
+                    // simulate sliding time window:
+                    (function() {
+                        if (ref.media.position>=0.5) {
+                            ref.timeListener({position: ref.media.position-0.5, duration: ref.media.duration || 0 });
+                            setTimeout(arguments.callee, 500);
+                        }                        
+                    })();
+                }
                 break;
             case 'stopped':
                 if (!this.getSeekState('SEEKING')) {
@@ -218,13 +240,12 @@ $p.newModel({
         }
     },    
     
-    /* todo */
     OSMF_updateDynamicStream: function() {
         var dynamicStreams = this.mediaElement.get(0).getStreamItems(),
             name = '',
             result = [];
             // switchMode = this.mediaElement.get(0).getAutoDynamicStreamSwitch() ? "Auto" : "Manual";
-       
+
         for (var index in dynamicStreams) {
             if (dynamicStreams.hasOwnProperty(index) && dynamicStreams[index].bitrate!==undefined) {
                 name = dynamicStreams[index].width + "x" + dynamicStreams[index].height;
@@ -243,8 +264,8 @@ $p.newModel({
         
         result.push('auto');
         
-        this.sendUpdate('availableQualitiesChange', result);
-        this._isDynamicStream = true;
+        this._isDynamicStream = true; // important: set this before sending the update
+        this.sendUpdate('availableQualitiesChange', result);        
     },
     
     /* todo */
@@ -297,7 +318,11 @@ $p.newModel({
             this.applySrc();
             return;
         }
-        
+
+        if (newpos==-1) {
+            newpos = this.getDuration();
+        }
+
         this.mediaElement.get(0).seek(newpos);
     },
     
@@ -351,6 +376,10 @@ $p.newModel({
         } catch(e) {return null;}
     },
     
+    getQuality: function () {
+        return this._quality;
+    },    
+    
     /************************************************
      * disablers
      ************************************************/    
diff --git a/src/models/player.js b/src/models/player.js
index 248227b..a9918b1 100644
--- a/src/models/player.js
+++ b/src/models/player.js
@@ -307,6 +307,10 @@ jQuery(function ($) {
         /*******************************
             ELEMENT GETTERS 
         *******************************/
+        getQuality: function () {
+            return this._quality;
+        },
+        
         getVolume: function () {
             if (this.mediaElement==null) {
                 return this._volume;
@@ -700,7 +704,7 @@ jQuery(function ($) {
             $p.utils.blockSelection(imageObj);
 
             // empty URL... apply placeholder
-            if (url === '' || url === undefined) {
+            if (url == null || url === false) {
                 return $('<span/>').attr({
                     "id": this.pp.getMediaId() + "_image"
                 }).appendTo(destObj);
diff --git a/src/plugins/projekktor.controlbar.js b/src/plugins/projekktor.controlbar.js
index 6786970..0676e58 100644
--- a/src/plugins/projekktor.controlbar.js
+++ b/src/plugins/projekktor.controlbar.js
@@ -11,9 +11,10 @@ var projekktorControlbar = function () {};
 jQuery(function ($) {
     projekktorControlbar.prototype = {
     
-        version: '1.1.00',
+        version: '1.1.01',
 
         _cTimer: null,
+        _isDVR: false,
         _noHide: false,
         _vSliderAct: false,
         
@@ -49,6 +50,13 @@ jQuery(function ($) {
                 call: null
             },
             'loaded': null, // { on:['touchstart', 'click'], call:'scrubberClk'},
+            'golive': [{
+                on: ['touchstart', 'click'],
+                call: 'goliveClk'
+            }, {
+                on: ['touchend'],
+                call: 'touchEnd'
+            }],
             'scrubber': null, // { on:['touchstart', 'click'], call:'scrubberClk'},
             'scrubbertip': null,
             'scrubberknob': null,
@@ -773,7 +781,6 @@ jQuery(function ($) {
         },
 
         stateHandler: function (state) {
-
             this.updateDisplay();
 
             if ('STOPPED|AWAKENING|IDLE|DONE'.indexOf(state) > -1) {
@@ -827,6 +834,21 @@ jQuery(function ($) {
         qualityChangeHandler: function (qual) {
             this.displayQualityToggle(qual);
         },
+        
+        streamTypeChangeHandler: function (streamType) {
+            if (streamType=='dvr') {
+                this._isDVR = true;
+                this.setActive(this.controlElements['golive'], true);
+            }
+        },
+        
+        isLiveHandler: function (islive) {
+            if (islive) {
+                this.controlElements['golive'].addClass('on').removeClass('off');
+            } else {
+                this.controlElements['golive'].addClass('off').removeClass('on');
+            }
+        },            
 
         fullscreenHandler: function (inFullscreen) {
 
@@ -900,6 +922,10 @@ jQuery(function ($) {
             this.pp.setPlaybackQuality($(evt.currentTarget).data('qual'));
         },
 
+        goliveClk: function (evt) {
+            this.pp.setSeek(-1);
+        },
+        
         playClk: function (evt) {
             this.pp.setPlay();
         },
@@ -1035,7 +1061,16 @@ jQuery(function ($) {
                 pageX = (evt.originalEvent.touches) ? evt.originalEvent.touches[0].pageX : evt.pageX,
                 pageY = (evt.originalEvent.touches) ? evt.originalEvent.touches[0].pageY : evt.pageY,
                 newPos = pageX - slider.offset().left - (tip.outerWidth() / 2),
-                times = this._clockDigits(this.pp.getDuration() / 100 * ((pageX - slider.offset().left) * 100 / slider.width()), 'tip');
+                timeIdx = this.pp.getDuration() / 100 * ((pageX - slider.offset().left) * 100 / slider.width()),
+                times = this._clockDigits(timeIdx, 'tip');
+                
+            if (this._isDVR) { 
+                timeIdx =  this.pp.getDuration() - timeIdx; 
+                var then = new Date( (new Date().getTime() / 1000 - timeIdx) * 1000), // date minus timeidx
+                    then = then.getSeconds() + (60 * then.getMinutes()) + (60 * 60 * then.getHours()); // second of today
+                    
+                times = this._clockDigits( then , 'tip');
+            }
 
             for (var key in this.controlElements) {
                 if (key == 'cb')