// jQuery.bbrk.home.specGalleryPage.js

(function ($) {
  
  if (typeof $.bbrk === "undefined") {
    $.bbrk = {};
  }
  
  if (typeof $.bbrk.home === "undefined") {
    $.bbrk.home = {};
  }
  
  $.bbrk.home.specGalleryPage = function (data) {
    
    var $page;
    var $contents;
    var $background;
    
    var events = $.bbrk.home.specGalleryPage.events;
    var pageTypes = $.bbrk.home.specGalleryPage.pageTypes;
    
    $page = $("<div>", {
      "class": "page"
    });
    
    $contents = $("<div>", {
      "class": "contents"
    });
    
    $contents.css({
      left: "-50%"
    });
    
    $background = $("<div>", {
      "class": "background"
    });
    
    switch (data.type) {
    case pageTypes.STORY:
      
      var $img1 = $("<img>", {
        "src": data.src[0]
      });
      
      var $img2 = $("<img>", {
        "src": data.src[1]
      });
      
      var $btn1 = $("<div>", {
        "class": "btn ja current"
      });
      
      var $btn2 = $("<div>", {
        "class": "btn en"
      });
      
      $img2.css({
        display: "none"
      });
      
      $btn1.html("<a></a>");
      $btn2.html("<a></a>");
      
      $btn1.on("click", function (e) {
        
        if ($btn1.hasClass("current")) {
          return;
        }
        
        $img1.css({
          display: "block"
        });
    
        $img2.css({
          display: "none"
        });
        
        $btn1.addClass("current");
        $btn2.removeClass("current");
      });
      
      $btn2.on("click", function (e) {
        
        if ($btn2.hasClass("current")) {
          return;
        }
        
        $img1.css({
          display: "none"
        });
    
        $img2.css({
          display: "block"
        });
        
        $btn1.removeClass("current");
        $btn2.addClass("current");
      });
      
      $contents.append($img1, $img2, $btn1, $btn2);

      break;
      
    case pageTypes.LOGO:
      
      var $img = $("<img>", {
        "src": data.src[0]
      });
      
      $contents.html($img);
      
      for (var i = 0; i < data.link.length; ++i) {
        
        var $link = $("<div class=\"btn btn" + (i + 1) + "\">");
        
        $link.html("<a href=\"" + data.link[i] + "\" target=\"_blank\"></a>");
        
        $contents.append($link);
      }
      
      break;
    }
    
    $page.append($background, $contents);
    
    $background.on("click", function () {
      $page.trigger(events.BG_CLICK);
    });
    
    
    $page.hide = function (duration, easing) {
      
      $contents.stop();
      
      $contents.animate({
        left: "150%"
      },{
        duration: duration,
        easing: easing,
        complete: function () {
          $page.css({
            display: "none"
          });
          $page.trigger(events.HIDE_COMPLETE);
        }
      });
    };
    
    $page.show = function (duration, easing) {
      
      $page.css({
        display: "block"
      });
      
      $contents.stop();
      
      $contents.css({
        left: "-50%"
      });
      
      $contents.animate({
        left: "50%"
      },{
        duration: duration,
        easing: easing
      });
    };
    
    return $page;
  };
  
  $.bbrk.home.specGalleryPage.events = {
    HIDE_COMPLETE: "hideComplete",
    BG_CLICK: "bgClick"
  };
  
  $.bbrk.home.specGalleryPage.pageTypes = {
    STORY: "story",
    LOGO: "logo"
  };
  
})(jQuery);