Design income form

6 files changed, 52 insertions, 66 deletions

diff --git a/src/client/elm/LoggedIn/Home/View/Paging.elm b/src/client/elm/LoggedIn/Home/View/Paging.elm
index 9166d23..fb78810 100644
--- a/src/client/elm/LoggedIn/Home/View/Paging.elm
+++ b/src/client/elm/LoggedIn/Home/View/Paging.elm
@@ -60,7 +60,7 @@ firstPage homeModel =
         ]
     , onClick (Msg.UpdateLoggedIn << LoggedInMsg.HomeMsg << HomeMsg.UpdatePage <| 1)
     ]
-    [ FontAwesome.fast_backward grey 20 ]
+    [ FontAwesome.fast_backward grey 15 ]
 
 previousPage : HomeModel.Model -> Html Msg
 previousPage homeModel =
@@ -71,7 +71,7 @@ previousPage homeModel =
           then (Msg.UpdateLoggedIn << LoggedInMsg.HomeMsg << HomeMsg.UpdatePage <| homeModel.currentPage - 1)
           else Msg.NoOp
     ]
-    [ FontAwesome.backward grey 20 ]
+    [ FontAwesome.backward grey 15 ]
 
 nextPage : HomeModel.Model -> Int -> Html Msg
 nextPage homeModel maxPage =
@@ -82,7 +82,7 @@ nextPage homeModel maxPage =
           then (Msg.UpdateLoggedIn << LoggedInMsg.HomeMsg << HomeMsg.UpdatePage <| homeModel.currentPage + 1)
           else Msg.NoOp
     ]
-    [ FontAwesome.forward grey 20 ]
+    [ FontAwesome.forward grey 15 ]
 
 lastPage : HomeModel.Model -> Int -> Html Msg
 lastPage homeModel maxPage =
@@ -90,7 +90,7 @@ lastPage homeModel maxPage =
     [ class "page"
     , onClick (Msg.UpdateLoggedIn << LoggedInMsg.HomeMsg << HomeMsg.UpdatePage <| maxPage)
     ]
-    [ FontAwesome.fast_forward grey 20 ]
+    [ FontAwesome.fast_forward grey 15 ]
 
 paymentsPage : HomeModel.Model -> Int -> Html Msg
 paymentsPage homeModel page =
diff --git a/src/client/elm/LoggedIn/Income/Model.elm b/src/client/elm/LoggedIn/Income/Model.elm
index bc09f0e..873eaf1 100644
--- a/src/client/elm/LoggedIn/Income/Model.elm
+++ b/src/client/elm/LoggedIn/Income/Model.elm
@@ -5,20 +5,20 @@ module LoggedIn.Income.Model exposing
   )
 
 import String exposing (toInt, split)
-import Date exposing (Date)
+import Date
+import Time exposing (Time)
 import Date.Extra.Create exposing (dateFromFields)
-import Utils.Date exposing (numToMonth)
+import Date.Extra.Core exposing (intToMonth)
 
 import Form exposing (Form)
 import Form.Validate as Validate exposing (..)
-import Form.Error exposing (Error(InvalidString))
 
 type alias Model =
