Cast updates

dashboard-ui/css/chromecast.css

@@ -16,3 +16,14 @@
 .btnActiveCast {
     background-image: url(images/chromecast/ic_media_route_on_holo_dark.png);
 }
+
+.btnDisabledCast {
+    background-image: url(images/chromecast/ic_media_route_disabled_holo_dark.png);
+}
+
+.ui-icon-ccast {
+    background-image: url(images/chromecast/ic_media_route_off_holo_dark.png);
+    background-position: 5px 5px;
+    background-repeat: no-repeat;
+	background-size: 18px 18px;
+}

dashboard-ui/scripts/chromecast.js

@@ -76,6 +76,13 @@
         this.initializeCastPlayer();
     };
 
+    /**
+     * Initialize local media player 
+     */
+    CastPlayer.prototype.initializeLocalPlayer = function () {
+        this.localPlayer = document.getElementById('itemVideo');
+    };
+
     /**
      * Initialize Cast media player 
      * Initializes the API. Note that either successCallback and errorCallback will be
@@ -89,6 +96,7 @@
         }
 
         if (!chrome.cast || !chrome.cast.isAvailable) {
+
             setTimeout(this.initializeCastPlayer.bind(this), 1000);
             return;
         }
@@ -136,6 +144,7 @@
             if (this.session.media[0]) {
                 this.onMediaDiscovered('activeSession', this.session.media[0]);
             }
+            this.session.addUpdateListener(this.sessionUpdateListener.bind(this));
         }
     };
 
@@ -145,9 +154,13 @@
      * does not provide a list of device IDs
      */
     CastPlayer.prototype.receiverListener = function (e) {
+
+        console.log("cast.receiverListener", e);
+
         if (e === 'available') {
             console.log("chromecast receiver found");
             this.hasReceivers = true;
+            this.updateMediaControlUI();
         }
         else {
             console.log("chromecast receiver list empty");
@@ -155,6 +168,25 @@
         }
     };
 
+    /**
+     * session update listener
+     */
+    CastPlayer.prototype.sessionUpdateListener = function (isAlive) {
+        if (!isAlive) {
+            this.session = null;
+            this.deviceState = DEVICE_STATE.IDLE;
+            this.castPlayerState = PLAYER_STATE.IDLE;
+            this.currentMediaSession = null;
+            clearInterval(this.timer);
+            this.updateDisplayMessage();
+
+            //// continue to play media locally
+            //console.log("current time: " + this.currentMediaTime);
+            //this.playMediaLocally(this.currentMediaTime);
+            this.updateMediaControlUI();
+        }
+    };
+
     /**
      * Requests that a receiver application session be created or joined. By default, the SessionRequest
      * passed to the API at initialization time is used; this may be overridden by passing a different
@@ -177,6 +209,7 @@
         this.session = e;
         this.deviceState = DEVICE_STATE.ACTIVE;
         this.updateMediaControlUI();
+        this.session.addUpdateListener(this.sessionUpdateListener.bind(this));
     };
 
     /**
@@ -213,7 +246,7 @@
         clearInterval(this.timer);
         this.updateDisplayMessage();
 
-        // continue to play media locally
+        //// continue to play media locally
         //console.log("current time: " + this.currentMediaTime);
         //this.playMediaLocally(this.currentMediaTime);
         this.updateMediaControlUI();
@@ -695,7 +728,11 @@
             return;
         }
         
+
         if (this.hasReceivers) {
+            document.getElementById("btnCast").className = "btnCast btnDefaultCast";
+            document.getElementById("video-ccastButton").removeAttribute("style");
+            this.initializeLocalPlayer();
         }
 
         if (this.deviceState == DEVICE_STATE.ACTIVE) {
@@ -722,15 +759,15 @@
         }
     };
 
-    window.CastPlayer = CastPlayer;
-
     var castPlayer = new CastPlayer();
 
+    window.CastPlayer = castPlayer;
+
     $(document).on('headercreated', ".libraryPage", function () {
 
         var page = this;
 
-        castPlayer.updateMediaControlUI();
+        //castPlayer.updateMediaControlUI();
 
     });
 

dashboard-ui/scripts/librarymenu.js

@@ -24,7 +24,7 @@
 
         html += '<div class="viewMenuSecondary">';
 
-        html += '<button class="btnCast btnDefaultCast" type="button" data-role="none"></button>';
+        html += '<button id="btnCast" class="btnCast btnDisabledCast" type="button" data-role="none"></button>';
 
         html += '<a class="viewMenuLink btnCurrentUser" href="#" onclick="Dashboard.showUserFlyout(this);">';
 
@@ -179,6 +179,8 @@
         
         var info = MediaController.getPlayerInfo();
 
+        if ($(".btnCast").hasClass("btnDisabledCast") == false) return; // No icon change if no CC is detected
+
         if (info.isLocalPlayer) {
 
             $('.btnCast').addClass('btnDefaultCast').removeClass('btnActiveCast');

dashboard-ui/scripts/site.js

@@ -1320,6 +1320,8 @@ $(function () {
     videoPlayerHtml += '<button onclick="MediaPlayer.showChaptersFlyout();" id="video-chaptersButton" class="mediaButton chaptersButton" title="Scenes" type="button" data-icon="video" data-iconpos="notext" data-inline="true">Scenes</button>';
     videoPlayerHtml += '<div class="mediaFlyoutContainer"><div id="video-chaptersFlyout" style="display:none;" class="mediaPlayerFlyout chaptersFlyout"></div></div>';
 
+    videoPlayerHtml += '<button onclick="CastPlayer.initializeLocalPlayer();CastPlayer.playMedia();" id="video-ccastButton" class="mediaButton videoCCastButton" title="Cast" type="button" data-icon="ccast" data-iconpos="notext" data-inline="true" style="display: none;">Cast</button>';
+
     videoPlayerHtml += '<button onclick="MediaPlayer.toggleVideoPlayerMenu();" id="video-videoPlayerMenuButton" class="mediaButton videoPlayerMenuButton" title="Menu" type="button" data-icon="bars" data-iconpos="notext" data-inline="true">Menu</button>';
 
     videoPlayerHtml += '</div>'; // videoControls