Adding UI to modify the income

2 files changed, 61 insertions, 7 deletions

diff --git a/src/client/View/LoggedIn/Account.elm b/src/client/View/LoggedIn/Account.elm
index 88f39c3..253647a 100644
--- a/src/client/View/LoggedIn/Account.elm
+++ b/src/client/View/LoggedIn/Account.elm
@@ -3,10 +3,13 @@ module View.LoggedIn.Account
   ) where
 
 import Html exposing (..)
+import Html as H exposing (..)
 import Html.Attributes exposing (..)
 import Html.Events exposing (..)
 import List
 
+import ServerCommunication as SC exposing (serverCommunications)
+
 import Update exposing (..)
 import Update.LoggedIn exposing (..)
 import Update.LoggedIn.Account exposing (..)
@@ -16,10 +19,13 @@ import Model.User exposing (getUserName)
 import Model.Payers exposing (..)
 import Model.View.LoggedInView exposing (LoggedInView)
 import Model.Translations exposing (getParamMessage, getMessage)
-import Model.View.LoggedIn.Account exposing (Account)
+import Model.View.LoggedIn.Account exposing (..)
 
 import View.Expand exposing (..)
 import View.Price exposing (price)
+import View.Events exposing (onSubmitPrevDefault)
+
+import Utils.Either exposing (toMaybeError)
 
 account : Model -> LoggedInView -> Html
 account model loggedInView =
@@ -64,11 +70,58 @@ exceedingPayer model loggedInView payer =
 
 income : Model -> Account -> Html
 income model account =
+  case account.incomeEdition of
+    Just edition ->
+      incomeEdition model account edition
+    Nothing ->
+      incomeRead model account
+
+incomeRead : Model -> Account -> Html
+incomeRead model account =
   div
     [ class "income" ]
-    ( case account.income of
-        Nothing ->
-          [ text (getMessage "NoIncome" model.translations) ]
-        Just income ->
-          [ text (getParamMessage [price model income] "Income" model.translations) ]
-    )
+    [ ( case account.income of
+          Nothing ->
+            text (getMessage "NoIncome" model.translations)
+          Just income ->
+            text (getParamMessage [price model income] "Income" model.translations)
+      )
+    , toggleIncomeEdition "editIncomeEdition" (getMessage "Edit" model.translations)
+    ]
+
+incomeEdition : Model -> Account -> IncomeEdition -> Html
+incomeEdition model account edition =
+  H.form
+    [ case validateIncome edition.income model.translations of
+        Ok validatedAmount ->
+          onSubmitPrevDefault serverCommunications.address (SC.SetIncome validatedAmount)
+        Err error ->
+          onSubmitPrevDefault actions.address (UpdateLoggedIn << UpdateAccount << UpdateEditionError <| error)
+    , class "income"
+    ]
+    [ label
+        [ for "incomeInput" ]
+        [ text (getMessage "NewIncome" model.translations) ]
+    , input
+        [ id "incomeInput"
+        , value edition.income
+        , on "input" targetValue (Signal.message actions.address << UpdateLoggedIn << UpdateAccount << UpdateIncomeEdition)
+        , maxlength 10
+        ]
+        []
+    , button
+        [ class "validateIncomeEdition" ]
+        [ text (getMessage "Validate" model.translations) ]
+    , toggleIncomeEdition "undoIncomeEdition" (getMessage "Undo" model.translations)
+    , case edition.error of
+        Just error -> div [ class "error" ] [ text error ]
+        Nothing -> text ""
+    ]
+
+toggleIncomeEdition : String -> String -> Html
+toggleIncomeEdition className name =
+  button
+    [ class className
+    , onClick actions.address (UpdateLoggedIn << UpdateAccount <| ToggleIncomeEdition)
+    ]
+    [ text name ]
diff --git a/src/client/View/LoggedIn/Add.elm b/src/client/View/LoggedIn/Add.elm
index bae3853..2167a7f 100644
--- a/src/client/View/LoggedIn/Add.elm
+++ b/src/client/View/LoggedIn/Add.elm
@@ -37,6 +37,7 @@ addPayment model loggedInView =
           in onSubmitPrevDefault serverCommunications.address action
         (resName, resCost) ->
           onSubmitPrevDefault actions.address (UpdateLoggedIn <| UpdateAdd <| AddError (toMaybeError resName) (toMaybeError resCost))
+    , class "addPayment"
     ]
     [ addPaymentName loggedInView.add
     , addPaymentCost model loggedInView.add