/* 
 * jQuery.dotBtn.js
 * © 2011 kumagaiyusuke
*/

(function ($) {

  $.dotBtn = function (width, height, mouseEnterData, mouseLeaveData) {

    if (typeof width === "undefined" || typeof height === "undefined") {
      throw new Error("widthとheightの値は必須です。");
    }
    
    var $dotBtn = $("<div>", {
      "class" : "dotBtn"
    });
    
    var $leave = $("<div>", {
      "class" : "leave"
    });
    
    var $enter = $("<div>", {
      "class" : "enter"
    });
    
    var isCurrent = false;

    
    // !初期化
    
    $dotBtn.css({
      position: "relative",
      width: width,
      height: height
    });
    
    $dotBtn.append($leave, $enter);
    
    $dotBtn.bind("mouseenter", onMouseEnter);
    $dotBtn.bind("mouseleave", onMouseLeave);
    
    $leave.css({
      position: "absolute",
      top: 0,
      left: 0,
      width: "100%",
      height: "100%"
    });

    $leave.html(mouseLeaveData.contents);
    
    $enter.css({
      position: "absolute",
      top: 0,
      left: 0,
      width: "100%",
      height: "100%",
      opacity: 0
    });
    
    $enter.html(mouseEnterData.contents);
    
    
    // !イベントハンドラ
    
    function onMouseEnter(e) {
      
      $enter.stop();
      
      $enter.animate({
        opacity: 1
      }, {
        duration: mouseEnterData.duration,
        easing: mouseEnterData.easing
      });
    }
    
    function onMouseLeave(e) {
      
      $enter.stop();
      
      $enter.animate({
        opacity: 0
      }, {
        duration: mouseLeaveData.duration,
        easing: mouseLeaveData.easing
      });
    }
    
    
    // !パブリック
    
    $dotBtn.setCurrent = function () {
      
      if (isCurrent) {
        return;
      }
      
      isCurrent = true;

      $dotBtn.unbind("mouseenter", onMouseEnter);
      $dotBtn.unbind("mouseleave", onMouseLeave);
      
      $enter.stop();
      
      $enter.animate({
        opacity: 1
      }, {
        duration: mouseEnterData.duration,
        easing: mouseEnterData.easing
      });
    };
    
    $dotBtn.removeCurrent = function () {
      
      if (!isCurrent) {
        return;
      }
      
      isCurrent = false;

      $dotBtn.bind("mouseenter", onMouseEnter);
      $dotBtn.bind("mouseleave", onMouseLeave);
      
      $enter.stop();

      $enter.animate({
        opacity: 0
      }, {
        duration: mouseLeaveData.duration,
        easing: mouseLeaveData.easing
      });
    };
    
    return $dotBtn;
  };

})(jQuery);