diff --git a/examples/maps/map_editor/index.html b/examples/maps/map_editor/index.html
new file mode 100644
index 00000000..294e941c
--- /dev/null
+++ b/examples/maps/map_editor/index.html
@@ -0,0 +1,13 @@
+
+
+
+ World Map with Countries
+
+
+
+
+
+
+
+
+
diff --git a/examples/maps/map_editor/js/example.js b/examples/maps/map_editor/js/example.js
new file mode 100644
index 00000000..7e75d600
--- /dev/null
+++ b/examples/maps/map_editor/js/example.js
@@ -0,0 +1,88 @@
+/*
+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});
+
+});
diff --git a/examples/maps/world_map_with_countries/index.html b/examples/maps/world_map_with_countries/index.html
index b636b69e..294e941c 100644
--- a/examples/maps/world_map_with_countries/index.html
+++ b/examples/maps/world_map_with_countries/index.html
@@ -5,9 +5,9 @@
-
+
-