MediaPlayer will now remember where the user was on restart. Also able to reconnect... 45/10545/4 accepted/tizen/20131003.224112 accepted/tizen/20131004.164521 submit/tizen/20131003.224339
authorbrianjjones <brian.j.jones@intel.com>
Thu, 3 Oct 2013 22:09:25 +0000 (15:09 -0700)
committerbrianjjones <brian.j.jones@intel.com>
Thu, 3 Oct 2013 22:35:50 +0000 (15:35 -0700)
Change-Id: Ia9125f2f56cb68aee1e8990e57b9095c109eeaae
Signed-off-by: brianjjones <brian.j.jones@intel.com>
config.xml
css/main.css
index.html
js/dlna.js
js/listFunctions.js
js/main.js
packaging/MediaPlayer.changes

index 8536249..b8b32d9 100644 (file)
@@ -4,6 +4,7 @@
     <content src="index.html"/>
     <icon src="MediaPlayer.png"/>
     <name>MediaPlayer</name>
+    <access origin="*" />
     <tizen:privilege name="http://tizen.org/privilege/speech"/>
     <tizen:privilege name="http://tizen.org/privilege/content.read"/>
     <tizen:privilege name="http://tizen.org/privilege/content.write"/>
index 6f9a4dc..dbe5ee9 100644 (file)
@@ -14,7 +14,7 @@
 
 html
 {
-       background-color: black;
+       background-color: white;
        min-height: 100%;
        background-size:cover;
 }
@@ -188,7 +188,7 @@ html
 .mediaList ul li a { position:absolute; display:block; overflow: auto; background-color:rgba(50, 50, 50, 0.5);
    padding-left:15px; padding-top:5px; padding-bottom:5px;  border-radius: 20px; -webkit-border-radius: 20px;}
 
-.mediaList ul li a.lightColor { position:absolute; display:block; overflow: auto; background-color:rgba(180, 180, 180, 0.5);
+.mediaList ul li a.lightColor { position:absolute; display:block; overflow: auto; background-color:rgba(150, 150, 250, 0.5);
    padding-left:15px; padding-top:5px; padding-bottom:5px;  border-radius: 20px; -webkit-border-radius: 20px;}
 
 /********************** Night versions ***********************/
@@ -200,7 +200,7 @@ html.night
        background-size:cover;
 }
 
