var p = $('#picplayer');
var pics1 = [{url: '/images/minBanner-1.png', link: '#', time: 3000}, {
    url: '/images/minBanner-2.jpg',
    link: '',
    time: 3000
}, {url: '/images/minBanner-3.jpg', link: '', time: 3000}, {url: '/images/minBanner-4.jpg', link: '', time: 3000}];
initPicPlayer(pics1, p.css('width').split('px')[0], p.css('height').split('px')[0]);
//
//
function initPicPlayer(pics, w, h) {
    //选中的图片
    var selectedItem;
    //选中的按钮
    var selectedBtn;
    //自动播放的id
    var playID;
    //选中图片的索引
    var selectedIndex;
    //容器
    var p = $('#picplayer');
    var c = $('#piccontent');

    for (var i = 0; i < pics.length; i++) {
        //添加图片到容器中
        c.append('<a target="_blank"><img id="picitem' + i + '" style="display: none;z-index:' + i + '" src="' + pics[i].url + '" /></a>');
        // href="'+pics[i].link+'"
    }

    //按钮容器，绝对定位在右下角
    var btnHolder = $('#picbtnHolder');
    var btns = $('#picbtns');

    for (var i = 0; i < pics.length; i++) {
        //增加图片对应的按钮
        $('#picbtn' + i).data('index', i);
        $('#picbtn' + i).click(function (event) {
            if (selectedItem.attr('src') == $('#picitem' + $(this).data('index')).attr('src')) {
                return;
            }
            setSelectedItem($(this).data('index'));
        });
    }
    setSelectedItem(0);

    //显示指定的图片index
    function setSelectedItem(index) {
        selectedIndex = index;
        clearInterval(playID);
        if (selectedItem) selectedItem.fadeOut('fast');
        selectedItem = $('#picitem' + index);
        selectedItem.fadeIn('slow');
        //
        if (selectedBtn) {
            selectedBtn.children('span').css('backgroundColor', '#D8D8D8');
            // selectedBtn.css('color','#000');
        }
        selectedBtn = $('#picbtn' + index);
        selectedBtn.children('span').css('backgroundColor', '#485766');
        // selectedBtn.css('color','#fff');
        //自动播放
        playID = setInterval(function () {
            var index = selectedIndex + 1;
            if (index > pics.length - 1) index = 0;
            setSelectedItem(index);
        }, pics[index].time);
    }
}