diff --git a/cerealblotchmodels/templates/cerealblotchmodels/barleynetblotchform.html b/cerealblotchmodels/templates/cerealblotchmodels/barleynetblotchform.html index 74e66b2f2fbc97c7bdb3eda3610fc1438e094b87..83a6177b9b6d1667e884766da119b6d734429de6 100755 --- a/cerealblotchmodels/templates/cerealblotchmodels/barleynetblotchform.html +++ b/cerealblotchmodels/templates/cerealblotchmodels/barleynetblotchform.html @@ -28,8 +28,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" /> <style> /* Added when integrating map, should perhaps be moved to main css file. */ @@ -206,9 +206,7 @@ <script type="text/javascript" src="{% static "organisms/organismsUtil.js" %}"></script> <script type="text/javascript" src="{% static "forecasts/js/forecasts.js" %}"></script> <script type="module"> - import MapModal from 'https://logic.testvips.nibio.no/js/mapModal.js'; - //import MapModal from settings.vipslogicProtocol + "://" + settings.vipslogicServerName + "/js/mapModal.js" - + const modulePath = `${settings.vipslogicProtocol}://${settings.vipslogicServerName}/js/mapModal.js`; const theForm = document.getElementById("{{ form_id }}"); const inputLatitudeElement = document.getElementById("latitude"); const inputLongitudeElement = document.getElementById("longitude"); @@ -287,8 +285,14 @@ const isPoiMap = false; // Map should enable selection of coordinates (not pois) const allowNewPoints = true; // User should be able to select new coordinates - const coordinatesMapInstance = new MapModal('coordinates-map', selectedFeature, settings.currentLanguage, isPoiMap, allowNewPoints, selectCoordinates); - coordinatesMapInstance.openModal(selectedPoint); + + import(modulePath).then((module) => { + const MapModal = module.default; + const coordinatesMapInstance = new MapModal('coordinates-map', selectedFeature, settings.currentLanguage, isPoiMap, allowNewPoints, selectCoordinates); + coordinatesMapInstance.openModal(selectedPoint); + }).catch((error) => { + console.error('Error loading module MapModal for coordinatesMap', error); + }); } window.openPoiMap = () => { @@ -304,9 +308,16 @@ .then(geoJson => { 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, settings.currentLanguage, isPoiMap, allowNewPoints, selectPoi); - const selectedPoiId = getSelectedPoiId(); - poiMapInstance.openModal(selectedPoiId); + + import(modulePath).then((module) => { + const MapModal = module.default; + const poiMapInstance = new MapModal('poi-map', geoJson, settings.currentLanguage, isPoiMap, allowNewPoints, selectPoi); + const selectedPoiId = getSelectedPoiId(); + poiMapInstance.openModal(selectedPoiId); + }).catch((error) => { + console.error('Error loading module MapModal for poiMap', error); + }); + }) .catch(error => { console.error('Unable to retrieve weatherstation geojson', error); @@ -628,6 +639,7 @@ }).catch(function(error) { console.error("Error initializing data:", error); }); + }); </script> diff --git a/cerealblotchmodels/templates/cerealblotchmodels/septoriahumiditymodelform.html b/cerealblotchmodels/templates/cerealblotchmodels/septoriahumiditymodelform.html index ad4559ea6c1e6aa7a8fbf298cf7256bc912a5539..6164d4cbdd6b8954c2f4b3fd68b282e83d78b14c 100644 --- a/cerealblotchmodels/templates/cerealblotchmodels/septoriahumiditymodelform.html +++ b/cerealblotchmodels/templates/cerealblotchmodels/septoriahumiditymodelform.html @@ -25,8 +25,8 @@ {% block title %}{% trans "Septoria humidity model" %}{% endblock %} {% block customCSS %} -<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" /> <style> /* Added when integrating map, should perhaps be moved to main css file. */ @@ -229,9 +229,7 @@ <script type="text/javascript" src="{% static "js/validateForm.js" %}"></script> <script type="text/javascript" src="{% static "forecasts/js/forecasts.js" %}"></script> <script type="module"> - import MapModal from 'https://logic.testvips.nibio.no/js/mapModal.js'; - //import MapModal from settings.vipslogicProtocol + "://" + settings.vipslogicServerName + "/js/mapModal.js" - + const modulePath = `${settings.vipslogicProtocol}://${settings.vipslogicServerName}/js/mapModal.js`; const theForm = document.getElementById("{{ form_id }}"); const inputLatitudeElement = document.getElementById("latitude"); const inputLongitudeElement = document.getElementById("longitude"); @@ -294,8 +292,13 @@ const isPoiMap = false; // Map should enable selection of coordinates (not pois) const allowNewPoints = true; // User should be able to select new coordinates - const coordinatesMapInstance = new MapModal('coordinates-map', selectedFeature, settings.currentLanguage, isPoiMap, allowNewPoints, selectCoordinates); - coordinatesMapInstance.openModal(selectedPoint); + import(modulePath).then((module) => { + const MapModal = module.default; + const coordinatesMapInstance = new MapModal('coordinates-map', selectedFeature, settings.currentLanguage, isPoiMap, allowNewPoints, selectCoordinates); + coordinatesMapInstance.openModal(selectedPoint); + }).catch((error) => { + console.error('Error loading module MapModal for coordinatesMap', error); + }); } window.openPoiMap = () => { @@ -311,9 +314,14 @@ .then(geoJson => { 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, settings.currentLanguage, isPoiMap, allowNewPoints, selectPoi); - const selectedPoiId = getSelectedPoiId(); - poiMapInstance.openModal(selectedPoiId); + import(modulePath).then((module) => { + const MapModal = module.default; + const poiMapInstance = new MapModal('poi-map', geoJson, settings.currentLanguage, isPoiMap, allowNewPoints, selectPoi); + const selectedPoiId = getSelectedPoiId(); + poiMapInstance.openModal(selectedPoiId); + }).catch((error) => { + console.error('Error loading module MapModal for poiMap', error); + }); }) .catch(error => { console.error('Unable to retrieve weatherstation geojson', error);