// ==UserScript==
// @name                图片浏览插件
// @description         针对全部带左右button的图片浏览的插件
// @created date        2009/8/18   16:16
// @created author      Tiger(tigershi0507@gmail.com)
// @version             4.0.1
// @version owner       Copyright (C) 2009-2010 keerr.com All rights reserved.
// ==/UserScript==

/*************************************************
verified time 	:	2009/8/18   16:20
verified author	:	Tiger
verified purpose:	添加函数参数，完成小图slide，大图显示的功能。其中的难点是要对点击左右button的判断值的修正
**************************************************/
/*************************************************
verified time 	:	2009/8/18   17:08
verified author	:	Tiger
verified purpose:	添加了鼠标mouseover在小图，大图切换的功能
**************************************************/
/*************************************************
verified time 	:	2009/10/29   13:10
verified author	:	Tiger
verified purpose:	修改了一些逻辑不做，以便适合楼盘户型的图片滚动
**************************************************/
/*************************************************
verified time 	:	2009/11/6   17:13
verified author	:	Tiger
verified purpose:	修改了click事件切换户型的一个bug（147行）
**************************************************/
/*************************************************
verified time 	:	2010/2/4   15:29
verified author	:	Tiger
verified purpose:	移到邻所进行操作
**************************************************/
var _choosed_Id;    //初始化时显示的户型id
var _group_num;     //初始的group number
var _group_num_picBar;  // picslideBar点击的全局变量

