remove error from javascript file with L variable
This commit is contained in:
Tanguy PATTE
parent
c8baf0c280
commit
a9b001e762
7 changed files with 831 additions and 819 deletions
|
|
@ -1,101 +1,103 @@
|
|||
(function () {
|
||||
OSM = L.tileLayer("http://{s}.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png", {
|
||||
attribution: '© Openstreetmap France | © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
|
||||
});
|
||||
mapId = "map_qp";
|
||||
|
||||
position = get_position();
|
||||
|
||||
map = L.map(mapId, {
|
||||
center: new L.LatLng(position.lat, position.lon),
|
||||
zoom: 13,
|
||||
layers: [OSM]
|
||||
});
|
||||
window.map = map;
|
||||
baseMap = {
|
||||
"OpenStreetMap": OSM
|
||||
};
|
||||
|
||||
L.control.layers(baseMap).addTo(map);
|
||||
|
||||
function loaddraw(data) {
|
||||
var qpLayer = L.geoJson(data).addTo(map);
|
||||
map.fitBounds(qpLayer.getBounds());
|
||||
|
||||
recup_qp_dessin(data)
|
||||
};
|
||||
|
||||
getdraw(ref_dossier);
|
||||
|
||||
function getdraw (ref) {
|
||||
$.ajax({
|
||||
headers: {'AUTHORIZATION': ''},
|
||||
url: 'http://apicarto.coremaps.com/api/v1/data/' + ref + '/geojson',
|
||||
datatype: 'json',
|
||||
jsonCallback: 'getJson',
|
||||
success: loaddraw
|
||||
if (typeof L != 'undefined') {
|
||||
(function () {
|
||||
OSM = L.tileLayer("http://{s}.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png", {
|
||||
attribution: '© Openstreetmap France | © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
|
||||
});
|
||||
};
|
||||
mapId = "map_qp";
|
||||
|
||||
function loadGeoJson(data) {
|
||||
map.spin(false);
|
||||
var qpLayer = L.geoJson(data, {onEachFeature: onEachFeature, style: style()}).addTo(map);
|
||||
};
|
||||
position = get_position();
|
||||
|
||||
function onEachFeature(feature, layer) {
|
||||
var anchor = $(location).attr('hash').substring(1);
|
||||
if (anchor != "") {
|
||||
var qp_select = JSON.parse(anchor);
|
||||
if (qp_select.qp.indexOf(feature.properties.code_qp) > -1) {
|
||||
window.geom_inter.index.push(feature.properties.code_qp);
|
||||
window.featureCollection.features.push(feature);
|
||||
layer.setStyle(select_style());
|
||||
map.fitBounds(layer.getBounds());
|
||||
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function style(feature) {
|
||||
return {
|
||||
fillColor: '#FC4E2A',
|
||||
weight: 1,
|
||||
opacity: 1,
|
||||
color: 'white',
|
||||
dashArray: '0',
|
||||
fillOpacity: 0.6
|
||||
map = L.map(mapId, {
|
||||
center: new L.LatLng(position.lat, position.lon),
|
||||
zoom: 13,
|
||||
layers: [OSM]
|
||||
});
|
||||
window.map = map;
|
||||
baseMap = {
|
||||
"OpenStreetMap": OSM
|
||||
};
|
||||
}
|
||||
|
||||
function recup_qp_dessin(geom){
|
||||
/**/
|
||||
$.ajax({
|
||||
url: 'http://apicarto.coremaps.com/zoneville/api/v1/qp',
|
||||
datatype: 'json',
|
||||
method: 'POST',
|
||||
data: {geom: geom},
|
||||
jsonCallback: 'getJson',
|
||||
success: function (data) {
|
||||
var qp_supp = "";
|
||||
feature = geom
|
||||
feature.properties = data;
|
||||
L.control.layers(baseMap).addTo(map);
|
||||
|
||||
for (i = 0; i < data.length; i++) {
|
||||
$.ajax({
|
||||
url: 'http://apicarto.coremaps.com/zoneville/api/beta/qp/mapservice',
|
||||
datatype: 'json',
|
||||
method: 'GET',
|
||||
data: {code: data[i].code_qp},
|
||||
jsonCallback: 'getJson',
|
||||
success: function (data) {
|
||||
function loaddraw(data) {
|
||||
var qpLayer = L.geoJson(data).addTo(map);
|
||||
map.fitBounds(qpLayer.getBounds());
|
||||
|
||||
recup_qp_dessin(data)
|
||||
};
|
||||
|
||||
getdraw(ref_dossier);
|
||||
|
||||
function getdraw (ref) {
|
||||
$.ajax({
|
||||
headers: {'AUTHORIZATION': ''},
|
||||
url: 'http://apicarto.coremaps.com/api/v1/data/' + ref + '/geojson',
|
||||
datatype: 'json',
|
||||
jsonCallback: 'getJson',
|
||||
success: loaddraw
|
||||
});
|
||||
};
|
||||
|
||||
function loadGeoJson(data) {
|
||||
map.spin(false);
|
||||
var qpLayer = L.geoJson(data, {onEachFeature: onEachFeature, style: style()}).addTo(map);
|
||||
};
|
||||
|
||||
function onEachFeature(feature, layer) {
|
||||
var anchor = $(location).attr('hash').substring(1);
|
||||
if (anchor != "") {
|
||||
var qp_select = JSON.parse(anchor);
|
||||
if (qp_select.qp.indexOf(feature.properties.code_qp) > -1) {
|
||||
window.geom_inter.index.push(feature.properties.code_qp);
|
||||
window.featureCollection.features.push(feature);
|
||||
layer.setStyle(select_style());
|
||||
map.fitBounds(layer.getBounds());
|
||||
|
||||
loadGeoJson(data);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
/**/
|
||||
}
|
||||
};
|
||||
|
||||
}).call(this);
|
||||
function style(feature) {
|
||||
return {
|
||||
fillColor: '#FC4E2A',
|
||||
weight: 1,
|
||||
opacity: 1,
|
||||
color: 'white',
|
||||
dashArray: '0',
|
||||
fillOpacity: 0.6
|
||||
};
|
||||
}
|
||||
|
||||
function recup_qp_dessin(geom){
|
||||
/**/
|
||||
$.ajax({
|
||||
url: 'http://apicarto.coremaps.com/zoneville/api/v1/qp',
|
||||
datatype: 'json',
|
||||
method: 'POST',
|
||||
data: {geom: geom},
|
||||
jsonCallback: 'getJson',
|
||||
success: function (data) {
|
||||
var qp_supp = "";
|
||||
feature = geom
|
||||
feature.properties = data;
|
||||
|
||||
for (i = 0; i < data.length; i++) {
|
||||
$.ajax({
|
||||
url: 'http://apicarto.coremaps.com/zoneville/api/beta/qp/mapservice',
|
||||
datatype: 'json',
|
||||
method: 'GET',
|
||||
data: {code: data[i].code_qp},
|
||||
jsonCallback: 'getJson',
|
||||
success: function (data) {
|
||||
|
||||
loadGeoJson(data);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
/**/
|
||||
}
|
||||
|
||||
}).call(this);
|
||||
}
|
||||
|
|
@ -1,58 +1,60 @@
|
|||
L.Control.EasyButtons = L.Control.extend({
|
||||
options: {
|
||||
position: 'topleft',
|
||||
title: '',
|
||||
intendedIcon: 'fa-circle-o'
|
||||
},
|
||||
if (typeof L != 'undefined') {
|
||||
L.Control.EasyButtons = L.Control.extend({
|
||||
options: {
|
||||
position: 'topleft',
|
||||
title: '',
|
||||
intendedIcon: 'fa-circle-o'
|
||||
},
|
||||
|
||||
onAdd: function () {
|
||||
var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control');
|
||||
onAdd: function () {
|
||||
var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control');
|
||||
|
||||
this.link = L.DomUtil.create('a', 'leaflet-bar-part', container);
|
||||
this._addImage()
|
||||
this.link.href = '#';
|
||||
this.link = L.DomUtil.create('a', 'leaflet-bar-part', container);
|
||||
this._addImage()
|
||||
this.link.href = '#';
|
||||
|
||||
L.DomEvent.on(this.link, 'click', this._click, this);
|
||||
this.link.title = this.options.title;
|
||||
L.DomEvent.on(this.link, 'click', this._click, this);
|
||||
this.link.title = this.options.title;
|
||||
|
||||
return container;
|
||||
},
|
||||
return container;
|
||||
},
|
||||
|
||||
intendedFunction: function(){ alert('no function selected');},
|
||||
intendedFunction: function(){ alert('no function selected');},
|
||||
|
||||
_click: function (e) {
|
||||
L.DomEvent.stopPropagation(e);
|
||||
L.DomEvent.preventDefault(e);
|
||||
this.intendedFunction();
|
||||
this.link.blur();
|
||||
},
|
||||
_click: function (e) {
|
||||
L.DomEvent.stopPropagation(e);
|
||||
L.DomEvent.preventDefault(e);
|
||||
this.intendedFunction();
|
||||
this.link.blur();
|
||||
},
|
||||
|
||||
_addImage: function () {
|
||||
var extraClasses = this.options.intendedIcon.lastIndexOf('fa', 0) === 0 ? ' fa fa-lg' : ' glyphicon';
|
||||
_addImage: function () {
|
||||
var extraClasses = this.options.intendedIcon.lastIndexOf('fa', 0) === 0 ? ' fa fa-lg' : ' glyphicon';
|
||||
|
||||
var icon = L.DomUtil.create('i', this.options.intendedIcon + extraClasses, this.link);
|
||||
icon.id = this.options.id;
|
||||
var icon = L.DomUtil.create('i', this.options.intendedIcon + extraClasses, this.link);
|
||||
icon.id = this.options.id;
|
||||
}
|
||||
});
|
||||
|
||||
L.easyButton = function( btnIcon , btnFunction , btnTitle , btnMap , btnId) {
|
||||
var newControl = new L.Control.EasyButtons();
|
||||
|
||||
if (btnIcon) newControl.options.intendedIcon = btnIcon;
|
||||
if (btnId) newControl.options.id = btnId;
|
||||
|
||||
if ( typeof btnFunction === 'function'){
|
||||
newControl.intendedFunction = btnFunction;
|
||||
}
|
||||
});
|
||||
|
||||
L.easyButton = function( btnIcon , btnFunction , btnTitle , btnMap , btnId) {
|
||||
var newControl = new L.Control.EasyButtons();
|
||||
if (btnTitle) newControl.options.title = btnTitle;
|
||||
|
||||
if (btnIcon) newControl.options.intendedIcon = btnIcon;
|
||||
if (btnId) newControl.options.id = btnId;
|
||||
|
||||
if ( typeof btnFunction === 'function'){
|
||||
newControl.intendedFunction = btnFunction;
|
||||
}
|
||||
|
||||
if (btnTitle) newControl.options.title = btnTitle;
|
||||
|
||||
if ( btnMap === '' ){
|
||||
// skip auto addition
|
||||
} else if ( btnMap ) {
|
||||
btnMap.addControl(newControl);
|
||||
} else {
|
||||
map.addControl(newControl);
|
||||
}
|
||||
return newControl;
|
||||
};
|
||||
if ( btnMap === '' ){
|
||||
// skip auto addition
|
||||
} else if ( btnMap ) {
|
||||
btnMap.addControl(newControl);
|
||||
} else {
|
||||
map.addControl(newControl);
|
||||
}
|
||||
return newControl;
|
||||
};
|
||||
}
|
||||
|
|
@ -1,444 +1,446 @@
|
|||
L.PhotonBase = L.Class.extend({
|
||||
if (typeof L != 'undefined') {
|
||||
L.PhotonBase = L.Class.extend({
|
||||
|
||||
forEach: function (els, callback) {
|
||||
Array.prototype.forEach.call(els, callback);
|
||||
},
|
||||
forEach: function (els, callback) {
|
||||
Array.prototype.forEach.call(els, callback);
|
||||
},
|
||||
|
||||
ajax: function (callback, thisobj) {
|
||||
if (typeof this.xhr === 'object') {
|
||||
this.xhr.abort();
|
||||
}
|
||||
this.xhr = new XMLHttpRequest();
|
||||
var self = this;
|
||||
this.xhr.open('GET', this.options.url + this.buildQueryString(this.getParams()), true);
|
||||
ajax: function (callback, thisobj) {
|
||||
if (typeof this.xhr === 'object') {
|
||||
this.xhr.abort();
|
||||
}
|
||||
this.xhr = new XMLHttpRequest();
|
||||
var self = this;
|
||||
this.xhr.open('GET', this.options.url + this.buildQueryString(this.getParams()), true);
|
||||
|
||||
this.xhr.onload = function(e) {
|
||||
self.fire('ajax:return');
|
||||
if (this.status === 200) {
|
||||
if (callback) {
|
||||
var raw = this.response;
|
||||
raw = JSON.parse(raw);
|
||||
callback.call(thisobj || this, raw);
|
||||
this.xhr.onload = function(e) {
|
||||
self.fire('ajax:return');
|
||||
if (this.status === 200) {
|
||||
if (callback) {
|
||||
var raw = this.response;
|
||||
raw = JSON.parse(raw);
|
||||
callback.call(thisobj || this, raw);
|
||||
}
|
||||
}
|
||||
delete this.xhr;
|
||||
};
|
||||
|
||||
this.fire('ajax:send');
|
||||
this.xhr.send();
|
||||
},
|
||||
|
||||
buildQueryString: function (params) {
|
||||
var queryString = [];
|
||||
for (var key in params) {
|
||||
if (params[key]) {
|
||||
queryString.push(encodeURIComponent(key) + '=' + encodeURIComponent(params[key]));
|
||||
}
|
||||
}
|
||||
delete this.xhr;
|
||||
};
|
||||
return queryString.join('&');
|
||||
},
|
||||
|
||||
this.fire('ajax:send');
|
||||
this.xhr.send();
|
||||
},
|
||||
|
||||
buildQueryString: function (params) {
|
||||
var queryString = [];
|
||||
for (var key in params) {
|
||||
if (params[key]) {
|
||||
queryString.push(encodeURIComponent(key) + '=' + encodeURIComponent(params[key]));
|
||||
}
|
||||
featureToPopupContent: function (feature) {
|
||||
var container = L.DomUtil.create('div', 'leaflet-photon-popup'),
|
||||
title = L.DomUtil.create('h3', '', container);
|
||||
title.innerHTML = feature.properties.label;
|
||||
return container;
|
||||
}
|
||||
return queryString.join('&');
|
||||
},
|
||||
|
||||
featureToPopupContent: function (feature) {
|
||||
var container = L.DomUtil.create('div', 'leaflet-photon-popup'),
|
||||
title = L.DomUtil.create('h3', '', container);
|
||||
title.innerHTML = feature.properties.label;
|
||||
return container;
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
L.PhotonSearch = L.PhotonBase.extend({
|
||||
L.PhotonSearch = L.PhotonBase.extend({
|
||||
|
||||
includes: L.Mixin.Events,
|
||||
includes: L.Mixin.Events,
|
||||
|
||||
options: {
|
||||
url: 'http://photon.komoot.de/api/?',
|
||||
placeholder: 'Start typing...',
|
||||
minChar: 3,
|
||||
limit: 5,
|
||||
submitDelay: 300,
|
||||
includePosition: true,
|
||||
noResultLabel: 'No result',
|
||||
feedbackEmail: 'photon@komoot.de', // Set to null to remove feedback box
|
||||
feedbackLabel: 'Feedback'
|
||||
},
|
||||
options: {
|
||||
url: 'http://photon.komoot.de/api/?',
|
||||
placeholder: 'Start typing...',
|
||||
minChar: 3,
|
||||
limit: 5,
|
||||
submitDelay: 300,
|
||||
includePosition: true,
|
||||
noResultLabel: 'No result',
|
||||
feedbackEmail: 'photon@komoot.de', // Set to null to remove feedback box
|
||||
feedbackLabel: 'Feedback'
|
||||
},
|
||||
|
||||
CACHE: '',
|
||||
RESULTS: [],
|
||||
KEYS: {
|
||||
LEFT: 37,
|
||||
UP: 38,
|
||||
RIGHT: 39,
|
||||
DOWN: 40,
|
||||
TAB: 9,
|
||||
RETURN: 13,
|
||||
ESC: 27,
|
||||
APPLE: 91,
|
||||
SHIFT: 16,
|
||||
ALT: 17,
|
||||
CTRL: 18
|
||||
},
|
||||
CACHE: '',
|
||||
RESULTS: [],
|
||||
KEYS: {
|
||||
LEFT: 37,
|
||||
UP: 38,
|
||||
RIGHT: 39,
|
||||
DOWN: 40,
|
||||
TAB: 9,
|
||||
RETURN: 13,
|
||||
ESC: 27,
|
||||
APPLE: 91,
|
||||
SHIFT: 16,
|
||||
ALT: 17,
|
||||
CTRL: 18
|
||||
},
|
||||
|
||||
initialize: function (map, input, options) {
|
||||
this.map = map;
|
||||
this.input = input;
|
||||
L.setOptions(this, options);
|
||||
var CURRENT = null;
|
||||
initialize: function (map, input, options) {
|
||||
this.map = map;
|
||||
this.input = input;
|
||||
L.setOptions(this, options);
|
||||
var CURRENT = null;
|
||||
|
||||
try {
|
||||
Object.defineProperty(this, 'CURRENT', {
|
||||
get: function () {
|
||||
return CURRENT;
|
||||
},
|
||||
set: function (index) {
|
||||
if (typeof index === 'object') {
|
||||
index = this.resultToIndex(index);
|
||||
try {
|
||||
Object.defineProperty(this, 'CURRENT', {
|
||||
get: function () {
|
||||
return CURRENT;
|
||||
},
|
||||
set: function (index) {
|
||||
if (typeof index === 'object') {
|
||||
index = this.resultToIndex(index);
|
||||
}
|
||||
CURRENT = index;
|
||||
}
|
||||
CURRENT = index;
|
||||
});
|
||||
} catch (e) {
|
||||
// Hello IE8
|
||||
}
|
||||
this.input.type = 'search';
|
||||
this.input.placeholder = this.options.placeholder;
|
||||
this.input.autocomplete = 'off';
|
||||
this.input.autocorrect = 'off';
|
||||
L.DomEvent.disableClickPropagation(this.input);
|
||||
|
||||
L.DomEvent.on(this.input, 'keydown', this.onKeyDown, this);
|
||||
L.DomEvent.on(this.input, 'input', this.onInput, this);
|
||||
L.DomEvent.on(this.input, 'blur', this.onBlur, this);
|
||||
L.DomEvent.on(this.input, 'focus', this.onFocus, this);
|
||||
this.createResultsContainer();
|
||||
},
|
||||
|
||||
createResultsContainer: function () {
|
||||
this.resultsContainer = L.DomUtil.create('ul', 'photon-autocomplete', document.querySelector('body'));
|
||||
},
|
||||
|
||||
resizeContainer: function()
|
||||
{
|
||||
var l = this.getLeft(this.input);
|
||||
var t = this.getTop(this.input) + this.input.offsetHeight;
|
||||
this.resultsContainer.style.left = l + 'px';
|
||||
this.resultsContainer.style.top = t + 'px';
|
||||
var width = this.options.width ? this.options.width : this.input.offsetWidth - 2;
|
||||
this.resultsContainer.style.width = width + 'px';
|
||||
},
|
||||
|
||||
onKeyDown: function (e) {
|
||||
switch (e.keyCode) {
|
||||
case this.KEYS.TAB:
|
||||
if(this.CURRENT !== null)
|
||||
{
|
||||
this.setChoice();
|
||||
}
|
||||
L.DomEvent.stop(e);
|
||||
break;
|
||||
case this.KEYS.RETURN:
|
||||
L.DomEvent.stop(e);
|
||||
this.setChoice();
|
||||
break;
|
||||
case this.KEYS.ESC:
|
||||
L.DomEvent.stop(e);
|
||||
this.hide();
|
||||
this.input.blur();
|
||||
break;
|
||||
case this.KEYS.DOWN:
|
||||
if(this.RESULTS.length > 0) {
|
||||
if(this.CURRENT !== null && this.CURRENT < this.RESULTS.length - 1) { // what if one resutl?
|
||||
this.CURRENT++;
|
||||
this.highlight();
|
||||
}
|
||||
else if(this.CURRENT === null) {
|
||||
this.CURRENT = 0;
|
||||
this.highlight();
|
||||
}
|
||||
}
|
||||
break;
|
||||
case this.KEYS.UP:
|
||||
if(this.CURRENT !== null) {
|
||||
L.DomEvent.stop(e);
|
||||
}
|
||||
if(this.RESULTS.length > 0) {
|
||||
if(this.CURRENT > 0) {
|
||||
this.CURRENT--;
|
||||
this.highlight();
|
||||
}
|
||||
else if(this.CURRENT === 0) {
|
||||
this.CURRENT = null;
|
||||
this.highlight();
|
||||
}
|
||||
}
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
||||
onInput: function (e) {
|
||||
if (typeof this.submitDelay === 'number') {
|
||||
window.clearTimeout(this.submitDelay);
|
||||
delete this.submitDelay;
|
||||
}
|
||||
this.submitDelay = window.setTimeout(L.Util.bind(this.search, this), this.options.submitDelay);
|
||||
},
|
||||
|
||||
onBlur: function (e) {
|
||||
this.fire('blur');
|
||||
var self = this;
|
||||
setTimeout(function () {
|
||||
self.hide();
|
||||
}, 100);
|
||||
},
|
||||
|
||||
onFocus: function (e) {
|
||||
this.fire('focus');
|
||||
this.input.select();
|
||||
this.search(); // In case we have a value from a previous search.
|
||||
},
|
||||
|
||||
clear: function () {
|
||||
this.RESULTS = [];
|
||||
this.CURRENT = null;
|
||||
this.CACHE = '';
|
||||
this.resultsContainer.innerHTML = '';
|
||||
},
|
||||
|
||||
hide: function() {
|
||||
this.fire('hide');
|
||||
this.clear();
|
||||
this.resultsContainer.style.display = 'none';
|
||||
},
|
||||
|
||||
setChoice: function (choice) {
|
||||
choice = choice || this.RESULTS[this.CURRENT];
|
||||
if (choice) {
|
||||
this.hide();
|
||||
this.fire('selected', {choice: choice.feature});
|
||||
this.onSelected(choice.feature);
|
||||
this.input.value = '';
|
||||
}
|
||||
},
|
||||
|
||||
search: function() {
|
||||
var val = this.input.value;
|
||||
var minChar = typeof this.options.minChar === 'function' ? this.options.minChar(val) : val.length >= this.options.minChar;
|
||||
if (!val || !minChar) return this.clear();
|
||||
if(val + '' === this.CACHE + '') return;
|
||||
else this.CACHE = val;
|
||||
this._doSearch();
|
||||
},
|
||||
|
||||
_doSearch: function () {
|
||||
this.ajax(this.handleResults, this);
|
||||
},
|
||||
|
||||
_onSelected: function (feature) {
|
||||
this.map.setView([feature.geometry.coordinates[1], feature.geometry.coordinates[0]], 16);
|
||||
},
|
||||
|
||||
onSelected: function (choice) {
|
||||
return (this.options.onSelected || this._onSelected).call(this, choice);
|
||||
},
|
||||
|
||||
_formatResult: function (feature, el) {
|
||||
var title = L.DomUtil.create('strong', '', el),
|
||||
detailsContainer = L.DomUtil.create('small', '', el),
|
||||
details = [],
|
||||
type = this.formatType(feature);
|
||||
title.innerHTML = feature.properties.name;
|
||||
if (type) details.push(type);
|
||||
if (feature.properties.city && feature.properties.city !== feature.properties.name) {
|
||||
details.push(feature.properties.city);
|
||||
}
|
||||
if (feature.properties.country) details.push(feature.properties.country);
|
||||
detailsContainer.innerHTML = details.join(', ');
|
||||
},
|
||||
|
||||
formatResult: function (feature, el) {
|
||||
return (this.options.formatResult || this._formatResult).call(this, feature, el);
|
||||
},
|
||||
|
||||
formatType: function (feature) {
|
||||
return (this.options.formatType || this._formatType).call(this, feature);
|
||||
},
|
||||
|
||||
_formatType: function (feature) {
|
||||
return feature.properties.osm_value;
|
||||
},
|
||||
|
||||
createResult: function (feature) {
|
||||
var el = L.DomUtil.create('li', '', this.resultsContainer);
|
||||
this.formatResult(feature, el);
|
||||
var result = {
|
||||
feature: feature,
|
||||
el: el
|
||||
};
|
||||
// Touch handling needed
|
||||
L.DomEvent.on(el, 'mouseover', function (e) {
|
||||
this.CURRENT = result;
|
||||
this.highlight();
|
||||
}, this);
|
||||
L.DomEvent.on(el, 'mousedown', function (e) {
|
||||
this.setChoice();
|
||||
}, this);
|
||||
return result;
|
||||
},
|
||||
|
||||
resultToIndex: function (result) {
|
||||
var out = null;
|
||||
this.forEach(this.RESULTS, function (item, index) {
|
||||
if (item === result) {
|
||||
out = index;
|
||||
return;
|
||||
}
|
||||
});
|
||||
} catch (e) {
|
||||
// Hello IE8
|
||||
}
|
||||
this.input.type = 'search';
|
||||
this.input.placeholder = this.options.placeholder;
|
||||
this.input.autocomplete = 'off';
|
||||
this.input.autocorrect = 'off';
|
||||
L.DomEvent.disableClickPropagation(this.input);
|
||||
return out;
|
||||
},
|
||||
|
||||
L.DomEvent.on(this.input, 'keydown', this.onKeyDown, this);
|
||||
L.DomEvent.on(this.input, 'input', this.onInput, this);
|
||||
L.DomEvent.on(this.input, 'blur', this.onBlur, this);
|
||||
L.DomEvent.on(this.input, 'focus', this.onFocus, this);
|
||||
this.createResultsContainer();
|
||||
},
|
||||
|
||||
createResultsContainer: function () {
|
||||
this.resultsContainer = L.DomUtil.create('ul', 'photon-autocomplete', document.querySelector('body'));
|
||||
},
|
||||
|
||||
resizeContainer: function()
|
||||
{
|
||||
var l = this.getLeft(this.input);
|
||||
var t = this.getTop(this.input) + this.input.offsetHeight;
|
||||
this.resultsContainer.style.left = l + 'px';
|
||||
this.resultsContainer.style.top = t + 'px';
|
||||
var width = this.options.width ? this.options.width : this.input.offsetWidth - 2;
|
||||
this.resultsContainer.style.width = width + 'px';
|
||||
},
|
||||
|
||||
onKeyDown: function (e) {
|
||||
switch (e.keyCode) {
|
||||
case this.KEYS.TAB:
|
||||
if(this.CURRENT !== null)
|
||||
{
|
||||
this.setChoice();
|
||||
}
|
||||
L.DomEvent.stop(e);
|
||||
break;
|
||||
case this.KEYS.RETURN:
|
||||
L.DomEvent.stop(e);
|
||||
this.setChoice();
|
||||
break;
|
||||
case this.KEYS.ESC:
|
||||
L.DomEvent.stop(e);
|
||||
this.hide();
|
||||
this.input.blur();
|
||||
break;
|
||||
case this.KEYS.DOWN:
|
||||
if(this.RESULTS.length > 0) {
|
||||
if(this.CURRENT !== null && this.CURRENT < this.RESULTS.length - 1) { // what if one resutl?
|
||||
this.CURRENT++;
|
||||
this.highlight();
|
||||
}
|
||||
else if(this.CURRENT === null) {
|
||||
this.CURRENT = 0;
|
||||
this.highlight();
|
||||
}
|
||||
}
|
||||
break;
|
||||
case this.KEYS.UP:
|
||||
if(this.CURRENT !== null) {
|
||||
L.DomEvent.stop(e);
|
||||
}
|
||||
if(this.RESULTS.length > 0) {
|
||||
if(this.CURRENT > 0) {
|
||||
this.CURRENT--;
|
||||
this.highlight();
|
||||
}
|
||||
else if(this.CURRENT === 0) {
|
||||
this.CURRENT = null;
|
||||
this.highlight();
|
||||
}
|
||||
}
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
||||
onInput: function (e) {
|
||||
if (typeof this.submitDelay === 'number') {
|
||||
window.clearTimeout(this.submitDelay);
|
||||
delete this.submitDelay;
|
||||
}
|
||||
this.submitDelay = window.setTimeout(L.Util.bind(this.search, this), this.options.submitDelay);
|
||||
},
|
||||
|
||||
onBlur: function (e) {
|
||||
this.fire('blur');
|
||||
var self = this;
|
||||
setTimeout(function () {
|
||||
self.hide();
|
||||
}, 100);
|
||||
},
|
||||
|
||||
onFocus: function (e) {
|
||||
this.fire('focus');
|
||||
this.input.select();
|
||||
this.search(); // In case we have a value from a previous search.
|
||||
},
|
||||
|
||||
clear: function () {
|
||||
this.RESULTS = [];
|
||||
this.CURRENT = null;
|
||||
this.CACHE = '';
|
||||
this.resultsContainer.innerHTML = '';
|
||||
},
|
||||
|
||||
hide: function() {
|
||||
this.fire('hide');
|
||||
this.clear();
|
||||
this.resultsContainer.style.display = 'none';
|
||||
},
|
||||
|
||||
setChoice: function (choice) {
|
||||
choice = choice || this.RESULTS[this.CURRENT];
|
||||
if (choice) {
|
||||
this.hide();
|
||||
this.fire('selected', {choice: choice.feature});
|
||||
this.onSelected(choice.feature);
|
||||
this.input.value = '';
|
||||
}
|
||||
},
|
||||
|
||||
search: function() {
|
||||
var val = this.input.value;
|
||||
var minChar = typeof this.options.minChar === 'function' ? this.options.minChar(val) : val.length >= this.options.minChar;
|
||||
if (!val || !minChar) return this.clear();
|
||||
if(val + '' === this.CACHE + '') return;
|
||||
else this.CACHE = val;
|
||||
this._doSearch();
|
||||
},
|
||||
|
||||
_doSearch: function () {
|
||||
this.ajax(this.handleResults, this);
|
||||
},
|
||||
|
||||
_onSelected: function (feature) {
|
||||
this.map.setView([feature.geometry.coordinates[1], feature.geometry.coordinates[0]], 16);
|
||||
},
|
||||
|
||||
onSelected: function (choice) {
|
||||
return (this.options.onSelected || this._onSelected).call(this, choice);
|
||||
},
|
||||
|
||||
_formatResult: function (feature, el) {
|
||||
var title = L.DomUtil.create('strong', '', el),
|
||||
detailsContainer = L.DomUtil.create('small', '', el),
|
||||
details = [],
|
||||
type = this.formatType(feature);
|
||||
title.innerHTML = feature.properties.name;
|
||||
if (type) details.push(type);
|
||||
if (feature.properties.city && feature.properties.city !== feature.properties.name) {
|
||||
details.push(feature.properties.city);
|
||||
}
|
||||
if (feature.properties.country) details.push(feature.properties.country);
|
||||
detailsContainer.innerHTML = details.join(', ');
|
||||
},
|
||||
|
||||
formatResult: function (feature, el) {
|
||||
return (this.options.formatResult || this._formatResult).call(this, feature, el);
|
||||
},
|
||||
|
||||
formatType: function (feature) {
|
||||
return (this.options.formatType || this._formatType).call(this, feature);
|
||||
},
|
||||
|
||||
_formatType: function (feature) {
|
||||
return feature.properties.osm_value;
|
||||
},
|
||||
|
||||
createResult: function (feature) {
|
||||
var el = L.DomUtil.create('li', '', this.resultsContainer);
|
||||
this.formatResult(feature, el);
|
||||
var result = {
|
||||
feature: feature,
|
||||
el: el
|
||||
};
|
||||
// Touch handling needed
|
||||
L.DomEvent.on(el, 'mouseover', function (e) {
|
||||
this.CURRENT = result;
|
||||
handleResults: function(geojson) {
|
||||
var self = this;
|
||||
this.clear();
|
||||
this.resultsContainer.style.display = 'block';
|
||||
this.resizeContainer();
|
||||
this.forEach(geojson.features, function (feature) {
|
||||
self.RESULTS.push(self.createResult(feature));
|
||||
});
|
||||
if (geojson.features.length === 0) {
|
||||
var noresult = L.DomUtil.create('li', 'photon-no-result', this.resultsContainer);
|
||||
noresult.innerHTML = this.options.noResultLabel;
|
||||
}
|
||||
if (this.options.feedbackEmail) {
|
||||
var feedback = L.DomUtil.create('a', 'photon-feedback', this.resultsContainer);
|
||||
feedback.href = 'mailto:' + this.options.feedbackEmail;
|
||||
feedback.innerHTML = this.options.feedbackLabel;
|
||||
}
|
||||
this.CURRENT = 0;
|
||||
this.highlight();
|
||||
}, this);
|
||||
L.DomEvent.on(el, 'mousedown', function (e) {
|
||||
this.setChoice();
|
||||
}, this);
|
||||
return result;
|
||||
},
|
||||
|
||||
resultToIndex: function (result) {
|
||||
var out = null;
|
||||
this.forEach(this.RESULTS, function (item, index) {
|
||||
if (item === result) {
|
||||
out = index;
|
||||
return;
|
||||
if (this.options.resultsHandler) {
|
||||
this.options.resultsHandler(geojson);
|
||||
}
|
||||
});
|
||||
return out;
|
||||
},
|
||||
},
|
||||
|
||||
handleResults: function(geojson) {
|
||||
var self = this;
|
||||
this.clear();
|
||||
this.resultsContainer.style.display = 'block';
|
||||
this.resizeContainer();
|
||||
this.forEach(geojson.features, function (feature) {
|
||||
self.RESULTS.push(self.createResult(feature));
|
||||
});
|
||||
if (geojson.features.length === 0) {
|
||||
var noresult = L.DomUtil.create('li', 'photon-no-result', this.resultsContainer);
|
||||
noresult.innerHTML = this.options.noResultLabel;
|
||||
}
|
||||
if (this.options.feedbackEmail) {
|
||||
var feedback = L.DomUtil.create('a', 'photon-feedback', this.resultsContainer);
|
||||
feedback.href = 'mailto:' + this.options.feedbackEmail;
|
||||
feedback.innerHTML = this.options.feedbackLabel;
|
||||
}
|
||||
this.CURRENT = 0;
|
||||
this.highlight();
|
||||
if (this.options.resultsHandler) {
|
||||
this.options.resultsHandler(geojson);
|
||||
}
|
||||
},
|
||||
highlight: function () {
|
||||
var self = this;
|
||||
this.forEach(this.RESULTS, function (item, index) {
|
||||
if (index === self.CURRENT) {
|
||||
L.DomUtil.addClass(item.el, 'on');
|
||||
}
|
||||
else {
|
||||
L.DomUtil.removeClass(item.el, 'on');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
highlight: function () {
|
||||
var self = this;
|
||||
this.forEach(this.RESULTS, function (item, index) {
|
||||
if (index === self.CURRENT) {
|
||||
L.DomUtil.addClass(item.el, 'on');
|
||||
}
|
||||
else {
|
||||
L.DomUtil.removeClass(item.el, 'on');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
getLeft: function (el) {
|
||||
var tmp = el.offsetLeft;
|
||||
el = el.offsetParent;
|
||||
while(el) {
|
||||
tmp += el.offsetLeft;
|
||||
getLeft: function (el) {
|
||||
var tmp = el.offsetLeft;
|
||||
el = el.offsetParent;
|
||||
}
|
||||
return tmp;
|
||||
},
|
||||
while(el) {
|
||||
tmp += el.offsetLeft;
|
||||
el = el.offsetParent;
|
||||
}
|
||||
return tmp;
|
||||
},
|
||||
|
||||
getTop: function (el) {
|
||||
var tmp = el.offsetTop;
|
||||
el = el.offsetParent;
|
||||
while(el) {
|
||||
tmp += el.offsetTop;
|
||||
getTop: function (el) {
|
||||
var tmp = el.offsetTop;
|
||||
el = el.offsetParent;
|
||||
while(el) {
|
||||
tmp += el.offsetTop;
|
||||
el = el.offsetParent;
|
||||
}
|
||||
return tmp;
|
||||
},
|
||||
|
||||
getParams: function () {
|
||||
return {
|
||||
q: this.CACHE,
|
||||
lang: this.options.lang,
|
||||
limit: this.options.limit,
|
||||
lat: this.options.includePosition ? this.map.getCenter().lat : null,
|
||||
lon: this.options.includePosition ? this.map.getCenter().lng : null
|
||||
};
|
||||
}
|
||||
return tmp;
|
||||
},
|
||||
|
||||
getParams: function () {
|
||||
return {
|
||||
q: this.CACHE,
|
||||
lang: this.options.lang,
|
||||
limit: this.options.limit,
|
||||
lat: this.options.includePosition ? this.map.getCenter().lat : null,
|
||||
lon: this.options.includePosition ? this.map.getCenter().lng : null
|
||||
};
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
L.Control.Photon = L.Control.extend({
|
||||
L.Control.Photon = L.Control.extend({
|
||||
|
||||
includes: L.Mixin.Events,
|
||||
includes: L.Mixin.Events,
|
||||
|
||||
onAdd: function (map, options) {
|
||||
this.map = map;
|
||||
this.container = L.DomUtil.create('div', 'leaflet-photon');
|
||||
onAdd: function (map, options) {
|
||||
this.map = map;
|
||||
this.container = L.DomUtil.create('div', 'leaflet-photon');
|
||||
|
||||
this.options = L.Util.extend(this.options, options);
|
||||
this.options = L.Util.extend(this.options, options);
|
||||
|
||||
this.input = L.DomUtil.create('input', 'photon-input', this.container);
|
||||
this.search = new L.PhotonSearch(map, this.input, this.options);
|
||||
this.search.on('blur', this.forwardEvent, this);
|
||||
this.search.on('focus', this.forwardEvent, this);
|
||||
this.search.on('hide', this.forwardEvent, this);
|
||||
this.search.on('selected', this.forwardEvent, this);
|
||||
this.search.on('ajax:send', this.forwardEvent, this);
|
||||
this.search.on('ajax:return', this.forwardEvent, this);
|
||||
return this.container;
|
||||
},
|
||||
this.input = L.DomUtil.create('input', 'photon-input', this.container);
|
||||
this.search = new L.PhotonSearch(map, this.input, this.options);
|
||||
this.search.on('blur', this.forwardEvent, this);
|
||||
this.search.on('focus', this.forwardEvent, this);
|
||||
this.search.on('hide', this.forwardEvent, this);
|
||||
this.search.on('selected', this.forwardEvent, this);
|
||||
this.search.on('ajax:send', this.forwardEvent, this);
|
||||
this.search.on('ajax:return', this.forwardEvent, this);
|
||||
return this.container;
|
||||
},
|
||||
|
||||
forwardEvent: function (e) {
|
||||
this.fire(e.type, e);
|
||||
}
|
||||
forwardEvent: function (e) {
|
||||
this.fire(e.type, e);
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
L.Map.addInitHook(function () {
|
||||
if (this.options.photonControl) {
|
||||
this.photonControl = new L.Control.Photon(this.options.photonControlOptions || {});
|
||||
this.addControl(this.photonControl);
|
||||
}
|
||||
});
|
||||
L.Map.addInitHook(function () {
|
||||
if (this.options.photonControl) {
|
||||
this.photonControl = new L.Control.Photon(this.options.photonControlOptions || {});
|
||||
this.addControl(this.photonControl);
|
||||
}
|
||||
});
|
||||
|
||||
L.PhotonReverse = L.PhotonBase.extend({
|
||||
L.PhotonReverse = L.PhotonBase.extend({
|
||||
|
||||
includes: L.Mixin.Events,
|
||||
includes: L.Mixin.Events,
|
||||
|
||||
options: {
|
||||
url: 'http://photon.komoot.de/reverse/?',
|
||||
limit: 1,
|
||||
handleResults: null
|
||||
},
|
||||
options: {
|
||||
url: 'http://photon.komoot.de/reverse/?',
|
||||
limit: 1,
|
||||
handleResults: null
|
||||
},
|
||||
|
||||
initialize: function (options) {
|
||||
L.setOptions(this, options);
|
||||
},
|
||||
initialize: function (options) {
|
||||
L.setOptions(this, options);
|
||||
},
|
||||
|
||||
doReverse: function (latlng) {
|
||||
latlng = L.latLng(latlng);
|
||||
this.fire('reverse', {latlng: latlng});
|
||||
this.latlng = latlng;
|
||||
this.ajax(this.handleResults, this);
|
||||
},
|
||||
doReverse: function (latlng) {
|
||||
latlng = L.latLng(latlng);
|
||||
this.fire('reverse', {latlng: latlng});
|
||||
this.latlng = latlng;
|
||||
this.ajax(this.handleResults, this);
|
||||
},
|
||||
|
||||
_handleResults: function (data) {
|
||||
/*eslint-disable no-console */
|
||||
console.log(data);
|
||||
/*eslint-enable no-alert */
|
||||
},
|
||||
_handleResults: function (data) {
|
||||
/*eslint-disable no-console */
|
||||
console.log(data);
|
||||
/*eslint-enable no-alert */
|
||||
},
|
||||
|
||||
handleResults: function (data) {
|
||||
return (this.options.handleResults || this._handleResults).call(this, data);
|
||||
},
|
||||
handleResults: function (data) {
|
||||
return (this.options.handleResults || this._handleResults).call(this, data);
|
||||
},
|
||||
|
||||
getParams: function () {
|
||||
return {
|
||||
lang: this.options.lang,
|
||||
limit: this.options.limit,
|
||||
lat: this.latlng.lat,
|
||||
lon: this.latlng.lng
|
||||
};
|
||||
}
|
||||
getParams: function () {
|
||||
return {
|
||||
lang: this.options.lang,
|
||||
limit: this.options.limit,
|
||||
lat: this.latlng.lat,
|
||||
lon: this.latlng.lng
|
||||
};
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
@ -1,41 +1,43 @@
|
|||
L.SpinMapMixin = {
|
||||
spin: function (state, options) {
|
||||
if (!!state) {
|
||||
// start spinning !
|
||||
if (!this._spinner) {
|
||||
this._spinner = new Spinner(options).spin(this._container);
|
||||
this._spinning = 0;
|
||||
if (typeof L != 'undefined') {
|
||||
L.SpinMapMixin = {
|
||||
spin: function (state, options) {
|
||||
if (!!state) {
|
||||
// start spinning !
|
||||
if (!this._spinner) {
|
||||
this._spinner = new Spinner(options).spin(this._container);
|
||||
this._spinning = 0;
|
||||
}
|
||||
this._spinning++;
|
||||
}
|
||||
this._spinning++;
|
||||
}
|
||||
else {
|
||||
this._spinning--;
|
||||
if (this._spinning <= 0) {
|
||||
// end spinning !
|
||||
if (this._spinner) {
|
||||
this._spinner.stop();
|
||||
this._spinner = null;
|
||||
else {
|
||||
this._spinning--;
|
||||
if (this._spinning <= 0) {
|
||||
// end spinning !
|
||||
if (this._spinner) {
|
||||
this._spinner.stop();
|
||||
this._spinner = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
L.Map.include(L.SpinMapMixin);
|
||||
L.Map.include(L.SpinMapMixin);
|
||||
|
||||
L.Map.addInitHook(function () {
|
||||
this.on('layeradd', function (e) {
|
||||
// If added layer is currently loading, spin !
|
||||
if (e.layer.loading) this.spin(true);
|
||||
if (typeof e.layer.on != 'function') return;
|
||||
e.layer.on('data:loading', function () { this.spin(true); }, this);
|
||||
e.layer.on('data:loaded', function () { this.spin(false); }, this);
|
||||
}, this);
|
||||
this.on('layerremove', function (e) {
|
||||
// Clean-up
|
||||
if (e.layer.loading) this.spin(false);
|
||||
if (typeof e.layer.on != 'function') return;
|
||||
e.layer.off('data:loaded');
|
||||
e.layer.off('data:loading');
|
||||
}, this);
|
||||
});
|
||||
L.Map.addInitHook(function () {
|
||||
this.on('layeradd', function (e) {
|
||||
// If added layer is currently loading, spin !
|
||||
if (e.layer.loading) this.spin(true);
|
||||
if (typeof e.layer.on != 'function') return;
|
||||
e.layer.on('data:loading', function () { this.spin(true); }, this);
|
||||
e.layer.on('data:loaded', function () { this.spin(false); }, this);
|
||||
}, this);
|
||||
this.on('layerremove', function (e) {
|
||||
// Clean-up
|
||||
if (e.layer.loading) this.spin(false);
|
||||
if (typeof e.layer.on != 'function') return;
|
||||
e.layer.off('data:loaded');
|
||||
e.layer.off('data:loading');
|
||||
}, this);
|
||||
});
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,266 +1,269 @@
|
|||
(function () {
|
||||
API_URL = '//api-adresse.data.gouv.fr';
|
||||
if (typeof L != 'undefined') {
|
||||
(function () {
|
||||
|
||||
var showSearchPoints = function (geojson) {
|
||||
console.log(geojson);
|
||||
};
|
||||
var SHORT_CITY_NAMES = ['y', 'ay', 'bu', 'by', 'eu', 'fa', 'gy', 'oo', 'oz', 'py', 'ri', 'ry', 'sy', 'ur', 'us', 'uz'];
|
||||
var photonControlOptions = {
|
||||
resultsHandler: showSearchPoints,
|
||||
position: 'topleft',
|
||||
url: API_URL + '/search/?',
|
||||
placeholder: 'Entrer une adresse',
|
||||
minChar: function (val) {
|
||||
return SHORT_CITY_NAMES.indexOf(val) !== -1 || val.length >= 3;
|
||||
},
|
||||
submitDelay: 200
|
||||
};
|
||||
var LeafIcon, OSM, baseMap, cad, cadWmtsUrl, drawControl, drawnItems, greenIcon, ignApiKey, layers, map, mapId, onEachFeature, onMapClick, onZoom, ortho, overlayMaps, scan25, scan25url, scanWmtsUrl;
|
||||
L.drawLocal.draw.toolbar.buttons.polygon = 'Dessiner un polygone';
|
||||
L.drawLocal.draw.toolbar.actions.title = "Annule le dessin en cours";
|
||||
L.drawLocal.draw.toolbar.actions.text = "Annuler";
|
||||
L.drawLocal.draw.toolbar.undo.text = "Supprimer le dernier point";
|
||||
L.drawLocal.draw.toolbar.undo.title = "Supprime le dernier point dessiné";
|
||||
L.drawLocal.draw.handlers.polygon.tooltip.start = "Cliquer pour commencer le dessin";
|
||||
L.drawLocal.draw.handlers.polygon.tooltip.cont = "Cliquer pour continuer le dessin";
|
||||
L.drawLocal.draw.handlers.polygon.tooltip.end = "Cliquer sur le premier point pour finaliser votre dessin";
|
||||
L.drawLocal.edit.toolbar.actions.save.title = "Valide les modifications";
|
||||
L.drawLocal.edit.toolbar.actions.save.text = "Valider les modifications";
|
||||
L.drawLocal.edit.toolbar.actions.cancel.title = "Annule les modifications";
|
||||
L.drawLocal.edit.toolbar.actions.cancel.text = "Annuler les modifications";
|
||||
L.drawLocal.edit.handlers.edit.tooltip.text = "Déplacer les points pour éditer le dessin";
|
||||
L.drawLocal.edit.handlers.edit.tooltip.subtext = "Cliquer sur 'annuler' pour annuler les changements";
|
||||
L.drawLocal.edit.toolbar.buttons.edit = "Édition du dessin";
|
||||
L.drawLocal.edit.toolbar.buttons.editDisabled = "Aucun dessin à éditer";
|
||||
L.drawLocal.edit.toolbar.buttons.removeDisabled = "Aucun dessin à supprimer";
|
||||
L.drawLocal.edit.toolbar.buttons.remove = "Supprimer le dessin";
|
||||
L.drawLocal.edit.handlers.remove.tooltip.text = "Cliquer sur le dessin pour le supprimer";
|
||||
L.drawLocal.edit.handlers.remove.tooltip.subtext = "Cliquer sur 'annuler' pour annuler la suppression";
|
||||
mapId = "map_qp";
|
||||
layers = new Array;
|
||||
API_URL = '//api-adresse.data.gouv.fr';
|
||||
|
||||
window.featureCollection = new Object()
|
||||
window.featureCollection.type = 'FeatureCollection';
|
||||
window.featureCollection.features = new Array();
|
||||
OSM = L.tileLayer("http://{s}.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png", {
|
||||
attribution: '© Openstreetmap France | © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
|
||||
});
|
||||
|
||||
position = get_position();
|
||||
position_zoom = 13;
|
||||
|
||||
if (position.lat == '0' && position.lon == '0'){
|
||||
position.lon = '2.428462';
|
||||
position.lat = '46.538192';
|
||||
position_zoom = 6;
|
||||
}
|
||||
|
||||
map = L.map(mapId, {
|
||||
center: new L.LatLng(position.lat, position.lon),
|
||||
zoom: position_zoom,
|
||||
layers: [OSM],
|
||||
photonControl: true,
|
||||
photonControlOptions: photonControlOptions,
|
||||
photonReverseControl: true
|
||||
});
|
||||
var info = L.control();
|
||||
// method that we will use to update the control based on feature properties passed
|
||||
info.update = function (props) {
|
||||
this._div.innerHTML = '<h4>Quartier prioritaire</h4>' + (props ?
|
||||
'<b>' + props.nom_qp + '</b><br />' + props.commune_qp
|
||||
: 'survolez un quartier prioritaire');
|
||||
};
|
||||
info.onAdd = function (map) {
|
||||
this._div = L.DomUtil.create('div', 'info'); // create a div with a class "info"
|
||||
this.update();
|
||||
return this._div;
|
||||
};
|
||||
info.addTo(map);
|
||||
|
||||
window.map = map;
|
||||
baseMap = {
|
||||
"OpenStreetMap": OSM
|
||||
};
|
||||
|
||||
//L.control.layers(baseMap).addTo(map);
|
||||
LeafIcon = L.Icon.extend({
|
||||
options: {
|
||||
shadowUrl: "http://leafletjs.com/docs/images/leaf-shadow.png",
|
||||
iconSize: [38, 95],
|
||||
shadowSize: [50, 64],
|
||||
iconAnchor: [22, 94],
|
||||
shadowAnchor: [4, 62],
|
||||
popupAnchor: [-3, -76]
|
||||
}
|
||||
});
|
||||
greenIcon = new LeafIcon({
|
||||
iconUrl: "http://leafletjs.com/docs/images/leaf-green.png"
|
||||
});
|
||||
drawnItems = new L.FeatureGroup();
|
||||
map.addLayer(drawnItems);
|
||||
|
||||
drawControl = new L.Control.Draw({
|
||||
position: "topright",
|
||||
draw: {
|
||||
polygon: {
|
||||
shapeOptions: {
|
||||
color: "purple"
|
||||
},
|
||||
allowIntersection: false,
|
||||
drawError: {
|
||||
color: "orange",
|
||||
timeout: 1000
|
||||
},
|
||||
showArea: false,
|
||||
metric: true,
|
||||
repeatMode: false
|
||||
var showSearchPoints = function (geojson) {
|
||||
console.log(geojson);
|
||||
};
|
||||
var SHORT_CITY_NAMES = ['y', 'ay', 'bu', 'by', 'eu', 'fa', 'gy', 'oo', 'oz', 'py', 'ri', 'ry', 'sy', 'ur', 'us', 'uz'];
|
||||
var photonControlOptions = {
|
||||
resultsHandler: showSearchPoints,
|
||||
position: 'topleft',
|
||||
url: API_URL + '/search/?',
|
||||
placeholder: 'Entrer une adresse',
|
||||
minChar: function (val) {
|
||||
return SHORT_CITY_NAMES.indexOf(val) !== -1 || val.length >= 3;
|
||||
},
|
||||
marker: false,
|
||||
polyline: false,
|
||||
rectangle: false,
|
||||
circle: false
|
||||
},
|
||||
edit: {
|
||||
featureGroup: drawnItems
|
||||
}
|
||||
});
|
||||
map.addControl(drawControl);
|
||||
L.control.scale({
|
||||
imperial: false
|
||||
}).addTo(map);
|
||||
map.on("draw:created", function (e) {
|
||||
var layer;
|
||||
layer = e.layer;
|
||||
drawnItems.addLayer(layer);
|
||||
console.log(layer);
|
||||
window.featureCollection.features.push(layer.toGeoJSON());
|
||||
get_ref_dossier ();
|
||||
/**
|
||||
$.ajax({
|
||||
url: 'http://apicarto.coremaps.com//zoneville/api/v1/qp',
|
||||
datatype: 'json',
|
||||
method: 'POST',
|
||||
data: {geom:layer.toGeoJSON()},
|
||||
jsonCallback: 'getJson',
|
||||
success: function (data){
|
||||
var qp_supp = "";
|
||||
feature = layer.toGeoJSON()
|
||||
feature.properties = data;
|
||||
for (i = 0; i < data.length; i++){
|
||||
qp_supp += "<br><span>Quartier(s) prioritaire(s) : " + data[i].code_qp+ " - " +data[i].nom_qp;
|
||||
}
|
||||
$("#selection_qp").append("<span>Dessin personnalisé</span><br>"+qp_supp +'<br>');
|
||||
}
|
||||
});**/
|
||||
});
|
||||
map.spin(true);
|
||||
$.ajax({
|
||||
url: 'http://apicarto.coremaps.com/zoneville/api/beta/qp/mapservice',
|
||||
datatype: 'json',
|
||||
jsonCallback: 'getJson',
|
||||
success: loadGeoJson
|
||||
});
|
||||
window.geom_inter = {index: []};
|
||||
|
||||
function style(feature) {
|
||||
return {
|
||||
fillColor: '#FC4E2A',
|
||||
weight: 1,
|
||||
opacity: 1,
|
||||
color: 'white',
|
||||
dashArray: '0',
|
||||
fillOpacity: 0.6
|
||||
submitDelay: 200
|
||||
};
|
||||
}
|
||||
var LeafIcon, OSM, baseMap, cad, cadWmtsUrl, drawControl, drawnItems, greenIcon, ignApiKey, layers, map, mapId, onEachFeature, onMapClick, onZoom, ortho, overlayMaps, scan25, scan25url, scanWmtsUrl;
|
||||
L.drawLocal.draw.toolbar.buttons.polygon = 'Dessiner un polygone';
|
||||
L.drawLocal.draw.toolbar.actions.title = "Annule le dessin en cours";
|
||||
L.drawLocal.draw.toolbar.actions.text = "Annuler";
|
||||
L.drawLocal.draw.toolbar.undo.text = "Supprimer le dernier point";
|
||||
L.drawLocal.draw.toolbar.undo.title = "Supprime le dernier point dessiné";
|
||||
L.drawLocal.draw.handlers.polygon.tooltip.start = "Cliquer pour commencer le dessin";
|
||||
L.drawLocal.draw.handlers.polygon.tooltip.cont = "Cliquer pour continuer le dessin";
|
||||
L.drawLocal.draw.handlers.polygon.tooltip.end = "Cliquer sur le premier point pour finaliser votre dessin";
|
||||
L.drawLocal.edit.toolbar.actions.save.title = "Valide les modifications";
|
||||
L.drawLocal.edit.toolbar.actions.save.text = "Valider les modifications";
|
||||
L.drawLocal.edit.toolbar.actions.cancel.title = "Annule les modifications";
|
||||
L.drawLocal.edit.toolbar.actions.cancel.text = "Annuler les modifications";
|
||||
L.drawLocal.edit.handlers.edit.tooltip.text = "Déplacer les points pour éditer le dessin";
|
||||
L.drawLocal.edit.handlers.edit.tooltip.subtext = "Cliquer sur 'annuler' pour annuler les changements";
|
||||
L.drawLocal.edit.toolbar.buttons.edit = "Édition du dessin";
|
||||
L.drawLocal.edit.toolbar.buttons.editDisabled = "Aucun dessin à éditer";
|
||||
L.drawLocal.edit.toolbar.buttons.removeDisabled = "Aucun dessin à supprimer";
|
||||
L.drawLocal.edit.toolbar.buttons.remove = "Supprimer le dessin";
|
||||
L.drawLocal.edit.handlers.remove.tooltip.text = "Cliquer sur le dessin pour le supprimer";
|
||||
L.drawLocal.edit.handlers.remove.tooltip.subtext = "Cliquer sur 'annuler' pour annuler la suppression";
|
||||
mapId = "map_qp";
|
||||
layers = new Array;
|
||||
|
||||
function select_style(feature) {
|
||||
return {
|
||||
fillColor: '#1E4E2E',
|
||||
weight: 1,
|
||||
opacity: 1,
|
||||
color: 'white',
|
||||
dashArray: '0',
|
||||
fillOpacity: 0.6
|
||||
window.featureCollection = new Object()
|
||||
window.featureCollection.type = 'FeatureCollection';
|
||||
window.featureCollection.features = new Array();
|
||||
OSM = L.tileLayer("http://{s}.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png", {
|
||||
attribution: '© Openstreetmap France | © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
|
||||
});
|
||||
|
||||
position = get_position();
|
||||
position_zoom = 13;
|
||||
|
||||
if (position.lat == '0' && position.lon == '0'){
|
||||
position.lon = '2.428462';
|
||||
position.lat = '46.538192';
|
||||
position_zoom = 6;
|
||||
}
|
||||
|
||||
map = L.map(mapId, {
|
||||
center: new L.LatLng(position.lat, position.lon),
|
||||
zoom: position_zoom,
|
||||
layers: [OSM],
|
||||
photonControl: true,
|
||||
photonControlOptions: photonControlOptions,
|
||||
photonReverseControl: true
|
||||
});
|
||||
var info = L.control();
|
||||
// method that we will use to update the control based on feature properties passed
|
||||
info.update = function (props) {
|
||||
this._div.innerHTML = '<h4>Quartier prioritaire</h4>' + (props ?
|
||||
'<b>' + props.nom_qp + '</b><br />' + props.commune_qp
|
||||
: 'survolez un quartier prioritaire');
|
||||
};
|
||||
}
|
||||
info.onAdd = function (map) {
|
||||
this._div = L.DomUtil.create('div', 'info'); // create a div with a class "info"
|
||||
this.update();
|
||||
return this._div;
|
||||
};
|
||||
info.addTo(map);
|
||||
|
||||
function onEachFeature(feature, layer) {
|
||||
var anchor = $(location).attr('hash').substring(1);
|
||||
if (anchor != "") {
|
||||
var qp_select = JSON.parse(anchor);
|
||||
if (qp_select.qp.indexOf(feature.properties.code_qp) > -1) {
|
||||
window.geom_inter.index.push(feature.properties.code_qp);
|
||||
window.featureCollection.features.push(feature);
|
||||
layer.setStyle(select_style());
|
||||
map.fitBounds(layer.getBounds());
|
||||
window.map = map;
|
||||
baseMap = {
|
||||
"OpenStreetMap": OSM
|
||||
};
|
||||
|
||||
//L.control.layers(baseMap).addTo(map);
|
||||
LeafIcon = L.Icon.extend({
|
||||
options: {
|
||||
shadowUrl: "http://leafletjs.com/docs/images/leaf-shadow.png",
|
||||
iconSize: [38, 95],
|
||||
shadowSize: [50, 64],
|
||||
iconAnchor: [22, 94],
|
||||
shadowAnchor: [4, 62],
|
||||
popupAnchor: [-3, -76]
|
||||
}
|
||||
}
|
||||
layer.on("mouseover", function (e) {
|
||||
info.update({nom_qp: feature.properties.nom_qp, commune_qp: feature.properties.commune_qp})
|
||||
});
|
||||
layer.on("mouseout", function (e) {
|
||||
info.update()
|
||||
greenIcon = new LeafIcon({
|
||||
iconUrl: "http://leafletjs.com/docs/images/leaf-green.png"
|
||||
});
|
||||
//layer.on("click", function (e) {
|
||||
// var feature = e.target.feature;
|
||||
// console.log(select_style());
|
||||
// if (window.geom_inter.index.indexOf(feature.properties.code_qp) == -1) {
|
||||
// window.geom_inter.index.push(feature.properties.code_qp);
|
||||
// window.featureCollection.features.push(feature);
|
||||
// layer.setStyle(select_style());
|
||||
// $("#selection_qp").append("<span>Quartier sélectionné : " + feature.properties.code_qp + "</span><br>");
|
||||
// }
|
||||
//});
|
||||
};
|
||||
drawnItems = new L.FeatureGroup();
|
||||
map.addLayer(drawnItems);
|
||||
|
||||
|
||||
function loadGeoJson(data) {
|
||||
map.spin(false);
|
||||
// var store = new Terraformer.GeoStore({
|
||||
// store: new Terraformer.GeoStore.Memory(),
|
||||
// index: new Terraformer.RTree()
|
||||
// });
|
||||
// store.add(data);
|
||||
// window.store = store;
|
||||
// var anchor = $(location).attr('hash').substring(1);
|
||||
// var qp_select = JSON.parse(anchor);
|
||||
// for (i = 0; i < qp_select.qp.length; i++){
|
||||
// store.get(id, function (err, res) {
|
||||
// if (typeof res == != 'undefined'){
|
||||
// window.geom_inter.index.push(res.properties.code_qp);
|
||||
// window.featureCollection.features.push(res);
|
||||
// }
|
||||
// });
|
||||
//}
|
||||
var qpLayer = L.geoJson(data, {onEachFeature: onEachFeature, style: style()}).addTo(map);
|
||||
};
|
||||
|
||||
|
||||
function store() {
|
||||
return $.ajax("http://apicarto.coremaps.com/store/api/v2/datastore/draw", {
|
||||
drawControl = new L.Control.Draw({
|
||||
position: "topright",
|
||||
draw: {
|
||||
polygon: {
|
||||
shapeOptions: {
|
||||
color: "purple"
|
||||
},
|
||||
allowIntersection: false,
|
||||
drawError: {
|
||||
color: "orange",
|
||||
timeout: 1000
|
||||
},
|
||||
showArea: false,
|
||||
metric: true,
|
||||
repeatMode: false
|
||||
},
|
||||
marker: false,
|
||||
polyline: false,
|
||||
rectangle: false,
|
||||
circle: false
|
||||
},
|
||||
edit: {
|
||||
featureGroup: drawnItems
|
||||
}
|
||||
});
|
||||
map.addControl(drawControl);
|
||||
L.control.scale({
|
||||
imperial: false
|
||||
}).addTo(map);
|
||||
map.on("draw:created", function (e) {
|
||||
var layer;
|
||||
layer = e.layer;
|
||||
drawnItems.addLayer(layer);
|
||||
console.log(layer);
|
||||
window.featureCollection.features.push(layer.toGeoJSON());
|
||||
get_ref_dossier ();
|
||||
/**
|
||||
$.ajax({
|
||||
url: 'http://apicarto.coremaps.com//zoneville/api/v1/qp',
|
||||
datatype: 'json',
|
||||
method: 'POST',
|
||||
crossDomain: true,
|
||||
contentType: 'application/x-www-form-urlencoded',
|
||||
headers: {'AUTHORIZATION': ''},
|
||||
data: {geojson: JSON.stringify(window.featureCollection)}
|
||||
}).done(function (data) {
|
||||
$('#info').append('<span>Références pour récupérer le fichier : ' + data.reference + '</span>');
|
||||
data: {geom:layer.toGeoJSON()},
|
||||
jsonCallback: 'getJson',
|
||||
success: function (data){
|
||||
var qp_supp = "";
|
||||
feature = layer.toGeoJSON()
|
||||
feature.properties = data;
|
||||
for (i = 0; i < data.length; i++){
|
||||
qp_supp += "<br><span>Quartier(s) prioritaire(s) : " + data[i].code_qp+ " - " +data[i].nom_qp;
|
||||
}
|
||||
$("#selection_qp").append("<span>Dessin personnalisé</span><br>"+qp_supp +'<br>');
|
||||
}
|
||||
});**/
|
||||
});
|
||||
};
|
||||
map.spin(true);
|
||||
$.ajax({
|
||||
url: 'http://apicarto.coremaps.com/zoneville/api/beta/qp/mapservice',
|
||||
datatype: 'json',
|
||||
jsonCallback: 'getJson',
|
||||
success: loadGeoJson
|
||||
});
|
||||
window.geom_inter = {index: []};
|
||||
|
||||
L.easyButton('fa-floppy-o', store, 'Enregistrer votre sélection').addTo(map);
|
||||
function style(feature) {
|
||||
return {
|
||||
fillColor: '#FC4E2A',
|
||||
weight: 1,
|
||||
opacity: 1,
|
||||
color: 'white',
|
||||
dashArray: '0',
|
||||
fillOpacity: 0.6
|
||||
};
|
||||
}
|
||||
|
||||
function listener(event) {
|
||||
console.log(event);
|
||||
console.log("received: " + event.data);
|
||||
}
|
||||
function select_style(feature) {
|
||||
return {
|
||||
fillColor: '#1E4E2E',
|
||||
weight: 1,
|
||||
opacity: 1,
|
||||
color: 'white',
|
||||
dashArray: '0',
|
||||
fillOpacity: 0.6
|
||||
};
|
||||
}
|
||||
|
||||
if (window.addEventListener) {
|
||||
addEventListener("message", listener, false)
|
||||
} else {
|
||||
attachEvent("onmessage", listener)
|
||||
}
|
||||
function onEachFeature(feature, layer) {
|
||||
var anchor = $(location).attr('hash').substring(1);
|
||||
if (anchor != "") {
|
||||
var qp_select = JSON.parse(anchor);
|
||||
if (qp_select.qp.indexOf(feature.properties.code_qp) > -1) {
|
||||
window.geom_inter.index.push(feature.properties.code_qp);
|
||||
window.featureCollection.features.push(feature);
|
||||
layer.setStyle(select_style());
|
||||
map.fitBounds(layer.getBounds());
|
||||
|
||||
}
|
||||
}
|
||||
layer.on("mouseover", function (e) {
|
||||
info.update({nom_qp: feature.properties.nom_qp, commune_qp: feature.properties.commune_qp})
|
||||
});
|
||||
layer.on("mouseout", function (e) {
|
||||
info.update()
|
||||
});
|
||||
//layer.on("click", function (e) {
|
||||
// var feature = e.target.feature;
|
||||
// console.log(select_style());
|
||||
// if (window.geom_inter.index.indexOf(feature.properties.code_qp) == -1) {
|
||||
// window.geom_inter.index.push(feature.properties.code_qp);
|
||||
// window.featureCollection.features.push(feature);
|
||||
// layer.setStyle(select_style());
|
||||
// $("#selection_qp").append("<span>Quartier sélectionné : " + feature.properties.code_qp + "</span><br>");
|
||||
// }
|
||||
//});
|
||||
};
|
||||
|
||||
|
||||
}).call(this);
|
||||
function loadGeoJson(data) {
|
||||
map.spin(false);
|
||||
// var store = new Terraformer.GeoStore({
|
||||
// store: new Terraformer.GeoStore.Memory(),
|
||||
// index: new Terraformer.RTree()
|
||||
// });
|
||||
// store.add(data);
|
||||
// window.store = store;
|
||||
// var anchor = $(location).attr('hash').substring(1);
|
||||
// var qp_select = JSON.parse(anchor);
|
||||
// for (i = 0; i < qp_select.qp.length; i++){
|
||||
// store.get(id, function (err, res) {
|
||||
// if (typeof res == != 'undefined'){
|
||||
// window.geom_inter.index.push(res.properties.code_qp);
|
||||
// window.featureCollection.features.push(res);
|
||||
// }
|
||||
// });
|
||||
//}
|
||||
var qpLayer = L.geoJson(data, {onEachFeature: onEachFeature, style: style()}).addTo(map);
|
||||
};
|
||||
|
||||
|
||||
function store() {
|
||||
return $.ajax("http://apicarto.coremaps.com/store/api/v2/datastore/draw", {
|
||||
method: 'POST',
|
||||
crossDomain: true,
|
||||
contentType: 'application/x-www-form-urlencoded',
|
||||
headers: {'AUTHORIZATION': ''},
|
||||
data: {geojson: JSON.stringify(window.featureCollection)}
|
||||
}).done(function (data) {
|
||||
$('#info').append('<span>Références pour récupérer le fichier : ' + data.reference + '</span>');
|
||||
});
|
||||
};
|
||||
|
||||
L.easyButton('fa-floppy-o', store, 'Enregistrer votre sélection').addTo(map);
|
||||
|
||||
function listener(event) {
|
||||
console.log(event);
|
||||
console.log("received: " + event.data);
|
||||
}
|
||||
|
||||
if (window.addEventListener) {
|
||||
addEventListener("message", listener, false)
|
||||
} else {
|
||||
attachEvent("onmessage", listener)
|
||||
}
|
||||
|
||||
|
||||
}).call(this);
|
||||
}
|
||||
|
|
@ -16,6 +16,5 @@
|
|||
//= require_tree .
|
||||
//= require jquery
|
||||
//= require bootstrap-sprockets
|
||||
|
||||
//= require bootstrap-datepicker/core
|
||||
//= require bootstrap-datepicker/locales/bootstrap-datepicker.fr.js
|
||||
Loading…
Reference in a new issue