//点击播放事件,x为播放视频在视频列表里的下标
function showvideo(x) {
    var src = videolist[x];           //播放加载视频
    if (videolist[x] != null) {
        ind = x;
        $(".video_grid_bg").show();
        $(".video_grid").show();
        myPlayer.src(src);
        myPlayer.load(src);
        myPlayer.play();
    }
}

//播放上一个视频
function prevplay() {
    ind--;
    if (ind < 0) {
        ind = 0;
    }
    else {
        var src = videolist[ind];
        myPlayer.src(src);
        myPlayer.load();
        myPlayer.play();
    }
}

//播放下一个视频
function nextplay() {
    ind++;
    if (ind < videolist.length) {
        var src = videolist[ind];
        myPlayer.src(src);
        myPlayer.load();
        myPlayer.play();
    }
    else {
        ind = videolist.length;
    }
}


var limit = Number($("#sidle_grid").attr("data-limt"));                 //获取能活动显示的个数
var length = $("#sidle_grid .sidle").length;                            //获取列表项目个数
var mid_limit = Math.ceil(limit / 2);                                   //获取活动列表视图中的中间项目的视觉下标(1开始)
var mid = Math.ceil(length / 2);                                        //获取列表项目中中间项目的实际下标(1开始)
var left_limit = mid_limit - 1;                                         //获取活动列表视图中间项目左边能显示项目的个数
var right_limit = limit - mid_limit;                                    //获取活动列表视图中间项目右边能显示项目的个数
var unit_width = Number($("#sidle_grid .sidle").outerWidth()) + 15;     //位移单位距离
var maxleft = unit_width * (left_limit + 1);                            //左侧超出视图的距离
var maxright = unit_width * (right_limit + 1);                          //右侧超出视图的距离
var active = new Array();                                               //活动标示数组
var no_active = true;                                                   //是否空闲中
var no_show_l = 2;                                                      //左边淡化区个数
var no_show_r = 2;                                                      //右边淡化区个数

//将数值转换成从0开始计数
limit = limit - 1;
length = length - 1;
mid_limit = mid_limit - 1;
mid = mid - 1;

$(function () {

    //照片墙轮播
    //位置初始化
    $("#sidle_grid .sidle").each(function (index, element) {//遍历列表项目

        if (index < mid) {//判断是否在左侧

            if ((index + left_limit) >= mid) {//判断是否在左侧能够显示

                $(element).css("left", "-" + (unit_width * (mid - index)) + "px");
                active.push({ "id": index, "el": $(element) });

                if ((index + left_limit) < (mid + no_show_l)) {
                    $(element).css("opacity", "0.5");
                }
            }
            else {
                $(element).css({ "left": "-" + maxleft + "px", "opacity": "0.5" });
            }
        }
        else if (index == mid) {
            if (screen.width <= 1440) {
                $(element).css({ "height": "200px", "top": "0px" });
            }
            else {
                $(element).css({ "height": "240px", "top": "0px" });
            }
            active.push({ "id": index, "el": $(element) });
        }
        else if (index > mid) {//判断是否在右侧

            if ((index - right_limit) <= mid) {//判断是否在右侧能够显示

                $(element).css("left", (unit_width * (index - mid)) + "px");
                active.push({ "id": index, "el": $(element) });

                if ((index - right_limit) > (mid - no_show_r)) {
                    $(element).css("opacity", "0.5");
                }
            }
            else {
                $(element).css({ "left": maxright + "px", "opacity": "0.5" });
            }
        }
    });

    if (length > limit) {//自动
        //var setInterval_ID = setInterval(sidle_left, 3500);
        $(".left_btn").click(function () {
            //clearInterval(setInterval_ID);
            sidle_left();
            //setInterval_ID = setInterval(sidle_left, 3500);
        });

        $(".right_btn").click(function () {
            //clearInterval(setInterval_ID);
            sidle_right();
            //setInterval_ID = setInterval(sidle_left, 3500);
        });
        //$(".sidle_btn").mousemove(function () { clearInterval(setInterval_ID) });
        //$(".sidle_btn").mouseout(function () { setInterval_ID = setInterval(sidle_left, 3500); });
    }
    else {
        $(".sidle_btn").hide();
    }
});