-.mediaList ul li a.night { position:absolute; display:block; overflow: auto; background-color:rgba(150, 150, 250, 0.5);
+.mediaList ul li a.night { position:absolute; display:block; overflow: auto; background-color:rgba(180, 180, 180, 0.5);
    padding-left:15px; padding-top:5px; padding-bottom:5px;  border-radius: 20px; -webkit-border-radius: 20px;}
 
 .mediaList ul li a.lightColor.night { position:absolute; display:block; overflow: auto; background-color:rgba(18, 18, 18, 0.5);
index 98db753..594944c 100644 (file)
@@ -26,7 +26,7 @@
                        <source id=audioSrc type="audio/mpeg">
                </audio>
 
-               <video id="videoPlayer" onClick="playButtonClick()" class="player">
+               <video id="videoPlayer" onClick="playButtonClick()" class="player" oncanplaythrough="videoLoaded()">
                        <source id=videoSrc>
                </video>
 
@@ -54,7 +54,6 @@
                </div>
 
                <div id="navigationButtons" style="position:absolute; visible:hidden">
-                       <!-- <div id="mediaName" ><font size="8" color="#F00"></font></div> -->
                        <img id="backButton" class="navButton" onClick="backButtonClick()" style="position:absolute; display: none">
                        <img id="nextButton" class="navButton" onClick="nextButtonClick()" style="position:absolute; display: none">
                        <img id="returnButton" class="navButton" onClick="showMainMenu()" style="position:absolute; display: none">
index 4d9242b..41fab32 100644 (file)
@@ -6,6 +6,8 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  *
  */
+var stopConnectionSearch = undefined;
+var remoteMediaPreviouslyLoaded = false;
 
 function convertMediaServerContent(item)
 {
@@ -18,13 +20,16 @@ function convertMediaServerContent(item)
                content.storageType = "EXTERNAL";
        }
 
-       else {
+       else
+       {
                content.editableAttributes = [];
                content.name = content.title;
                content.contentURI = item.URLs[0];
                content.mimeType = item.MIMEType;
                content.size = item.Size;
                content.rating = 0;
+               content.remoteFile = true;
+
                if (item.Type.indexOf("video") == 0)
                {
                        content.type = "VIDEO";
@@ -73,6 +78,9 @@ function findAllCallback(medias)
        console.log("MediaServer findAllCallback");
        console.log("found " + medias.length + " medias.");
 
+       clearInterval(stopConnectionSearch);
+       stopConnectionSearch = undefined;
+
        var itemsAdded = 0;
 
        for (var i=0; i < medias.length; i++)
@@ -106,6 +114,13 @@ function findAllCallback(medias)
        imageMediaListLoaded = false;
 }
 
+function restartMedia (medias)
+{
+       clearInterval(stopConnectionSearch);
+       loadPrevVideo = true;
+       $("#videoSrc").attr("src", videoContent[videoIndex].contentURI);
+}
+
 function foundMediaServer(srv)
 {
        console.log("MediaPlayer: New MediaServer Found");
@@ -119,7 +134,23 @@ function foundMediaServer(srv)
                console.log("MediaPlayer: MediaServer root folder: " + srv.root.id);
                srv.browse(srv.root.id, "+DisplayName", 0, 0, browseCallback);
                srv.find(srv.root.id, "*", "+DisplayName", 0, 0, findAllCallback);
+
+               if (stopConnectionSearch !== undefined)
+                       clearInterval(stopConnectionSearch);
+
+               stopConnectionSearch = setInterval(function(){console.log("MediaPlayer searching for remote media..."); tizen.mediaserver.scanNetwork(foundMediaServer);}, 3000);
        }
        else
                console.log("MediaServer not browsable");
 }
+
+function reconnectServer(srv)
+{
+       if (srv.root)
+       {
+               srv.find(srv.root.id, "*", "+DisplayName", 0, 0, restartMedia);
+               stopConnectionSearch = setInterval(function(){console.log("MediaPlayer searching for remote media for reconnect..."); tizen.mediaserver.scanNetwork(reconnectServer);}, 1000);
+       }
+       else
+               console.log("MediaServer not reloadable");
+}
index 0b8d45e..2994825 100644 (file)
@@ -141,15 +141,16 @@ function makeListItem(j, k, contentList, playerType, listItems)
                case "AUDIO":
                try
                {
-               audioIndex = $(this).parent().parent().index();
-               loadAndPlay = true;
-               updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
-               $("#audioSrc").attr("src", audioContent[audioIndex].contentURI);
-               audioPlayer.load();
+                   audioIndex = $(this).parent().parent().index();
+                   loadAndPlay = true;
+                   updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
+                   $("#audioSrc").attr("src", audioContent[audioIndex].contentURI);
+                   localStorage.prevAudioTrack = audioContent[audioIndex].contentURI;
+                   audioPlayer.load();
                }
                catch(err)
                {
-               console.log("MediaPlayer: load audio error " + err.message);
+                       console.log("MediaPlayer: load audio error " + err.message);
                }
                break;
 
@@ -158,6 +159,7 @@ function makeListItem(j, k, contentList, playerType, listItems)
                {
                    videoIndex = $(this).parent().parent().index();
                    $("#videoSrc").attr("src", videoContent[videoIndex].contentURI);
+                   localStorage.prevVideo = videoContent[videoIndex].contentURI;
                    videoPlayer.load();
                    currentMediaList.fadeOut(300);
                }
index 0fd3eb6..cb947db 100644 (file)
@@ -25,6 +25,8 @@ var currentPlayerType = "AUDIO";
 var currentMediaList = $("#audioMediaList");
 var currentMediaListItems = $("#audioMediaListItems");
 var currentPlayerControls;
+var audioPlayerControls;
+var videoPlayerControls;
 var audioMediaListLoaded = false;
 var videoMediaListLoaded = false;
 var imageMediaListLoaded = false;
@@ -41,6 +43,9 @@ var mediaListItemW;
 var mediaListItemH;
 var imageControls;
 var loadAndPlay = false;
+var loadPrevAudio = false;
+var loadPrevVideo = false;
+var playOnConnect = false;
 var currentFileLoaded = false;
 var mediaNameCanvas;
 var mediaNameCTX;
@@ -48,6 +53,7 @@ var speechObj;
 var nightMode = false;
 var waitingToResumeVideo = false;              //Media has been paused by exterior forces.  If set to true, resume previous media when given the signal.
 var stopServerSearch;
+var clearAudioTimeInterval, clearVideoTimeInterval;
 
 var mainMenuTitleTemplateLandscape = {"font" : "oblique bolder 30pt arial", "lineWidth" : 9.5, "fillStyle" : "black", "strokeStyle" : "white", "textAlign" : "left",
                "largeShadow" : 8, "shadowOffsetX" : 0, "shadowOffsetY" : 0, "shadowBlur" : 45, "shadowColor" : "rgba(255, 187, 0, 0.4)"};
@@ -234,8 +240,28 @@ function onContentItemArraySuccess(content)
                                {
                                        audioContent = audioContent.concat(content);
 
-                                       $("#audioSrc").attr("src", audioContent[0].contentURI);
-                                       audioPlayer.load();
+                                       if (localStorage.prevAudioTrack)
+                                       {
+                                               for (var i = 0; i < audioContent.length; i++)
+                                               {
+
+                                                       if (audioContent[i].contentURI === localStorage.prevAudioTrack)
+                                                       {
+
+                                                               audioIndex = i;
+                                                       loadPrevAudio = true;
+                                                       $("#audioSrc").attr("src", audioContent[audioIndex].contentURI);
+                                                       audioPlayer.load();
+                                                       break;
+                                                       }
+                                               }
+                                       }
+                                       else
+                                       {
+                                               $("#audioSrc").attr("src", audioContent[0].contentURI);
+                                               localStorage.prevAudioTrack = audioContent[0].contentURI;
+                                               audioPlayer.load();
+                                       }
 
                                        var imgSources = [];
                                        for (var i = 0; i < audioContent.length; i++)
@@ -264,7 +290,28 @@ function onContentItemArraySuccess(content)
                if (!emptyContent)
                {
                        videoContent = videoContent.concat(content);
-                       $("#videoSrc").attr("src", videoContent[0].contentURI);
+
+                       if (localStorage.prevVideo)
+                       {
+                               for (var i = 0; i < videoContent.length; i++)
+                               {
+                                       if (videoContent[i].contentURI === localStorage.prevVideo)
+                                       {
+                                               videoIndex = i;
+                                               loadPrevVideo = true;
+                                               $("#videoSrc").attr("src", videoContent[videoIndex].contentURI);
+                                               videoPlayer.load();
+
+                                       }
+                               }
+                       }
+                       else
+                       {
+                               $("#videoSrc").attr("src", videoContent[0].contentURI);
+                               localStorage.prevVideo = videoContent[0].contentURI;
+                               videoPlayer.load();
+                       }
+
                }
                contentType = "IMAGE";
                break;
@@ -281,7 +328,7 @@ function onContentItemArraySuccess(content)
 
        default:
                console.log("Undefined content search type");
-       nextContentType = undefined;
+               nextContentType = undefined;
        break;
        }
 
@@ -418,8 +465,6 @@ function changeMenu(menuButtonId)
                        if (!videoMediaListLoaded)
                                fillMediaList(currentContent);
 
-                        $("#videoPlayer").load();
-
                        showMediaMenu();
                break;
 
@@ -448,6 +493,12 @@ function showMainMenu()
 {
        console.log("MediaPlayer in showMainMenu");
        currentMenu = "main";
+
+       if (!currentPlayerControls.paused && currentPlayerType === "AUDIO")
+               clearInterval(clearAudioTimeInterval);
+       else if (!currentPlayerControls.paused && currentPlayerType === "VIDEO")
+               clearInterval(clearVideoTimeInterval);
+
        currentPlayerControls.pause();
 
        //If the media list is showing, hide it.  Remove the mediaListAudioList class if it exists so that it will resize properly
@@ -554,8 +605,42 @@ function playLoadedMedia()
        if (loadAndPlay)
        {
                currentPlayerControls.play();
+               clearAudioTimeInterval = setInterval(
+                       function(){
+                               if (localStorage.prevAudioTime === audioPlayerControls.currentTime)
+                               {
+                                       stallCounter++;
+
+                                       if (stallCounter > 10)
+                                       {
+                                               //Remote media has stalled, attempt to reconnect
+                                               playOnConnect = true;
+                                               tizen.mediaserver.scanNetwork(reconnectServer);
+                                       }
+                               }
+
+                               localStorage.prevAudioTime = audioPlayerControls.currentTime;
+                               },500);
+
+               if (audioContent[audioIndex].remoteFile)
+                       stallCounter = 0;
+
                loadAndPlay = false;
        }
+       else if (loadPrevAudio)
+       {
+               audioPlayerControls.currentTime = localStorage.prevAudioTime;
+               loadPrevAudio = false;
+       }
+}
+
+function videoLoaded()
+{
+        if (loadPrevVideo)
+        {
+               videoPlayerControls.currentTime = localStorage.prevVideoTime;
+               loadPrevVideo = false;
+        }
 }
 
 function playButtonClick()
@@ -565,11 +650,28 @@ function playButtonClick()
        {
                if (currentPlayerControls.paused)
                {
+
+                       if (loadAndPlay)
+                               currentPlayerControls.currentTime = localStorage.prevAudioTime;
+
+                       loadAndPlay = false;
                        currentPlayerControls.play();
+
+                       //Start tracking the current time of the media.  This is used to play from previous position on restart.
+                       if (currentPlayerType === "AUDIO")
+                               clearAudioTimeInterval = setInterval(function(){localStorage.prevAudioTime = currentPlayerControls.currentTime},500);
+                       else if (currentPlayerType === "VIDEO")
+                               clearVideoTimeInterval = setInterval(function(){localStorage.prevVideoTime = currentPlayerControls.currentTime},500);
+
                }
                else
                {
                        currentPlayerControls.pause();
+
+                       if (currentPlayerType === "AUDIO")
+                               clearInterval(clearAudioTimeInterval);
+                       else if (currentPlayerType === "VIDEO")
+                               clearInterval(clearVideoTimeInterval);
                }
        }
        else
@@ -603,6 +705,8 @@ function backButtonClick()
 
                        $("#audioSrc").attr("src", audioContent[audioIndex].contentURI);
                        updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
+
+                       localStorage.prevAudioTrack = audioContent[audioIndex].contentURI;
                        audioPlayer.load();
                }
                break;
@@ -658,6 +762,8 @@ function nextButtonClick()
                        audioPlayer.pause();
 
                        $("#audioSrc").attr("src", audioContent[audioIndex].contentURI);
+
+                       localStorage.prevAudioTrack = audioContent[audioIndex].contentURI;
                        updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
                        audioPlayer.load();
                }
@@ -850,6 +956,9 @@ function init()
        imgIcon.src = "images/imageIcon.png";
        imageControls = new ImageControls();
 
+       audioPlayerControls = document.getElementById("audioPlayer");
+       videoPlayerControls = document.getElementById("videoPlayer");
+
        mediaNameCanvas = document.getElementById("mediaName");
        mediaNameCTX = mediaNameCanvas.getContext("2d");
 
index cfd915b..f8ff933 100644 (file)
@@ -1,3 +1,9 @@
+* Thu Oct 03 2013 brianjjones <brian.j.jones@intel.com> submit/tizen/20130925.235244@b480ae8
+- MediaPlayer will now remember where the user was on restart.  Also able to reconnect to remote media if connection is lost (TIVI-1254)
+- Load the first video when moving to the video player mode
+- Fix background when in nightMode
+- Make play button state driven directly off media events
+
 * Wed Sep 25 2013 brianjjones <brian.j.jones@intel.com> submit/tizen/20130925.145436@899c31e
 - DLNA plugin doesn't currently give a signal that it failed to connect.  So a interval call
   has been added to continue trying until successfull.