/* Video carousel library */

(function($) {
  $.fn.VideoCarousel = function(siteroot, options) {
    // build main options before element iteration
    $.fn.VideoCarousel.opts = $.extend({}, $.fn.VideoCarousel.defaults, options);
    $.fn.VideoCarousel.currentPlayIndex = 0;
    $.fn.VideoCarousel.siteroot = siteroot;

    //
    // Enable video carousel...
    //
    return this.each(function() {
      var container = $(this);

      //
      // Clear div
      //
      container.empty();

      container.append("<div id=\"videoCarousel\"></div>");
      var videoCarousel = $("#videoCarousel");

      //
      // Add video placeholders
      //
      videoCarousel.append("<img id=\"videoImage1\" src=\"" + siteroot + $.fn.VideoCarousel.opts.imageList[0] + "\" alt=\"Play video\" />");
      videoCarousel.append("<img id=\"videoImage2\" src=\"" + siteroot + $.fn.VideoCarousel.opts.imageList[1] + "\" alt=\"Play video\" />");
      videoCarousel.append("<img id=\"videoImage3\" src=\"" + siteroot + $.fn.VideoCarousel.opts.imageList[2] + "\" alt=\"Play video\" />");
      videoCarousel.append("<img id=\"videoImage4\" src=\"" + siteroot + $.fn.VideoCarousel.opts.imageList[0] + "\" alt=\"Play video\" />");

      //
      // Add next/prev and play buttons
      //
      videoCarousel.append("<a href=\"#\" onclick=\"return $.fn.VideoCarousel.Previous();\"><img id=\"prevBtn\" src=\"" + siteroot + "/notion/site/vtnzinternet/images/vtnzinternet/btn-prev.png\" alt=\"Previous\" /></a>");
      videoCarousel.append("<a href=\"#\" onclick=\"return $.fn.VideoCarousel.PlayMovie();\"><img id=\"playBtn\" src=\"" + siteroot + "/notion/site/vtnzinternet/images/vtnzinternet/btn-play.png\" alt=\"Play\" /></a>");
      videoCarousel.append("<a href=\"#\" onclick=\"return $.fn.VideoCarousel.Next();\"><img id=\"nextBtn\" src=\"" + siteroot + "/notion/site/vtnzinternet/images/vtnzinternet/btn-next.png\" alt=\"Next\" /></a>");

      //
      // Add player containers (we may be able to just use one here rather than 3)
      //
      container.append("<div id=\"mediaPlayerWrapper1\" class=\"mediaPlayer\">" +
                       "  <a name=\"video-1\" id=\"video-1\"></a>" +
                       "  <a href=\"#\" onclick=\"return $.fn.VideoCarousel.CloseMovie($(this).parent());\"><img src=\"" + siteroot + "/notion/site/vtnzinternet/images/vtnzinternet/close.png\" alt=\"Close\" class=\"closeBtn\" /></a>" +
                       "  <div class=\"media-player\" id=\"flashmovie_1\">" +
                       "    <p>To view this movie you must have <a href=\"http://www.adobe.com\">Adobe Flash Player</a> version 9 or higher and javascript turned on.</p>" +
                       "  </div>" +
                       "</div>");

      container.append("<div id=\"mediaPlayerWrapper2\" class=\"mediaPlayer\">" +
                       "  <a name=\"video-2\" id=\"video-2\"></a>" +
                       "  <a href=\"#\" onclick=\"return $.fn.VideoCarousel.CloseMovie($(this).parent());\"><img src=\"" + siteroot + "/notion/site/vtnzinternet/images/vtnzinternet/close.png\" alt=\"Close\" class=\"closeBtn\" /></a>" +
                       "  <div class=\"media-player\" id=\"flashmovie_2\">" +
                       "    <p>To view this movie you must have <a href=\"http://www.adobe.com\">Adobe Flash Player</a> version 9 or higher and javascript turned on.</p>" +
                       "  </div>" +
                       "</div>");

      container.append("<div id=\"mediaPlayerWrapper3\" class=\"mediaPlayer\">" +
                       "  <a name=\"video-3\" id=\"video-3\"></a>" +
                       "  <a href=\"#\" onclick=\"return $.fn.VideoCarousel.CloseMovie($(this).parent());\"><img src=\"" + siteroot + "/notion/site/vtnzinternet/images/vtnzinternet/close.png\" alt=\"Close\" class=\"closeBtn\" /></a>" +
                       "  <div class=\"media-player\" id=\"flashmovie_3\">" +
                       "    <p>To view this movie you must have <a href=\"http://www.adobe.com\">Adobe Flash Player</a> version 9 or higher and javascript turned on.</p>" +
                       "  </div>" +
                       "</div>");

      var flashvars = { width: '470', height: '256', enablejs: 'true', file: siteroot + '/notion/site/vtnzinternet/video/vtnzinternet/video2.flv', image: siteroot + '/notion/site/vtnzinternet/images/vtnzinternet/video-image2.jpg', backcolor: 'bbbbbb', frontcolor: 'd4e6e8', lightcolor: 'd4e6e8', screencolor: 'eeeeee' };
      var params = { allowfullscreen: 'true', wmode: 'opaque', allowscriptaccess: 'always' };
      var attributes = { id: 'flashmovie_player_1', name: 'flashmovie_player_1' };
      swfobject.embedSWF(siteroot + '/notion/site/vtnzinternet/flash/player.swf', 'flashmovie_1', '470', '256', '9.0.0', 'expressInstall.swf', flashvars, params, attributes);

      var flashvars = { width: '470', height: '256', enablejs: 'true', file: siteroot + '/notion/site/vtnzinternet/video/vtnzinternet/video3.flv', image: siteroot + '/notion/site/vtnzinternet/images/vtnzinternet/video-image3.jpg', backcolor: 'bbbbbb', frontcolor: 'd4e6e8', lightcolor: 'd4e6e8', screencolor: 'eeeeee' };
      var params = { allowfullscreen: 'true', wmode: 'opaque', allowscriptaccess: 'always' };
      var attributes = { id: 'flashmovie_player_2', name: 'flashmovie_player_2' };
      swfobject.embedSWF(siteroot + '/notion/site/vtnzinternet/flash/player.swf', 'flashmovie_2', '470', '256', '9.0.0', 'expressInstall.swf', flashvars, params, attributes);

      var flashvars = { width: '470', height: '256', enablejs: 'true', file: siteroot + '/notion/site/vtnzinternet/video/vtnzinternet/video1.flv', image: siteroot + '/notion/site/vtnzinternet/images/vtnzinternet/video-image1.jpg', backcolor: 'bbbbbb', frontcolor: 'd4e6e8', lightcolor: 'd4e6e8', screencolor: 'eeeeee' };
      var params = { allowfullscreen: 'true', wmode: 'opaque', allowscriptaccess: 'always' };
      var attributes = { id: 'flashmovie_player_3', name: 'flashmovie_player_3' };
      swfobject.embedSWF(siteroot + '/notion/site/vtnzinternet/flash/player.swf', 'flashmovie_3', '470', '256', '9.0.0', 'expressInstall.swf', flashvars, params, attributes);
    });
  };

  //
  // Play current movie
  //
  $.fn.VideoCarousel.PlayMovie = function() {
    $("#welcome-bar-right .mediaPlayer").css("display", "none");

    var mediaPlayerNo = ($.fn.VideoCarousel.currentPlayIndex + 1);

    $("#videoCarousel").css("display", "none");
    $("#mediaPlayerWrapper" + mediaPlayerNo).css("display", "block");

    return false;
  }

  //
  // Close current movie
  //
  $.fn.VideoCarousel.CloseMovie = function(obj) {
  obj.css("display", "none");
  $("#videoCarousel").css("display", "block");
  }

  //
  // CircularPath, circle path based on circle of radius 1 at (0,0)
  //
  $.fn.CircularPathLeft = function(slideNo) {
    var scaleX = 154;
    var scaleY = 15;
    var originalImageHeight = 248;
    var originalImageWidth = 208;
    var posX = 240;
    var posY = 114;
    this.css = function(p) {
      var iP = (1 - p);                    // p = 1 -> 0, iP = 0 -> 1
      var x1 = p;                          // x1 = 1 -> 0
      var x2 = iP;                         // x2 = 0 -> 1
      var y1 = Math.sqrt(1 - (x1 * x1));   // y1 = 1 -> 0
      var y2 = Math.sqrt(1 - (x2 * x2));   // y2 = 0 -> 1 
      var firstHalf = (p > 0.5);           // Boolean value, true if in the first half of the animation

      var x, y, h, w, z;

      switch (slideNo) {
        case 1:  // Left image
          h = originalImageHeight * (0.7 - (iP * 0.2));
          w = originalImageWidth * (0.7 - (iP * 0.2));
          x = (posX - w / 2) - (x1 * scaleX);
          y = (posY - h / 2) - (y1 * scaleY);
          z = (firstHalf ? 10 : 9);
          break;
        case 2:  // Centre front image
          h = originalImageHeight * (1 - (iP * 0.3));
          w = originalImageWidth * (1 - (iP * 0.3));
          x = (posX - w / 2) - (x2 * scaleX);
          y = (posY - h / 2) + (y2 * scaleY);
          z = (firstHalf ? 11 : 10);
          break;
        case 3:  // Right image
          h = originalImageHeight * (1 - (p * 0.3));
          w = originalImageWidth * (1 - (p * 0.3));
          x = (posX - w / 2) + (x1 * scaleX);
          y = (posY - h / 2) + (y1 * scaleY);
          z = (firstHalf ? 10 : 11);
          break;
        case 4:  // Centre back image
          h = originalImageHeight * (0.7 - (p * 0.2));
          w = originalImageWidth * (0.7 - (p * 0.2));
          x = (posX - w / 2) + (x2 * scaleX);
          y = (posY - h / 2) - (y2 * scaleY);
          z = (firstHalf ? 9 : 10);
          break;
      }

      return { top: y + "px", left: x + "px", width: w + "px", height: h + "px", zIndex: z };
    }
  }

  //
  // CircularPath, circle path based on circle of radius 1 at (0,0)
  //
  $.fn.CircularPathRight = function(slideNo) {
    var scaleX = 154;
    var scaleY = 15;
    var originalImageHeight = 248;
    var originalImageWidth = 208;
    var posX = 240;
    var posY = 114;
    this.css = function(p) {
      var iP = (1 - p);                    // p = 1 -> 0, iP = 0 -> 1
      var x1 = p;                          // x1 = 1 -> 0
      var x2 = iP;                         // x2 = 0 -> 1
      var y1 = Math.sqrt(1 - (x1 * x1));   // y1 = 1 -> 0
      var y2 = Math.sqrt(1 - (x2 * x2));   // y2 = 0 -> 1
      var firstHalf = (p > 0.5);           // Boolean value, true if in the first half of the animation

      var x, y, h, w, z;

      switch (slideNo) {
        case 1:  // Left image
          h = originalImageHeight * (1 - (p * 0.3));
          w = originalImageWidth * (1 - (p * 0.3));
          x = (posX - w / 2) - (x1 * scaleX);
          y = (posY - h / 2) + (y1 * scaleY);
          z = (firstHalf ? 10 : 11);
          break;
        case 2:  // Centre front image
          h = originalImageHeight * (1 - (iP * 0.3));
          w = originalImageWidth * (1 - (iP * 0.3));
          x = (posX - w / 2) + (x2 * scaleX);
          y = (posY - h / 2) + (y2 * scaleY);
          z = (firstHalf ? 11 : 10);
          break;
        case 3:  // Right image
          h = originalImageHeight * (0.7 - (iP * 0.2));
          w = originalImageWidth * (0.7 - (iP * 0.2));
          x = (posX - w / 2) + (x1 * scaleX);
          y = (posY - h / 2) - (y1 * scaleY);
          z = (firstHalf ? 10 : 9);
          break;
        case 4:  // Centre back image
          h = originalImageHeight * (0.7 - (p * 0.2));
          w = originalImageWidth * (0.7 - (p * 0.2));
          x = (posX - w / 2) - (x2 * scaleX);
          y = (posY - h / 2) - (y2 * scaleY);
          z = (firstHalf ? 9 : 10);
      }

      return { top: y + "px", left: x + "px", width: w + "px", height: h + "px", zIndex: z };
    }
  }

  //
  // Move previous
  //
  $.fn.VideoCarousel.Previous = function() {
    $.fn.VideoCarousel.currentPlayIndex++;
    if ($.fn.VideoCarousel.currentPlayIndex >= $.fn.VideoCarousel.opts.imageList.length) {
      $.fn.VideoCarousel.currentPlayIndex = 0;
    }

    $("#videoImage4").attr("src", $("#videoImage1").attr("src"));

    $("#videoImage1").animate({ path: new $.fn.CircularPathLeft(1) }, $.fn.VideoCarousel.opts.duration);
    $("#videoImage2").animate({ path: new $.fn.CircularPathLeft(2) }, $.fn.VideoCarousel.opts.duration);
    $("#videoImage3").animate({ path: new $.fn.CircularPathLeft(3) }, $.fn.VideoCarousel.opts.duration);
    $("#videoImage4").animate({ path: new $.fn.CircularPathLeft(4) }, $.fn.VideoCarousel.opts.duration, $.fn.VideoCarousel.Reset);

    return false;
  }

  //
  // Move next
  //
  $.fn.VideoCarousel.Next = function() {
    $.fn.VideoCarousel.currentPlayIndex--;
    if ($.fn.VideoCarousel.currentPlayIndex < 0) {
      $.fn.VideoCarousel.currentPlayIndex = $.fn.VideoCarousel.opts.imageList.length - 1;
    }

    $("#videoImage4").attr("src", $("#videoImage3").attr("src"));

    $("#videoImage1").animate({ path: new $.fn.CircularPathRight(1) }, $.fn.VideoCarousel.opts.duration);
    $("#videoImage2").animate({ path: new $.fn.CircularPathRight(2) }, $.fn.VideoCarousel.opts.duration);
    $("#videoImage3").animate({ path: new $.fn.CircularPathRight(3) }, $.fn.VideoCarousel.opts.duration);
    $("#videoImage4").animate({ path: new $.fn.CircularPathRight(4) }, $.fn.VideoCarousel.opts.duration, $.fn.VideoCarousel.Reset);

    return false;
  }

  //
  // Reset positions
  //
  $.fn.VideoCarousel.Reset = function() {
    $("#videoImage1").css({ 'width': '145px', 'height': '173px', 'left': '10px', 'top': '27px', 'zIndex': '10' }).attr("src", $.fn.VideoCarousel.GetImageForPosition(0));
    $("#videoImage2").css({ 'width': '208px', 'height': '248px', 'left': '135px', 'top': '5px', 'zIndex': '11' }).attr("src", $.fn.VideoCarousel.GetImageForPosition(1));
    $("#videoImage3").css({ 'width': '145px', 'height': '173px', 'left': '318px', 'top': '27px', 'zIndex': '10' }).attr("src", $.fn.VideoCarousel.GetImageForPosition(2));
    $("#videoImage4").css({ 'width': '104px', 'height': '124px', 'left': '188px', 'top': '37px', 'zIndex': '9' }).attr("src", $.fn.VideoCarousel.GetImageForPosition(3));
  }

  //
  // Returns the current image for the requested position
  //
  $.fn.VideoCarousel.GetImageForPosition = function(position) {
    position = $.fn.VideoCarousel.currentPlayIndex + position;
    if (position >= $.fn.VideoCarousel.opts.imageList.length) {
      position = position - $.fn.VideoCarousel.opts.imageList.length;
    }

    return $.fn.VideoCarousel.siteroot + $.fn.VideoCarousel.opts.imageList[position];
  }

  //
  // plugin defaults
  //
  $.fn.VideoCarousel.defaults = {
    duration: 500,
    imageList: ['/notion/site/VTNZInternet/images/VTNZInternet/placeholder-image1.png',
                '/notion/site/VTNZInternet/images/VTNZInternet/placeholder-image2.png',
                '/notion/site/VTNZInternet/images/VTNZInternet/placeholder-image3.png'
    ]
  };

})(jQuery);