$(function() {
  function initScale(target, scale,  animate) {
    var $this = $(target),
      nScale = scale || 1.2,
      nW = $this.parent().width(),
      nH = $this.parent().height(),
      nTw = nW * nScale,
      nTh = nH * nScale,
      nLeft = (nW - nTw) / 2,
      nTop = (nH - nTh) / 2,
      target = {
        top: nTop,
        left: nLeft,
        width: nTw,
        height: nTh,
      };
    if (animate) {
      $this.stop(true).animate(target, 500);
    } else {
      $this.css(target);
    }
    
  }
  $('.scale-animate .img').each(function() {
    initScale(this, $(this).attr('scale'));
  });
  $('.scale-animate').hover(function() {
    initScale($(this).find('.img'), 1, true);
  }, function() {
    initScale($(this).find('.img'), $(this).attr('scale'), true);
  })
  $('.pos-mark').data('isAnimate', false);

  $(window).on('resize', function() {
    $('.scale-animate .img').each(function () {
      initScale(this, $(this).attr('scale'));
    });
  });
   $('.pos-mark').css('opacity', 0);

  function posAnimation() {
    var nScrollTop = $(window).scrollTop(),
        nH = $(window).height();
    $('.pos-mark').each(function () {
      if (nH + nScrollTop - 100 > $(this).position().top && !$(this).data('isAnimate')) {
        $(this).data('isAnimate', true);
        $(this).css('opacity', 1)
        $(this).find('.pos-animate').each(function() {
          var $this = $(this);
          // var $pthis = $(this).parent('.pos-parent');
          // $this.parent().css('height', $this.parent().height());
          // $this.css({
          //   'position': 'absolute',
          //   opacity: 0,
          //   left: 0,
          //   top: 0
          // });
          if ($this.attr('left') !== undefined) {

            $this.addClass('bounceInLeft')

            // $this.css({
            //   left: -$pthis.width(),
            // })
          }
          if ($this.attr('bottom') !== undefined) {
            // $this.css({
            //   top: $pthis.height()
            // })
            $this.addClass('bounceInUp')
          }
          if ($this.attr('right') !== undefined) {
            // $this.css({
            //   left: $pthis.width(),
            // })
            $this.addClass('bounceInRight')
          }
          if ($this.attr('top') !== undefined) {
            // $this.css({
            //   top: -$pthis.height()
            // })
            $this.addClass('bounceInDown')
          }
          $this.addClass('animated')
          // $(this).animate({
          //   left: 0,
          //   top: 0,
          //   opacity: 1,
          // }, 1000, function () {
          //   $pthis.find('.pos-animate').css({
          //     position: 'relative'
          //   })
          //   $pthis.find('.pos-animate').parent().css('height', '100%');
          // });
        });
        
      }
    });
  }
  posAnimation();
  $(window).scroll(function() {
    posAnimation();
    var nScrollTop = $(this).scrollTop();
    if (nScrollTop > 60) {
      $('.nav-top').addClass('scroll')
    } else {
      $('.nav-top').removeClass('scroll')
    }

  });


  $('.mark-box').hover(function() {
    $(this).toggleClass('mark-show');
  }, function() {
    $(this).toggleClass('mark-show');
  })

  // 鎵嬫満
  !function () {
    $('#m-nav .menu-btn').click(function () {
      var $_parent = $(this).parent();
      $_parent.toggleClass('open');
    });

    $('.nav-parent .title').click(function () {
      var $_parent = $(this).parent();
      var has = $_parent.hasClass('open');
      $('.nav-parent.open').find('.sub').animate({
        height: 0,
      }, 500);
      $('.nav-parent.open').removeClass('open');

      if (!has) {
        $('.nav-parent.open').removeClass('open');
        $_parent.addClass('open');
        $_parent.find('.sub').animate({
          height: $_parent.find('.sub').children().length * 40,
        }, 500)
      }

    })
  }()
});