88 lines
2.8 KiB
JavaScript
88 lines
2.8 KiB
JavaScript
/*
|
|
In this example, we use Ox.MapEditor
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
Ox.load(['UI', 'Geo'], function() {
|
|
var $storage = Ox.localStorage("map_editor")
|
|
var places = $storage('places') || []
|
|
var placesAPI = Ox.api(places, {
|
|
geo: true,
|
|
sort: '-area',
|
|
cache: true,
|
|
})
|
|
var $map = Ox.MapEditor({
|
|
addPlace: function(place, callback) {
|
|
place = Ox.clone(place)
|
|
place.id = Ox.encodeBase26((places.length ? Ox.max(places.map(p => Ox.decodeBase26(p.id))) : 0) + 1)
|
|
place.editable = true
|
|
console.log("addPlace", place.id, place)
|
|
places.push(place)
|
|
$storage("places", places)
|
|
placesAPI.update(places)
|
|
setTimeout(() => {
|
|
Ox.Request.clearCache();
|
|
callback({
|
|
status: {
|
|
code: 200
|
|
},
|
|
data: place
|
|
})
|
|
}, 200)
|
|
},
|
|
editPlace: function(place, callback) {
|
|
place = Ox.clone(place)
|
|
places.forEach(p => {
|
|
if (p.id == place.id) {
|
|
Object.assign(p, place);
|
|
place = p
|
|
}
|
|
})
|
|
$storage("places", places)
|
|
placesAPI.update(places)
|
|
setTimeout(() => {
|
|
Ox.Request.clearCache();
|
|
callback({
|
|
status: {
|
|
code: 200
|
|
},
|
|
data: place
|
|
})
|
|
}, 200)
|
|
},
|
|
getMatches: function(names, callback) {
|
|
console.log("getMatches", names)
|
|
callback(23);
|
|
},
|
|
hasMatches: true, // FIXME: getMatches is enough
|
|
height: 800,
|
|
mode: 'add', // 'define',
|
|
names: null,
|
|
places: placesAPI,
|
|
removePlace: function(place, callback) {
|
|
console.log("removePlace", place.id, places)
|
|
places = places.filter(p => { return p.id != place.id })
|
|
console.log("new places", places)
|
|
$storage("places", places)
|
|
placesAPI.update(places)
|
|
setTimeout(() => {
|
|
Ox.Request.clearCache();
|
|
callback({
|
|
status: {
|
|
code: 200
|
|
},
|
|
})
|
|
}, 200)
|
|
},
|
|
selected: '',
|
|
showControls: false,
|
|
showLabels: false,
|
|
showTypes: true,
|
|
width: 600
|
|
})
|
|
.appendTo(Ox.$body);
|
|
|
|
Ox.$window.bind({resize: $map.resizeMap});
|
|
|
|
});
|