feat: Remember values in barleynetblotch, make lat+lon uneditable

VIPSWeb/static/js/util.js

@@ -204,6 +204,18 @@ function getLocalSettings(keys, allOrNothing)
 	return (allOrNothing && keys.length != Object.keys(retVal).length) ? null : retVal;
 }
 
+/**
+ * Namespace all strings in given array
+ */
+function getNameSpaced(nameSpace, anArray) {
+	var retVal = [];
+	for(var i = 0; i<anArray.length;i++)
+	{
+		retVal.push(nameSpace + "." + anArray[i]);
+	}
+	return retVal;
+};
+
 /**
  * Converts a string like this "6,3,23,1,100" => [6,3,23,1,100]
  * @param csvString

cerealblotchmodels/templates/cerealblotchmodels/barleynetblotchform.html

@@ -43,12 +43,15 @@
 		display: inline-block;
 		margin: 10px 10px 10px 0;
 	}
-	.main-label {
-		font-size: 1.8rem;
-		font-weight: 500 !important;
-	}
 	fieldset {
-		margin-bottom: 40px;
+		margin-bottom: 30px;
+	}
+	.btn-map {
+		margin-top: 5px;
+		margin-bottom: 20px;
+	}
+	#gridPointInfo {
+		margin: 10px 0;
 	}
 </style>
 {% endblock %}
@@ -78,13 +81,15 @@
 					<div class="form-group">
 						<div class="radio">
 							<label>
-								<input type="radio" name="weatherDataSourceType" id="grid" value="grid" checked onchange="displayCoordinatesInput()">
-								for et spesifikt punkt (koordinater)
+								<input type="radio" name="weatherDataSourceType" id="grid" value="grid" onchange="displayCoordinatesInput()">
+								for et punkt i kartet
 							</label>
 							<div id="input-coordinates">
-								<input type="text" class="form-control" name="latitude" id="latitude" placeholder="Breddegrad" aria-label="Breddegrad">
-								<input type="text" class="form-control" name="longitude" id="longitude" placeholder="Lengdegrad" aria-label="Lengdegrad">
-								<button type="button" class="btn btn-primary" onclick="openCoordinatesMap()"><i class="fa fa-map-marker fa-lg"></i> Velg i kart</button>
+								<input type="hidden" class="form-control" name="latitude" id="latitude" placeholder="Breddegrad" aria-label="Breddegrad">
+								<input type="hidden" class="form-control" name="longitude" id="longitude" placeholder="Lengdegrad" aria-label="Lengdegrad">
+								<input type="hidden" class="form-control" name="timezone" id="timezone" placeholder="Tidssone" aria-label="Tidssone">
+								<div id="gridPointInfo"></div>
+								<button type="button" class="btn btn-primary btn-map" onclick="openCoordinatesMap()"><i class="fa fa-map-marker fa-lg"></i>&nbsp;&nbsp;Velg i kart</button>
 							</div>
 							<div id="coordinates-map" class="map-modal"></div>
 						</div>
@@ -94,14 +99,16 @@
 							fra en værstasjon
 							</label>
 							<div id="input-weatherstation" style="display: none;">
-								<select name="weatherStationId" id="weatherStationId" class="form-control" onblur="validateField(this);"></select>
-								<button type="button" class="btn btn-primary" onclick="openPoiMap()"><i class="fa fa-map-marker fa-lg"></i> Velg i kart</button>
+								<select name="weatherStationId" id="weatherStationId" class="form-control">
+									<option value="">Velg værstasjon</option>
+								</select>
+								<button type="button" class="btn btn-primary btn-map" onclick="openPoiMap()"><i class="fa fa-map-marker fa-lg"></i>&nbsp;&nbsp;Velg i kart</button>
 							</div>
 							<div id="poi-map" class="map-modal"></div>
 						</div>
 						<span class="help-block" id="{{ form_id }}_latitude_validation"></span>
-						<span class="help-block" id="{{ form_id }}_weatherStationId_validation"></span>
 						<span class="help-block" id="{{ form_id }}_longitude_validation"></span>
+						<span class="help-block" id="{{ form_id }}_weatherStationId_validation"></span>
 					</div>
 				</fieldset>
 				<fieldset>
@@ -165,7 +172,7 @@
 		</div>
 		<div class="row">
 			<div class="col-md-12 form-group">
-				<button type="button" class="btn btn-primary pull-right" onclick="if(validateForm(document.getElementById('{{ form_id }}')) & validateFormExtra()){runModel();}">{% trans "Run model" %}</button>
+				<button type="button" class="btn btn-primary pull-right" onclick="if(validateForm(document.getElementById('{{ form_id }}')) & validateFormExtra()){storeUserSettings();runModel();}">{% trans "Run model" %}</button>
 			</div>
 		</div>
 		
@@ -205,6 +212,7 @@
 	import MapModal from 'https://logic.testvips.nibio.no/js/mapModal.js';
 	//import MapModal from settings.vipslogicProtocol + "://" + settings.vipslogicServerName + "/js/mapModal.js"
 
+	const theForm = document.getElementById("{{ form_id }}");
 	const inputLatitudeElement = document.getElementById("latitude");
 	const inputLongitudeElement = document.getElementById("longitude");
 	const selectWeatherstationElement = document.getElementById("weatherStationId");
@@ -213,6 +221,23 @@
 	let selectedPoint = null;
 	let selectedFeature = undefined;
 
+	const formFields = [
+		"weatherDataSourceType",
+		"latitude",
+		"longitude",
+		"timezone",
+		"weatherStationId",
+		"cropOrganismId",
+		"sowingDate",
+		"sameCropAsLastSeason",
+		"plowed",
+		"observationDate",
+		"observationValue",
+		"sprayingDate",
+		"preparationId",
+		"preparationDose"
+		];
+
 	function getSelectedPoiId() {
 		const value = selectWeatherstationElement.value;
 		const parsedValue = parseInt(value, 10);
@@ -226,6 +251,7 @@
 		if(selectedLatitude && selectedLongitude) {
 			inputLatitudeElement.value = selectedLatitude;
 			inputLongitudeElement.value = selectedLongitude;
+			getTimezoneForPoint(selectedLatitude, selectedLongitude);
 		}
 	}
 
@@ -292,19 +318,36 @@
 		document.getElementById("weatherstation").checked = true;
 		document.getElementById('input-weatherstation').style.display="block";
 		document.getElementById('input-coordinates').style.display="none";
-		inputLatitudeElement.value = ""
-		inputLongitudeElement.value = ""
 	}
 
 	window.displayCoordinatesInput = (id) => {
 		document.getElementById("grid").checked = true;
 		document.getElementById('input-weatherstation').style.display="none";
 		document.getElementById('input-coordinates').style.display="block";
-		selectWeatherstationElement.selectedIndex = 0;
+		getTimezoneForSelectedPoint()
+	}
+
+	const getTimezoneForPoint = (latitude, longitude) => {
+		getLocationInformation(latitude, longitude).then(locationInfo => {
+			theForm["timezone"].value = locationInfo.timezone;
+			document.getElementById("gridPointInfo").innerHTML = `<b>Sted</b> ${locationInfo.location}<br>
+																	<b>Breddegrad</b> ${locationInfo.latitude}<br>	
+																	<b>Lengdegrad</b> ${locationInfo.longitude}<br>
+																	<b>Tidssone</b> ${locationInfo.timezone}`
+		});
+	}
+
+	const getTimezoneForSelectedPoint = () => {
+		const lat = theForm["latitude"].value;
+		const lon = theForm["longitude"].value;
+		if(lat && lon) {
+			getTimezoneForPoint(lat, lon)
+		} else {
+			console.info("Latitude and longitude not set in form, cannot get timezone information")
+		}
 	}
 
 	window.validateFormExtra = () => {
-		var theForm = document.getElementById("{{ form_id }}");
 		// Location: Either weatherStationId or latitude/longitude must be set
 		const selectedWeatherdataType = theForm.querySelector('input[name="weatherDataSourceType"]:checked').value;
 		if( selectedWeatherdataType === "grid") {
@@ -340,7 +383,35 @@
 		return true;
 	}
 
-	var VIPSOrganizationId = {{vips_organization_id}};
+	window.storeUserSettings = () => {
+		var settingsDict = {}
+		for(var i in formFields) {
+			const inputElement = theForm[formFields[i]];
+			const key = "{{ form_id }}" + "." + formFields[i];
+			// Need to add the formId as namespace to avoid confusion in Local Storage
+			if(inputElement.type === "checkbox") {
+				settingsDict[key] = inputElement.checked
+			} else {
+				settingsDict[key] = inputElement.value;
+			}
+		}
+		storeLocalSettings(settingsDict);
+	};
+
+	window.renderUserSettings = (userSettings) => {
+		for(const key in userSettings){
+			const fieldName = key.substring("{{form_id}}.".length);
+			const inputElement = theForm[fieldName];
+			const theValue = userSettings[key];
+			if (inputElement.type && inputElement.type === "checkbox") {
+				inputElement.checked = theValue === "true" || theValue === true;
+			} else {
+				inputElement.value = theValue;
+			}
+		}
+	};
+
+	const VIPSOrganizationId = {{vips_organization_id}};
 	window.runModel = () => {
 		document.getElementById("results").style.display="none";
 		document.getElementById("errorMessageContainer").style.display="none";
@@ -443,9 +514,8 @@
 	};
 	
 	
-	function initWeatherStations(){
-		// Fetching information asynchronously from server 
-	    var request = $.ajax({
+	async function initWeatherStations(){
+		return $.ajax({
 	        type:"GET",
 	        url: settings.vipslogicProtocol + "://" + settings.vipslogicServerName + "/rest/poi/organization/" + VIPSOrganizationId,
 	        statusCode:{
@@ -471,8 +541,7 @@
 	
 	function initCrops()
     {
-     	// Fetching information asynchronously from server 
-	    var request = $.ajax({
+	    return $.ajax({
 	        type:"GET",
 	        url: settings.vipslogicProtocol + "://" + settings.vipslogicServerName + "/rest/barleynetblotchmodel/barleyvarieties/" + VIPSOrganizationId,
 	        statusCode:{
@@ -499,8 +568,7 @@
     
     function initPreparations()
     {
-    	// Fetching information asynchronously from server 
-	    var request = $.ajax({
+	    return $.ajax({
 	        type:"GET",
 	        url: settings.vipslogicProtocol + "://" + settings.vipslogicServerName + "/rest/barleynetblotchmodel/preparations/" + VIPSOrganizationId,
 	        statusCode:{
@@ -531,18 +599,31 @@
         document.getElementById("errorMessage").innerHTML = "<h1>Error</h1><pre>" + message + "</pre>";
         document.getElementById("errorMessageContainer").style.display="block";
     };
-    
+
     $(document).ready(function() {
     	if(settings.userIsIE)
 		{
 			alert("{% trans "WARNING: We suspect you are using Internet Explorer to view this site. VIPS is not designed to work with Internet Explorer, you may experience errors and missing features. Please use a different browser, like Microsoft Edge or Google Chrome." %}");
 		}
-		initWeatherStations();
-		initCrops();
-		initPreparations();
-		// Init form validation
-		loadFormDefinition("{{ form_id }}","/static/cerealblotchmodels/formdefinitions/");
-		displayCoordinatesInput();
+
+		// Make sure all promises have returned before continuing
+		Promise.all([initWeatherStations(), initCrops(), initPreparations()]).then(function() {
+			loadFormDefinition("{{ form_id }}","/static/cerealblotchmodels/formdefinitions/");
+
+			var userSettings = getLocalSettings(getNameSpaced("{{ form_id }}",formFields), false);
+			if(!isDictEmpty(userSettings)) {
+				renderUserSettings(userSettings);
+				if(theForm["weatherDataSourceType"].value == "grid") {
+					displayCoordinatesInput();
+				} else if(theForm["weatherDataSourceType"].value == "weatherstation") {
+					displayWeatherstationInput();
+				} else {
+					displayCoordinatesInput();
+				}
+			}
+		}).catch(function(error) {
+        	console.error("Error initializing data:", error);
+    	});
 	});
 </script>
 

cerealblotchmodels/templates/cerealblotchmodels/septoriahumiditymodelform.html

@@ -683,15 +683,6 @@
 		}
 	}
 	
-	window.getNameSpaced = (nameSpace, anArray) => {
-		var retVal = [];
-		for(var i = 0; i<anArray.length;i++)
-		{
-			retVal.push(nameSpace + "." + anArray[i]);
-		}
-		return retVal;
-	};
-	
 	window.storeUserSettings = () => {
 		var theForm = document.getElementById('{{ form_id }}');
 		var settingsDict = {}