|
Popmenu = Control.subClass({
|
|
items: true,
|
|
init: function(config) {
|
config.css = util.combine(config.css, {
|
container: null
|
});
|
|
this.groups = {};
|
this.items = [];
|
Control.call(this, config);
|
|
let me = this;
|
//添加点击事件
|
document.addEventListener("click", function(){
|
me.hide();
|
});
|
},
|
|
getContainerTemplate: function() {
|
return $(Popmenu_Template.container);
|
},
|
|
createContent: function() {
|
// this.cancelContextmenu();
|
|
var items = this.config.items;
|
|
if (!items || !items.length) {
|
return;
|
}
|
|
var max = items.length;
|
|
for (var i = 0; i < max; i++) {
|
var item = items[i];
|
|
if (item.name == "-") {
|
this.createOneSpliter(this.container, item);
|
}
|
else {
|
this.createOneItem(this.container, item);
|
}
|
}
|
},
|
|
cancelContextmenu: function() {
|
if (!document.oncontextmenu) {
|
document.oncontextmenu = function(e){
|
return false;
|
}
|
}
|
|
},
|
|
createOneItem: function(parent, option) {
|
//1. element
|
var item = $(Popmenu_Template.item);
|
item.html(option.name);
|
|
//2. click
|
var me = this;
|
item.click(function() {
|
if (option.onClick) {
|
option.onClick.call(this, me.data);
|
}
|
});
|
|
//3. append
|
parent.append(item);
|
return result;
|
},
|
|
createOneSpliter: function(parent) {
|
var item = $(Popmenu_Template.spliter);
|
parent.append(item);
|
|
return result;
|
},
|
|
linkTo: function(el, option) {
|
var me = this;
|
if (me.el) {
|
$(el).unbind( "contextmenu");
|
me.el = null;
|
}
|
me.el = el;
|
|
$(el).on('contextmenu', function(e) {
|
me.resetPosition(e.pageX, e.pageY);
|
me.data = option;
|
me.show();
|
return false;
|
});
|
|
},
|
|
resetPosition: function(x, y) {
|
if(this.container) {
|
$(this.container).css("left", x + "px");
|
$(this.container).css("top", y + "px");
|
}
|
},
|
show: function() {
|
this.container.show();
|
},
|
hide: function() {
|
this.container.hide();
|
}
|
});
|
|
|
//*************************************
|
Popmenu_Template = {};
|
|
Popmenu_Template.container = "<ul class='popmenu' style='display:none;'></ul>";
|
|
Popmenu_Template.item = "<li class='popmenu-item'></li>";
|
|
Popmenu_Template.spliter = "<li class='popmenu-spliter'></li>";
|