Add an event listener for changing L.

This commit also:

- Changes the order of the parameters. `L` appears before λ since the
latter is defined in terms of the former.

leios-sim/index.html

@@ -25,15 +25,16 @@
     <div class="row g-3" style="width: 95%; margin: auto;">
 
       <div class="col-md-3">
-	<label for="inputLambda" class="form-label">$$\lambda_{\ }$$</label>
-	<input type="number" min="1" max="15" class="form-control" id="input_λ">
+	<label for="input_L" class="form-label">$$L_{\ }$$</label>
+	<input type="number" min="1" max="15" class="form-control" id="input_L">
       </div>
 
       <div class="col-md-3">
-	<label for="inputL" class="form-label">$$L_{\ }$$</label>
-	<input type="number" min="1" max="15" class="form-control" id="input_L">
+	<label for="inputLambda" class="form-label">$$\lambda_{\ }$$</label>
+	<input type="number" min="1" max="15" class="form-control" id="input_λ">
       </div>
 
+
       <div class="col-md-3">
 	<label for="input_f_I" class="form-label">$$f_I$$</label>
 	<input type="number" min="1" max="15" class="form-control" id="input_f_I">

leios-sim/index.js

@@ -154,16 +154,40 @@ document.addEventListener('DOMContentLoaded', () => {
     console.log('disconnected');
   };
 
-  // handle parameters change
+  /*
+   * Parameters change handling
+   */
+  onParametersChange('input_L',
+		     (newValue) => { parameters.L = newValue },
+		     `/api/set-L`);
+
   const input_λ = document.getElementById('input_λ');
   input_λ.addEventListener('change', function() {
     parameters.λ = input_λ.value;
-    postJSON(`/api/lambda?sessionId=${sessionId}`,
+    postJSON(`/api/set-lambda?sessionId=${sessionId}`,
 	     parseInt(input_λ.value));
   });
 
 });
 
+/*
+ * Add an event listener on the given parameter id.
+ *
+ * When the value changes `applyNewvalue` is called with this new
+ * value, and the new value is sent to the given endpoint.
+ *
+ * We assume the value `parameterId` refers to is an integer.
+ *
+ * The query parameter `sessionId=${sessionId}` will be added to the given endpoint.
+ */
+function onParametersChange(parameterId, applyNewValue, endpoint) {
+  const input = document.getElementById(parameterId);
+  input.addEventListener('change', function() {
+    applyNewValue (input.value);
+    postJSON(`${endpoint}?sessionId=${sessionId}`, parseInt(input.value));
+  });
+}
+
 async function startSimulation() {
   const L = document.getElementById('input_L');
   const λ = document.getElementById('input_λ');

leios-sim/src/Leios/Server.hs

@@ -176,10 +176,18 @@ scottyApp serverState =
     --   atomically $
     --     modifyTVar params (\p -> p{nodeBandwidth = BitsPerSecond bps})
 
-    Sc.post "/api/lambda" $ do
+    Sc.post "/api/set-L" $ do
+      _L <- Sc.jsonData
+      sid <- Sc.queryParam "sessionId"
+      mParamsTVar <- liftIO $ lookupParamsTVar sid serverState
+      case mParamsTVar of
+        Nothing -> Sc.status badRequest400
+        Just paramsTVar ->
+          liftIO $ atomically $ modifyTVar paramsTVar (\p -> p{_L})
+
+    Sc.post "/api/set-lambda" $ do
       λ <- Sc.jsonData
       sid <- Sc.queryParam "sessionId"
-      -- TODO: modify parameters
       mParamsTVar <- liftIO $ lookupParamsTVar sid serverState
       case mParamsTVar of
         Nothing -> Sc.status badRequest400