-  { addIncome : Form () AddIncome
+  { addIncome : Form String AddIncome
   }
 
 type alias AddIncome =
-  { creation : Date
+  { time : Time
   , amount : Int
   }
 
@@ -27,20 +27,20 @@ init =
   { addIncome = Form.initial [] validate
   }
 
-validate : Validation () AddIncome
+validate : Validation String AddIncome
 validate =
   form2 AddIncome
-    (get "creation" dateValidation)
+    (get "creation" timeValidation)
     (get "amount" (int `andThen` (minInt 1)))
 
-dateValidation : Validation () Date
-dateValidation =
+timeValidation : Validation String Time
+timeValidation =
   customValidation string (\str ->
     case split "/" str of
       [day, month, year] ->
         case (toInt day, toInt month, toInt year) of
           (Ok dayNum, Ok monthNum, Ok yearNum) ->
-            Ok (dateFromFields yearNum (numToMonth monthNum) dayNum 0 0 0 0)
-          _ -> Err InvalidString
-      _ -> Err InvalidString
+            Ok (Date.toTime (dateFromFields yearNum (intToMonth monthNum) dayNum 0 0 0 0))
+          _ -> Err (customError "InvalidDate")
+      _ -> Err (customError "InvalidDate")
   )
diff --git a/src/client/elm/LoggedIn/Income/View.elm b/src/client/elm/LoggedIn/Income/View.elm
index 036cd80..d5863ab 100644
--- a/src/client/elm/LoggedIn/Income/View.elm
+++ b/src/client/elm/LoggedIn/Income/View.elm
@@ -5,13 +5,15 @@ module LoggedIn.Income.View exposing
 import Dict
 import Date
 import Time exposing (Time)
+import Color
+
+import FontAwesome
 
-import Html.App as Html
 import Html exposing (..)
 import Html.Events exposing (..)
 import Html.Attributes exposing (..)
+import Html.App as Html
 import Form exposing (Form)
-import Form.Input as Input
 
 import Msg exposing (Msg)
 
@@ -29,10 +31,10 @@ import LoggedIn.Income.Msg as IncomeMsg
 import LoggedIn.View.Date exposing (renderShortDate)
 import LoggedIn.View.Format as Format
 
-import Utils.Maybe exposing (isJust)
-
 import LoggedIn.View.Date exposing (renderLongDate)
 import View.Events exposing (onSubmitPrevDefault)
+import View.Form as Form
+import View.Color as Color
 
 view : LoggedData -> IncomeModel.Model -> Html Msg
 view loggedData incomeModel =
@@ -41,9 +43,8 @@ view loggedData incomeModel =
     [ case useIncomesFrom loggedData.users loggedData.incomes loggedData.payments of
         Just since -> cumulativeIncomesView loggedData since
         Nothing -> text ""
-    , h1 [] [ text <| getMessage "AddIncome" loggedData.translations ]
-    , addIncomeView loggedData incomeModel.addIncome
     , h1 [] [ text <| getMessage "MonthlyNetIncomes" loggedData.translations ]
+    , addIncomeView loggedData incomeModel.addIncome
     , incomesView loggedData
     ]
 
@@ -71,45 +72,31 @@ cumulativeIncomesView loggedData since =
             )
         ]
 
-addIncomeView : LoggedData -> Form () IncomeModel.AddIncome -> Html Msg
+addIncomeView : LoggedData -> Form String IncomeModel.AddIncome -> Html Msg
 addIncomeView loggedData addIncome =
-  let
-    errorFor error field =
-      if isJust field.liveError
-        then div [ class "error" ] [ text (getMessage error loggedData.translations) ]
-        else text ""
-    creation = Form.getFieldAsString "creation" addIncome
-    amount = Form.getFieldAsString "amount" addIncome
-    htmlMap = Html.map (Msg.UpdateLoggedIn << LoggedInMsg.IncomeMsg << IncomeMsg.AddIncomeMsg)
-  in
-    Html.form
-      [ onSubmitPrevDefault Msg.NoOp ]
-      [ label [] [ text (getMessage "Creation" loggedData.translations) ]
-      , htmlMap <| Input.textInput creation []
-      , errorFor "DateValidationError" creation
-
-      , label [] [ text (getMessage "Amount" loggedData.translations) ]
-      , htmlMap <| Input.textInput amount []
-      , errorFor "IncomeValidationError" amount
-
-      , button
-          [ case Form.getOutput addIncome of
-              Just data ->
-                onClick (Msg.UpdateLoggedIn <| LoggedInMsg.AddIncome data.creation data.amount)
-              Nothing ->
-                onClick (Msg.UpdateLoggedIn <| LoggedInMsg.IncomeMsg <| IncomeMsg.AddIncomeMsg <| Form.Submit)
-          ]
-          [ text (getMessage "Add" loggedData.translations) ]
-      ]
+  let htmlMap = Html.map (Msg.UpdateLoggedIn << LoggedInMsg.IncomeMsg << IncomeMsg.AddIncomeMsg)
+  in  Html.form
+        [ onSubmitPrevDefault Msg.NoOp ]
+        [ Form.textInput loggedData.translations addIncome htmlMap "creation"
+        , Form.textInput loggedData.translations addIncome htmlMap "amount"
+        , button
+            [ case Form.getOutput addIncome of
+                Just data ->
+                  onClick (Msg.UpdateLoggedIn <| LoggedInMsg.AddIncome data.time data.amount)
+                Nothing ->
+                  onClick (Msg.UpdateLoggedIn <| LoggedInMsg.IncomeMsg <| IncomeMsg.AddIncomeMsg <| Form.Submit)
+            ]
+            [ text (getMessage "Add" loggedData.translations) ]
+        ]
 
 incomesView : LoggedData -> Html Msg
 incomesView loggedData =
   ul