function sidle_left() {//左移动
    if (no_active) {
        no_active = false;

        var add = active[limit].id + 1;
        if (add > length) {
            add = 0;
        }

        $("#sidle_grid .sidle").eq(add).css("left", maxright + "px");
        active.push({ "id": add, "el": $("#sidle_grid .sidle").eq(add) });

        for (var i = 0; i < active.length; i++) {
            if (i == mid_limit) {
                if (screen.width <= 1440) {
                    active[i].el.removeClass("curr").animate({ "left": "-=" + unit_width + "px", "height": "180px", "top": "10px" }, 800, function () { no_active = true; });
                }
                else {
                    active[i].el.removeClass("curr").animate({ "left": "-=" + unit_width + "px", "height": "200px", "top": "20px" }, 800, function () { no_active = true; });
                }
            }
            else if (i == mid_limit + 1) {
                if (screen.width <= 1440) {
                    active[i].el.addClass("curr").animate({ "left": "-=" + unit_width + "px", "height": "200px", "top": "0px" }, 800, function () { no_active = true; });
                }
                else {
                    active[i].el.addClass("curr").animate({ "left": "-=" + unit_width + "px", "height": "240px", "top": "0px" }, 800, function () { no_active = true; });
                }
            }
            else if (i == no_show_l) {
                active[i].el.animate({ "left": "-=" + unit_width + "px", "opacity": "0.5" }, 800, function () { no_active = true; });
            }
            else if (i == active.length - no_show_r - 1) {
                active[i].el.animate({ "left": "-=" + unit_width + "px", "opacity": "1" }, 800, function () { no_active = true; });
            }
            else {
                active[i].el.animate({ "left": "-=" + unit_width + "px" }, 800, function () { no_active = true; });
            }
        }

        active.shift();
    }
}

function sidle_right() {//右移动
    if (no_active) {
        no_active = false;

        var add = active[0].id - 1;
        if (add < 0) {
            add = length;
        }

        $("#sidle_grid .sidle").eq(add).css("left", "-" + maxleft + "px");
        active.unshift({ "id": add, "el": $("#sidle_grid .sidle").eq(add) });

        for (var i = 0; i < active.length; i++) {
            if (i == mid_limit + 1) {
                if (screen.width <= 1440) {
                    active[i].el.removeClass("curr").animate({ "left": "+=" + unit_width + "px", "height": "180px", "top": "10px" }, 800, function () { no_active = true; });
                }
                else {
                    active[i].el.removeClass("curr").animate({ "left": "+=" + unit_width + "px", "height": "200px", "top": "20px" }, 800, function () { no_active = true; });
                }
            }
            else if (i == mid_limit) {
                if (screen.width <= 1440) {
                    active[i].el.addClass("curr").animate({ "left": "+=" + unit_width + "px", "height": "200px", "top": "0px" }, 800, function () { no_active = true; });
                }
                else {
                    active[i].el.addClass("curr").animate({ "left": "+=" + unit_width + "px", "height": "240px", "top": "0px" }, 800, function () { no_active = true; });
                }
            }
            else if (i == no_show_l) {
                active[i].el.animate({ "left": "+=" + unit_width + "px", "opacity": "1" }, 800, function () { no_active = true; });
            }
            else if (i == active.length - no_show_r - 1) {
                active[i].el.animate({ "left": "+=" + unit_width + "px", "opacity": "0.5" }, 800, function () { no_active = true; });
            }
            else {
                active[i].el.animate({ "left": "+=" + unit_width + "px" }, 800, function () { no_active = true; });
            }
        }

        active.pop();
    }
}