(function($) {
    $.fn.picSlider = function(options) {
        // default configuration properties
        var defaults = {
            prevId: 'prevBtn',
            prevText: 'Previous',
            nextId: 'nextBtn',
            nextText: 'Next',
            controlsShow: true,
            controlsBefore: '',
            controlsAfter: '',
            controlsFade: true,
            firstId: 'firstBtn',
            firstText: 'First',
            firstShow: false,
            lastId: 'lastBtn',
            lastText: 'Last',
            lastShow: false,
            vertical: false,
            speed: 888,
            auto: false,
            pause: 1000,
            continuous: false,
            numberOfOnce: 1,    // 一次移动几个Item
            numberOfShow: 1,    // 一次显示几个Item
            hoverShow: false,
            autoFocus: false,   // 页面加载直接显示url传递的id对应的图片
            afterClick: function() {    // 点击thunbnail图后的操作函数
                ;
            }
        };
        var opt = $.extend({}, defaults, options);

        this.each(function() {

            var obj = $(this),
                s = Math.ceil($("li", obj).length / opt.numberOfOnce),
                $_itemObj = $("li", obj),
                item_left = parseInt($_itemObj.css("margin-left").replace("px", "")),
                item_right = parseInt($_itemObj.css("margin-right").replace("px", "")),
                item_top = parseInt($_itemObj.css("margin-top").replace("px", "")),
                item_bottom = parseInt($_itemObj.css("margin-bottom").replace("px", ""));

            var w = $("li", obj).outerWidth() + item_left + item_right,
            //w = obj.width();
                h = $("li", obj).outerHeight() + item_top + item_bottom;
            obj.width(w * opt.numberOfShow);
            obj.height(h);
            obj.css("overflow", "hidden");

            var ts = s - 1, // 移动的次数统计
                t = 0;  // 初始group记录
            $("ul", obj).css('width', $("li", obj).length * w);
            if (!opt.vertical) { $("li", obj).css('float', 'left'); }
            if (opt.controlsShow) {
                var html = opt.controlsBefore;
                if (opt.firstShow) { html += '<span id="' + opt.firstId + '"><a href=\"javascript:void(0);\">' + opt.firstText + '</a></span>'; }
                html += ' <span id="' + opt.prevId + '"><a href=\"javascript:void(0);\">' + opt.prevText + '</a></span>';
                html += ' <span id="' + opt.nextId + '"><a href=\"javascript:void(0);\">' + opt.nextText + '</a></span>';
                if (opt.lastShow) { html += ' <span id="' + opt.lastId + '"><a href=\"javascript:void(0);\">' + opt.lastText + '</a></span>'; }
                html += opt.controlsAfter;
                $(obj).after(html);
            };

            $("#" + opt.nextId).click(function() {
                animate("next", true);
                _group_num += 1;
            });
            $("#" + opt.prevId).click(function() {
                animate("prev", true);
                _group_num -= 1;
            });
            $("#" + opt.firstId).click(function() {
                animate("first", true);
            });
            $("#" + opt.lastId).click(function() {
                animate("last", true);
            });

            /// <summary>
            /// click后切换主要内容
            /// </summary>
            $(opt["clickItemSel"], obj)
            .click(function() {
                opt.afterClick($(this));    // 调用相关输入函数处理点击后事件
            })
            .css("cursor", "pointer");

            if (opt.autoFocus) {
                autoFocusFun();
            }
            /// <summary>
            /// 自动切换到相应thumbnail图片上，需要改变变量t
            /// </summary>
            function autoFocusFun() {
                var url = location.href,
                    groupOfItem;
                _choosed_Id = url.split("_")[1]?url.split("_")[1].split(".")[0]:1;  // from keerr.getUrlParam.js
                
                if (_choosed_Id % opt.numberOfOnce === 0) {
                    groupOfItem = Math.floor((_choosed_Id - 1) / opt.numberOfOnce);
                } else {
                    groupOfItem = Math.floor(_choosed_Id / opt.numberOfOnce);
                }

                t = _group_num = groupOfItem;
                $("ul", obj).css("margin-left", groupOfItem * w * opt.numberOfShow * -1 + "px");
            }

            /// <summary>
            /// 动作效果
            /// </summary>
            /// <param name="dir">动作</param>
            /// <param name="clicked">是否点击</param>
            function animate(dir, clicked) {
                //debugger;
                var ot = t;
                if (_group_num_picBar > -1) {
                    ot = t = _group_num_picBar;
                    _group_num_picBar = -1;
                }
                switch (dir) {
                    case "next":
                        t = ((ot >= ts) ? (opt.continuous ? 0 : ts) : t + 1);
                        break;
                    case "prev":
                        t = ((t <= 0) ? (opt.continuous ? ts : 0) : t - 1);
                        break;
                    case "first":
                        t = 0;
                        break;
                    case "last":
                        t = ts;
                        break;
                    case "hover":
                        break;
                    default:
                        break;
                };

                var diff = Math.abs(ot - t);
                var speed = diff * opt.speed;
                if (!opt.vertical) {
                    if (diff !== 0) {
                        p = (opt.numberOfOnce * t * w * -1);
                        $("ul", obj).animate({ marginLeft: p }, speed, function() {
                            $("#lbNext").unbind().mouseup(function() {
                                picSlideFunc.clickNext($(this));
                            });
                            $("#lbPrev").unbind().mouseup(function() {
                                picSlideFunc.clickPrev($(this));
                            });
                        });
                    }

                } else {
                    p = (opt.numberOfOnce * t * h * -1);
                    $("ul", obj).animate({
                        marginTop: p
                    },
                    speed);
                };

                if (!opt.continuous && opt.controlsFade) {
                    if (t === ts) {
                        $("a", "#" + opt.nextId).css("opacity", "0.3");
                        $("a", "#" + opt.lastId).css("opacity", "0.3");
                    } else {
                        $("a", "#" + opt.nextId).css("opacity", "1.0");
                        $("a", "#" + opt.lastId).css("opacity", "1.0");
                    };
                    if (t === 0) {
                        $("a", "#" + opt.prevId).css("opacity", "0.3");
                        $("a", "#" + opt.firstId).css("opacity", "0.3");
                    } else {
                        $("a", "#" + opt.prevId).css("opacity", "1.0");
                        $("a", "#" + opt.firstId).css("opacity", "1.0");
                    };
                };
            };

            if (!opt.continuous && opt.controlsFade) {
                if (t === ts) {
                    $("a", "#" + opt.nextId).css("opacity", "0.3");
                    $("a", "#" + opt.lastId).css("opacity", "0.3");
                } else {
                    $("a", "#" + opt.nextId).css("opacity", "1.0");
                    $("a", "#" + opt.lastId).css("opacity", "1.0");
                };
                if (t === 0) {
                    $("a", "#" + opt.prevId).css("opacity", "0.3");
                    $("a", "#" + opt.firstId).css("opacity", "0.3");
                } else {
                    $("a", "#" + opt.prevId).css("opacity", "1.0");
                    $("a", "#" + opt.firstId).css("opacity", "1.0");
                };
            };
        });
    };
})(jQuery);

