|
1 L.Edit = L.Edit || {}; |
|
2 |
|
3 /** |
|
4 * @class L.Edit.Marker |
|
5 * @aka Edit.Marker |
|
6 */ |
|
7 L.Edit.Marker = L.Handler.extend({ |
|
8 // @method initialize(): void |
|
9 initialize: function (marker, options) { |
|
10 this._marker = marker; |
|
11 L.setOptions(this, options); |
|
12 }, |
|
13 |
|
14 // @method addHooks(): void |
|
15 // Add listener hooks to this handler |
|
16 addHooks: function () { |
|
17 var marker = this._marker; |
|
18 |
|
19 marker.dragging.enable(); |
|
20 marker.on('dragend', this._onDragEnd, marker); |
|
21 this._toggleMarkerHighlight(); |
|
22 }, |
|
23 |
|
24 // @method removeHooks(): void |
|
25 // Remove listener hooks from this handler |
|
26 removeHooks: function () { |
|
27 var marker = this._marker; |
|
28 |
|
29 marker.dragging.disable(); |
|
30 marker.off('dragend', this._onDragEnd, marker); |
|
31 this._toggleMarkerHighlight(); |
|
32 }, |
|
33 |
|
34 _onDragEnd: function (e) { |
|
35 var layer = e.target; |
|
36 layer.edited = true; |
|
37 this._map.fire(L.Draw.Event.EDITMOVE, { layer: layer }); |
|
38 }, |
|
39 |
|
40 _toggleMarkerHighlight: function () { |
|
41 var icon = this._marker._icon; |
|
42 |
|
43 // Don't do anything if this layer is a marker but doesn't have an icon. Markers |
|
44 // should usually have icons. If using Leaflet.draw with Leaflet.markercluster there |
|
45 // is a chance that a marker doesn't. |
|
46 if (!icon) { |
|
47 return; |
|
48 } |
|
49 |
|
50 // This is quite naughty, but I don't see another way of doing it. (short of setting a new icon) |
|
51 icon.style.display = 'none'; |
|
52 |
|
53 if (L.DomUtil.hasClass(icon, 'leaflet-edit-marker-selected')) { |
|
54 L.DomUtil.removeClass(icon, 'leaflet-edit-marker-selected'); |
|
55 // Offset as the border will make the icon move. |
|
56 this._offsetMarker(icon, -4); |
|
57 |
|
58 } else { |
|
59 L.DomUtil.addClass(icon, 'leaflet-edit-marker-selected'); |
|
60 // Offset as the border will make the icon move. |
|
61 this._offsetMarker(icon, 4); |
|
62 } |
|
63 |
|
64 icon.style.display = ''; |
|
65 }, |
|
66 |
|
67 _offsetMarker: function (icon, offset) { |
|
68 var iconMarginTop = parseInt(icon.style.marginTop, 10) - offset, |
|
69 iconMarginLeft = parseInt(icon.style.marginLeft, 10) - offset; |
|
70 |
|
71 icon.style.marginTop = iconMarginTop + 'px'; |
|
72 icon.style.marginLeft = iconMarginLeft + 'px'; |
|
73 } |
|
74 }); |
|
75 |
|
76 L.Marker.addInitHook(function () { |
|
77 if (L.Edit.Marker) { |
|
78 this.editing = new L.Edit.Marker(this); |
|
79 |
|
80 if (this.options.editable) { |
|
81 this.editing.enable(); |
|
82 } |
|
83 } |
|
84 }); |