Hack to have both input ranges be created by websocket when either is…

… changed
philschonholzer · Oct 8, 2021 · 9b7bf4e · 9b7bf4e
1 parent 4ecafce
commit 9b7bf4e
Showing 1 changed file with 12 additions and 9 deletions.
diff --git a/Web/Component/CommonConsumption.hs b/Web/Component/CommonConsumption.hs
@@ -25,8 +25,8 @@ data CommonConsumption = CommonConsumption
 
 -- The set of actions
 data CommonConsumptionController
-  = SetCommonConsumptionValue {newAmount :: !Double, newGCo2 :: !Double}
-  | SetTimesPerYear {newTimesPerYear :: !Double, newGCo2 :: !Double}
+  = SetCommonConsumptionValue {newAmount :: !Double, newGCo2 :: !Double, newOther :: !Double}
+  | SetTimesPerYear {newTimesPerYear :: !Double, newGCo2 :: !Double, newOther :: !Double}
   deriving (Eq, Show, Data)
 
 $(deriveSSC ''CommonConsumptionController)
@@ -62,20 +62,21 @@ instance Component CommonConsumption CommonConsumptionController where
           <span style="font-size: 1.5em">=&ensp;</span>
           <span class="co2-amount timesPerYear">{((calcCo2Factor gCo2 1.0 amount) * timesPerYear) |> renderWeight}</span>&nbsp;CO<sub>2</sub>e / year
         </p>
-        {renderInput amount minAmount maxAmount "SetCommonConsumptionValue" "newAmount" "Single consumption"}
+        {renderInput amount minAmount maxAmount timesPerYear "SetCommonConsumptionValue" "newAmount" "Single consumption"}
 
-        {renderInput timesPerYear minTimesPerYear maxTimesPerYear "SetTimesPerYear" "newTimesPerYear" "Times per year"}
+        {renderInput timesPerYear minTimesPerYear maxTimesPerYear amount "SetTimesPerYear" "newTimesPerYear" "Times per year"}
     |]
     where
-      renderInput :: Double -> Double -> Double -> String -> String -> String -> Html
-      renderInput value minValue maxValue action newField labelTitle = case (minValue, maxValue) of
+      renderInput :: Double -> Double -> Double -> Double -> String -> String -> String -> Html
+      renderInput value minValue maxValue otherValue action newField labelTitle = case (minValue, maxValue) of
         (min, max) | min == max -> [hsx||]
         _ ->
           [hsx|
             <label for={action}>{labelTitle}</label>
             <input 
               id={action}
               data-gco2={tshow gCo2} 
+              data-other={tshow otherValue} 
               class="range" 
               type="range" 
               min={tshow minValue} 
@@ -90,7 +91,7 @@ instance Component CommonConsumption CommonConsumptionController where
             steps = showFFloat (Just 2) ((maxValue - minValue) / 50.0) ""
 
             onInput :: String
-            onInput = "callServerAction('" <> action <> "', { " <> newField <> ": parseFloat(this.value), newGCo2: parseFloat(this.dataset.gco2) })"
+            onInput = "callServerAction('" <> action <> "', { " <> newField <> ": parseFloat(this.value), newGCo2: parseFloat(this.dataset.gco2), newOther: parseFloat(this.dataset.other) })"
 
       svg =
         [hsx|
@@ -100,15 +101,17 @@ instance Component CommonConsumption CommonConsumptionController where
         |]
 
   -- The action handlers
-  action state SetCommonConsumptionValue {newAmount, newGCo2} = do
+  action state SetCommonConsumptionValue {newAmount, newGCo2, newOther} = do
     state
       |> set #amount newAmount
       |> set #gCo2 newGCo2
+      |> set #timesPerYear newOther
       |> pure
-  action state SetTimesPerYear {newTimesPerYear, newGCo2} = do
+  action state SetTimesPerYear {newTimesPerYear, newGCo2, newOther} = do
     state
       |> set #timesPerYear newTimesPerYear
       |> set #gCo2 newGCo2
+      |> set #amount newOther
       |> pure
 
 instance SetField "amount" CommonConsumption Double where setField amount' commonConsumption = commonConsumption {amount = amount'}