js/main.js

   1 /*
   2  * Copyright (c) 2013, Intel Corporation.
   3  *
   4  * This program is licensed under the terms and conditions of the
   5  * Apache License, version 2.0.  The full text of the Apache License is at
   6  * http://www.apache.org/licenses/LICENSE-2.0
   7  *
   8  */
   9
  10 var currentMenu = "main";
  11 var mouseDownEvent;
  12 var resizeCB = resizeMainMenu;
  13 var screenWidth;
  14 var screenHeight;
  15 var screenOrientation;
  16 var iconWidth;
  17 var padding;
  18 var contentType = "AUDIO";
  19 var audioContent = new Array();
  20 var videoContent = new Array();
  21 var imageContent = new Array();
  22 var currentContent;
  23 var currentPlayer;
  24 var currentPlayerType = "AUDIO";
  25 var currentMediaList = $("#audioMediaList");
  26 var currentMediaListItems = $("#audioMediaListItems");
  27 var currentPlayerControls;
  28 var audioMediaListLoaded = false;
  29 var videoMediaListLoaded = false;
  30 var imageMediaListLoaded = false;
  31 var audioPlayer;
  32 var videoPlayer;
  33 var audioIndex = 0;
  34 var videoIndex = 0;
  35 var imageIndex = 0;
  36 var vidIcon = new Image();
  37 var imgIcon = new Image();
  38 var musicIcon = new Image();
  39 var imagesLoaded = false;
  40 var mediaListItemW;
  41 var mediaListItemH;
  42 var imageControls;
  43 var loadAndPlay = false;
  44 var currentFileLoaded = false;
  45 var mediaNameCanvas;
  46 var mediaNameCTX;
  47 var speechObj;
  48 var nightMode = false;
  49 var waitingToResumeVideo = false;               //Media has been paused by exterior forces.  If set to true, resume previous media when given the signal.
  50 var stopServerSearch;
  51
  52 var mainMenuTitleTemplateLandscape = {"font" : "oblique bolder 30pt arial", "lineWidth" : 9.5, "fillStyle" : "black", "strokeStyle" : "white", "textAlign" : "left",
  53                 "largeShadow" : 8, "shadowOffsetX" : 0, "shadowOffsetY" : 0, "shadowBlur" : 45, "shadowColor" : "rgba(255, 187, 0, 0.4)"};
  54
  55 var mainMenuTitleTemplate = {"font" : "oblique bolder 40pt arial", "lineWidth" : 9.5, "fillStyle" : "black", "strokeStyle" : "white", "textAlign" : "left",
  56                 "largeShadow" : 8, "shadowOffsetX" : 0, "shadowOffsetY" : 0, "shadowBlur" : 45, "shadowColor" : "rgba(255, 187, 0, 0.4)"};
  57
  58 var mainTrackTemplateLandscape = {"font" : "bold 20pt Arial", "lineWidth" : 7.5, "fillStyle" : "black", "strokeStyle" : "white", "textAlign" : "left",
  59                 "largeShadow" : 8, "shadowOffsetX" : 0, "shadowOffsetY" : 0, "shadowBlur" : 45, "shadowColor" : "rgba(255, 187, 0, 0.5))"};
  60
  61 var mainTrackTemplate = {"font" : "bold 30pt Arial", "lineWidth" : 7.5, "fillStyle" : "black", "strokeStyle" : "white", "textAlign" : "left",
  62                 "largeShadow" : 8, "shadowOffsetX" : 0, "shadowOffsetY" : 0, "shadowBlur" : 45, "shadowColor" : "rgba(255, 187, 0, 0.5))"};
  63
  64 var mediaTextTemplate2 = {"font" : "bold 20pt Arial", "lineWidth" : 10.0, "fillStyle" : "white", "strokeStyle" : "rgba(0, 0, 0, 1.0)", "textAlign" : "left",
  65                 "shadowOffsetX" : 0, "shadowOffsetY" : 0, "shadowBlur" : 0, "shadowColor" : "rgba(0, 0, 0, 1.0)"};
  66
  67 var mediaTextTemplate3 = {"font" : "bold 20pt Arial", "lineWidth" : 3.0, "fillStyle" : "white", "strokeStyle" : "rgba(100, 0, 0, 1.0)", "textAlign" : "left"};
  68
  69 var trackTextTemplate  = {"font" : "bold 16pt Arial", "lineWidth" : 3.0, "fillStyle" : "white", "strokeStyle" : "black", "textAlign" : "left"};
  70
  71 var mediaTextTemplate2Landscape = {"font" : "bold 15pt Arial", "lineWidth" : 10.0, "fillStyle" : "white", "strokeStyle" : "rgba(0, 0, 0, 1.0)", "textAlign" : "left",
  72                 "shadowOffsetX" : 0, "shadowOffsetY" : 0, "shadowBlur" : 0, "shadowColor" : "rgba(0, 0, 0, 1.0)"};
  73
  74 var mediaTextTemplate3Landscape = {"font" : "bold 15pt Arial", "lineWidth" : 3.0, "fillStyle" : "white", "strokeStyle" : "rgba(100, 0, 0, 1.0)", "textAlign" : "left"};
  75
  76 var trackTextTemplateLandscape  = {"font" : "bold 11pt Arial", "lineWidth" : 3.0, "fillStyle" : "white", "strokeStyle" : "black", "textAlign" : "left"};
  77
  78
  79 var mediaTextTemplate = {"font" : "bold 20pt Arial", "fillStyle" : "", "textAlign" : "left",
  80                 "shadowOffsetX" : 0, "shadowOffsetY" : 0, "shadowBlur" : 12, "shadowColor" : "red"};
  81
  82 function onError()
  83 {
  84         console.log("Content discovery failed");
  85 }
  86
  87 function setupSpeech()
  88 {
  89         console.log("MediaPlayer in setupSpeech");
  90
  91         speechObj = tizen.speech;
  92         speechObj.vocalizeString(" ");
  93
  94         try
  95         {
  96                 var speechEventListener = {
  97                         onaudiostart: function(){console.log("MediaPlayer: onaudiostart received");},
  98                         onsoundstart: function(){console.log("MediaPlayer: onsoundstart received");},
  99                         onspeechstart: function(){console.log("MediaPlayer: onspeechstart received");},
 100                         onspeechend: function(){console.log("MediaPlayer: onspeechend received");},
 101                         onsoundend: function(){console.log("MediaPlayer: onsoundend received");},
 102                         onaudioend: function(){console.log("MediaPlayer: onaudioend received");},
 103                         onresult: function(result){
 104
 105                                 console.log("MediaPlayer: onresult received");
 106
 107                                 for (var i = 0; i < result.length; i++)
 108                                 {
 109                                         console.log("MediaPlayer: forloop, command = " + result[i]);
 110                                         var commandFound = false;
 111
 112                                         switch(result[i])
 113                                         {
 114                                                 case "play":
 115                                                         playButtonClick();
 116                                                         commandFound = true;
 117                                                 break;
 118                                                 case "next":
 119                                                         nextButtonClick();
 120                                                         commandFound = true;
 121                                                 break;
 122                                                 case "previous":
 123                                                         backButtonClick();
 124                                                         commandFound = true;
 125                                                 break;
 126                                                 case "stop":
 127                                                 case "pause":
 128                                                         pauseButtonClick();
 129                                                         commandFound = true;
 130                                                 break;
 131                                                 default:
 132                                                 break;
 133                                         }
 134
 135                                         if (commandFound)
 136                                                 break;
 137                                 }
 138                         },
 139                         onnomatch: function(result){console.log("MediaPlayer: onnomatch received ");},
 140                         onerror: function(error){console.log("MediaPlayer: onerror received");},
 141                         onstart: function(){console.log("MediaPlayer: onstart received");},
 142                         onend: function(){console.log("MediaPlayer: onend received");}
 143                 }
 144
 145                 speechObj.setCBListener(speechEventListener);
 146
 147         }
 148         catch(err)
 149         {
 150                 console.log("MediaPlayer setupSpeech FAILED + " + err.message);
 151         }
 152
 153 }
 154
 155 function updateMediaName(newArtist, newTitle, newCover)
 156 {
 157         if (currentMenu === "audio")
 158         {
 159                 var playBarHeight = mediaNameCanvas.height;
 160                 var boxWidth = playBarHeight * 0.75;
 161                 mediaNameCTX.clearRect(0,0,mediaNameCanvas.width, mediaNameCanvas.height);
 162
 163                 if (currentPlayerType === "AUDIO")
 164                 {
 165                         var shadeJump = 10;
 166                         var alphaJump = 0.01;
 167                         var currColor = 255;
 168                         var currAlpha = 1.0;
 169
 170                         mediaNameCTX.fillStyle="rgba(30,30,30,0.5)";
 171                         mediaNameCTX.strokeStyle="rgba(130,130,130,1)";
 172                         mediaNameCTX.lineWidth = 5;
 173                         mediaNameCTX.fillRect(0,0,mediaNameCanvas.width, playBarHeight);
 174                         mediaNameCTX.strokeRect(-20,0,mediaNameCanvas.width + 40, playBarHeight);
 175
 176                         if (newCover === undefined || newCover.naturalWidth === undefined || newCover.naturalWidth <= 0)
 177                         {
 178                                 newCover = musicIcon;
 179                         }
 180
 181                         mediaNameCTX.drawImage(newCover, 20, (playBarHeight - boxWidth) / 2, boxWidth, boxWidth);
 182
 183                         if (screenOrientation === "portrait")
 184                         {
 185                                 var textStartX = boxWidth + 50;
 186
 187                                 var trackText = new TextObject(mediaNameCTX,{"text" : newTitle, "xLoc" : textStartX, "yLoc" : 70 , "zLoc" : 0,
 188                                                                         "width" : mediaNameCanvas.width - textStartX, "height" : 50, "lineHeight" : 65, "wordWrap" : true});
 189                                 trackText.applyTemplate(mainMenuTitleTemplate);
 190
 191                                 var artistText = new TextObject(mediaNameCTX,{"text" : newArtist, "xLoc" : textStartX, "yLoc" : 70, "zLoc" : 0,
 192                                                                                 "width" : mediaNameCanvas.width - textStartX, "height" : 50, "lineHeight" : 50, "wordWrap" : true});
 193                                 artistText.applyTemplate(mainTrackTemplate);
 194                         }
 195                         else
 196                         {
 197                                 var textStartX = boxWidth + 50;
 198                                 var trackText = new TextObject(mediaNameCTX,{"text" : newTitle, "xLoc" : textStartX, "yLoc" : 50 , "zLoc" : 0,
 199                                                                                 "width" : mediaNameCanvas.width - textStartX, "height" : 30, "lineHeight" : 30, "wordWrap" : true});
 200                                 trackText.applyTemplate(mainMenuTitleTemplateLandscape);
 201                                 var artistText = new TextObject(mediaNameCTX,{"text" : newArtist, "xLoc" : textStartX, "yLoc" : 50, "zLoc" : 0,
 202                                                                                 "width" : mediaNameCanvas.width - textStartX, "height" : 30, "lineHeight" : 30, "wordWrap" : true});
 203                                 artistText.applyTemplate(mainTrackTemplateLandscape);
 204                         }
 205
 206                         trackText.drawObj();
 207                         trackText.drawLargeShadow();
 208
 209                         artistText.yLoc += trackText.height;
 210                         artistText.drawObj();
 211                 }
 212         }
 213 }
 214
 215 function onContentItemArraySuccess(content)
 216 {
 217         console.log("MediaPlayer in onContentItemArraySuccess");
 218         var emptyContent = true;
 219
 220         if (!content || content === undefined || content.length <= 0)
 221                 console.log("Invalid content for " + contentType);
 222         else
 223         {
 224                 emptyContent = false;
 225         }
 226
 227         switch (contentType)
 228         {
 229         case "AUDIO":
 230
 231                         if (!emptyContent)
 232                         {
 233                                 try
 234                                 {
 235                                         audioContent = audioContent.concat(content);
 236
 237                                         $("#audioSrc").attr("src", audioContent[0].contentURI);
 238                                         audioPlayer.load();
 239
 240                                         var imgSources = [];
 241                                         for (var i = 0; i < audioContent.length; i++)
 242                                         {
 243                                                 var iconURI = (audioContent[i].thumbnailURIs !== undefined && audioContent[i].thumbnailURIs !== null) ? audioContent[i].thumbnailURIs[0] : "images/musicIcon.png";
 244                                                 audioContent[i].coverArtURI = iconURI;
 245                                         }
 246
 247                                         loadImages();
 248
 249                                         audioMediaListLoaded = true;
 250                                         currentMediaListItems = $("#audioMediaListItems");
 251                                         fillMediaList(audioContent);
 252                                 }
 253
 254                                 catch (err)
 255                                 {
 256                                         console.log("Error when parsing audioContent");
 257                                 }
 258                         }
 259
 260                 contentType = "VIDEO";
 261                 break;
 262
 263         case "VIDEO":
 264                 if (!emptyContent)
 265                 {
 266                         videoContent = videoContent.concat(content);
 267                         $("#videoSrc").attr("src", videoContent[0].contentURI);
 268                 }
 269                 contentType = "IMAGE";
 270                 break;
 271
 272         case "IMAGE":
 273                 if (!emptyContent)
 274                 {
 275                         imageContent = imageContent.concat(content);
 276                         $("#imagePlayer").css("background", "url(" + imageContent[0].contentURI + ") no-repeat center");
 277                         $("#imagePlayer").css("background-size", "contain");
 278                 }
 279                 contentType = undefined;
 280                 break;
 281
 282         default:
 283                 console.log("Undefined content search type");
 284         nextContentType = undefined;
 285         break;
 286         }
 287
 288         if (contentType !== undefined)
 289                 getMedia(contentType);
 290 }
 291
 292 function getMedia(mediaType)
 293 {
 294         console.log("MediaPlayer in getMedia");
 295         var manager = tizen.content;
 296
 297         var filter = new tizen.AttributeFilter("type", "EXACTLY", mediaType);
 298         manager.find(onContentItemArraySuccess, onError, null, filter);
 299 }
 300
 301 function showMediaMenu()
 302 {
 303         console.log("MediaPlayer in showMediaMenu");
 304         $(".navButton").fadeIn(800);
 305
 306         switch(currentPlayerType)
 307         {
 308                 case "AUDIO":
 309                         //show audio player
 310                         try
 311                         {
 312                                 if (audioContent.length > 0)
 313                                         updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
 314                         }
 315                         catch(err)
 316                         {
 317                                 console.log("updateMediaName failed for showMediaMenu (audio) : " + err.message);
 318                         }
 319
 320                         $("#mediaName").fadeIn(800);
 321                         $(".sortButton").fadeIn(800);
 322                         currentPlayer.fadeIn(800);
 323
 324                         if (screenOrientation === "landscape" )
 325                                 $("#audioMediaList").addClass("landscape");
 326                         else
 327                                 $("#audioMediaList").removeClass("landscape");
 328
 329                         $("#audioMediaList").fadeIn(800);
 330                         break;
 331
 332                 case "VIDEO":
 333                         //show video
 334                         setTimeout(function(){currentPlayer.show()}, 800);              //The video element can't be faded, so wait a moment before showing
 335                         break;
 336
 337                 case "IMAGE":
 338                         //show image
 339                         currentPlayer.fadeIn(800);
 340                         break;
 341
 342                 default:
 343                         console.log("Invalid player type");
 344                 break;
 345         }
 346 }
 347
 348 function showMediaList()
 349 {
 350         console.log("MediaPlayer in showMediaList");
 351
 352         if (currentMediaList.is(":visible"))
 353                 currentMediaList.fadeOut(300);
 354         else
 355         {
 356                 currentMediaList.fadeIn(300);
 357         }
 358 }
 359
 360 function changeMenu(menuButtonId)
 361 {
 362         console.log("MediaPlayer in changeMenu");
 363         var clickedButton  = $("#" + menuButtonId);
 364         var buttonWidth  = clickedButton.width();
 365         var buttonHeight = clickedButton.height();
 366         var buttonBottom = clickedButton.css("bottom");
 367         var buttonRight  = clickedButton.css("right");
 368
 369         //Animate the clicked button slightly
 370         clickedButton.animate({
 371                 bottom: screenOrientation === "portrait" ? "+=0" : "+=50",
 372                                 right: screenOrientation === "portrait" ? "+=50" : "+=0",
 373                                                 opacity: "0"
 374         }, 300 ,
 375
 376         //Reset the size once done
 377         function() {
 378                 clickedButton.width(buttonWidth);
 379                 clickedButton.height(buttonHeight);
 380
 381                 if (screenOrientation === "portrait")
 382                         clickedButton.css({"right": buttonRight});
 383                 else
 384                         clickedButton.css({"bottom": buttonBottom});
 385         }
 386         );
 387
 388         $(".mainButton").fadeOut(300);
 389
 390         switch(menuButtonId)
 391         {
 392                 case ("mainMusicButton"):
 393                         speechObj.vocalizeString("Music player");
 394                         currentMenu = "audio";
 395                         currentPlayer = $("#audioPlayer");
 396                         currentPlayerControls = document.getElementById("audioPlayer");
 397                         currentPlayerType = "AUDIO";
 398                         currentMediaList = $("#audioMediaList");
 399                         currentMediaListItems = $("#audioMediaListItems");
 400                         currentContent = audioContent;
 401
 402                         if (!audioMediaListLoaded)
 403                                 fillMediaList(currentContent);
 404
 405                         showMediaMenu();
 406                 break;
 407
 408                 case ("mainVideoButton"):
 409                         speechObj.vocalizeString("Video player");
 410                         currentMenu = "video";
 411                         currentPlayer = $("#videoPlayer");
 412                         currentPlayerControls = document.getElementById("videoPlayer");
 413                         currentPlayerType = "VIDEO";
 414                         currentMediaList = $("#videoMediaList");
 415                         currentMediaListItems = $("#videoMediaListItems");
 416                         currentContent = videoContent;
 417
 418                         if (!videoMediaListLoaded)
 419                                 fillMediaList(currentContent);
 420
 421                         showMediaMenu();
 422                 break;
 423
 424                 case ("mainImageButton"):
 425                         speechObj.vocalizeString("Picture viewer");
 426                         currentMenu = "image";
 427                         currentPlayer = $("#imagePlayer");
 428                         currentPlayerControls = imageControls;
 429                         currentPlayerType = "IMAGE";
 430                         currentMediaList = $("#imageMediaList");
 431                         currentMediaListItems = $("#imageMediaListItems");
 432                         currentContent = imageContent;
 433
 434                         if (!imageMediaListLoaded)
 435                                 fillMediaList(currentContent);
 436
 437                         showMediaMenu();
 438                 break;
 439                 default:
 440                         console.log("Error: No menu by that name");
 441                 break;
 442         }
 443 }
 444
 445 function showMainMenu()
 446 {
 447         console.log("MediaPlayer in showMainMenu");
 448         currentMenu = "main";
 449         currentPlayerControls.pause();
 450
 451         //If the media list is showing, hide it.  Remove the mediaListAudioList class if it exists so that it will resize properly
 452         if (currentMediaList.is(":visible"))
 453                 currentMediaList.fadeOut(300);
 454
 455         $(".navButton").fadeOut(300);
 456         $(".sortButton").fadeOut(300);
 457         $("#mediaName").fadeOut(300);
 458
 459         if (currentPlayerType !== "VIDEO")
 460                 currentPlayer.fadeOut(300);
 461         else
 462                 currentPlayer.hide();
 463
 464
 465         $(".mainButton").css({"opacity": "100"});
 466         $(".mainButton").fadeIn(800);
 467 }
 468
 469 function sortByAlpha(contentToSort)
 470 {
 471         console.log("MediaPlayer in sortByAlpha");
 472
 473         if (currentPlayerType === "AUDIO")
 474                 emptyTimeouts();
 475
 476         //If contentToSort is undefined it's because the request came from the sortBy buttons
 477         if (contentToSort === undefined)
 478                 contentToSort = audioContent;
 479
 480         contentToSort.sort(function (a,b) {
 481                 var first = a.title.toLowerCase();
 482                 var second = b.title.toLowerCase();
 483
 484                 if (first < second)
 485                         return -1;
 486                 if (first > second)
 487                         return 1;
 488
 489                 return 0;
 490         });
 491
 492         fillMediaList(contentToSort);
 493 }
 494
 495 function sortByArtist(contentToSort)
 496 {
 497         console.log("MediaPlayer in sortByArtist");
 498
 499         if (currentPlayerType === "AUDIO")
 500                 emptyTimeouts();
 501
 502         if (contentToSort === undefined)
 503                 contentToSort = audioContent;
 504
 505         contentToSort.sort(function (a,b) {
 506                 var first = a.artists[0].toLowerCase();
 507                 var second = b.artists[0].toLowerCase();
 508
 509                 if (first < second)
 510                         return -1;
 511                 if (first > second)
 512                         return 1;
 513
 514                 return 0;
 515         });
 516
 517         fillMediaList(contentToSort);
 518 }
 519
 520 function sortByAlbum(contentToSort)
 521 {
 522         if (currentPlayerType === "AUDIO")
 523                 emptyTimeouts();
 524
 525         console.log("MediaPlayer in sortByAlbum");
 526         if (contentToSort === undefined)
 527                 contentToSort = audioContent;
 528
 529         contentToSort.sort(function (a,b) {
 530                 var first = a.album.toLowerCase();
 531                 var second = b.album.toLowerCase();
 532
 533                 if (first < second)
 534                         return -1;
 535                 if (first > second)
 536                         return 1;
 537
 538                 return 0;
 539         });
 540
 541         fillMediaList(contentToSort);
 542 }
 543
 544 /**************************************** NAVIGATION FUNCTIONS *******************************************/
 545
 546 // This function is called once a file being loaded is ready to play
 547 function playLoadedMedia()
 548 {
 549         console.log("MediaPlayer in playLoadedMedia");
 550         currentFileLoaded = true;
 551
 552         if (loadAndPlay)
 553         {
 554                 currentPlayerControls.play();
 555                 loadAndPlay = false;
 556         }
 557 }
 558
 559 function playButtonClick()
 560 {
 561         console.log("MediaPlayer in playButtonClick");
 562         if (currentPlayerType !== "AUDIO" || currentFileLoaded)
 563         {
 564                 if (currentPlayerControls.paused)
 565                 {
 566                         currentPlayerControls.play();
 567                 }
 568                 else
 569                 {
 570                         currentPlayerControls.pause();
 571                 }
 572         }
 573         else
 574                 console.log(audioContent[audioIndex].artists[0] + " : " + audioContent[audioIndex].title + " can't play yet, it hasn't loaded");
 575 }
 576
 577 function pauseButtonClick()
 578 {
 579         console.log("MediaPlayer in pauseButtonClick");
 580         if (!currentPlayerControls.paused)
 581         {
 582                 currentPlayerControls.pause();
 583         }
 584 }
 585
 586 function backButtonClick()
 587 {
 588         console.log("MediaPlayer in backButtonClick");
 589         switch (currentPlayerType)
 590         {
 591         case "AUDIO":
 592                 if (audioContent)
 593                 {
 594                         if (audioIndex > 0 )
 595                                 audioIndex--;
 596                         else
 597                                 audioIndex = audioContent.length - 1;
 598
 599                         loadAndPlay = true;
 600                         audioPlayer.pause();
 601
 602                         $("#audioSrc").attr("src", audioContent[audioIndex].contentURI);
 603                         updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
 604                         audioPlayer.load();
 605                 }
 606                 break;
 607
 608         case "VIDEO":
 609                 if (videoContent)
 610                 {
 611                         if (videoIndex > 0 )
 612                                 videoIndex--;
 613                         else
 614                                 videoIndex = videoContent.length - 1;
 615
 616                         videoPlayer.pause();
 617                         $("#videoSrc").attr("src", videoContent[videoIndex].contentURI);
 618                         videoPlayer.load();
 619                 }
 620                 break;
 621
 622         case "IMAGE":
 623                 if (imageContent)
 624                 {
 625                         if (imageIndex > 0 )
 626                                 imageIndex--;
 627                         else
 628                                 imageIndex = imageContent.length - 1;
 629
 630                         $("#imagePlayer").css("background", "url(" + imageContent[imageIndex].contentURI + ") no-repeat center");
 631                         $("#imagePlayer").css("background-size", "contain");
 632                 }
 633                 break;
 634
 635         default:
 636                 console.log("Content failure");
 637         break;
 638         }
 639 }
 640
 641
 642 function nextButtonClick()
 643 {
 644         console.log("MediaPlayer in nextButtonClick");
 645         switch (currentPlayerType)
 646         {
 647         case "AUDIO":
 648                 if (audioContent)
 649                 {
 650                         if (audioContent.length > (audioIndex + 1))
 651                                 audioIndex++;
 652                         else
 653                                 audioIndex = 0;
 654
 655                         loadAndPlay = true;
 656                         audioPlayer.pause();
 657
 658                         $("#audioSrc").attr("src", audioContent[audioIndex].contentURI);
 659                         updateMediaName(audioContent[audioIndex].artists[0], audioContent[audioIndex].title, audioContent[audioIndex].coverArt);
 660                         audioPlayer.load();
 661                 }
 662                 break;
 663
 664         case "VIDEO":
 665                 if (videoContent)
 666                 {
 667                         if (videoContent.length > (videoIndex + 1))
 668                                 videoIndex++;
 669                         else
 670                                 videoIndex = 0;
 671
 672                         videoPlayer.pause();
 673                         $("#videoSrc").attr("src", videoContent[videoIndex].contentURI);
 674                         videoPlayer.load();
 675                 }
 676                 break;
 677
 678         case "IMAGE":
 679                 if (imageContent)
 680                 {
 681                         if (imageContent.length > (imageIndex + 1))
 682                                 imageIndex++;
 683                         else
 684                                 imageIndex = 0;
 685
 686                         $("#imagePlayer").css("background", "url(" + imageContent[imageIndex].contentURI + ") no-repeat center");
 687                         $("#imagePlayer").css("background-size", "contain");
 688                 }
 689                 break;
 690
 691         default:
 692                 console.log("Content failure");
 693         break;
 694         }
 695 }
 696
 697 /**************************************** END NAVIGATION FUNCTIONS *******************************************/
 698
 699 function resizeMainMenu()
 700 {
 701         console.log("MediaPlayer in resizeMainMenu");
 702
 703         currentMediaList.fadeOut(0);
 704         screenWidth = window.innerWidth;
 705         screenHeight = window.innerHeight;
 706         screenOrientation = screenWidth < screenHeight ? "portrait" : "landscape";
 707         iconWidth = screenOrientation === "portrait" ? screenHeight / 4 : screenWidth / 4;
 708         var padding = 20;
 709
 710         $(".mainButton").width(iconWidth + "px");
 711         $(".mainButton").height(iconWidth + "px");
 712
 713         var iconsTop  = screenOrientation === "portrait" ? ((screenHeight - (iconWidth * 3)) / 2) - (padding * 3) : (screenHeight - iconWidth) / 2;
 714
 715         if (screenOrientation === "portrait")
 716                 $("#mainMenuButtons").css({"top": iconsTop + "px", "left" : (screenWidth / 2) - (iconWidth /2) - padding + "px", "width" : "50%"});
 717         else
 718         {
 719                 $("#mainMenuButtons").css({"top": iconsTop + "px", "left" : ((iconWidth / 2) - (padding * 3)) + "px", "width" : "100%"});
 720                 $("#sortButtons").addClass("landscape");
 721         }
 722 }
 723
 724 function resizePlayerPage()
 725 {
 726         console.log("MediaPlayer in resizePlayerPage");
 727
 728         audioPlayer = document.getElementById("audioPlayer");
 729         videoPlayer = document.getElementById("videoPlayer");
 730         screenWidth = window.innerWidth;
 731         screenHeight = window.innerHeight;
 732
 733         var padding = 15;
 734         var buttonWidth = screenOrientation === "portrait" ? screenHeight * 0.05 : screenWidth * 0.05;
 735
 736         $("#backButton").css({"width": buttonWidth + "px", "height": buttonWidth + "px", "top": padding + "px", "left": ((screenWidth / 2) - (buttonWidth *3)) + "px"});
 737         $("#nextButton").css({"width": buttonWidth + "px", "height": buttonWidth + "px", "top": padding + "px", "left": ((screenWidth / 2) + (buttonWidth *2)) + "px"});
 738         $("#returnButton").css({"width": buttonWidth + "px", "height": buttonWidth + "px", "top": padding + "px", "left": padding + "px"});
 739         $("#listButton").css({"width": buttonWidth + "px", "height": buttonWidth + "px", "top": padding + "px", "left": (screenWidth - buttonWidth - padding * 2) + "px"});
 740         $("#playButton").css({"width": buttonWidth * 1.15 + "px", "height": buttonWidth * 1.15 + "px", "top": padding * 0.3 + "px", "left": (screenWidth / 2) - (buttonWidth / 2) + "px"});
 741
 742         mediaNameCanvas.width = (screenWidth);
 743         mediaNameCanvas.height = (screenHeight * 0.34) - (buttonWidth + (2 * padding));
 744         mediaNameCanvas.style.top = (buttonWidth + (2 * padding) ) + "px";
 745         mediaNameCanvas.style.left = "0px";
 746
 747         var sortButtonTop = (buttonWidth + (2 * padding) ) + mediaNameCanvas.height - (buttonWidth * 1.3);
 748         var sortButtonWidth = buttonWidth * 2.5;
 749         var buttonSpacing = screenWidth / 5;
 750
 751         mediaListItemW = $("#videoMediaList").width() * 0.92;
 752         mediaListItemH = $("#videoMediaList").height() / 10;
 753 }
 754
 755 function resizeAll()
 756 {
 757         console.log("MediaPlayer in resizeAll");
 758         resizeMainMenu();
 759         resizePlayerPage();
 760 }
 761
 762 /*
 763  * swipe - Handles swipe events.  Currently it just acts as another way to hit the next / back buttons, but
 764  * it could be expanded to other things in the future.
 765  */
 766
 767 function swipe(direction, object)
 768 {
 769         console.log("MediaPlayer in swipe");
 770         switch (object)
 771         {
 772         case "mediaName":
 773                 if (direction === "right")
 774                         nextButtonClick();
 775                 else if (direction === "left")
 776                         backButtonClick();
 777                 break;
 778
 779         default:
 780                 break;
 781         }
 782 }
 783
 784 function toggleNightMode(nightModeValue)
 785 {
 786         if (nightMode !== nightModeValue)
 787         {
 788                 Array.prototype.forEach.call (document.querySelectorAll ('*'), function (el) {el.classList.toggle('night');});
 789                 nightMode = nightModeValue;
 790         }
 791 }
 792
 793 function init()
 794 {
 795         console.log("MediaPlayer in init");
 796         var vehicle = tizen.vehicle;
 797
 798
 799         /* Subscribe to AMB NightMode signal, and switch colors
 800          * upon receipt of the signal
 801          */
 802
 803         if (vehicle && vehicle !== undefined)
 804         {
 805                 var getVal = vehicle.get("NightMode");
 806
 807                 //Check that NightMode returned a value before trying to hook up to it
 808                 if (getVal)
 809                 {
 810                         toggleNightMode(getVal.nightMode);
 811                 }
 812
 813                 /* Subscribe to AMB NightMode signal, and switch colors
 814                 * upon receipt of the signal
 815                 */
 816
 817                 vehicle.subscribe("NightMode",function(value) {
 818                                 console.log("MediaPlayer: Day / Night mode changed to " + value.nightMode);
 819                                 toggleNightMode(value.nightMode);
 820                 });
 821
 822
 823                 /* Subscribe to AMB DrivingMode signal, and pause video
 824                  * upon receipt of the signal
 825                  */
 826
 827
 828                 vehicle.subscribe("DrivingMode",function(value) {
 829                         console.log("MediaPlayer: DrivingMode changed to " + value.drivingMode);
 830
 831                         if (value.drivingMode > 0 && currentPlayerType === "VIDEO" && !currentPlayerControls.paused)
 832                         {
 833                                 console.log("MediaPlayer: pausing video due to vehicle motion");
 834                                 currentPlayerControls.pause();
 835                                 waitingToResumeVideo = true;
 836                         }
 837                         else if (value.drivingMode === 0 && currentPlayerType === "VIDEO" && waitingToResumeVideo)
 838                         {
 839                                 console.log("MediaPlayer: vehicle has stopped, resuming video");
 840                                 currentPlayerControls.play();
 841                                 waitingToResumeVideo = false;
 842                         }
 843                 });
 844         }
 845
 846         musicIcon.src = "images/musicIcon.png";
 847         vidIcon.src = "images/videoIcon.png";
 848         imgIcon.src = "images/imageIcon.png";
 849         imageControls = new ImageControls();
 850
 851         mediaNameCanvas = document.getElementById("mediaName");
 852         mediaNameCTX = mediaNameCanvas.getContext("2d");
 853
 854         //Resize all items and search for local media
 855         resizeAll();
 856
 857         //Check if DLNA plugin is installed.  If so, scan for media.
 858         if (tizen.mediaserver)
 859         {
 860                 //Currently no success signal, so continue trying until a server is found.  Once that
 861                 //happens, clear the stopServerSearch interval
 862
 863                 stopServerSearch = setInterval(function(){console.log("MediaPlayer searching for remote media..."); tizen.mediaserver.scanNetwork(foundMediaServer);}, 5000);
 864         }
 865         else
 866                 console.log("MediaPlayer: No DLNA server running, using local media only...");
 867
 868         //Setup voice control
 869         if (tizen.speech)
 870                 setupSpeech();
 871         else
 872                 console.log("MediaPlayer: Speech Recognition not running, voice control will be unavailable");
 873
 874         //Get local media
 875         setTimeout(function(){getMedia(contentType);}, 500);
 876
 877         //Prevent highlighting
 878         window.ondragstart = function() { return false; }
 879
 880         $(window).bind('resize', resizeAll);
 881
 882         //Simple swipe detection
 883         $("#mediaName").mousedown(function(e){mouseDownEvent = e;});
 884         $("#mediaName").mouseup(function(e){
 885                 if (Math.abs(mouseDownEvent.clientY - e.clientY) < 100)
 886                 {
 887                         if (Math.abs(mouseDownEvent.clientX - e.clientX) > 100)
 888                         {
 889                                 if (mouseDownEvent.clientX > e.clientX)
 890                                         swipe("left", "mediaName");
 891                                 else
 892                                         swipe("right", "mediaName");
 893                         }
 894                 }
 895         });
 896
 897     document.getElementById('videoPlayer').addEventListener("playing", function() {
 898         $("#playButton").toggleClass('playing', true);
 899         $("#navigationButtons").hide();
 900     }, false);
 901     document.getElementById('videoPlayer').addEventListener("pause", function() {
 902         $("#playButton").toggleClass('playing', false);
 903         $("#navigationButtons").show();
 904     }, false);
 905     document.getElementById('videoPlayer').addEventListener("ended", function() {
 906         $("#playButton").toggleClass('playing', false);
 907         $("#navigationButtons").show();
 908     }, false);
 909     document.getElementById('audioPlayer').addEventListener("playing", function() {
 910         $("#playButton").toggleClass('playing', true);
 911     }, false);
 912     document.getElementById('audioPlayer').addEventListener("pause", function() {
 913         $("#playButton").toggleClass('playing', false);
 914     }, false);
 915     document.getElementById('audioPlayer').addEventListener("ended", function() {
 916         $("#playButton").toggleClass('playing', false);
 917     }, false);
 918     document.getElementById('imagePlayer').addEventListener("click", function() {
 919         if (imageControls.paused)
 920         {
 921             // next picture
 922             nextButtonClick();
 923         }
 924         else
 925         {
 926             // pause the slideshow and fade in the controls
 927             imageControls.pause();
 928             $("#navigationButtons").show();
 929         }
 930     }, false);
 931 }
 932
 933 $(document).ready(function () {
 934         init();
 935 });