$(function() {
  var $imgCenter  = $('#center');
  var $imgCont    = $('#img div');
  var $btnCont    = $('#btn');
  var $caption    = $('#caption');
  var imgLength   = $imgCont.find('img').length;
  var time        = 5000;
  var timerID;

  // 画像非表示
  $imgCont.find('img').css('opacity', 0);

  // 画像読み込み後に実行
  $(window).load(function() {
    // ボタン的なもの初期化
    var btnList = '';
    for (var i = 0; i < imgLength; i++) {
      btnList += '<span></span>';
    }
    $btnCont.html(btnList).find('span').eq(0).addClass('active');
    // 画像初期化
    var width = 0;
    $imgCont.find('img').each(function() {
      width = width + $(this).outerWidth(true);
    });
    width = parseInt(width + $imgCont.find('img').eq(0).outerWidth(true) / 2, 10);
    $imgCont.prepend($imgCont.html()).prepend($imgCont.html()).css('marginLeft', - width + 'px');
    // 中央画像初期化
    $imgCenter.html($imgCont.find('img').eq(0).clone(true)).find('img').css(sizeThumb());
    // 画像表示
    var fadeFlag = 0;
    $imgCont.find('img').fadeTo(800, 0.5, function() {
      if (fadeFlag == 0) {
        fadeFlag = 1;
        $imgCenter.find('img').animate(sizeMain(), 'fast', function() {
          $caption.html($(this).attr('alt'));
        });
        // ループ実行
        slideTimer();
        // クリックイベントをバインド
        $imgCont.find('img').live('click', slideEvent).mouseup(slideTimer);
      }
    });
  });

  // マウスイベント
  $imgCont.find('img').live('mouseover', function() {
    $(this).fadeTo('', 0.8);
  }).live('mouseout', function() {
    $(this).fadeTo('', 0.5);
  });

  // 中央画像縮小設定
  function sizeThumb() {
    var left = parseInt($imgCont.find('img').eq(0).width() / 2, 10);
    var size = {
      height : '310px',
      left : - left,
      opacity : 0,
      top : 0
    }
    return size;
  }

  // 中央画像拡大設定
  function sizeMain() {
    var firstImgWidth = $imgCont.find('img').eq(0).width();
    var left = parseInt((firstImgWidth / 2) + (((350 * firstImgWidth / 310) - firstImgWidth) / 2), 10);
    var size = {
      height : '350px',
      left : - left,
      opacity : 1,
      top : '-20px'
    }
    return size;
  }

  // 中央画像設定、拡大処理
  function centerSet() {
    $imgCenter.html($imgCont.find('img').eq(0).clone(true))
      .find('img').css(sizeThumb()).animate(sizeMain(), 'fast', function() {
        $caption.html($(this).attr('alt'));
      });
  }

  // スライドイベント
  var floatFlagNext = 0;
  var floatFlagPrev = 0;
  var count = 0;
  function slideEvent() {
    if ($imgCont.is(':animated') || $imgCenter.find('img').is(':animated')) {
      return false;
    }
    var width = 0;
    var slideWidth = 0;
    var clickNum = $imgCont.find('img').index(this);
    clickNum = clickNum != -1 ? clickNum - imgLength : 1;
    // キャプション消去
    $caption.empty();
    // 中央画像縮小
    $imgCenter.find('img').animate(sizeThumb(), 'fast', function() {
      // 中央画像消去
      $imgCenter.empty();
      // 右の画像をクリック
      if (clickNum >= 0) {
        for (var i = 0; i <= clickNum; i++) {
          width = $imgCont.find('img').eq(i).outerWidth(true) + width;
        }
        slideWidth = width - ($imgCont.find('img').eq(0).outerWidth(true) + $imgCont.find('img').eq(clickNum).outerWidth(true)) / 2;
        // 浮動小数点の処理
        floatFlagNext = slideWidth.toString().indexOf('.') != -1 ? floatFlagNext + 1 : floatFlagNext;
        slideWidth = parseInt(slideWidth, 10);
        if (floatFlagNext == 2) {
          slideWidth = slideWidth + 1;
          floatFlagNext = 0;
        }
        slideWidth = parseInt($imgCont.css('marginLeft'), 10) - slideWidth;
        // スライド処理
        $imgCont.animate({ marginLeft : slideWidth + 'px' }, function() {
          $imgCont.css('marginLeft', slideWidth + width - $imgCont.find('img').eq(clickNum).outerWidth(true))
            .find('img:lt(' + clickNum + ')').appendTo($imgCont);
          // 中央画像設定、拡大処理
          centerSet();
        });
      }
      // 左の画像をクリック
      else {
        for (var i = 0; i >= clickNum; i--) {
          width = $imgCont.find('img').eq(i).outerWidth(true) + width;
        }
        slideWidth = ($imgCont.find('img').eq(0).outerWidth(true) + $imgCont.find('img').eq(clickNum).outerWidth(true)) / 2 - width;
        // 浮動小数点の処理
        floatFlagPrev = slideWidth.toString().indexOf('.') != -1 ? floatFlagPrev + 1 : floatFlagPrev;
        slideWidth = parseInt(slideWidth, 10);
        if (floatFlagPrev == 2) {
          slideWidth = slideWidth - 1;
          floatFlagPrev = 0;
        }
        slideWidth = parseInt($imgCont.css('marginLeft'), 10) - slideWidth;
        // スライド処理
        $imgCont.animate({ marginLeft : slideWidth + 'px' }, function() {
          $imgCont.css('marginLeft', slideWidth - width + $imgCont.find('img').eq(0).outerWidth(true))
            .find('img:gt(' + ($imgCont.find('img').length + clickNum - 1) + ')').prependTo($imgCont);
          // 中央画像設定、拡大処理
          centerSet();
        });
      };
      // ボタン的なもの設定
      count = count + clickNum;
      if (count <= - imgLength) {
        count = count + imgLength
      }
      else if (count >= imgLength) {
        count = count - imgLength
      }
      $btnCont.find('span').removeClass().eq(count).addClass('active');
    });
  }

  // ループ処理
  function slideTimer() {
    clearInterval(timerID);
    timerID = setInterval(slideEvent, time);
  }

});