🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

leaflet-contextmenu

Package Overview
Dependencies
Maintainers
1
Versions
7
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

leaflet-contextmenu - npm Package Compare versions

Comparing version

1.1.1
to
1.2.0

197

dist/leaflet.contextmenu.js
/*
Leaflet.contextmenu, a context menu for Leaflet.
(c) 2015, Adam Ratcliffe, GeoSmart Maps Limited
@preserve
@preserve
*/

@@ -14,3 +14,3 @@

define(['leaflet'], factory);
} else if (typeof module !== 'undefined') {
} else if (typeof module === 'object' && typeof module.exports === 'object') {
// Node/CommonJS

@@ -32,3 +32,2 @@ L = require('leaflet');

L.Map.ContextMenu = L.Handler.extend({
_touchstart: L.Browser.msPointer ? 'MSPointerDown' : L.Browser.pointer ? 'pointerdown' : 'touchstart',

@@ -53,3 +52,3 @@

}
this._createItems();

@@ -65,12 +64,12 @@

addHooks: function () {
var container = this._map.getContainer();
var container = this._map.getContainer();
L.DomEvent
.on(container, 'mouseleave', this._hide, this)
.on(container, 'mouseleave', this._hide, this)
.on(document, 'keydown', this._onKeyDown, this);
if (L.Browser.touch) {
L.DomEvent.on(document, this._touchstart, this._hide, this);
}
if (L.Browser.touch) {
L.DomEvent.on(document, this._touchstart, this._hide, this);
}
this._map.on({

@@ -85,11 +84,11 @@ contextmenu: this._show,

removeHooks: function () {
var container = this._map.getContainer();
var container = this._map.getContainer();
L.DomEvent
.off(container, 'mouseleave', this._hide, this)
.off(container, 'mouseleave', this._hide, this)
.off(document, 'keydown', this._onKeyDown, this);
if (L.Browser.touch) {
L.DomEvent.off(document, this._touchstart, this._hide, this);
}
if (L.Browser.touch) {
L.DomEvent.off(document, this._touchstart, this._hide, this);
}

@@ -120,6 +119,6 @@ this._map.off({

insertItem: function (options, index) {
index = index !== undefined ? index: this._items.length;
index = index !== undefined ? index: this._items.length;
var item = this._createItem(this._container, options, index);
this._items.push(item);

@@ -154,3 +153,3 @@

});
}
}
},

@@ -182,3 +181,3 @@

item.el.style.display = '';
}
}
},

@@ -207,3 +206,3 @@

});
}
}
}

@@ -218,4 +217,4 @@ },

var itemOptions = this._map.options.contextmenuItems,
item,
i, l;
item,
i, l;