var picSlideFunc = {
    clickNext: function($_this) {
        var obj = $("#pic_nav_list");
        var nextIndexOfItem = picSlideFunc.judgeNum(0, $("li", obj).length, parseInt($("li", obj).index($("#xc_" + _choosed_Id, obj))) + 1),
            nextGroupOfItem = Math.floor(nextIndexOfItem / 5);
        if (_group_num !== nextGroupOfItem) {
            $_this.unbind();
            if (_group_num > nextGroupOfItem) {
                $("#prevBtn").click();
            } else {
                $("#nextBtn").click();
            }
            $("li", obj).eq(nextIndexOfItem).click();
            _group_num = nextGroupOfItem;
        }
        else {
            $("li", obj).eq(nextIndexOfItem).click();
        }
    },
    clickPrev: function($_this) {
        var obj = $("#pic_nav_list");
        var prevIndexOfItem = picSlideFunc.judgeNum(0, $("li", obj).length, parseInt($("li", obj).index($("#xc_" + _choosed_Id, obj))) - 1),
        prevGroupOfItem = Math.floor(prevIndexOfItem / 5);
        if (_group_num !== prevGroupOfItem) {
            $_this.unbind();
            $("#prevBtn").click();
            $("li", obj).eq(prevIndexOfItem).click();
            _group_num = prevGroupOfItem;
        }
        else {
            $("li", obj).eq(prevIndexOfItem).click();
        }
    },
    judgeNum: function(minNum, maxNum, num) {
        if (num >= maxNum) {
            return maxNum;
        }
        if (num <= minNum) {
            return minNum;
        }
        return num;
    },
    pageBar: function(pageIndex, pageSum) {
        var //pageSum = 10,
        //pageIndex = 4,
            pageHtml = '';

        if (pageSum > 0) {
            if (pageSum > 6) {
                /*if (pageIndex === 1) {
                //pageHtml += '<a class="pagePrev" href="javascript:void(0);">上一页</a>';
                $("#pagePrev").css("opacity", "0.3");
                } else {
                $("#pagePrev").css("opacity", "1.0");
                }*/
                if (pageIndex < 5) {
                    for (var i = 1; i < 5; i++) {
                        if (i === pageIndex) {
                            pageHtml += '<span><a class="on" href="javascript:void(0);">' + i + '</a></span>';
                        }
                        else {
                            pageHtml += '<span><a href="javascript:void(0);">' + i + '</a></span>';
                        };
                    }
                    if (pageIndex === 4) {
                        pageHtml += '<span><a href="javascript:void(0);">5</a></span>';
                    }
                    pageHtml += '<span>...</span><span><a href="javascript:void(0);">' + pageSum + '</a></span>';
                }
                else if (pageIndex < pageSum - 3 && pageIndex > 4) {
                    pageHtml += '<span><a href="javascript:void(0);">1</a></span><span>...</span>';
                    for (var i = -1; i < 2; i++) {
                        if (i === 0) {
                            pageHtml += '<span><a class="on" href="javascript:void(0);">' + pageIndex + '</a></span>';
                        }
                        else {
                            pageHtml += '<span><a href="javascript:void(0);">' + (pageIndex + i) + '</a></span>';
                        }
                    }
                    pageHtml += '<span>...</span><span><a href="javascript:void(0);">' + pageSum + '</a></span>';
                } else {
                    pageHtml += '<span><a href="javascript:void(0);">1</a></span><span>...</span>';
                    if (pageIndex === pageSum - 3) {
                        pageHtml += '<span><a href="javascript:void(0);">' + (pageSum - 4) + '</a></span>';
                    }
                    for (var i = -3; i < 1; i++) {
                        if (pageSum + i === pageIndex) {
                            pageHtml += '<span><a class="on" href="javascript:void(0);">' + pageIndex + '</a></span>';
                        }
                        else {
                            pageHtml += '<span><a href="javascript:void(0);">' + (pageSum + i) + '</a></span>';
                        }
                    }
                }
                if (pageIndex === pageSum) {
                    //pageHtml += '<a href="javascript:void(0);" class="pageNext">下一页</a>';
                    //$("#pagePrev").css("opacity", "0.3");                    
                }
            }
            else {
                if (pageSum > 1) {
                    for (var i = 1; i < pageSum + 1; i++) {
                        if (i === pageIndex) {
                            pageHtml += '<span><a class="on" href="javascript:void(0);">' + i + '</a></span>';
                        }
                        else {
                            pageHtml += '<span><a href="javascript:void(0);">' + i + '</a></span>';
                        }
                    }
                }
            }
        }

        $(".imgfy").html(pageHtml);

        $(".imgfy span a").unbind("click").click(function() {
            var $_this = $(this),
                picIndex = parseInt($(this).text());
            $(".imgfy .on").removeClass("on");
            $_this.addClass("on");
            $("#pic_nav_list li").eq(picIndex - 1).click();

            _group_num_picBar = Math.floor((picIndex - 1) / 4);
            $("#pic_nav_list ul").animate({ marginLeft: "-" + (138 * 4 * _group_num_picBar) });
        });


        // pagebar的上一页，下一页
        $("#pagePrev").unbind("click").click(function() {
            var $_curPage = $(".imgfy .on").parent("span"),
                $_prevPage = $_curPage.prev("span");
            $_prevPage.find("a").click();
        });
        $("#pageNext").unbind("click").click(function() {
            var $_curPage = $(".imgfy .on").parent("span"),
                $_nextPage = $_curPage.next("span");
            $_nextPage.find("a").click();
        });

        if (pageIndex === 1) {
            //pageHtml += '<a class="pagePrev" href="javascript:void(0);">上一页</a>';
            $("#pagePrev").css("opacity", "0.3");
        } else if (pageIndex > 1 && pageIndex < pageSum) {
            $("#pagePrev").css("opacity", "1.0");
        } else if (pageIndex === pageSum && $("#autoPage img").attr("src") !== "/images/9423081.gif") {
            $("#autoPage").click();
        }


    }
};

