*
*/
+//Audio list can be re-ordered while filling.
+//This requires cancelling all previous timeouts to properly fill
+var clearAudioTimeouts = new Array();
+var lightColor = false;
+
function mediaError()
{
- console.log("MediaPlayer: file failed to load");
+ console.log("MediaPlayer: file failed to load");
}
var drawCanvasImage = function(imageSrc) {
- return function() {
- drawAlbumArt(imageSrc);
- }
+ return function() {
+ drawAlbumArt(imageSrc);
+ }
}
function drawAlbumArt(imageSrc)
{
- if (currentPlayerType === "AUDIO")
+ if (currentPlayerType === "AUDIO")
+ {
+ var canvasH = mediaListItemH * 0.95 ;
+ for (var i in audioContent)
{
- for (var i in audioContent)
+ if (audioContent[i].coverArt.src !== musicIcon.src && audioContent[i].coverArt.src === imageSrc && audioContent[i].ctx)
+ {
+ try
{
- if (audioContent[i].coverArt.src !== musicIcon.src && audioContent[i].coverArt.src === imageSrc)
- {
- try
- {
- audioContent[i].ctx.drawImage(audioContent[i].coverArt, 0, 0, canvasH, canvasH );
- }
- catch(err)
- {
- console.log("MediaPlayer: drawImage failed - " + err);
- }
- }
+ if (i == audioIndex)
+ {
+ updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
+ }
+ audioContent[i].ctx.drawImage(audioContent[i].coverArt, 0, 0, canvasH, canvasH);
}
+ catch(err)
+ {
+ console.log("MediaPlayer: drawImage failed - " + err);
+ }
+ }
}
+ }
}
function loadImages()
{
- console.log("MediaPlayer in loadImages");
+ console.log("MediaPlayer in loadImages");
- for (var src in audioContent)
+ for (var src in audioContent)
+ {
+ try
{
- try
- {
- var imgSrc = (audioContent[src].coverArtURI !== undefined && audioContent[src].coverArtURI !== "") ? audioContent[src].coverArtURI : "images/musicIcon.png";
- audioContent[src].coverArt = new Image();
- audioContent[src].coverArt.onload = drawCanvasImage(imgSrc);
+ var imgSrc = (audioContent[src].coverArtURI !== undefined && audioContent[src].coverArtURI !== "") ? audioContent[src].coverArtURI : "images/musicIcon.png";
+ audioContent[src].coverArt = new Image();
+ audioContent[src].coverArt.onload = drawCanvasImage(imgSrc);
- audioContent[src].coverArt.onerror = function(e){
- audioContent[src].coverArt.src = "images/musicIcon.png";
- };
+ audioContent[src].coverArt.onerror = function(e){
+ audioContent[src].coverArt.src = "images/musicIcon.png";
+ };
- audioContent[src].coverArt.src = imgSrc;
- }
- catch(err)
- {
- console.log("Failed to load audio cover image: " + err);
- }
+ audioContent[src].coverArt.src = imgSrc;
+ }
+ catch(err)
+ {
+ console.log("Failed to load audio cover image: " + err);
}
+ }
}
-function fillMediaList(contentList)
+function makeListItem(j, k, contentList, playerType, listItems)
{
- console.log("MediaPlayer in fillMediaList");
-
- //Don't try and fill an empty content list
- if (contentList === undefined || contentList === null || contentList.length <=0)
- return false;
+ var iconURI;
+ var currentCanvas;
+ var canvasW = mediaListItemW;
+ var canvasH = mediaListItemH * 0.95 ;
+ var lowerType = playerType.toLowerCase();
- var iconURI;
- var currentCanvas;
- var iconImg = new Image();
- var canvasW = mediaListItemW;
- var canvasH = mediaListItemH * 0.95 ;
+ for (var i = j; (i < (j+k) && i < contentList.length); i++)
+ {
- $("#mediaListItems").empty();
- var lightColor = false;
- for (var i=0; i < contentList.length; i++)
+ if ((i+1)%2 === 0)
+ {
+ if (nightMode)
+ {
+
+ listItems.append("<li id=" + lowerType + "ListItem" + i + " style='width:" + mediaListItemW + "px;" + " height:" + mediaListItemH + "px;" +
+ " margin-bottom: 10px' ><a href='#' class='night' >" +
+ "<canvas id=" + lowerType + "CanvasNum" + i + " width=" + canvasW + " height=" + canvasH + "> </canvas>" +
+ "</a></li>"
+ );
+ }
+ else
+ {
+ listItems.append("<li id=" + lowerType + "ListItem" + i + " style='width:" + mediaListItemW + "px;" + " height:" + mediaListItemH + "px;" +
+ " margin-bottom: 10px' ><a href='#'>" +
+ "<canvas id=" + lowerType + "CanvasNum" + i + " width=" + canvasW + " height=" + canvasH + "> </canvas>" +
+ "</a></li>"
+ );
+ }
+ }
+ else
{
- if (!lightColor)
+ if (nightMode)
+ {
+ listItems.append("<li id=" + lowerType + "ListItem" + i + " style='width:" + mediaListItemW + "px;" + " height:" + mediaListItemH + "px;" +
+ " margin-bottom: 10px' ><a href='#' class='lightColor night' >" +
+ "<canvas id=" + lowerType + "CanvasNum" + i + " width=" + canvasW + " height=" + canvasH + "> </canvas>" +
+ "</a></li>"
+ );
+ }
+ else
+ {
+ listItems.append("<li id=" + lowerType + "ListItem" + i + " style='width:" + mediaListItemW + "px;" + " height:" + mediaListItemH + "px;" +
+ " margin-bottom: 10px' ><a href='#' class='lightColor' >" +
+ "<canvas id=" + lowerType + "CanvasNum" + i + " width=" + canvasW + " height=" + canvasH + "> </canvas>" +
+ "</a></li>"
+ );
+ }
+
+ }
+
+ lightColor = !lightColor;
+
+ var currentCanvas = document.getElementById(lowerType + "CanvasNum" + i);
+ var currentCTX = currentCanvas.getContext("2d");
+
+ // Set callback function for the new list item
+ $("#" + lowerType + "CanvasNum" + i).click(function () {
+
+ $("#playButton").toggleClass('playing', false);
+
+ switch (playerType)
{
- if (nightMode)
- {
- $("#mediaListItems").append("<li><a href='#' class='night'>" +
- "<canvas id=canvasNum" + i + " width=" + canvasW + " height=" + canvasH + "> </canvas>" +
- "</a></li>"
- );
- }
- else
- {
- $("#mediaListItems").append("<li><a href='#'>" +
- "<canvas id=canvasNum" + i + " width=" + canvasW + " height=" + canvasH + "> </canvas>" +
- "</a></li>"
- );
- }
+ 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();
}
- else
+ catch(err)
{
- if (nightMode)
- {
- $("#mediaListItems").append("<li><a href='#' class='lightColor night'>" +
- "<canvas id=canvasNum" + i + " width=" + canvasW + " height=" + canvasH + "> </canvas>" +
- "</a></li>"
- );
- }
- else
- {
- $("#mediaListItems").append("<li><a href='#' class='lightColor'>" +
- "<canvas id=canvasNum" + i + " width=" + canvasW + " height=" + canvasH + "> </canvas>" +
- "</a></li>"
- );
- }
+ console.log("MediaPlayer: load audio error " + err.message);
+ }
+ break;
+ case "VIDEO":
+ try
+ {
+ videoIndex = $(this).parent().parent().index();
+ $("#videoSrc").attr("src", videoContent[videoIndex].contentURI);
+ videoPlayer.load();
+ currentMediaList.fadeOut(300);
+ }
+ catch(err)
+ {
+ console.log("MediaPlayer: load video error " + err.message);
}
+ break;
- lightColor = !lightColor;
-
- var currentCanvas = document.getElementById("canvasNum"+ i);
- var currentCTX = currentCanvas.getContext("2d");
-
- // Set callback function for the new list item
- $("#canvasNum"+i).click(function () {
- listIndex = $(this).parent().parent().index();
-
- $("#playButton").toggleClass('playing', false);
-
- switch (currentPlayerType)
- {
- case "AUDIO":
- try
- {
- loadAndPlay = true;
- updateMediaName(audioContent[listIndex].artists[0], audioContent[listIndex].title, audioContent[listIndex].coverArt);
- $("#audioSrc").attr("src", audioContent[listIndex].contentURI);
- audioPlayer.load();
- }
- catch(err)
- {
- console.log("updateMediaName error: " + err.message);
- }
- break;
-
- case "VIDEO":
- try
- {
- updateMediaName(videoContent[listIndex].artists[0], audioContent[listIndex].title, vidIcon);
- $("#videoSrc").attr("src", videoContent[listIndex].contentURI);
- videoPlayer.load();
- $("#mediaList").fadeOut(300);
- }
- catch(err)
- {
- console.log("updateMediaName error: " + err.message);
- }
- break;
-
- case "IMAGE":
- try
- {
- $("#imagePlayer").css("background", "url(" + imageContent[listIndex].contentURI + ") no-repeat center");
- $("#imagePlayer").css("background-size", "contain");
- $("#mediaList").fadeOut(300);
- }
- catch(err)
- {
- console.log("updateMediaName error: " + err.message);
- }
- break;
-
- default:
- break;
- }
- });
-
- switch (currentPlayerType)
+ case "IMAGE":
+ try
{
- case "AUDIO":
-
- audioContent[i].ctx = currentCTX;
-
- try
- {
- //Check if album art is done loading, if not draw default until it is
- if (audioContent[i].coverArt.complete)
- currentCTX.drawImage(audioContent[i].coverArt, 0, 0, canvasH, canvasH );
- else
- currentCTX.drawImage(musicIcon, 0, 0, canvasH, canvasH );
- }
- catch(err)
- {
- console.log("MediaPlayer: drawImage failed - " + err);
- }
-
- var trackText = new TextObject(currentCTX,{"text" : contentList[i].title, "xLoc" : canvasH + 20, "yLoc" : canvasH / 2.5 , "zLoc" : 0});
- var artistText = new TextObject(currentCTX,{"text" : contentList[i].artists[0], "xLoc" : canvasH + 20, "yLoc" : canvasH / 1.1 , "zLoc" : 0});
-
- break;
- case "VIDEO":
- currentCTX.drawImage(vidIcon, 0, 0, canvasH, canvasH );
- var artistText = new TextObject(currentCTX,{"text" : contentList[i].artists[0], "xLoc" : canvasH + 20, "yLoc" : canvasH / 2.5 , "zLoc" : 0});
- var trackText = new TextObject(currentCTX,{"text" : contentList[i].title, "xLoc" : canvasH + 20, "yLoc" : canvasH / 1.1 , "zLoc" : 0});
-
- break;
- case "IMAGE":
- currentCTX.drawImage(imgIcon, 0, 0, canvasH, canvasH );
- var artistText = new TextObject(currentCTX,{"text" : contentList[i].title, "xLoc" : canvasH + 20, "yLoc" : canvasH / 2.5 , "zLoc" : 0});
- var trackText = new TextObject(currentCTX,{"text" : " ", "xLoc" : canvasH + 20, "yLoc" : canvasH / 1.1 , "zLoc" : 0});
- break;
-
- default:
- break;
+ imageIndex = $(this).parent().parent().index();
+ $("#imagePlayer").css("background", "url(" + imageContent[imageIndex].contentURI + ") no-repeat center");
+ $("#imagePlayer").css("background-size", "contain");
+ currentMediaList.fadeOut(300);
}
+ catch(err)
+ {
+ console.log("MediaPlayer: load image error: " + err.message);
+ }
+ break;
- var mediaTextTemp1 = screenOrientation === "portrait" ? mediaTextTemplate2 : mediaTextTemplate2Landscape;
- var mediaTextTemp2 = screenOrientation === "portrait" ? mediaTextTemplate3 : mediaTextTemplate3Landscape;
- var trackTextTemp = screenOrientation === "portrait" ? trackTextTemplate : trackTextTemplateLandscape;
+ default:
+ break;
+ }
+ });
- trackText.applyTemplate(mediaTextTemp1);
- trackText.drawObj();
- trackText.applyTemplate(mediaTextTemp2);
- trackText.drawObj();
+ switch (playerType)
+ {
+ case "AUDIO":
- artistText.applyTemplate(trackTextTemp);
- artistText.drawObj();
+ audioContent[i].ctx = currentCTX;
+ try
+ {
+ //Check if album art is done loading, if not draw default until it is
+ if (audioContent[i].coverArt.complete)
+ currentCTX.drawImage(audioContent[i].coverArt, 0, 0, canvasH, canvasH );
+ else
+ currentCTX.drawImage(musicIcon, 0, 0, canvasH, canvasH );
+ }
+ catch(err)
+ {
+ console.log("MediaPlayer: drawImage failed - " + err);
+ }
+
+ var trackText = new TextObject(currentCTX,{"text" : contentList[i].title, "xLoc" : canvasH + 20, "yLoc" : canvasH / 2.5 , "zLoc" : 0});
+ var artistText = new TextObject(currentCTX,{"text" : contentList[i].artists[0], "xLoc" : canvasH + 20, "yLoc" : canvasH / 1.1 , "zLoc" : 0});
+ clearAudioTimeouts.splice(0, 1);
+ break;
+
+ case "VIDEO":
+ currentCTX.drawImage(vidIcon, 0, 0, canvasH, canvasH );
+ var artistText = new TextObject(currentCTX,{"text" : contentList[i].artists[0], "xLoc" : canvasH + 20, "yLoc" : canvasH / 2.5 , "zLoc" : 0});
+ var trackText = new TextObject(currentCTX,{"text" : contentList[i].title, "xLoc" : canvasH + 20, "yLoc" : canvasH / 1.1 , "zLoc" : 0});
+ break;
+
+ case "IMAGE":
+ currentCTX.drawImage(imgIcon, 0, 0, canvasH, canvasH );
+ var artistText = new TextObject(currentCTX,{"text" : contentList[i].title, "xLoc" : canvasH + 20, "yLoc" : canvasH / 2.5 , "zLoc" : 0});
+ var trackText = new TextObject(currentCTX,{"text" : " ", "xLoc" : canvasH + 20, "yLoc" : canvasH / 1.1 , "zLoc" : 0});
+ break;
+
+ default:
+ break;
}
- $("#mediaListItems li").css({"width" : mediaListItemW + "px", "height" : mediaListItemH + "px", "margin-bottom" : "10px"});
+ var mediaTextTemp1 = screenOrientation === "portrait" ? mediaTextTemplate2 : mediaTextTemplate2Landscape;
+ var mediaTextTemp2 = screenOrientation === "portrait" ? mediaTextTemplate3 : mediaTextTemplate3Landscape;
+ var trackTextTemp = screenOrientation === "portrait" ? trackTextTemplate : trackTextTemplateLandscape;
+
+ trackText.applyTemplate(mediaTextTemp1);
+ trackText.drawObj();
+ trackText.applyTemplate(mediaTextTemp2);
+ trackText.drawObj();
+
+ artistText.applyTemplate(trackTextTemp);
+ artistText.drawObj();
+ }
+}
+
+function emptyTimeouts()
+{
+ var clearItem;
+
+ while (clearItem = clearAudioTimeouts.pop())
+ {
+ clearTimeout(clearItem);
+ }
+}
+
+function fillMediaList(contentList)
+{
+ console.log("MediaPlayer in fillMediaList");
+
+ //Don't try and fill an empty content list
+ if (contentList === undefined || contentList === null || contentList.length <=0)
+ return false;
+
+ if (currentPlayerType === "AUDIO")
+ emptyTimeouts();
+
+ currentMediaListItems.empty();
+ var timeOut = 1;
+
+ switch (currentPlayerType)
+ {
+ case "AUDIO":
+ audioMediaListLoaded = true;
+ break;
+ case "VIDEO":
+ videoMediaListLoaded = true;
+ break;
+ case "IMAGE":
+ imageMediaListLoaded = true;
+ break;
+ default:
+ break;
+ }
+
+ var jumpSize = 1;
+ var tmpClearTimeout;
+
+ for (var i=0; i < contentList.length; i++)
+ {
+ tmpClearTimeout = setTimeout(makeListItem.bind(this, i, jumpSize, contentList, currentPlayerType, currentMediaListItems), timeOut);
+ clearAudioTimeouts.push(tmpClearTimeout);
+
+ timeOut += 50;
+ i+=jumpSize - 1;
+ }
}
var currentContent;
var currentPlayer;
var currentPlayerType = "AUDIO";
+var currentMediaList = $("#audioMediaList");
+var currentMediaListItems = $("#audioMediaListItems");
var currentPlayerControls;
+var audioMediaListLoaded = false;
+var videoMediaListLoaded = false;
+var imageMediaListLoaded = false;
var audioPlayer;
var videoPlayer;
-var listIndex = 0;
+var audioIndex = 0;
var videoIndex = 0;
var imageIndex = 0;
var vidIcon = new Image();
function updateMediaName(newArtist, newTitle, newCover)
{
- console.log("MediaPlayer in updateMediaName");
-
- var playBarHeight = mediaNameCanvas.height;
- var boxWidth = playBarHeight * 0.75;
- mediaNameCTX.clearRect(0,0,mediaNameCanvas.width, mediaNameCanvas.height);
-
- if (currentPlayerType === "AUDIO")
+ if (currentMenu === "audio")
{
- var shadeJump = 10;
- var alphaJump = 0.01;
- var currColor = 255;
- var currAlpha = 1.0;
-
- mediaNameCTX.fillStyle="rgba(30,30,30,0.5)";
- mediaNameCTX.strokeStyle="rgba(130,130,130,1)";
- mediaNameCTX.lineWidth = 5;
- mediaNameCTX.fillRect(0,0,mediaNameCanvas.width, playBarHeight);
- mediaNameCTX.strokeRect(-20,0,mediaNameCanvas.width + 40, playBarHeight);
-
- if (newCover === undefined || newCover.naturalWidth === undefined || newCover.naturalWidth <= 0)
+ var playBarHeight = mediaNameCanvas.height;
+ var boxWidth = playBarHeight * 0.75;
+ mediaNameCTX.clearRect(0,0,mediaNameCanvas.width, mediaNameCanvas.height);
+
+ if (currentPlayerType === "AUDIO")
{
- newCover = musicIcon;
- }
+ var shadeJump = 10;
+ var alphaJump = 0.01;
+ var currColor = 255;
+ var currAlpha = 1.0;
+
+ mediaNameCTX.fillStyle="rgba(30,30,30,0.5)";
+ mediaNameCTX.strokeStyle="rgba(130,130,130,1)";
+ mediaNameCTX.lineWidth = 5;
+ mediaNameCTX.fillRect(0,0,mediaNameCanvas.width, playBarHeight);
+ mediaNameCTX.strokeRect(-20,0,mediaNameCanvas.width + 40, playBarHeight);
+
+ if (newCover === undefined || newCover.naturalWidth === undefined || newCover.naturalWidth <= 0)
+ {
+ newCover = musicIcon;
+ }
- mediaNameCTX.drawImage(newCover, 20, (playBarHeight - boxWidth) / 2, boxWidth, boxWidth);
+ mediaNameCTX.drawImage(newCover, 20, (playBarHeight - boxWidth) / 2, boxWidth, boxWidth);
- if (screenOrientation === "portrait")
- {
- var textStartX = boxWidth + 50;
+ if (screenOrientation === "portrait")
+ {
+ var textStartX = boxWidth + 50;
- var trackText = new TextObject(mediaNameCTX,{"text" : newTitle, "xLoc" : textStartX, "yLoc" : 70 , "zLoc" : 0,
- "width" : mediaNameCanvas.width - textStartX, "height" : 50, "lineHeight" : 65, "wordWrap" : true});
- trackText.applyTemplate(mainMenuTitleTemplate);
+ var trackText = new TextObject(mediaNameCTX,{"text" : newTitle, "xLoc" : textStartX, "yLoc" : 70 , "zLoc" : 0,
+ "width" : mediaNameCanvas.width - textStartX, "height" : 50, "lineHeight" : 65, "wordWrap" : true});
+ trackText.applyTemplate(mainMenuTitleTemplate);
- var artistText = new TextObject(mediaNameCTX,{"text" : newArtist, "xLoc" : textStartX, "yLoc" : 70, "zLoc" : 0,
- "width" : mediaNameCanvas.width - textStartX, "height" : 50, "lineHeight" : 50, "wordWrap" : true});
- artistText.applyTemplate(mainTrackTemplate);
- }
- else
- {
- var textStartX = boxWidth + 50;
- var trackText = new TextObject(mediaNameCTX,{"text" : newTitle, "xLoc" : textStartX, "yLoc" : 50 , "zLoc" : 0,
- "width" : mediaNameCanvas.width - textStartX, "height" : 30, "lineHeight" : 30, "wordWrap" : true});
- trackText.applyTemplate(mainMenuTitleTemplateLandscape);
- var artistText = new TextObject(mediaNameCTX,{"text" : newArtist, "xLoc" : textStartX, "yLoc" : 50, "zLoc" : 0,
- "width" : mediaNameCanvas.width - textStartX, "height" : 30, "lineHeight" : 30, "wordWrap" : true});
- artistText.applyTemplate(mainTrackTemplateLandscape);
- }
+ var artistText = new TextObject(mediaNameCTX,{"text" : newArtist, "xLoc" : textStartX, "yLoc" : 70, "zLoc" : 0,
+ "width" : mediaNameCanvas.width - textStartX, "height" : 50, "lineHeight" : 50, "wordWrap" : true});
+ artistText.applyTemplate(mainTrackTemplate);
+ }
+ else
+ {
+ var textStartX = boxWidth + 50;
+ var trackText = new TextObject(mediaNameCTX,{"text" : newTitle, "xLoc" : textStartX, "yLoc" : 50 , "zLoc" : 0,
+ "width" : mediaNameCanvas.width - textStartX, "height" : 30, "lineHeight" : 30, "wordWrap" : true});
+ trackText.applyTemplate(mainMenuTitleTemplateLandscape);
+ var artistText = new TextObject(mediaNameCTX,{"text" : newArtist, "xLoc" : textStartX, "yLoc" : 50, "zLoc" : 0,
+ "width" : mediaNameCanvas.width - textStartX, "height" : 30, "lineHeight" : 30, "wordWrap" : true});
+ artistText.applyTemplate(mainTrackTemplateLandscape);
+ }
- trackText.drawObj();
- trackText.drawLargeShadow();
+ trackText.drawObj();
+ trackText.drawLargeShadow();
- artistText.yLoc += trackText.height;
- artistText.drawObj();
+ artistText.yLoc += trackText.height;
+ artistText.drawObj();
+ }
}
}
try
{
audioContent = audioContent.concat(content);
- sortByAlpha(audioContent);
$("#audioSrc").attr("src", audioContent[0].contentURI);
audioPlayer.load();
loadImages();
+ audioMediaListLoaded = true;
+ currentMediaListItems = $("#audioMediaListItems");
+ fillMediaList(audioContent);
}
catch (err)
switch(currentPlayerType)
{
- case "AUDIO":
- //show audio player
- try
- {
- updateMediaName(audioContent[listIndex].artists[0], audioContent[listIndex].title, audioContent[listIndex].coverArt);
- }
- catch(err)
- {
- console.log("updateMediaName failed for showMediaMenu (audio) : " + err.message);
- }
+ case "AUDIO":
+ //show audio player
+ try
+ {
+ if (audioContent.length > 0)
+ updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
+ }
+ catch(err)
+ {
+ console.log("updateMediaName failed for showMediaMenu (audio) : " + err.message);
+ }
- $("#mediaName").fadeIn(800);
- $(".sortButton").fadeIn(800);
- currentPlayer.fadeIn(800);
+ $("#mediaName").fadeIn(800);
+ $(".sortButton").fadeIn(800);
+ currentPlayer.fadeIn(800);
- $("#mediaList").addClass("mediaListAudioList");
+ if (screenOrientation === "landscape" )
+ $("#audioMediaList").addClass("landscape");
+ else
+ $("#audioMediaList").removeClass("landscape");
- if (screenOrientation === "landscape" )
- $("#mediaList").addClass("landscape");
- else
- $("#mediaList").removeClass("landscape");
+ $("#audioMediaList").fadeIn(800);
+ break;
- $("#mediaList").fadeIn(800);
- break;
+ case "VIDEO":
+ //show video
+ setTimeout(function(){currentPlayer.show()}, 800); //The video element can't be faded, so wait a moment before showing
+ break;
- case "VIDEO":
- //show video
- setTimeout(function(){currentPlayer.show()}, 800); //The video element can't be faded, so wait a moment before showing
- break;
+ case "IMAGE":
+ //show image
+ currentPlayer.fadeIn(800);
+ break;
- case "IMAGE":
- //show image
- currentPlayer.fadeIn(800);
+ default:
+ console.log("Invalid player type");
break;
-
- default:
- console.log("Invalid player type");
- break;
}
}
function showMediaList()
{
console.log("MediaPlayer in showMediaList");
- if ($("#mediaList").is(":visible"))
- $("#mediaList").fadeOut(300);
+
+ if (currentMediaList.is(":visible"))
+ currentMediaList.fadeOut(300);
else
{
- $("#mediaList").fadeIn(300);
+ currentMediaList.fadeIn(300);
}
}
switch(menuButtonId)
{
- case ("mainMusicButton"):
- speechObj.vocalizeString("Music player");
- currentMenu = "audio";
- currentPlayer = $("#audioPlayer");
- currentPlayerControls = document.getElementById("audioPlayer");
- currentPlayerType = "AUDIO";
- currentContent = audioContent;
- fillMediaList(currentContent);
- showMediaMenu();
- break;
+ case ("mainMusicButton"):
+ speechObj.vocalizeString("Music player");
+ currentMenu = "audio";
+ currentPlayer = $("#audioPlayer");
+ currentPlayerControls = document.getElementById("audioPlayer");
+ currentPlayerType = "AUDIO";
+ currentMediaList = $("#audioMediaList");
+ currentMediaListItems = $("#audioMediaListItems");
+ currentContent = audioContent;
+
+ if (!audioMediaListLoaded)
+ fillMediaList(currentContent);
+
+ showMediaMenu();
+ break;
- case ("mainVideoButton"):
- speechObj.vocalizeString("Video player");
- currentMenu = "video";
- currentPlayer = $("#videoPlayer");
- currentPlayerControls = document.getElementById("videoPlayer");
- currentPlayerType = "VIDEO";
- currentContent = videoContent;
- fillMediaList(currentContent);
- showMediaMenu();
- break;
+ case ("mainVideoButton"):
+ speechObj.vocalizeString("Video player");
+ currentMenu = "video";
+ currentPlayer = $("#videoPlayer");
+ currentPlayerControls = document.getElementById("videoPlayer");
+ currentPlayerType = "VIDEO";
+ currentMediaList = $("#videoMediaList");
+ currentMediaListItems = $("#videoMediaListItems");
+ currentContent = videoContent;
- case ("mainImageButton"):
- speechObj.vocalizeString("Picture viewer");
- currentMenu = "image";
- currentPlayer = $("#imagePlayer");
- currentPlayerControls = imageControls;
- currentPlayerType = "IMAGE";
- currentContent = imageContent;
- fillMediaList(currentContent);
- showMediaMenu();
- break;
- default:
- console.log("Error: No menu by that name");
- break;
+ if (!videoMediaListLoaded)
+ fillMediaList(currentContent);
+
+ showMediaMenu();
+ break;
+
+ case ("mainImageButton"):
+ speechObj.vocalizeString("Picture viewer");
+ currentMenu = "image";
+ currentPlayer = $("#imagePlayer");
+ currentPlayerControls = imageControls;
+ currentPlayerType = "IMAGE";
+ currentMediaList = $("#imageMediaList");
+ currentMediaListItems = $("#imageMediaListItems");
+ currentContent = imageContent;
+
+ if (!imageMediaListLoaded)
+ fillMediaList(currentContent);
+
+ showMediaMenu();
+ break;
+ default:
+ console.log("Error: No menu by that name");
+ break;
}
}
$("#playButton").toggleClass('playing', false);
//If the media list is showing, hide it. Remove the mediaListAudioList class if it exists so that it will resize properly
- if ($("#mediaList").is(":visible"))
- $("#mediaList").fadeOut(300, function(){$("#mediaList").removeClass("mediaListAudioList");});
+ if (currentMediaList.is(":visible"))
+ currentMediaList.fadeOut(300);
$(".navButton").fadeOut(300);
$(".sortButton").fadeOut(300);
function sortByAlpha(contentToSort)
{
console.log("MediaPlayer in sortByAlpha");
+
+ if (currentPlayerType === "AUDIO")
+ emptyTimeouts();
+
//If contentToSort is undefined it's because the request came from the sortBy buttons
if (contentToSort === undefined)
contentToSort = audioContent;
function sortByArtist(contentToSort)
{
console.log("MediaPlayer in sortByArtist");
+
+ if (currentPlayerType === "AUDIO")
+ emptyTimeouts();
+
if (contentToSort === undefined)
contentToSort = audioContent;
function sortByAlbum(contentToSort)
{
+ if (currentPlayerType === "AUDIO")
+ emptyTimeouts();
+
console.log("MediaPlayer in sortByAlbum");
if (contentToSort === undefined)
contentToSort = audioContent;
}
}
else
- console.log(audioContent[listIndex].artists[0] + " : " + audioContent[listIndex].title + " can't play yet, it hasn't loaded");
+ console.log(audioContent[audioIndex].artists[0] + " : " + audioContent[audioIndex].title + " can't play yet, it hasn't loaded");
}
function pauseButtonClick()
case "AUDIO":
if (audioContent)
{
- if (listIndex > 0 )
- listIndex--;
+ if (audioIndex > 0 )
+ audioIndex--;
else
- listIndex = imageContent.length - 1;
+ audioIndex = audioContent.length - 1;
loadAndPlay = true;
audioPlayer.pause();
- $("#audioSrc").attr("src", audioContent[listIndex].contentURI);
- updateMediaName(audioContent[listIndex].artists[0], audioContent[listIndex].title, audioContent[listIndex].coverArt);
+ $("#playButton").toggleClass('playing', false);
+
+ $("#audioSrc").attr("src", audioContent[audioIndex].contentURI);
+ updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
audioPlayer.load();
}
break;
if (videoIndex > 0 )
videoIndex--;
else
- videoIndex = imageContent.length - 1;
+ videoIndex = videoContent.length - 1;
- if ($("#mediaList").is(":visible"))
- videoPlayer.pause();
-
- $("#playButton").toggleClass('playing', true);
+ videoPlayer.pause();
+ $("#playButton").toggleClass('playing', false);
$("#videoSrc").attr("src", videoContent[videoIndex].contentURI);
videoPlayer.load();
}
case "AUDIO":
if (audioContent)
{
- if (audioContent.length > (listIndex + 1))
- listIndex++;
+ if (audioContent.length > (audioIndex + 1))
+ audioIndex++;
else
- listIndex = 0;
+ audioIndex = 0;
loadAndPlay = true;
audioPlayer.pause();
- $("#audioSrc").attr("src", audioContent[listIndex].contentURI);
- updateMediaName(audioContent[listIndex].artists[0], audioContent[listIndex].title, audioContent[listIndex].coverArt);
+ $("#playButton").toggleClass('playing', false);
+
+ $("#audioSrc").attr("src", audioContent[audioIndex].contentURI);
+ updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
audioPlayer.load();
}
break;
videoIndex = 0;
videoPlayer.pause();
- $("#playButton").toggleClass('playing', true);
+ $("#playButton").toggleClass('playing', false);
$("#videoSrc").attr("src", videoContent[videoIndex].contentURI);
videoPlayer.load();
}
{
console.log("MediaPlayer in resizeMainMenu");
- $("#mediaList").fadeOut(0);
+ currentMediaList.fadeOut(0);
screenWidth = window.innerWidth;
screenHeight = window.innerHeight;
screenOrientation = screenWidth < screenHeight ? "portrait" : "landscape";
var sortButtonWidth = buttonWidth * 2.5;
var buttonSpacing = screenWidth / 5;
- mediaListItemW = $("#mediaList").width() * 0.92;
- mediaListItemH = $("#mediaList").height() / 10;
+ mediaListItemW = $("#videoMediaList").width() * 0.92;
+ mediaListItemH = $("#videoMediaList").height() / 10;
}
function resizeAll()
console.log("MediaPlayer: Speech Recognition not running, voice control will be unavailable");
//Get local media
- getMedia(contentType);
+ setTimeout(function(){getMedia(contentType);}, 500);
//Prevent highlighting
window.ondragstart = function() { return false; }
projects / profile / ivi / MediaPlayer.git / commitdiff