// jQuery as.pageViewer.sliderContainer

(function () {

  if (typeof $.as === "undefined") {
    $.as = {};
  }

  if (typeof $.as.pageViewer === "undefined") {
    $.as.coverSlider = {};
  }

  $.as.pageViewer.sliderContainer = function () {
  
    var $window = $(window);
    
    var $sliderContainer = $("<div>", {
      id: "sliderContainer"
    });
    
    var $preloader = $("<div>", {
      "class": "preloader"
    });
  
    var $slider = $.delta.slider("100%", "100%", {
      interval: 8000,
      duration: 2600,
      easing: "swing"
    });
    
    var $preloaderImage;
    
    var preloaderHTML = "<img src=\"/assets/images/preloader/indicator-white_black-32x32.gif\" alt=\"\" width=\"32\" height=\"32\">";
    
    var isCompletePreloader = false;
    var isStac = false;
    
    var sliderData = [];
    var imageList = [];
    var currentLoad = 0;
    
    var minWidth = 1000;
    var minHeight = 560;
    var duration = 2600;
    
    var isiPhone = /iPhone/.test(navigator.userAgent);
    
    
    // !初期化

    if (isiPhone && $window.height() < 520) {
      $window.scrollTop(0);
    }

    $sliderContainer.css({
      width: "100%",
      height: "100%"
    });
    
    $sliderContainer.delegate("img", "mousedown", function (e) {
      return false;
    });
    
    $sliderContainer.append($preloader);
    
    $preloader.css({
      margin: "-16px 0 0 -16px",
      position: "absolute",
      top: "50%",
      left: "50%",
      zIndex: 1
    });
    
    $preloader.bind("complete", onCompletePreloader);
    $preloader.append(preloaderHTML);

    $preloaderImage = $preloader.children("img");

    $preloaderImage.each(function (i) {
      
      var $this = $(this);
      
      var orgSrc = this.src;
      
      if (!$.browser.msie) {
        this.src = "";
      }
      
      $this.bind("load", onCompletePreloaderImage);
      
      if (!$.browser.msie) {
        this.src = orgSrc;
      }
      else if (this.complete || this.complete === undefined) {
        this.src = orgSrc;
      }
      
    });
    
    $slider.css({
      opacity: 0,
      zIndex: 2
    });
    
    $slider.bind("complete", onCompleteSlider);

    
    // !イベントハンドラ
    function onCompletePreloaderImage(e) {
      $preloader.trigger("complete");
      $preloaderImage.unbind("complete", onCompletePreloaderImage);
    }

    function onCompletePreloader(e) {
      isCompletePreloader = true;
      if (isStac) {
        loadSlider();
      }
      $preloader.unbind("complete", onCompletePreloader);
    }
    
    function onCompleteSliderImage(e) {
      ++currentLoad;
      if (currentLoad >= sliderData.length) {
        $slider.trigger("complete");
      }
      $(e.currentTarget).unbind("load", onCompleteSliderImage);
    }
    
    function onCompleteSlider(e) {
      $slider.slidePlay();
      $slider.unbind("complete", onCompleteSlider);
      $sliderContainer.trigger("complete");
    }
    
    function onResize(e) {
      var index = $slider.getCurrentItem();
      var prev = index - 1;
      
      if (prev < 0) {
        prev = $slider.getTotalItems() - 1;
      }
      
      resizeImage(imageList[index]);
      resizeImage(imageList[prev]);
    }
    
    function onResizeStart(e) {
    }
    
    function onResizeEnd(e) {
      for (var i = 0; i < imageList.length; ++i) {
        resizeImage(imageList[i]);
      }
      if (isiPhone && $window.height() < 520) {
        $(window).scrollTop(0);
      }
    }
    
    
    // !プライベート関数
    
    function loadSlider() {
      
      for (var i = 0; i < sliderData.length; ++i) {
        
        var $page = $("<div>", {
          "class": "page"
        });
        
        var $image = $(sliderData[i]);
        
        $page.css({
          textAlign: "center"
        });

        $image.data("originalSize", {
          width: $image.attr("width"),
          height: $image.attr("height")
        });

        $image.each(function (i) {
          
          var $this = $(this);
          var orgSrc = this.src;
          
          if (!$.browser.msie) {
            this.src = "";
          }
          
          $this.bind("load", onCompleteSliderImage);
          
          if (!$.browser.msie) {
            this.src = orgSrc;
          }
          else if (this.complete || this.complete === undefined) {
            this.src = orgSrc;
          }
        });
        
        imageList.push($image);

        $page.append($image);
        
        $slider.addItem($page);

        resizeImage($image);
      }
      
      $sliderContainer.append($slider);
    }
    
    function getNewRatio(x, y, nx, ny) {
      
      if (x / nx < y / ny) {
        nx = ny * x / y;
      }
      else {
        ny = nx * y / x;
      }
      
      return [nx, ny];
    }
    
    function resizeImage($img) {
      
      var originalSize = $img.data("originalSize");
      var newWidth = $window.width();
      var newHeight = $window.height();
      var newRatio;
      var marginTop = 0;
      
      if (newWidth < minWidth) {
        newWidth = minWidth;
      }
      
      if (newHeight < minHeight) {
        newHeight = minHeight;
      }
      
      newRatio = getNewRatio( originalSize.width, originalSize.height, newWidth, newHeight );

      $img.width(newRatio[0]);
      $img.height(newRatio[1]);
        
      if (newHeight - newRatio[1] > 0) {
        marginTop = (newHeight - newRatio[1]) / 2;
      }
      
      $img.css({
        marginTop: marginTop
      });

    }

    
    // !パブリックメソッド
    
    $sliderContainer.init = function ($slideImage, sliderBackgroundColor) {
    
      var randomList = [];
      
      if (!$.delta.resizeEvents.active) {
        $.delta.resizeEvents($window, { interval: 200 });
      }
  
      $window.bind("resize", onResize);
      $window.bind("resizestart", onResizeStart);
      $window.bind("resizeend", onResizeEnd);
      
      $slider.css("background-color", sliderBackgroundColor);
      
      for (var i = 0; i < $slideImage.length; ++i) {
        randomList[i] = i;
      }

      $slideImage.each(function (i) {
        var index = Math.floor(Math.random() * randomList.length);
        sliderData[randomList[index]] = $(this);
        randomList.splice(index, 1);
      });
      
      if (isCompletePreloader) {
        loadSlider();
      }
      else {
        isStac = true;
      }
    };
    
    $sliderContainer.showSlider = function () {
      
      $preloader.animate({
        opacity: 0
      }, {
        duration: duration / 2
      });
      
      $slider.animate({
        opacity: 1
      }, {
        duration: duration
      });
      
    }
    
    return $sliderContainer;
  };

})(jQuery);

