ss_new_ui_skin_and_page/ss/js/menu.js

//禁止鼠标选中文字。点选的时候容易选中文字
document.onselectstart = function(event) {
    event = window.event || event;
    event.returnValue = false;
}
var Float_menu = (function() {
    var FloatObject = null;
    var Args = {};
    var MenuManager = function(o) {
        Args._window = o._window;
        Args.mainDiv = o.mainDiv || '#main';
        Args.menuDiv = o.menuDiv || '#float_menu';
        Args.rightMenuDiv = o.rightMenuDiv || '#my_menu';
        Args.smallDiv = o.smallDiv || '.cardList-div';
        Args.checkboxDiv = o.checkboxDiv || '.xzzt';
        Args.rightMenuHtml = $(Args.rightMenuDiv).html();
        Args.mainHtml = $(Args.mainDiv).html();
        Args.hasInit = false;
        //事件需要通过在部件内初始化的时候传递过来

        Args.ctrlCancelFunction = o.ctrlCancelFunction; //ctrl取消事件
        Args.ctrlFunction = o.ctrlFunction; //ctrl多选事件

        Args.clickCancelFunction = o.clickCancelFunction; //左右键取消事件
        Args.clickFunction = o.clickFunction; //左右键选中事件

        Args.shiftCancelFunction = o.shiftCancelFunction; //shift取消选中事件
        Args.shiftFunction = o.shiftFunction; //shift选中事件

        Args.stackNumber = 0; //用于记录shift选中的个数
        Args.indexArray = [];
        Args.lastClickDiv; //记录上次点击的下标

        Args.currentClickIndex; //shift点击的下标
        Args.endIndex = 0; //结束下标
        Args.clickTarget = "";
        $(Args.checkboxDiv).unbind("mousedown").bind("mousedown", function(e) {
            return false;
        });
        //this.handleEvent();
        Args._window.document.onkeydown = this.handleEvent;
        $(Args._window.document).find(Args.mainDiv).mouseup(function(e){
            MenuManager.prototype.handleEvent(e);
        });
        //Args._window.document.onclick = this.handleEvent;
        Args._window.document.ondblclick = this.handleDbclick;
        //给checkbox绑定事件
        /*var checkboxList = Args._window.document.getElementsByClassName("xzzt");
        for(var index in checkboxList){
            checkboxList[index].onmousedown = this.checkboxHandle;
        }*/
    };
    MenuManager.prototype = {
        findSmallDiv: function(dom, i) {
            if (i > 5 || !dom.parentElement) {
                return;
            } else {
                if (dom.parentElement.className.indexOf(Args.smallDiv.substr(1)) > -1) {
                    return dom.parentElement;
                } else {
                    return MenuManager.prototype.findSmallDiv(dom.parentElement, i++);
                }
            }
        },
        handleDbclick: function(evt) {
            console.log("dbclick");
            var dom = MenuManager.prototype.findSmallDiv(evt.srcElement, 0);
            if (dom) {
                MenuManager.prototype.checked(dom);
                $("input[value=查看]").click();
            }
            console.log(Args);
        },
        handleEvent: function(evt) {
            Args.hasInit = true;
            evt = (evt) ? evt : this.window.event;
            if (Args.clickTarget == "checkbox") {
                Args.clickTarget = "smallDiv";
                return false;
            }
            var items = $(Args.mainDiv).find(Args.smallDiv);

            if (evt.button == 0 && evt.ctrlKey) { //ctrl+左键
                MenuManager.prototype.ctrlHandle(evt, items);
            } else if (evt.button == 0 && evt.shiftKey) { //shift+左键
                MenuManager.prototype.shiftHandle(evt, items);
            } else {
                if ($(evt.target) && $(evt.target).hasClass("xzzt")) { //如果左键单击事件的触发对象是"checkbox"
                    MenuManager.prototype.checkboxHandle(evt);
                } else {
                    MenuManager.prototype.clickHandle(evt, items);
                }
            }
        },
        checkboxHandle: function(evt) { //点击checkbox处理函数
            Args.clickTarget = "checkbox";
            evt = (evt) ? evt : this.window.event;
            evt.stopPropagation(); //阻止事件冒泡
            var items = $(Args.mainDiv).find(Args.smallDiv);
            MenuManager.prototype.ctrlHandle(evt, items);
            return false;
        },
        checked: function(dom) {
            var _this = this;
            Args.checkType && Args.checkType();
            if ($(dom).children('div.xzzt').hasClass("icon-checked")) { //已被选定的情况下触发点击事件，则取消选择
                $(dom).children('div.xzzt').removeClass("icon-checked");
                _this.handleTargetClass(this, 'single', 'cancel');
                Args.clickCancelFunction && Args.clickCancelFunction();
            } else {
                Args.clickCancelFunction && Args.clickCancelFunction();
                $(dom).siblings().children('div.xzzt').removeClass("icon-checked");
                $(dom).children('div.xzzt').addClass("icon-checked");
                _this.handleTargetClass(dom, 'single', "choice");
                Args.clickFunction && Args.clickFunction(dom);
            }
            _this.handleMenu(dom);
            Args.lastClickDiv = dom;
        },
        clickHandle: function(evt, items) { //click处理函数
            var _this = this;
            for (var i = 0; i < items.length; i++) {
                items[i].onclick = function() { //左键
                    Args.indexArray.push($(Args.mainDiv).find(Args.smallDiv).index(this));
                    _this.checked(this);
                };
                items[i].oncontextmenu = function() { //右键
                    Args.indexArray.push($(Args.mainDiv).find(Args.smallDiv).index(this));
                    _this.checked(this);
                };
            }
        },
        ctrlHandle: function(evt, items) { //ctrl处理函数
            var _this = this;
            for (var i = 0; i < items.length; i++) {
                items[i].onclick = function() {
                    Args.indexArray.push($(Args.mainDiv).find(Args.smallDiv).index(this));
                    Args.checkType && Args.checkType();
                    if ($(this).children('div.xzzt').hasClass("icon-checked")) { //已被选定的情况下触发点击事件，则取消选择
                        $(this).children('div.xzzt').removeClass("icon-checked");
                        _this.handleTargetClass(this, 'multiple', "cancel");
                        Args.ctrlCancelFunction && Args.ctrlCancelFunction(this);
                    } else {
                        Args.ctrlCancelFunction && Args.ctrlCancelFunction(this);
                        //$(this).siblings().removeClass("icon-checked");
                        $(this).children('div.xzzt').addClass("icon-checked");
                        _this.handleTargetClass(this, 'multiple', "choice");
                        Args.ctrlFunction && Args.ctrlFunction(this);
                    }
                    _this.handleMenu(this);
                    Args.lastClickDiv = this;
                };
            }
        },
        shiftHandle: function(evt, items) { //shift处理函数
            var _this = this;
            for (var i = 0; i < items.length; i++) {
                items[i].onclick = function() {
                    Args.indexArray.push($(Args.mainDiv).find(Args.smallDiv).index(this));
                    if (Args.indexArray.length > 1) {
                        console.log("shiftHandle");
                        //调用多选的清空
                        _this.clearFunction();
                        var iMin = Math.min(Args.indexArray[Args.indexArray.length - 2], Args.indexArray[Args.indexArray.length - 1]);
                        var iMax = Math.max(Args.indexArray[Args.indexArray.length - 2], Args.indexArray[Args.indexArray.length - 1]);
                        for (var i = iMin; i <= iMax; i++) {
                            $($(Args.mainDiv).find(Args.smallDiv).children('div.xzzt')[i]).addClass("icon-checked");
                            _this.handleTargetClass($(Args.mainDiv).find(Args.smallDiv)[i], 'multiple', 'choice');
                        }
                        Args.shiftFunction && Args.shiftFunction();
                        if (Args.indexArray[Args.indexArray.length - 2] > Args.indexArray[Args.indexArray.length - 1]) {
                            _this.handleMenu($(Args.mainDiv).find(Args.smallDiv)[iMin]);
                        } else {
                            _this.handleMenu($(Args.mainDiv).find(Args.smallDiv)[iMax]);
                        }
                    }
                };
            }
        },
        handleTargetClass: function(obj, type, operation, isShiftKey) { //处理div的class
            var _this = this;
            if (type == 'single') { //单选操作对应的处理
                if (operation == 'cancel') { //管理二数据块div对应的class :cardList-div/iconList-div
                    $('div.xzzt').attr("class", "xzzt icon-unchecked");
                    $($(obj).children('div.xzzt').get(0)).attr("class", "xzzt icon-unchecked");
                } else {
                    $('div.xzzt').attr("class", "xzzt icon-unchecked");
                    $($(obj).children('div.xzzt').get(0)).attr("class", "xzzt icon-checked");
                }
            } else { //多选操作处理class              
                if (operation == 'cancel') {
                    $($(obj).children('div.xzzt').get(0)).attr("class", "xzzt icon-unchecked");
                } else {
                    $($(obj).children('div.xzzt').get(0)).attr("class", "xzzt icon-checked");
                }
            }
        },
        handleMenu: function(obj) {
            var allCardListDiv = $(".cardList-div");
            var falg=-1;
            var rowCount=0;
            var allCardListDivLength=allCardListDiv.length;
            for(var i = 0; i < allCardListDivLength; i++){
                var itemTop=$(allCardListDiv[i]).offset().top; 
                if(falg>-1&&itemTop>falg){
                    break;
                }
                rowCount=rowCount+1;
                falg=itemTop;
            }
            
            //最后一行添加标识
            var remainder = allCardListDivLength % rowCount; 
            for (var i = allCardListDivLength - remainder ; i < allCardListDivLength; i++) { 
                $(allCardListDiv[i]).addClass("lastCardList");  
            }

            if ($(obj).children('div.xzzt').hasClass("icon-checked")) {
                var menu_width = $(Args.menuDiv).width();
                var leftX = ($(obj).offset().left + $(obj).width() / 2) - $(Args.menuDiv).width() / 2 - 8;
                if (((menu_width > $(obj).width()) && $(obj).offset().left == 1) || (menu_width > ($(obj).width() + $(obj).offset().left))) {
                    $(Args.menuDiv).css("left", 1).css("top", $(obj).offset().top + $(obj).height()).show();

                } else {
                    var leftX = ($(obj).offset().left + $(obj).width() / 2) - $(Args.menuDiv).width() / 2 - 8;
                    if ($(obj).hasClass("lastCardList")) {
                        console.log("kukuku")
                        $(Args.menuDiv).css("left", leftX).css("top", $(obj).offset().top + $(obj).height() - 36).show();
                    } else {
                        console.log("就我")
                        $(Args.menuDiv).css("left", leftX).css("top", $(obj).offset().top + $(obj).height()).show();
                    }

                }

            }

        },
        clearFunction: function() {
            var _this = this;
            for (var i = 0; i < $(Args.mainDiv).find(Args.smallDiv).length; i++) {
                _this.handleTargetClass($(Args.mainDiv).find(Args.smallDiv)[i], 'single', 'cancel');
            }
            $(Args.rightMenuDiv).html(Args.rightMenuHtml); //还原右部分菜单
            $(Args.menuDiv).hide();
        }
    };
    //返回对象的初始化接口、提供获取最后一个点击的dom对象接口
    return {
        init: function(o) {
            FloatObject = new MenuManager(o);
        },
        getLastCheckedDom: function() {
            if (FloatObject) {
                return Args.lastClickDiv;
            }
        }
    };
})();
//version2.0