-    []
+    [ class "incomes" ]
     ( loggedData.incomes
         |> Dict.toList
         |> List.filter ((==) loggedData.me << .userId << snd)
-        |> List.sortBy (.creation << snd)
+        |> List.sortBy (.time << snd)
         |> List.reverse
         |> List.map (incomeView loggedData)
     )
@@ -118,11 +105,10 @@ incomeView : LoggedData -> (IncomeId, Income) -> Html Msg
 incomeView loggedData (incomeId, income) =
   li
     []
-    [ text <| renderShortDate (Date.fromTime income.creation) loggedData.translations
+    [ text <| renderShortDate (Date.fromTime income.time) loggedData.translations
     , text "    −    "
     , text <| Format.price loggedData.conf income.amount
-    , text "    −    "
     , button
         [ onClick (Msg.UpdateLoggedIn <| LoggedInMsg.DeleteIncome incomeId) ]
-        [ text "x" ]
+        [ FontAwesome.remove Color.chestnutRose 14 ]
     ]
diff --git a/src/client/elm/LoggedIn/Msg.elm b/src/client/elm/LoggedIn/Msg.elm
index b83d486..6f6dab0 100644
--- a/src/client/elm/LoggedIn/Msg.elm
+++ b/src/client/elm/LoggedIn/Msg.elm
@@ -2,7 +2,7 @@ module LoggedIn.Msg exposing
   ( Msg(..)
   )
 
-import Date exposing (Date)
+import Time exposing (Time)
 
 import Model.Payment exposing (Payment, PaymentId, Frequency)
 import Model.Income exposing (IncomeId)
@@ -21,8 +21,8 @@ type Msg =
   | DeletePayment PaymentId
   | ValidateDeletePayment PaymentId
 
-  | AddIncome Date Int
-  | ValidateAddIncome IncomeId Date Int
+  | AddIncome Time Int
+  | ValidateAddIncome IncomeId Time Int
 
   | DeleteIncome IncomeId
   | ValidateDeleteIncome IncomeId
diff --git a/src/client/elm/LoggedIn/Update.elm b/src/client/elm/LoggedIn/Update.elm
index 564d6fc..6d8869a 100644
--- a/src/client/elm/LoggedIn/Update.elm
+++ b/src/client/elm/LoggedIn/Update.elm
@@ -106,16 +106,16 @@ update model action loggedIn =
           , Cmd.none
           )
 
-        LoggedInMsg.AddIncome creation amount ->
+        LoggedInMsg.AddIncome time amount ->
           ( loggedIn
-          , Server.addIncome creation amount
+          , Server.addIncome time amount
               |> Task.perform
                    (always LoggedInMsg.NoOp)
-                   (\incomeId -> (LoggedInMsg.ValidateAddIncome incomeId creation amount))
+                   (\incomeId -> (LoggedInMsg.ValidateAddIncome incomeId time amount))
           )
 
-        LoggedInMsg.ValidateAddIncome incomeId creation amount ->
-          let newIncome = { userId = loggedIn.me, creation = (Date.toTime creation), amount = amount }
+        LoggedInMsg.ValidateAddIncome incomeId time amount ->
+          let newIncome = { userId = loggedIn.me, time = time, amount = amount }
           in  ( { loggedIn | incomes = Dict.insert incomeId newIncome loggedIn.incomes }
               , Cmd.none
               )
diff --git a/src/client/elm/LoggedIn/View/Date.elm b/src/client/elm/LoggedIn/View/Date.elm
index 783f10c..8e4e872 100644
--- a/src/client/elm/LoggedIn/View/Date.elm
+++ b/src/client/elm/LoggedIn/View/Date.elm
@@ -5,7 +5,7 @@ module LoggedIn.View.Date exposing
   )
 
 import Date exposing (..)
-import Utils.Date exposing (monthToNum)
+import Date.Extra.Core as Date
 import String
 
 import Model.Translations exposing (..)
@@ -14,7 +14,7 @@ renderShortDate : Date -> Translations -> String
 renderShortDate date translations =
   let params =
         [ String.pad 2 '0' (toString (Date.day date))
-        , String.pad 2 '0' (toString (monthToNum (Date.month date)))
+        , String.pad 2 '0' (toString (Date.monthToInt (Date.month date)))
         , toString (Date.year date)
         ]
   in  getParamMessage params "ShortDate" translations