diff --git a/index.html b/index.html
index 57d8f72..9e2b32e 100644
--- a/index.html
+++ b/index.html
@@ -62,9 +62,17 @@
 
 <div class="bottom-content">
 
-    <p>
+    <h1>
         Carte des IRVE
-    </p>
+    </h1>
+
+
+<!--    <a href="#" class="button edit-button josm" data-href="http://127.0.0.1:8111/load_and_zoom?left=1.1486915000000002&top=49.4144783&right=1.1506915&bottom=49.412478300000004&select=12014929487">-->
+
+<!--test télécommande josm-->
+<!--    </a>-->
+
+    <div id="infos_carte"></div>
     <div id="filter">
         filtres: <br>
         prise: type 2, type CCS<br>
@@ -79,8 +87,8 @@
 <!--            100kW-->
 <!--        </button>-->
 <!--        ,-->
-        <button class="button" id="toggleMinPower_300">
-            fais voir les plus de 300kW, j'ai pas le time!
+        <button class="button" id="toggle_high_power">
+            fais voir les plus de 100kW, j'ai pas le time!
         </button>
         <br>
         <span class="marker-demo">
diff --git a/js/main.js b/js/main.js
index e6e47ae..c3b064e 100644
--- a/js/main.js
+++ b/js/main.js
@@ -34,18 +34,18 @@ let filteredMarkers = L.layerGroup().addTo(map)
 
 function buildOverpassApiUrl (map, overpassQuery) {
 
-	var baseUrl = 'https://overpass-api.de/api/interpreter'
-	var bounds = map.getBounds().getSouth() + ',' + map.getBounds().getWest() + ',' + map.getBounds().getNorth() + ',' + map.getBounds().getEast()
-	var resultUrl, query = ''
+	let baseUrl = 'https://overpass-api.de/api/interpreter'
+	let bounds = map.getBounds().getSouth() + ',' + map.getBounds().getWest() + ',' + map.getBounds().getNorth() + ',' + map.getBounds().getEast()
+	let resultUrl, query = ''
 
 	if (overrideQuery) {
 		query = `?data=[out:json][timeout:15];(
    node[amenity=charging_station](${bounds});
    );out body geom;`
 	} else {
-		var nodeQuery = 'node[' + overpassQuery + '](' + bounds + ');'
-		var wayQuery = 'way[' + overpassQuery + '](' + bounds + ');'
-		var relationQuery = 'relation[' + overpassQuery + '](' + bounds + ');'
+		let nodeQuery = 'node[' + overpassQuery + '](' + bounds + ');'
+		let wayQuery = 'way[' + overpassQuery + '](' + bounds + ');'
+		let relationQuery = 'relation[' + overpassQuery + '](' + bounds + ');'
 		query = '?data=[out:json][timeout:15];(' + nodeQuery + wayQuery + relationQuery + ');out body geom;'
 
 	}
@@ -80,6 +80,18 @@ const tags_to_display_in_popup = [
 	'authentication:app',
 	'authentication:debit_card',
 ]
+const margin_josm_bbox= 0.00001
+function createJOSMEditLink(feature) {
+	console.log('createJOSMEditLink feature', feature)
+	var coordinates = feature.geometry.coordinates;
+	var nodeId = feature.properties.id;
+	var left = coordinates[0] - margin_josm_bbox;
+	var right = coordinates[0] + margin_josm_bbox;
+	var bottom = coordinates[1] - margin_josm_bbox;
+	var top = coordinates[1] + margin_josm_bbox;
+	var josmUrl = `http://127.0.0.1:8111/load_and_zoom?left=${left}&top=${top}&right=${right}&bottom=${bottom}&select=${nodeId}`;
+	return josmUrl;
+}
 
 function supprimerMarqueurs (map) {
 	map.eachLayer((layer) => {
@@ -100,6 +112,7 @@ const colors = [
 
 function guessOutputPowerFromFeature (feature) {
 	let outputPower = 0
+	let power = 0
 	if (feature.properties && feature.properties.tags) {
 		/**
 		 * fouiller dans les tags les valeurs explicites de puissance déclarée.
@@ -131,7 +144,7 @@ function guessOutputPowerFromFeature (feature) {
 					value = value.replace(' ')
 					value = value.replace('kW', '')
 				}
-				var power = parseInt(value)
+				let power = parseInt(value)
 				// deviner les types de prises présents
 
 				if (power) {
@@ -155,7 +168,7 @@ function getColor (feature) {
 	feature.properties.tags.has_output_of_irve_specified = outputPower
 	if (outputPower) {
 
-		var index = Math.min(Math.floor(outputPower / 10), colors.length - 1)
+		let index = Math.min(Math.floor(outputPower / 10), colors.length - 1)
 		console.log('outputPower', outputPower)
 		// console.log('colors[index]', colors[index])
 		return colors[index]
@@ -273,13 +286,26 @@ ${count_estimated_type2combo} (${calculerPourcentage(count_estimated_type2combo,
 
 let geojsondata;
 
+function bindEventsOnJosmRemote () {
+	let josm_remote_buttons = $(`.josm`)
+	console.log('josm_remote_buttons',josm_remote_buttons[0])
+	$(josm_remote_buttons[0]).on('click',()=>{
+		console.log('link', josm_remote_buttons[0])
+		let josm_link = $(josm_remote_buttons[0]).attr('data-href')
+		console.log('lancer la télécommande josm', josm_link)
+		$.get(josm_link, (res)=>{
+			console.log('res', res)
+		})
+	})
+}
+
 function displayPointsFromApi (points) {
 
 	geojsondata = osmtogeojson(points)
 	console.log('resultAsGeojson', geojsondata)
 
 	displayStatsFromGeoJson(geojsondata)
-	var resultLayer = L.geoJson(geojsondata, {
+	let resultLayer = L.geoJson(geojsondata, {
 		style: function (feature) {
 			return { color: '#f00' }
 		},
@@ -290,14 +316,17 @@ function displayPointsFromApi (points) {
 		 * @returns {boolean}
 		 */
 		filter: function (feature, layer) {
-			var isPolygon = (feature.geometry) && (feature.geometry.type !== undefined) && (feature.geometry.type === 'Polygon')
+			let isPolygon = (feature.geometry) && (feature.geometry.type !== undefined) && (feature.geometry.type === 'Polygon')
 			if (isPolygon) {
 				feature.geometry.type = 'Point'
-				var polygonCenter = L.latLngBounds(feature.geometry.coordinates[0]).getCenter()
+				let polygonCenter = L.latLngBounds(feature.geometry.coordinates[0]).getCenter()
 				feature.geometry.coordinates = [polygonCenter.lat, polygonCenter.lng]
 			}
 			return true
 		},
+		onmoveend: function(event){
+			console.log('déplacement terminé')
+		},
 		onzoomend: function (event) {
 			console.log('event', event)
 		},
@@ -327,7 +356,9 @@ function displayPointsFromApi (points) {
 			if (!popupContent) {
 				popupContent = `<span class="no-data"> Aucune information renseignée, <a class="edit-button" href="https://www.openstreetmap.org/edit?editor=remote&node=${feature.properties.id}">ajoutez la dans OpenStreetMap!</a></span>`
 			}
-			let html = `<a class="edit-button" href="https://www.openstreetmap.org/edit?editor=id&node=${feature.properties.id}">✏️</a><a class="edit-button" href="https://www.openstreetmap.org/edit?editor=remote&node=${feature.properties.id}">JOSM</a> <span class="color-indication" style="background-color: ${color};">${displayOutPowerGuessed}</span><span class="popup-content">${popupContent}</span>`
+			let link_josm = createJOSMEditLink(feature)
+			console.log('link_josm', link_josm)
+			let html = `<a class="edit-button" href="https://www.openstreetmap.org/edit?editor=id&node=${feature.properties.id}">✏️</a><a class="edit-button josm" data-href="${link_josm}" href="#">JOSM</a> <span class="color-indication" style="background-color: ${color};">${displayOutPowerGuessed}</span><span class="popup-content">${popupContent}</span>`
 
 			let radius = 20
 			if (outPowerGuessed > 300) {
@@ -355,6 +386,7 @@ function displayPointsFromApi (points) {
 			circle.on({
 				mouseover: function () {
 					this.openPopup()
+					bindEventsOnJosmRemote()
 				},
 				mouseout: function () {
 					setTimeout(() => this.closePopup(), 3000)
@@ -365,6 +397,10 @@ function displayPointsFromApi (points) {
 			})
 		},
 	})
+
+	// link josm buttons to get request
+
+
 }
 
 function makeCssClassFromTags (tags) {
@@ -415,7 +451,7 @@ function addFilteredMarkers (showHighPower) {
 	geojsondata.features.forEach(function (feature) {
 		if (feature.properties.puissance_haute === showHighPower) {
 			counter++
-			var marker = L.marker(feature.geometry.coordinates).bindPopup(feature.properties.puissance_haute ? 'Puissance haute' : 'Puissance normale')
+			let marker = L.marker(feature.geometry.coordinates).bindPopup(feature.properties.puissance_haute ? 'Puissance haute' : 'Puissance normale')
 			filteredMarkers.addLayer(marker)
 		}
 	})
@@ -430,8 +466,8 @@ function loadOverpassQuery () {
 	if (!isLoading) {
 		isLoading = true
 		$('#spinning_icon').fadeIn()
-		var queryTextfieldValue = $('#query-textfield').val()
-		var overpassApiUrl = buildOverpassApiUrl(map, queryTextfieldValue)
+		let queryTextfieldValue = $('#query-textfield').val()
+		let overpassApiUrl = buildOverpassApiUrl(map, queryTextfieldValue)
 
 		$.get(overpassApiUrl, function (geoDataPointsFromApi) {
 			displayPointsFromApi(geoDataPointsFromApi)
@@ -445,4 +481,20 @@ function loadOverpassQuery () {
 $('#spinning_icon').hide()
 $('#message-loading').hide()
 
-loadOverpassQuery()
+function onMapMoveEnd () {
+	let center = map.getCenter();
+	let zoom = map.getZoom();
+	let infos = `Lat: ${center.lat}, Lon: ${center.lng}, Zoom : ${zoom}`
+	if (zoom > 10) {
+		loadOverpassQuery()
+	}else{
+		infos += "(zoomez au niveau 11 ou plus pour charger les stations en vous déplaçant)"
+	}
+	$("#infos_carte").html();
+}
+
+map.on('moveend', onMapMoveEnd);
+$(document).ready(function() {
+	bindEventsOnJosmRemote();
+	onMapMoveEnd()
+});