oxjs/source/UI/js/Map/LeafletMapRectangle.js

134 lines
3 KiB
JavaScript
Raw Normal View History

'use strict';
/*@
Ox.MapRectangle <f> MapRectangle Object
(options) -> <o> MapRectangle Object
options <o> Options object
map <o|null> map
place <o|null> place
@*/
Ox.LeafletMapRectangle = function(options) {
options = Ox.extend({
map: null,
place: null
}, options);
var that = this,
themeData = Ox.Theme.getThemeData();
Ox.forEach(options, function(val, key) {
that[key] = val;
});
/*@
rectangle <f> google.maps.Rectangle
@*/
console.log('place bounds', that.place.bounds);
that.rectangle = new L.rectangle(that.place.bounds);
/*@
markers <a> array of markers
@*/
that.markers = Ox.map(that.place.points, function(point, position) {
return new Ox.LeafletMapRectangleMarker({
map: that.map,
place: that.place,
position: position
});
});
setOptions();
function click() {
if (
that.map.options('editable')
&& that.place.editable
&& !that.place.editing
) {
that.place.edit();
} else if (that.map.getKey() == 'meta') {
that.place.submit();
} else if (that.map.getKey() == 'shift') {
that.map.zoomToPlace();
} else {
that.map.panToPlace();
}
}
function setOptions() {
var color = '#' + Ox.toHex(themeData[
that.place.editing
? 'mapPlaceEditingBorder'
: 'mapPlaceSelectedBorder'
]);
// that.rectangle.setOptions({
// bounds: that.place.bounds,
// fillColor: color,
// fillOpacity: that.place.editing ? 0.1 : 0,
// strokeColor: color,
// strokeOpacity: that.place.id[0] == '_' ? 0.5 : 1,
// strokeWeight: 2
// });
}
/*@
add <f> add
@*/
that.add = function() {
that.rectangle.addTo(that.map.map);
that.rectangle.on('click', click);
// google.maps.event.addListener(that.rectangle, 'click', click);
return that;
};
/*@
deselect <f> deselect
@*/
that.deselect = function() {
setOptions();
Ox.Log('Map', 'MARKERS', that.markers)
Ox.forEach(that.markers, function(marker) {
marker.remove();
});
return that;
};
/*@
remove <f> remove
@*/
that.remove = function() {
that.rectangle.remove();
// that.rectangle.setMap(null);
// google.maps.event.clearListeners(that.rectangle);
return that;
}
/*@
select <f> select
@*/
that.select = function() {
setOptions();
Ox.forEach(that.markers, function(marker) {
marker.add();
});
return that;
};
/*@
update <f> udpate
@*/
that.update = function() {
Ox.Log('Map', 'UPDATE...')
setOptions();
Ox.forEach(that.markers, function(marker) {
marker.update();
});
return that;
}
return that;
};