/**
 * 首页作品展示
 */
$(document).ready(function() {
    //设置参数
    var displayNum = 7;     //一共要显示的个数
    var itemWidth = 122;    //一个item的宽度
    var scrollStep = 3;     //每次滚动几个item
    var scrollTime = 800;  //滚动经历的时间
    var autoScroll = true;  //是否自动滚动
    var autoInterval = 5000;//自动滚动时间间隔
    var autoStep = 1;       //每次自动滚动几个item
    var autoTime = 500;     //每次自动滚动经历的时间

    //要操作的对象
    var $examples = $('.home #examples');
    var $items = $('div.item', $examples);
    var $itemsArray = new Array();
    var $container = $('div.cover', $examples);
    var $galleryNav = $('.home #gallery-nav');

    //初始化
    $items.remove().css({
        'float': 'none',
        'position': 'absolute',
        'left': 0,
        'top': 0
    });
    $examples.css('overflow', 'visible');
    $container.css('width', '100%');

    //hover效果
    var galleryInAnimate = false;
    function itemsHover($target) {
        $target.hover(function() {
            if (!galleryInAnimate) $(this).addClass('hover').css('opacity', 0.2).fadeTo(600, 1.0, 'easeOutQuad');
        }, function() {
            if (!galleryInAnimate) $target.stop().css('opacity', 1.0).removeClass('hover');
        });
    }

    
    //取出displayNum个item, 添加到显示区域
    for (var i=0; i<$items.length; i++) {
        if (i < displayNum) {
            itemsHover($items.eq(i).css('left', i*itemWidth).appendTo($container));
        } else {
            $itemsArray.push($items.eq(i));
        }
    }

    //item数目足够多时 才绑定滚动事件
    if ($items.length > displayNum) {
        $galleryNav.click(galleryNavHandle);
        if (autoScroll) {
            var autoIntervalId = null;
            startAutoInterval();
            $galleryNav.hover(stopAutoInterval, startAutoInterval);
            $examples.hover(stopAutoInterval, startAutoInterval);
        }
    }
    
    //左右滚动
    function galleryNavHandle(e) {
        $galleryNav.unbind('click');
        $examples.css('overflow', 'hidden');
        var i, action;
        if (e.target.id.toLowerCase() == 'gallery-left') {
            //左侧按钮 向右滚动
            action = 1;
            for (i=0; i<scrollStep; i++) {
                itemsHover($itemsArray.pop().css('left', (i+1)*(-itemWidth)).prependTo($container));
            }
        } else if (e.target.id.toLowerCase() == 'gallery-right') {
            //右侧按钮 向左滚动
            action = 0;
            for (i=0; i<scrollStep; i++) {
                itemsHover($itemsArray.shift().css('left', (displayNum+i)*itemWidth).appendTo($container));
            }
        }
        $tempItems = $('#examples div.item');
        galleryInAnimate = true;
        $tempItems.animate({
            'left':(action?'+':'-')+'='+itemWidth*scrollStep
        }, scrollTime, 'easeOutBack');
        setTimeout(function() {
            if (action == 1) {
                //去掉右边的item 加入到#gallery-temp-container头部
                $tempItems.filter(':gt(' +($tempItems.length-1-scrollStep)+ ')').each(function() {
                    $itemsArray.unshift($(this).remove());
                });
            } else {
                //去掉左边的item 加入到#gallery-temp-container尾部
                $tempItems.filter(':lt(' +(scrollStep)+ ')').each(function() {
                    $itemsArray.push($(this).remove());
                });
            }
            $examples.css('overflow', 'visible');
            //重新绑定事件
            $galleryNav.click(galleryNavHandle);
            galleryInAnimate = false;
        }, scrollTime);

        return false;
    }

    //自动滚动
    function autoIntervalHandle() {
        var cacheStep = scrollStep;
        var cacheTime = scrollTime;
        scrollStep = autoStep;
        scrollTime = autoTime;
        $('#gallery-right').trigger('click');
        setTimeout(function() {
            scrollStep = cacheStep;
            scrollTime = cacheTime;
        }, autoTime)


    }
    function startAutoInterval() {
        if (autoIntervalId == null) {
            autoIntervalId = setInterval(autoIntervalHandle, autoInterval);
        }
    }
    function stopAutoInterval() {
        if (autoIntervalId != null) {
            clearInterval(autoIntervalId);
            autoIntervalId = null;
        }
    }

});


/**
 * 首页 主要服务 动作
 */
$(document).ready(function() {
    var timeid = null;
    var extra = 8;
    var generalBottom = 85; //来自css, 缺少了灵活性
    $('.home #introduction .service ul li').hover(function() {
        var $this = $(this);
        timeid = setTimeout(function(){
            $this.css('margin-top','1px').find('.desc').each (function() {
                var $each = $(this);
                $each.css('display', 'block');
                $each.css({
                    'opacity':0,
                    'bottom':generalBottom-extra
                }).show().animate({
                    'opacity':0.6,
                    'bottom':generalBottom+2
                },500, 'easeOutElastic');
            });
            timeid = null;
        }, 100);
    }, function() {
        if (timeid != null) {
            clearTimeout(timeid);
        }
        $this = $(this);
        $this.css({
            'margin-top':0
        }).find('.desc').each(function() {
            var $each = $(this);
            $each.stop().animate({
                'opacity':0,
                'bottom':generalBottom
            }, 'fast', function() {
                $each.css('display','none');
            });
        });
    });
});