$.getUrlParam = function(para) {
    debugger;
    var url = location.href;
    var paraString = url.substring(url.indexOf("?") + 1, url.length).split("&");
    var paraObj = {};
    for (i = 0; j = paraString[i]; i++) {
        paraObj[j.substring(0, j.indexOf("=")).toLowerCase()] = j.substring(j.indexOf("=") + 1, j.length);
    }
    var returnValue = paraObj[para.toLowerCase()];
    if (typeof (returnValue) === "undefined") {
        return "";
    } else {
        return returnValue;
    }
};

$(function() {
    $("#pic_nav_list").picSlider({
        prevText: "",
        nextText: "",
        controlsShow: false,
        numberOfOnce: 4,
        numberOfShow: 4,
        clickItemSel: "li",
        autoFocus: true,
        afterClick: function($_this) {
            var obj = $("#pic_nav_list"),
                title = $.trim($_this.find("img").attr("title")),
                imgUrl = $_this.find("img").attr("src").replace("s_", ""),
                indexNo = $("#pic_nav_list li").index($_this);
            $("#originalPic").find("img").attr("src", imgUrl);
            $("#originalPic p").text(title);

            $("#pic_nav_list .on").removeClass("on");
            $_this.addClass("on");

            //picSlideFunc.pageBar(indexNo + 1, obj.find("li").length);

        }
    });

    /*$("#lbNext").mouseup(function() {
    picSlideFunc.clickNext($(this));
    });
    $("#lbPrev").mouseup(function() {
    picSlideFunc.clickPrev($(this));
    });
    */

    // 重构pagebar
    //picSlideFunc.pageBar(1, $("#pic_nav_list li").length);

    $("#autoPage").each(function() {
        var autoPageInterval,
            $_this = $(this);
        $_this.toggle(
            function() {
                if ($(".imgfy .on").parent("span").next("span").length === 0) {
                    return false;
                } else {
                    autoPageInterval = setInterval(function() {
                        $("#pageNext").click();
                    }, 4000);
                    $_this.find("img").attr("src", "/images/9423085.gif");
                }


            },
            function() {
                clearInterval(autoPageInterval);
                $_this.find("img").attr("src", "/images/9423081.gif");
            }
        );
    });


})