diff --git a/applefruitmoth/templates/applefruitmoth/index.html b/applefruitmoth/templates/applefruitmoth/index.html index 7d682e8bb9c1a329049dd4489d9aedeaa34e672b..5416c0da15edc8e72f5d402959db9aa0042edc06 100755 --- a/applefruitmoth/templates/applefruitmoth/index.html +++ b/applefruitmoth/templates/applefruitmoth/index.html @@ -45,6 +45,8 @@ }); </script> <script type="module"> + const modulePath = `${settings.vipslogicProtocol}://${settings.vipslogicServerName}/js/mapModal.js`; + import MapModal from 'https://logic.testvips.nibio.no/js/mapModal.js'; const selectWeatherstationElement = document.getElementById("weatherStationId"); @@ -154,7 +156,7 @@ window.openCoordinatesMap = () => { if (inputLatitudeElement.value && inputLongitudeElement.value) { - selectedPoint = 1; + selectedPoint = -1; selectedFeature = { "type": "FeatureCollection", "features": [ { @@ -175,8 +177,15 @@ const isPoiMap = false; // Map should enable selection of coordinates (not pois) const allowNewPoints = true; // User should be able to select new pois - const coordinatesMapInstance = new MapModal('coordinates-map', selectedFeature, 'nb', isPoiMap, allowNewPoints, selectCoordinates); - coordinatesMapInstance.openModal(selectedPoint); + + import(modulePath).then((module) => { + const MapModal = module.default; + const coordinatesMapInstance = new MapModal('coordinates-map', selectedFeature, 'nb', isPoiMap, allowNewPoints, selectCoordinates); + coordinatesMapInstance.openModal(selectedPoint); + }).catch((error) => { + console.error('Error loading module MapModal for coordinatesMap', error); + }); + } function selectPoi(poiData) @@ -209,9 +218,15 @@ geoJson["features"] = filteredFeatures; const isPoiMap = true; // Map should enable selection of pois const allowNewPoints = false; // User should not be able to create new pois - const poiMapInstance = new MapModal('poi-map', geoJson, 'nb', isPoiMap, allowNewPoints, selectPoi); - const selectedPoiId = applefruitMoth.getSelectedWeatherstation(); - poiMapInstance.openModal(selectedPoiId); + + import(modulePath).then((module) => { + const MapModal = module.default; + const poiMapInstance = new MapModal('poi-map', geoJson, 'nb', isPoiMap, allowNewPoints, selectPoi); + const selectedPoiId = applefruitMoth.getSelectedWeatherstation(); + poiMapInstance.openModal(selectedPoiId); + }).catch((error) => { + console.error('Error loading module MapModal for poiMap', error); + }); }) .catch(error => { console.error('Unable to retrieve weatherstation geojson', error); @@ -382,8 +397,8 @@ <!--[if lte IE 9]> <style type="text/css">#oldIEWarning{display: block !important;}</style> <![endif]--> -<link type="text/css" rel="stylesheet" href="https://logic.testvips.nibio.no/css/3rdparty/leaflet.css" /> -<link type="text/css" rel="stylesheet" href="https://logic.testvips.nibio.no/css/mapModal.css" /> +<link type="text/css" rel="stylesheet" href="{{settings.VIPSLOGIC_PROTOCOL}}://{{settings.VIPSLOGIC_SERVER_NAME}}/css/3rdparty/leaflet.css" /> +<link type="text/css" rel="stylesheet" href="{{settings.VIPSLOGIC_PROTOCOL}}://{{settings.VIPSLOGIC_SERVER_NAME}}/css/mapModal.css" /> <link rel="stylesheet" href="{% static "css/3rdparty/ol.css" %}" type="text/css"> <style>