@@ -232,8 +231,8 @@ for (i = 0, l = itemOptions.length; i < l; i++) {

var itemCls = L.Map.ContextMenu.BASE_CLS + '-item',
cls = options.disabled ? (itemCls + ' ' + itemCls + '-disabled') : itemCls,
el = this._insertElementAt('a', cls, container, index),
callback = this._createEventHandler(el, options.callback, options.context, options.hideOnSelect),
html = '';
var itemCls = L.Map.ContextMenu.BASE_CLS + '-item',
cls = options.disabled ? (itemCls + ' ' + itemCls + '-disabled') : itemCls,
el = this._insertElementAt('a', cls, container, index),
callback = this._createEventHandler(el, options.callback, options.context, options.hideOnSelect),
html = '';
if (options.icon) {

@@ -245,3 +244,3 @@ html = '<img class="' + L.Map.ContextMenu.BASE_CLS + '-icon" src="' + options.icon + '"/>';

el.innerHTML = html + options.text;
el.innerHTML = html + options.text;
el.href = '#';

@@ -255,6 +254,11 @@

if (L.Browser.touch) {
L.DomEvent.on(el, this._touchstart, L.DomEvent.stopPropagation);
}
if (L.Browser.touch) {
L.DomEvent.on(el, this._touchstart, L.DomEvent.stopPropagation);
}
// Devices without a mouse fire "mouseover" on tap, but never “mouseout"
if (!L.Browser.pointer) {
L.DomEvent.on(el, 'click', this._onItemMouseOut, this);
}
return {

@@ -269,4 +273,4 @@ id: L.Util.stamp(el),

var item,
el,
i, l, callback;
el,
i, l, callback;

@@ -287,7 +291,11 @@ for (i = 0, l = this._items.length; i < l; i++) {

if (L.Browser.touch) {
L.DomEvent.off(el, this._touchstart, L.DomEvent.stopPropagation);
}
if (L.Browser.touch) {
L.DomEvent.off(el, this._touchstart, L.DomEvent.stopPropagation);
}
if (!L.Browser.pointer) {
L.DomEvent.on(el, 'click', this._onItemMouseOut, this);
}
}
this._container.removeChild(el);

@@ -304,3 +312,3 @@ this._items.splice(i, 1);

var el = this._insertElementAt('div', L.Map.ContextMenu.BASE_CLS + '-separator', container, index);
return {

@@ -314,6 +322,6 @@ id: L.Util.stamp(el),

var me = this,
map = this._map,
disabledCls = L.Map.ContextMenu.BASE_CLS + '-item-disabled',
hideOnSelect = (hideOnSelect !== undefined) ? hideOnSelect : true;
map = this._map,
disabledCls = L.Map.ContextMenu.BASE_CLS + '-item-disabled',
hideOnSelect = (hideOnSelect !== undefined) ? hideOnSelect : true;
return function (e) {

@@ -323,9 +331,9 @@ if (L.DomUtil.hasClass(el, disabledCls)) {

}
if (hideOnSelect) {
me._hide();
me._hide();
}
if (func) {
func.call(context || map, me._showLocation);
func.call(context || map, me._showLocation);
}

@@ -342,3 +350,3 @@

var refEl,
el = document.createElement(tagName);
el = document.createElement(tagName);

@@ -370,3 +378,3 @@ el.className = className;

event = L.extend(data || {}, {contextmenu: this});
this._showLocation = {

@@ -378,13 +386,11 @@ latlng: latlng,

if(data && data.relatedTarget){
if (data && data.relatedTarget){
this._showLocation.relatedTarget = data.relatedTarget;
}
this._setPosition(pt);
this._setPosition(pt);
if (!this._visible) {
this._container.style.display = 'block';
this._visible = true;
} else {
this._setPosition(pt);
this._container.style.display = 'block';
this._visible = true;
}

@@ -396,3 +402,3 @@

_hide: function () {
_hide: function () {
if (this._visible) {

@@ -407,5 +413,5 @@ this._visible = false;

var mapSize = this._map.getSize(),
container = this._container,
containerSize = this._getElementSize(container),
anchor;
container = this._container,
containerSize = this._getElementSize(container),
anchor;

@@ -421,3 +427,3 @@ if (this._map.options.contextmenuAnchor) {

container.style.left = 'auto';
container.style.right = Math.max(mapSize.x - pt.x, 0) + 'px';
container.style.right = Math.min(Math.max(mapSize.x - pt.x, 0), mapSize.x - containerSize.x - 1) + 'px';
} else {

@@ -427,6 +433,6 @@ container.style.left = Math.max(pt.x, 0) + 'px';

}
if (pt.y + containerSize.y > mapSize.y) {
container.style.top = 'auto';
container.style.bottom = Math.max(mapSize.y - pt.y, 0) + 'px';
container.style.bottom = Math.min(Math.max(mapSize.y - pt.y, 0), mapSize.y - containerSize.y - 1) + 'px';
} else {

@@ -438,5 +444,5 @@ container.style.top = Math.max(pt.y, 0) + 'px';

_getElementSize: function (el) {
_getElementSize: function (el) {
var size = this._size,
initialDisplay = el.style.display;
initialDisplay = el.style.display;

@@ -449,9 +455,9 @@ if (!size || this._sizeChanged) {

el.style.display = 'block';
size.x = el.offsetWidth;
size.y = el.offsetHeight;
el.style.left = 'auto';
el.style.display = initialDisplay;
this._sizeChanged = false;

@@ -466,3 +472,3 @@ }

// If ESC pressed and context menu is visible hide it
// If ESC pressed and context menu is visible hide it
if (key === 27) {

@@ -484,3 +490,2 @@ this._hide();

L.Mixin.ContextMenu = {
bindContextMenu: function (options) {

@@ -504,18 +509,18 @@ L.setOptions(this, options);

removeContextMenuItemWithIndex: function (index) {
var items = [];
for (var i = 0; i < this.options.contextmenuItems.length; i++) {
if(this.options.contextmenuItems[i].index == index){
items.push(i);
}
var items = [];
for (var i = 0; i < this.options.contextmenuItems.length; i++) {
if (this.options.contextmenuItems[i].index == index){
items.push(i);
}
var elem = items.pop();
while (elem !== undefined) {
this.options.contextmenuItems.splice(elem,1);
elem = items.pop();
}
}
var elem = items.pop();
while (elem !== undefined) {
this.options.contextmenuItems.splice(elem,1);
elem = items.pop();
}
},
replaceConextMenuItem: function (item) {
this.removeContextMenuItemWithIndex(item.index);
this.addContextMenuItem(item);
replaceContextMenuItem: function (item) {
this.removeContextMenuItemWithIndex(item.index);
this.addContextMenuItem(item);
},

@@ -525,3 +530,3 @@

this._items = [];
this.on('contextmenu', this._showContextMenu, this);

@@ -532,7 +537,7 @@ },

var itemOptions,
data, pt, i, l;
data, pt, i, l;
if (this._map.contextmenu) {
data = L.extend({relatedTarget: this}, e)
data = L.extend({relatedTarget: this}, e);
pt = this._map.mouseEventToContainerPoint(e.originalEvent);

@@ -550,3 +555,3 @@

this._map.once('contextmenu.hide', this._hideContextMenu, this);
this._map.contextmenu.showAt(pt, data);

@@ -562,3 +567,3 @@ }

}
this._items.length = 0;
this._items.length = 0;

@@ -568,12 +573,12 @@ if (!this.options.contextmenuInheritItems) {

}
}
}
};
var classes = [L.Marker, L.Path],
defaultOptions = {
defaultOptions = {
contextmenu: false,
contextmenuItems: [],
contextmenuInheritItems: true
contextmenuInheritItems: true
},
cls, i, l;
cls, i, l;

@@ -599,3 +604,3 @@ for (i = 0, l = classes.length; i < l; i++) {

}
return L.Map.ContextMenu;
});
return L.Map.ContextMenu;
});

6

dist/leaflet.contextmenu.min.js
/*
Leaflet.contextmenu, a context menu for Leaflet.
(c) 2015, Adam Ratcliffe, GeoSmart Maps Limited
@preserve
@preserve
*/
(function(t){var e;if(typeof define==="function"&&define.amd){define(["leaflet"],t)}else if(typeof module!=="undefined"){e=require("leaflet");module.exports=t(e)}else{if(typeof window.L==="undefined"){throw new Error("Leaflet must be loaded first")}t(window.L)}})(function(t){t.Map.mergeOptions({contextmenuItems:[]});t.Map.ContextMenu=t.Handler.extend({_touchstart:t.Browser.msPointer?"MSPointerDown":t.Browser.pointer?"pointerdown":"touchstart",statics:{BASE_CLS:"leaflet-contextmenu"},initialize:function(e){t.Handler.prototype.initialize.call(this,e);this._items=[];this._visible=false;var n=this._container=t.DomUtil.create("div",t.Map.ContextMenu.BASE_CLS,e._container);n.style.zIndex=1e4;n.style.position="absolute";if(e.options.contextmenuWidth){n.style.width=e.options.contextmenuWidth+"px"}this._createItems();t.DomEvent.on(n,"click",t.DomEvent.stop).on(n,"mousedown",t.DomEvent.stop).on(n,"dblclick",t.DomEvent.stop).on(n,"contextmenu",t.DomEvent.stop)},addHooks:function(){var e=this._map.getContainer();t.DomEvent.on(e,"mouseleave",this._hide,this).on(document,"keydown",this._onKeyDown,this);if(t.Browser.touch){t.DomEvent.on(document,this._touchstart,this._hide,this)}this._map.on({contextmenu:this._show,mousedown:this._hide,movestart:this._hide,zoomstart:this._hide},this)},removeHooks:function(){var e=this._map.getContainer();t.DomEvent.off(e,"mouseleave",this._hide,this).off(document,"keydown",this._onKeyDown,this);if(t.Browser.touch){t.DomEvent.off(document,this._touchstart,this._hide,this)}this._map.off({contextmenu:this._show,mousedown:this._hide,movestart:this._hide,zoomstart:this._hide},this)},showAt:function(e,n){if(e instanceof t.LatLng){e=this._map.latLngToContainerPoint(e)}this._showAtPoint(e,n)},hide:function(){this._hide()},addItem:function(t){return this.insertItem(t)},insertItem:function(t,e){e=e!==undefined?e:this._items.length;var n=this._createItem(this._container,t,e);this._items.push(n);this._sizeChanged=true;this._map.fire("contextmenu.additem",{contextmenu:this,el:n.el,index:e});return n.el},removeItem:function(e){var n=this._container;if(!isNaN(e)){e=n.children[e]}if(e){this._removeItem(t.Util.stamp(e));this._sizeChanged=true;this._map.fire("contextmenu.removeitem",{contextmenu:this,el:e})}},removeAllItems:function(){var e;while(this._container.children.length){e=this._container.children[0];this._removeItem(t.Util.stamp(e))}},hideAllItems:function(){var t,e,n;for(e=0,n=this._items.length;e<n;e++){t=this._items[e];t.el.style.display="none"}},showAllItems:function(){var t,e,n;for(e=0,n=this._items.length;e<n;e++){t=this._items[e];t.el.style.display=""}},setDisabled:function(e,n){var i=this._container,o=t.Map.ContextMenu.BASE_CLS+"-item";if(!isNaN(e)){e=i.children[e]}if(e&&t.DomUtil.hasClass(e,o)){if(n){t.DomUtil.addClass(e,o+"-disabled");this._map.fire("contextmenu.disableitem",{contextmenu:this,el:e})}else{t.DomUtil.removeClass(e,o+"-disabled");this._map.fire("contextmenu.enableitem",{contextmenu:this,el:e})}}},isVisible:function(){return this._visible},_createItems:function(){var t=this._map.options.contextmenuItems,e,n,i;for(n=0,i=t.length;n<i;n++){this._items.push(this._createItem(this._container,t[n]))}},_createItem:function(e,n,i){if(n.separator||n==="-"){return this._createSeparator(e,i)}var o=t.Map.ContextMenu.BASE_CLS+"-item",s=n.disabled?o+" "+o+"-disabled":o,h=this._insertElementAt("a",s,e,i),a=this._createEventHandler(h,n.callback,n.context,n.hideOnSelect),r="";if(n.icon){r='<img class="'+t.Map.ContextMenu.BASE_CLS+'-icon" src="'+n.icon+'"/>'}else if(n.iconCls){r='<span class="'+t.Map.ContextMenu.BASE_CLS+"-icon "+n.iconCls+'"></span>'}h.innerHTML=r+n.text;h.href="#";t.DomEvent.on(h,"mouseover",this._onItemMouseOver,this).on(h,"mouseout",this._onItemMouseOut,this).on(h,"mousedown",t.DomEvent.stopPropagation).on(h,"click",a);if(t.Browser.touch){t.DomEvent.on(h,this._touchstart,t.DomEvent.stopPropagation)}return{id:t.Util.stamp(h),el:h,callback:a}},_removeItem:function(e){var n,i,o,s,h;for(o=0,s=this._items.length;o<s;o++){n=this._items[o];if(n.id===e){i=n.el;h=n.callback;if(h){t.DomEvent.off(i,"mouseover",this._onItemMouseOver,this).off(i,"mouseover",this._onItemMouseOut,this).off(i,"mousedown",t.DomEvent.stopPropagation).off(i,"click",h);if(t.Browser.touch){t.DomEvent.off(i,this._touchstart,t.DomEvent.stopPropagation)}}this._container.removeChild(i);this._items.splice(o,1);return n}}return null},_createSeparator:function(e,n){var i=this._insertElementAt("div",t.Map.ContextMenu.BASE_CLS+"-separator",e,n);return{id:t.Util.stamp(i),el:i}},_createEventHandler:function(e,n,i,o){var s=this,h=this._map,a=t.Map.ContextMenu.BASE_CLS+"-item-disabled",o=o!==undefined?o:true;return function(r){if(t.DomUtil.hasClass(e,a)){return}if(o){s._hide()}if(n){n.call(i||h,s._showLocation)}s._map.fire("contextmenu:select",{contextmenu:s,el:e})}},_insertElementAt:function(t,e,n,i){var o,s=document.createElement(t);s.className=e;if(i!==undefined){o=n.children[i]}if(o){n.insertBefore(s,o)}else{n.appendChild(s)}return s},_show:function(t){this._showAtPoint(t.containerPoint,t)},_showAtPoint:function(e,n){if(this._items.length){var i=this._map,o=i.containerPointToLayerPoint(e),s=i.layerPointToLatLng(o),h=t.extend(n||{},{contextmenu:this});this._showLocation={latlng:s,layerPoint:o,containerPoint:e};if(n&&n.relatedTarget){this._showLocation.relatedTarget=n.relatedTarget}this._setPosition(e);if(!this._visible){this._container.style.display="block";this._visible=true}else{this._setPosition(e)}this._map.fire("contextmenu.show",h)}},_hide:function(){if(this._visible){this._visible=false;this._container.style.display="none";this._map.fire("contextmenu.hide",{contextmenu:this})}},_setPosition:function(e){var n=this._map.getSize(),i=this._container,o=this._getElementSize(i),s;if(this._map.options.contextmenuAnchor){s=t.point(this._map.options.contextmenuAnchor);e=e.add(s)}i._leaflet_pos=e;if(e.x+o.x>n.x){i.style.left="auto";i.style.right=Math.max(n.x-e.x,0)+"px"}else{i.style.left=Math.max(e.x,0)+"px";i.style.right="auto"}if(e.y+o.y>n.y){i.style.top="auto";i.style.bottom=Math.max(n.y-e.y,0)+"px"}else{i.style.top=Math.max(e.y,0)+"px";i.style.bottom="auto"}},_getElementSize:function(t){var e=this._size,n=t.style.display;if(!e||this._sizeChanged){e={};t.style.left="-999999px";t.style.right="auto";t.style.display="block";e.x=t.offsetWidth;e.y=t.offsetHeight;t.style.left="auto";t.style.display=n;this._sizeChanged=false}return e},_onKeyDown:function(t){var e=t.keyCode;if(e===27){this._hide()}},_onItemMouseOver:function(e){t.DomUtil.addClass(e.target||e.srcElement,"over")},_onItemMouseOut:function(e){t.DomUtil.removeClass(e.target||e.srcElement,"over")}});t.Map.addInitHook("addHandler","contextmenu",t.Map.ContextMenu);t.Mixin.ContextMenu={bindContextMenu:function(e){t.setOptions(this,e);this._initContextMenu();return this},unbindContextMenu:function(){this.off("contextmenu",this._showContextMenu,this);return this},addContextMenuItem:function(t){this.options.contextmenuItems.push(t)},removeContextMenuItemWithIndex:function(t){var e=[];for(var n=0;n<this.options.contextmenuItems.length;n++){if(this.options.contextmenuItems[n].index==t){e.push(n)}}var i=e.pop();while(i!==undefined){this.options.contextmenuItems.splice(i,1);i=e.pop()}},replaceConextMenuItem:function(t){this.removeContextMenuItemWithIndex(t.index);this.addContextMenuItem(t)},_initContextMenu:function(){this._items=[];this.on("contextmenu",this._showContextMenu,this)},_showContextMenu:function(e){var n,i,o,s,h;if(this._map.contextmenu){i=t.extend({relatedTarget:this},e);o=this._map.mouseEventToContainerPoint(e.originalEvent);if(!this.options.contextmenuInheritItems){this._map.contextmenu.hideAllItems()}for(s=0,h=this.options.contextmenuItems.length;s<h;s++){n=this.options.contextmenuItems[s];this._items.push(this._map.contextmenu.insertItem(n,n.index))}this._map.once("contextmenu.hide",this._hideContextMenu,this);this._map.contextmenu.showAt(o,i)}},_hideContextMenu:function(){var t,e;for(t=0,e=this._items.length;t<e;t++){this._map.contextmenu.removeItem(this._items[t])}this._items.length=0;if(!this.options.contextmenuInheritItems){this._map.contextmenu.showAllItems()}}};var e=[t.Marker,t.Path],n={contextmenu:false,contextmenuItems:[],contextmenuInheritItems:true},i,o,s;for(o=0,s=e.length;o<s;o++){i=e[o];if(!i.prototype.options){i.prototype.options=n}else{i.mergeOptions(n)}i.addInitHook(function(){if(this.options.contextmenu){this._initContextMenu()}});i.include(t.Mixin.ContextMenu)}return t.Map.ContextMenu});
(function(t){var e;if(typeof define==="function"&&define.amd){define(["leaflet"],t)}else if(typeof module==="object"&&typeof module.exports==="object"){e=require("leaflet");module.exports=t(e)}else{if(typeof window.L==="undefined"){throw new Error("Leaflet must be loaded first")}t(window.L)}})(function(t){t.Map.mergeOptions({contextmenuItems:[]});t.Map.ContextMenu=t.Handler.extend({_touchstart:t.Browser.msPointer?"MSPointerDown":t.Browser.pointer?"pointerdown":"touchstart",statics:{BASE_CLS:"leaflet-contextmenu"},initialize:function(e){t.Handler.prototype.initialize.call(this,e);this._items=[];this._visible=false;var n=this._container=t.DomUtil.create("div",t.Map.ContextMenu.BASE_CLS,e._container);n.style.zIndex=1e4;n.style.position="absolute";if(e.options.contextmenuWidth){n.style.width=e.options.contextmenuWidth+"px"}this._createItems();t.DomEvent.on(n,"click",t.DomEvent.stop).on(n,"mousedown",t.DomEvent.stop).on(n,"dblclick",t.DomEvent.stop).on(n,"contextmenu",t.DomEvent.stop)},addHooks:function(){var e=this._map.getContainer();t.DomEvent.on(e,"mouseleave",this._hide,this).on(document,"keydown",this._onKeyDown,this);if(t.Browser.touch){t.DomEvent.on(document,this._touchstart,this._hide,this)}this._map.on({contextmenu:this._show,mousedown:this._hide,movestart:this._hide,zoomstart:this._hide},this)},removeHooks:function(){var e=this._map.getContainer();t.DomEvent.off(e,"mouseleave",this._hide,this).off(document,"keydown",this._onKeyDown,this);if(t.Browser.touch){t.DomEvent.off(document,this._touchstart,this._hide,this)}this._map.off({contextmenu:this._show,mousedown:this._hide,movestart:this._hide,zoomstart:this._hide},this)},showAt:function(e,n){if(e instanceof t.LatLng){e=this._map.latLngToContainerPoint(e)}this._showAtPoint(e,n)},hide:function(){this._hide()},addItem:function(t){return this.insertItem(t)},insertItem:function(t,e){e=e!==undefined?e:this._items.length;var n=this._createItem(this._container,t,e);this._items.push(n);this._sizeChanged=true;this._map.fire("contextmenu.additem",{contextmenu:this,el:n.el,index:e});return n.el},removeItem:function(e){var n=this._container;if(!isNaN(e)){e=n.children[e]}if(e){this._removeItem(t.Util.stamp(e));this._sizeChanged=true;this._map.fire("contextmenu.removeitem",{contextmenu:this,el:e})}},removeAllItems:function(){var e;while(this._container.children.length){e=this._container.children[0];this._removeItem(t.Util.stamp(e))}},hideAllItems:function(){var t,e,n;for(e=0,n=this._items.length;e<n;e++){t=this._items[e];t.el.style.display="none"}},showAllItems:function(){var t,e,n;for(e=0,n=this._items.length;e<n;e++){t=this._items[e];t.el.style.display=""}},setDisabled:function(e,n){var i=this._container,o=t.Map.ContextMenu.BASE_CLS+"-item";if(!isNaN(e)){e=i.children[e]}if(e&&t.DomUtil.hasClass(e,o)){if(n){t.DomUtil.addClass(e,o+"-disabled");this._map.fire("contextmenu.disableitem",{contextmenu:this,el:e})}else{t.DomUtil.removeClass(e,o+"-disabled");this._map.fire("contextmenu.enableitem",{contextmenu:this,el:e})}}},isVisible:function(){return this._visible},_createItems:function(){var t=this._map.options.contextmenuItems,e,n,i;for(n=0,i=t.length;n<i;n++){this._items.push(this._createItem(this._container,t[n]))}},_createItem:function(e,n,i){if(n.separator||n==="-"){return this._createSeparator(e,i)}var o=t.Map.ContextMenu.BASE_CLS+"-item",s=n.disabled?o+" "+o+"-disabled":o,h=this._insertElementAt("a",s,e,i),a=this._createEventHandler(h,n.callback,n.context,n.hideOnSelect),r="";if(n.icon){r='<img class="'+t.Map.ContextMenu.BASE_CLS+'-icon" src="'+n.icon+'"/>'}else if(n.iconCls){r='<span class="'+t.Map.ContextMenu.BASE_CLS+"-icon "+n.iconCls+'"></span>'}h.innerHTML=r+n.text;h.href="#";t.DomEvent.on(h,"mouseover",this._onItemMouseOver,this).on(h,"mouseout",this._onItemMouseOut,this).on(h,"mousedown",t.DomEvent.stopPropagation).on(h,"click",a);if(t.Browser.touch){t.DomEvent.on(h,this._touchstart,t.DomEvent.stopPropagation)}if(!t.Browser.pointer){t.DomEvent.on(h,"click",this._onItemMouseOut,this)}return{id:t.Util.stamp(h),el:h,callback:a}},_removeItem:function(e){var n,i,o,s,h;for(o=0,s=this._items.length;o<s;o++){n=this._items[o];if(n.id===e){i=n.el;h=n.callback;if(h){t.DomEvent.off(i,"mouseover",this._onItemMouseOver,this).off(i,"mouseover",this._onItemMouseOut,this).off(i,"mousedown",t.DomEvent.stopPropagation).off(i,"click",h);if(t.Browser.touch){t.DomEvent.off(i,this._touchstart,t.DomEvent.stopPropagation)}if(!t.Browser.pointer){t.DomEvent.on(i,"click",this._onItemMouseOut,this)}}this._container.removeChild(i);this._items.splice(o,1);return n}}return null},_createSeparator:function(e,n){var i=this._insertElementAt("div",t.Map.ContextMenu.BASE_CLS+"-separator",e,n);return{id:t.Util.stamp(i),el:i}},_createEventHandler:function(e,n,i,o){var s=this,h=this._map,a=t.Map.ContextMenu.BASE_CLS+"-item-disabled",o=o!==undefined?o:true;return function(r){if(t.DomUtil.hasClass(e,a)){return}if(o){s._hide()}if(n){n.call(i||h,s._showLocation)}s._map.fire("contextmenu:select",{contextmenu:s,el:e})}},_insertElementAt:function(t,e,n,i){var o,s=document.createElement(t);s.className=e;if(i!==undefined){o=n.children[i]}if(o){n.insertBefore(s,o)}else{n.appendChild(s)}return s},_show:function(t){this._showAtPoint(t.containerPoint,t)},_showAtPoint:function(e,n){if(this._items.length){var i=this._map,o=i.containerPointToLayerPoint(e),s=i.layerPointToLatLng(o),h=t.extend(n||{},{contextmenu:this});this._showLocation={latlng:s,layerPoint:o,containerPoint:e};if(n&&n.relatedTarget){this._showLocation.relatedTarget=n.relatedTarget}this._setPosition(e);if(!this._visible){this._container.style.display="block";this._visible=true}this._map.fire("contextmenu.show",h)}},_hide:function(){if(this._visible){this._visible=false;this._container.style.display="none";this._map.fire("contextmenu.hide",{contextmenu:this})}},_setPosition:function(e){var n=this._map.getSize(),i=this._container,o=this._getElementSize(i),s;if(this._map.options.contextmenuAnchor){s=t.point(this._map.options.contextmenuAnchor);e=e.add(s)}i._leaflet_pos=e;if(e.x+o.x>n.x){i.style.left="auto";i.style.right=Math.min(Math.max(n.x-e.x,0),n.x-o.x-1)+"px"}else{i.style.left=Math.max(e.x,0)+"px";i.style.right="auto"}if(e.y+o.y>n.y){i.style.top="auto";i.style.bottom=Math.min(Math.max(n.y-e.y,0),n.y-o.y-1)+"px"}else{i.style.top=Math.max(e.y,0)+"px";i.style.bottom="auto"}},_getElementSize:function(t){var e=this._size,n=t.style.display;if(!e||this._sizeChanged){e={};t.style.left="-999999px";t.style.right="auto";t.style.display="block";e.x=t.offsetWidth;e.y=t.offsetHeight;t.style.left="auto";t.style.display=n;this._sizeChanged=false}return e},_onKeyDown:function(t){var e=t.keyCode;if(e===27){this._hide()}},_onItemMouseOver:function(e){t.DomUtil.addClass(e.target||e.srcElement,"over")},_onItemMouseOut:function(e){t.DomUtil.removeClass(e.target||e.srcElement,"over")}});t.Map.addInitHook("addHandler","contextmenu",t.Map.ContextMenu);t.Mixin.ContextMenu={bindContextMenu:function(e){t.setOptions(this,e);this._initContextMenu();return this},unbindContextMenu:function(){this.off("contextmenu",this._showContextMenu,this);return this},addContextMenuItem:function(t){this.options.contextmenuItems.push(t)},removeContextMenuItemWithIndex:function(t){var e=[];for(var n=0;n<this.options.contextmenuItems.length;n++){if(this.options.contextmenuItems[n].index==t){e.push(n)}}var i=e.pop();while(i!==undefined){this.options.contextmenuItems.splice(i,1);i=e.pop()}},replaceContextMenuItem:function(t){this.removeContextMenuItemWithIndex(t.index);this.addContextMenuItem(t)},_initContextMenu:function(){this._items=[];this.on("contextmenu",this._showContextMenu,this)},_showContextMenu:function(e){var n,i,o,s,h;if(this._map.contextmenu){i=t.extend({relatedTarget:this},e);o=this._map.mouseEventToContainerPoint(e.originalEvent);if(!this.options.contextmenuInheritItems){this._map.contextmenu.hideAllItems()}for(s=0,h=this.options.contextmenuItems.length;s<h;s++){n=this.options.contextmenuItems[s];this._items.push(this._map.contextmenu.insertItem(n,n.index))}this._map.once("contextmenu.hide",this._hideContextMenu,this);this._map.contextmenu.showAt(o,i)}},_hideContextMenu:function(){var t,e;for(t=0,e=this._items.length;t<e;t++){this._map.contextmenu.removeItem(this._items[t])}this._items.length=0;if(!this.options.contextmenuInheritItems){this._map.contextmenu.showAllItems()}}};var e=[t.Marker,t.Path],n={contextmenu:false,contextmenuItems:[],contextmenuInheritItems:true},i,o,s;for(o=0,s=e.length;o<s;o++){i=e[o];if(!i.prototype.options){i.prototype.options=n}else{i.mergeOptions(n)}i.addInitHook(function(){if(this.options.contextmenu){this._initContextMenu()}});i.include(t.Mixin.ContextMenu)}return t.Map.ContextMenu});

7

package.json
{
"name": "leaflet-contextmenu",
"version": "1.1.1",
"version": "1.2.0",
"description": "A context menu for Leaflet",

@@ -11,3 +11,3 @@ "main": "dist/leaflet.contextmenu.js",

"concat": "cat src/copyright.js src/Map.ContextMenu.js src/Mixin.ContextMenu.js src/end.js > dist/leaflet.contextmenu.js",
"compress": "uglifyjs dist/leaflet.contextmenu.js -m --comments -o dist/leaflet.contextmenu.min.js; uglifycss dist/leaflet.contextmenu.css > dist/leaflet.contextmenu.min.css",
"compress": "node_modules/uglify-js/bin/uglifyjs dist/leaflet.contextmenu.js -m --comments -o dist/leaflet.contextmenu.min.js; node_modules/uglifycss/uglifycss dist/leaflet.contextmenu.css > dist/leaflet.contextmenu.min.css",
"build": "npm run concat && npm run compress"

@@ -33,4 +33,5 @@ },

"devDependencies": {
"uglifyjs": "^2.3.6"
"uglify-js": "^2.7.4",
"uglifycss": "^0.0.25"
}
}

22

README.md
#Leaflet.contextmenu
====================
[![CDNJS](https://img.shields.io/cdnjs/v/leaflet-contextmenu.svg)](https://cdnjs.com/libraries/leaflet-contextmenu)
[![npm](https://img.shields.io/npm/v/leaflet-contextmenu.svg)](https://www.npmjs.com/package/leaflet-contextmenu)
[![Bower](https://img.shields.io/bower/v/leaflet.contextmenu.svg)](https://libraries.io/bower/Leaflet.contextmenu)
A context menu for Leaflet. See the [demo](http://aratcliffe.github.io/Leaflet.contextmenu/examples/index.html).

@@ -29,3 +33,3 @@

}]
});
});

@@ -81,3 +85,5 @@

| icon | String | `undefined` | Url for a 16x16px icon to display to the left of the label.
| retinaIcon | String | `undefined` | Url for a retina-sized version (32x32px) icon to display to the left of the label.
| iconCls | String | `undefined` | A CSS class which sets the background image for the icon (exclusive of the `icon` option).
| retinaIconCls | String | `undefined` | A CSS class which sets the background image for a retina version of the icon (exclusive of the `retinaIcon` option).
| callback | Function | `undefined` | A callback function to be invoked when the menu item is clicked. The callback is passed an object with properties identifying the location the menu was opened at: `latlng`, `layerPoint` and `containerPoint`.

@@ -146,3 +152,3 @@ | context | Object | The map | The scope the callback will be executed in.

````javascript
bindContextMenu(contextMenuOptions)
bindContextMenu(contextMenuOptions)
````

@@ -155,3 +161,3 @@ Binds a context menu to the feature the method is called on.

Unbinds the context menu previously bound to the feature with the bindContextMenu() method.
###Events

@@ -224,4 +230,12 @@

##Development
Edit files in `src/`. To build the files in `dist/`, run:
````shell
npm install
npm run build
````
##License
This software is released under the [MIT licence](http://www.opensource.org/licenses/mit-license.php). Icons used in the example are from [http://glyphicons.com](http://glyphicons.com).

2

src/copyright.js

@@ -5,3 +5,3 @@ /*

@preserve
@preserve
*/

@@ -8,0 +8,0 @@

4

src/end.js

@@ -1,2 +0,2 @@

return L.Map.ContextMenu;
});
return L.Map.ContextMenu;
});

684

src/Map.ContextMenu.js
L.Map.mergeOptions({
contextmenuItems: []
contextmenuItems: []
});
L.Map.ContextMenu = L.Handler.extend({
_touchstart: L.Browser.msPointer ? 'MSPointerDown' : L.Browser.pointer ? 'pointerdown' : 'touchstart',
statics: {
BASE_CLS: 'leaflet-contextmenu'
},
initialize: function (map) {
L.Handler.prototype.initialize.call(this, map);
this._items = [];
this._visible = false;
_touchstart: L.Browser.msPointer ? 'MSPointerDown' : L.Browser.pointer ? 'pointerdown' : 'touchstart',
var container = this._container = L.DomUtil.create('div', L.Map.ContextMenu.BASE_CLS, map._container);
container.style.zIndex = 10000;
container.style.position = 'absolute';
statics: {
BASE_CLS: 'leaflet-contextmenu'
},
if (map.options.contextmenuWidth) {
container.style.width = map.options.contextmenuWidth + 'px';
}
initialize: function (map) {
L.Handler.prototype.initialize.call(this, map);
this._createItems();
this._items = [];
this._visible = false;
L.DomEvent
.on(container, 'click', L.DomEvent.stop)
.on(container, 'mousedown', L.DomEvent.stop)
.on(container, 'dblclick', L.DomEvent.stop)
.on(container, 'contextmenu', L.DomEvent.stop);
},
var container = this._container = L.DomUtil.create('div', L.Map.ContextMenu.BASE_CLS, map._container);
container.style.zIndex = 10000;
container.style.position = 'absolute';
addHooks: function () {
var container = this._map.getContainer();
if (map.options.contextmenuWidth) {
container.style.width = map.options.contextmenuWidth + 'px';
}
this._createItems();
L.DomEvent
.on(container, 'click', L.DomEvent.stop)
.on(container, 'mousedown', L.DomEvent.stop)
.on(container, 'dblclick', L.DomEvent.stop)
.on(container, 'contextmenu', L.DomEvent.stop);
},
addHooks: function () {
var container = this._map.getContainer();
L.DomEvent
L.DomEvent
.on(container, 'mouseleave', this._hide, this)
.on(document, 'keydown', this._onKeyDown, this);
.on(document, 'keydown', this._onKeyDown, this);

@@ -46,174 +45,176 @@ if (L.Browser.touch) {

}
this._map.on({
contextmenu: this._show,
mousedown: this._hide,
movestart: this._hide,
zoomstart: this._hide
}, this);
},
removeHooks: function () {
this._map.on({
contextmenu: this._show,
mousedown: this._hide,
movestart: this._hide,
zoomstart: this._hide
}, this);
},
removeHooks: function () {
var container = this._map.getContainer();
L.DomEvent
.off(container, 'mouseleave', this._hide, this)
.off(document, 'keydown', this._onKeyDown, this);
L.DomEvent
.off(container, 'mouseleave', this._hide, this)
.off(document, 'keydown', this._onKeyDown, this);
if (L.Browser.touch) {
L.DomEvent.off(document, this._touchstart, this._hide, this);
}
}
this._map.off({
contextmenu: this._show,
mousedown: this._hide,
movestart: this._hide,
zoomstart: this._hide
}, this);
},
this._map.off({
contextmenu: this._show,
mousedown: this._hide,
movestart: this._hide,
zoomstart: this._hide
}, this);
},
showAt: function (point, data) {
if (point instanceof L.LatLng) {
point = this._map.latLngToContainerPoint(point);
}
this._showAtPoint(point, data);
},
showAt: function (point, data) {
if (point instanceof L.LatLng) {
point = this._map.latLngToContainerPoint(point);
}
this._showAtPoint(point, data);
},
hide: function () {
this._hide();
},
hide: function () {
this._hide();
},
addItem: function (options) {
return this.insertItem(options);
},
addItem: function (options) {
return this.insertItem(options);
},
insertItem: function (options, index) {
index = index !== undefined ? index: this._items.length;
insertItem: function (options, index) {
index = index !== undefined ? index: this._items.length;
var item = this._createItem(this._container, options, index);
this._items.push(item);
var item = this._createItem(this._container, options, index);
this._sizeChanged = true;
this._items.push(item);
this._map.fire('contextmenu.additem', {
contextmenu: this,
el: item.el,
index: index
});
this._sizeChanged = true;
return item.el;
},
this._map.fire('contextmenu.additem', {
contextmenu: this,
el: item.el,
index: index
});
removeItem: function (item) {
var container = this._container;
return item.el;
},
if (!isNaN(item)) {
item = container.children[item];
}
removeItem: function (item) {
var container = this._container;
if (item) {
this._removeItem(L.Util.stamp(item));
if (!isNaN(item)) {
item = container.children[item];
}
this._sizeChanged = true;
if (item) {
this._removeItem(L.Util.stamp(item));
this._map.fire('contextmenu.removeitem', {
contextmenu: this,
el: item
});
}
},
this._sizeChanged = true;
removeAllItems: function () {
var item;
this._map.fire('contextmenu.removeitem', {
contextmenu: this,
el: item
});
}
},
while (this._container.children.length) {
item = this._container.children[0];
this._removeItem(L.Util.stamp(item));
}
},
removeAllItems: function () {
var item;
hideAllItems: function () {
var item, i, l;
while (this._container.children.length) {
item = this._container.children[0];
this._removeItem(L.Util.stamp(item));
}
},
for (i = 0, l = this._items.length; i < l; i++) {
item = this._items[i];
item.el.style.display = 'none';
}
},
hideAllItems: function () {
var item, i, l;
showAllItems: function () {
var item, i, l;
for (i = 0, l = this._items.length; i < l; i++) {
item = this._items[i];
item.el.style.display = 'none';
}
},
for (i = 0, l = this._items.length; i < l; i++) {
item = this._items[i];
item.el.style.display = '';
}
},
showAllItems: function () {
var item, i, l;
setDisabled: function (item, disabled) {
var container = this._container,
itemCls = L.Map.ContextMenu.BASE_CLS + '-item';
for (i = 0, l = this._items.length; i < l; i++) {
item = this._items[i];
item.el.style.display = '';
}
},
if (!isNaN(item)) {
item = container.children[item];
}
setDisabled: function (item, disabled) {
var container = this._container,
itemCls = L.Map.ContextMenu.BASE_CLS + '-item';
if (item && L.DomUtil.hasClass(item, itemCls)) {
if (disabled) {
L.DomUtil.addClass(item, itemCls + '-disabled');
this._map.fire('contextmenu.disableitem', {
contextmenu: this,
el: item
});
} else {
L.DomUtil.removeClass(item, itemCls + '-disabled');
this._map.fire('contextmenu.enableitem', {
contextmenu: this,
el: item
});
}
}
},
if (!isNaN(item)) {
item = container.children[item];
}
isVisible: function () {
return this._visible;
},
if (item && L.DomUtil.hasClass(item, itemCls)) {
if (disabled) {
L.DomUtil.addClass(item, itemCls + '-disabled');
this._map.fire('contextmenu.disableitem', {
contextmenu: this,
el: item
});
} else {
L.DomUtil.removeClass(item, itemCls + '-disabled');
this._map.fire('contextmenu.enableitem', {
contextmenu: this,
el: item
});
}
}
},
_createItems: function () {
var itemOptions = this._map.options.contextmenuItems,
item,
i, l;
isVisible: function () {
return this._visible;
},
for (i = 0, l = itemOptions.length; i < l; i++) {
this._items.push(this._createItem(this._container, itemOptions[i]));
}
},
_createItems: function () {
var itemOptions = this._map.options.contextmenuItems,
item,
i, l;
_createItem: function (container, options, index) {
if (options.separator || options === '-') {
return this._createSeparator(container, index);
}
for (i = 0, l = itemOptions.length; i < l; i++) {
this._items.push(this._createItem(this._container, itemOptions[i]));
}
},
var itemCls = L.Map.ContextMenu.BASE_CLS + '-item',
cls = options.disabled ? (itemCls + ' ' + itemCls + '-disabled') : itemCls,
el = this._insertElementAt('a', cls, container, index),
callback = this._createEventHandler(el, options.callback, options.context, options.hideOnSelect),
html = '';
if (options.icon) {
html = '<img class="' + L.Map.ContextMenu.BASE_CLS + '-icon" src="' + options.icon + '"/>';
} else if (options.iconCls) {
html = '<span class="' + L.Map.ContextMenu.BASE_CLS + '-icon ' + options.iconCls + '"></span>';
}
_createItem: function (container, options, index) {
if (options.separator || options === '-') {
return this._createSeparator(container, index);
}
el.innerHTML = html + options.text;
el.href = '#';
var itemCls = L.Map.ContextMenu.BASE_CLS + '-item',
cls = options.disabled ? (itemCls + ' ' + itemCls + '-disabled') : itemCls,
el = this._insertElementAt('a', cls, container, index),
callback = this._createEventHandler(el, options.callback, options.context, options.hideOnSelect),
icon = this._getIcon(options),
iconCls = this._getIconCls(options),
html = '';
L.DomEvent
.on(el, 'mouseover', this._onItemMouseOver, this)
.on(el, 'mouseout', this._onItemMouseOut, this)
.on(el, 'mousedown', L.DomEvent.stopPropagation)
.on(el, 'click', callback);
if (icon) {
html = '<img class="' + L.Map.ContextMenu.BASE_CLS + '-icon" src="' + icon + '"/>';
} else if (iconCls) {
html = '<span class="' + L.Map.ContextMenu.BASE_CLS + '-icon ' + iconCls + '"></span>';
}
el.innerHTML = html + options.text;
el.href = '#';
L.DomEvent
.on(el, 'mouseover', this._onItemMouseOver, this)
.on(el, 'mouseout', this._onItemMouseOut, this)
.on(el, 'mousedown', L.DomEvent.stopPropagation)
.on(el, 'click', callback);
if (L.Browser.touch) {

@@ -223,209 +224,224 @@ L.DomEvent.on(el, this._touchstart, L.DomEvent.stopPropagation);

return {
id: L.Util.stamp(el),
el: el,
callback: callback
};
},
// Devices without a mouse fire "mouseover" on tap, but never “mouseout"
if (!L.Browser.pointer) {
L.DomEvent.on(el, 'click', this._onItemMouseOut, this);
}
_removeItem: function (id) {
var item,
el,
i, l, callback;
return {
id: L.Util.stamp(el),
el: el,
callback: callback
};
},
for (i = 0, l = this._items.length; i < l; i++) {
item = this._items[i];
_removeItem: function (id) {
var item,
el,
i, l, callback;
if (item.id === id) {
el = item.el;
callback = item.callback;
for (i = 0, l = this._items.length; i < l; i++) {
item = this._items[i];
if (callback) {
L.DomEvent
.off(el, 'mouseover', this._onItemMouseOver, this)
.off(el, 'mouseover', this._onItemMouseOut, this)
.off(el, 'mousedown', L.DomEvent.stopPropagation)
.off(el, 'click', callback);
if (item.id === id) {
el = item.el;
callback = item.callback;
if (callback) {
L.DomEvent
.off(el, 'mouseover', this._onItemMouseOver, this)
.off(el, 'mouseover', this._onItemMouseOut, this)
.off(el, 'mousedown', L.DomEvent.stopPropagation)
.off(el, 'click', callback);
if (L.Browser.touch) {
L.DomEvent.off(el, this._touchstart, L.DomEvent.stopPropagation);
}
}
this._container.removeChild(el);
this._items.splice(i, 1);
return item;
}
}
return null;
},
if (!L.Browser.pointer) {
L.DomEvent.on(el, 'click', this._onItemMouseOut, this);
}
}
_createSeparator: function (container, index) {
var el = this._insertElementAt('div', L.Map.ContextMenu.BASE_CLS + '-separator', container, index);
return {
id: L.Util.stamp(el),
el: el
};
},
this._container.removeChild(el);
this._items.splice(i, 1);
_createEventHandler: function (el, func, context, hideOnSelect) {
var me = this,
map = this._map,
disabledCls = L.Map.ContextMenu.BASE_CLS + '-item-disabled',
hideOnSelect = (hideOnSelect !== undefined) ? hideOnSelect : true;
return function (e) {
if (L.DomUtil.hasClass(el, disabledCls)) {
return;
}
if (hideOnSelect) {
me._hide();
}
return item;
}
}
return null;
},
if (func) {
func.call(context || map, me._showLocation);
}
_createSeparator: function (container, index) {
var el = this._insertElementAt('div', L.Map.ContextMenu.BASE_CLS + '-separator', container, index);
me._map.fire('contextmenu:select', {
contextmenu: me,
el: el
});
};
},
return {
id: L.Util.stamp(el),
el: el
};
},
_insertElementAt: function (tagName, className, container, index) {
var refEl,
el = document.createElement(tagName);
_createEventHandler: function (el, func, context, hideOnSelect) {
var me = this,
map = this._map,
disabledCls = L.Map.ContextMenu.BASE_CLS + '-item-disabled',
hideOnSelect = (hideOnSelect !== undefined) ? hideOnSelect : true;
el.className = className;
return function (e) {
if (L.DomUtil.hasClass(el, disabledCls)) {
return;
}
if (index !== undefined) {
refEl = container.children[index];
}
if (hideOnSelect) {
me._hide();
}
if (refEl) {
container.insertBefore(el, refEl);
} else {
container.appendChild(el);
}
if (func) {
func.call(context || map, me._showLocation);
}
return el;
},
me._map.fire('contextmenu:select', {
contextmenu: me,
el: el
});
};
},
_show: function (e) {
this._showAtPoint(e.containerPoint, e);
},
_insertElementAt: function (tagName, className, container, index) {
var refEl,
el = document.createElement(tagName);
_showAtPoint: function (pt, data) {
if (this._items.length) {
var map = this._map,
layerPoint = map.containerPointToLayerPoint(pt),
latlng = map.layerPointToLatLng(layerPoint),
event = L.extend(data || {}, {contextmenu: this});
this._showLocation = {
latlng: latlng,
layerPoint: layerPoint,
containerPoint: pt
};
el.className = className;
if(data && data.relatedTarget){
this._showLocation.relatedTarget = data.relatedTarget;
}
if (index !== undefined) {
refEl = container.children[index];
}
this._setPosition(pt);
if (refEl) {
container.insertBefore(el, refEl);
} else {
container.appendChild(el);
}
if (!this._visible) {
this._container.style.display = 'block';
this._visible = true;
} else {
this._setPosition(pt);
}
return el;
},
this._map.fire('contextmenu.show', event);
}
},
_show: function (e) {
this._showAtPoint(e.containerPoint, e);
},
_hide: function () {
if (this._visible) {
this._visible = false;
this._container.style.display = 'none';
this._map.fire('contextmenu.hide', {contextmenu: this});
}
},
_showAtPoint: function (pt, data) {
if (this._items.length) {
var map = this._map,
layerPoint = map.containerPointToLayerPoint(pt),
latlng = map.layerPointToLatLng(layerPoint),
event = L.extend(data || {}, {contextmenu: this});
_setPosition: function (pt) {
var mapSize = this._map.getSize(),
container = this._container,
containerSize = this._getElementSize(container),
anchor;
this._showLocation = {
latlng: latlng,
layerPoint: layerPoint,
containerPoint: pt
};
if (this._map.options.contextmenuAnchor) {
anchor = L.point(this._map.options.contextmenuAnchor);
pt = pt.add(anchor);
}
if (data && data.relatedTarget){
this._showLocation.relatedTarget = data.relatedTarget;
}
container._leaflet_pos = pt;
this._setPosition(pt);
if (pt.x + containerSize.x > mapSize.x) {
container.style.left = 'auto';
container.style.right = Math.max(mapSize.x - pt.x, 0) + 'px';
} else {
container.style.left = Math.max(pt.x, 0) + 'px';
container.style.right = 'auto';
}
if (pt.y + containerSize.y > mapSize.y) {
container.style.top = 'auto';
container.style.bottom = Math.max(mapSize.y - pt.y, 0) + 'px';
} else {
container.style.top = Math.max(pt.y, 0) + 'px';
container.style.bottom = 'auto';
}
},
if (!this._visible) {
this._container.style.display = 'block';
this._visible = true;
}
_getElementSize: function (el) {
var size = this._size,
initialDisplay = el.style.display;
this._map.fire('contextmenu.show', event);
}
},
if (!size || this._sizeChanged) {
size = {};
_hide: function () {
if (this._visible) {
this._visible = false;
this._container.style.display = 'none';
this._map.fire('contextmenu.hide', {contextmenu: this});
}
},
el.style.left = '-999999px';
el.style.right = 'auto';
el.style.display = 'block';
size.x = el.offsetWidth;
size.y = el.offsetHeight;
el.style.left = 'auto';
el.style.display = initialDisplay;
this._sizeChanged = false;
}
_getIcon: function (options) {
return L.Browser.retina && options.retinaIcon || options.icon;
},
return size;
},
_getIconCls: function (options) {
return L.Browser.retina && options.retinaIconCls || options.iconCls;
},
_onKeyDown: function (e) {
var key = e.keyCode;
_setPosition: function (pt) {
var mapSize = this._map.getSize(),
container = this._container,
containerSize = this._getElementSize(container),
anchor;
// If ESC pressed and context menu is visible hide it
if (key === 27) {
this._hide();
}
},
if (this._map.options.contextmenuAnchor) {
anchor = L.point(this._map.options.contextmenuAnchor);
pt = pt.add(anchor);
}
_onItemMouseOver: function (e) {
L.DomUtil.addClass(e.target || e.srcElement, 'over');
},
container._leaflet_pos = pt;
_onItemMouseOut: function (e) {
L.DomUtil.removeClass(e.target || e.srcElement, 'over');
}
if (pt.x + containerSize.x > mapSize.x) {
container.style.left = 'auto';
container.style.right = Math.min(Math.max(mapSize.x - pt.x, 0), mapSize.x - containerSize.x - 1) + 'px';
} else {
container.style.left = Math.max(pt.x, 0) + 'px';
container.style.right = 'auto';
}
if (pt.y + containerSize.y > mapSize.y) {
container.style.top = 'auto';
container.style.bottom = Math.min(Math.max(mapSize.y - pt.y, 0), mapSize.y - containerSize.y - 1) + 'px';
} else {
container.style.top = Math.max(pt.y, 0) + 'px';
container.style.bottom = 'auto';
}
},
_getElementSize: function (el) {
var size = this._size,
initialDisplay = el.style.display;
if (!size || this._sizeChanged) {
size = {};
el.style.left = '-999999px';
el.style.right = 'auto';
el.style.display = 'block';
size.x = el.offsetWidth;
size.y = el.offsetHeight;
el.style.left = 'auto';
el.style.display = initialDisplay;
this._sizeChanged = false;
}
return size;
},
_onKeyDown: function (e) {
var key = e.keyCode;
// If ESC pressed and context menu is visible hide it
if (key === 27) {
this._hide();
}
},
_onItemMouseOver: function (e) {
L.DomUtil.addClass(e.target || e.srcElement, 'over');
},
_onItemMouseOut: function (e) {
L.DomUtil.removeClass(e.target || e.srcElement, 'over');
}
});
L.Map.addInitHook('addHandler', 'contextmenu', L.Map.ContextMenu);

161

src/Mixin.ContextMenu.js
L.Mixin.ContextMenu = {
bindContextMenu: function (options) {
L.setOptions(this, options);
this._initContextMenu();
bindContextMenu: function (options) {
L.setOptions(this, options);
this._initContextMenu();
return this;
},
return this;
},
unbindContextMenu: function (){
this.off('contextmenu', this._showContextMenu, this);
unbindContextMenu: function (){
this.off('contextmenu', this._showContextMenu, this);
return this;
},
return this;
},
addContextMenuItem: function (item) {
this.options.contextmenuItems.push(item);
},
addContextMenuItem: function (item) {
this.options.contextmenuItems.push(item);
},
removeContextMenuItemWithIndex: function (index) {
var items = [];
for (var i = 0; i < this.options.contextmenuItems.length; i++) {
if (this.options.contextmenuItems[i].index == index){
items.push(i);
}
}
var elem = items.pop();
while (elem !== undefined) {
this.options.contextmenuItems.splice(elem,1);
elem = items.pop();
}
},
removeContextMenuItemWithIndex: function (index) {
var items = [];
for (var i = 0; i < this.options.contextmenuItems.length; i++) {
if(this.options.contextmenuItems[i].index == index){
items.push(i);
}
}
var elem = items.pop();
while (elem !== undefined) {
this.options.contextmenuItems.splice(elem,1);
elem = items.pop();
}
},
replaceContextMenuItem: function (item) {
this.removeContextMenuItemWithIndex(item.index);
this.addContextMenuItem(item);
},
replaceContextMenuItem: function (item) {
this.removeContextMenuItemWithIndex(item.index);
this.addContextMenuItem(item);
},
_initContextMenu: function () {
this._items = [];
_initContextMenu: function () {
this._items = [];
this.on('contextmenu', this._showContextMenu, this);
},
this.on('contextmenu', this._showContextMenu, this);
},
_showContextMenu: function (e) {
var itemOptions,
data, pt, i, l;
_showContextMenu: function (e) {
var itemOptions,
data, pt, i, l;
if (this._map.contextmenu) {
data = L.extend({relatedTarget: this}, e)
pt = this._map.mouseEventToContainerPoint(e.originalEvent);
if (this._map.contextmenu) {
data = L.extend({relatedTarget: this}, e);
if (!this.options.contextmenuInheritItems) {
this._map.contextmenu.hideAllItems();
}
pt = this._map.mouseEventToContainerPoint(e.originalEvent);
for (i = 0, l = this.options.contextmenuItems.length; i < l; i++) {
itemOptions = this.options.contextmenuItems[i];
this._items.push(this._map.contextmenu.insertItem(itemOptions, itemOptions.index));
}
if (!this.options.contextmenuInheritItems) {
this._map.contextmenu.hideAllItems();
}
this._map.once('contextmenu.hide', this._hideContextMenu, this);
this._map.contextmenu.showAt(pt, data);
}
},
for (i = 0, l = this.options.contextmenuItems.length; i < l; i++) {
itemOptions = this.options.contextmenuItems[i];
this._items.push(this._map.contextmenu.insertItem(itemOptions, itemOptions.index));
}
_hideContextMenu: function () {
var i, l;
this._map.once('contextmenu.hide', this._hideContextMenu, this);
for (i = 0, l = this._items.length; i < l; i++) {
this._map.contextmenu.removeItem(this._items[i]);
}
this._items.length = 0;
this._map.contextmenu.showAt(pt, data);
}
},
if (!this.options.contextmenuInheritItems) {
this._map.contextmenu.showAllItems();
}
}
_hideContextMenu: function () {
var i, l;
for (i = 0, l = this._items.length; i < l; i++) {
this._map.contextmenu.removeItem(this._items[i]);
}
this._items.length = 0;
if (!this.options.contextmenuInheritItems) {
this._map.contextmenu.showAllItems();
}
}
};

@@ -85,26 +84,26 @@

defaultOptions = {
contextmenu: false,
contextmenuItems: [],
contextmenuInheritItems: true
},
contextmenu: false,
contextmenuItems: [],
contextmenuInheritItems: true
},
cls, i, l;
for (i = 0, l = classes.length; i < l; i++) {
cls = classes[i];
cls = classes[i];
// L.Class should probably provide an empty options hash, as it does not test
// for it here and add if needed
if (!cls.prototype.options) {
cls.prototype.options = defaultOptions;
} else {
cls.mergeOptions(defaultOptions);
}
// L.Class should probably provide an empty options hash, as it does not test
// for it here and add if needed
if (!cls.prototype.options) {
cls.prototype.options = defaultOptions;
} else {
cls.mergeOptions(defaultOptions);
}
cls.addInitHook(function () {
if (this.options.contextmenu) {
this._initContextMenu();
}
});
cls.addInitHook(function () {
if (this.options.contextmenu) {
this._initContextMenu();
}
});
cls.include(L.Mixin.ContextMenu);
cls.include(L.Mixin.ContextMenu);
}