Features/categories

3 files changed, 69 insertions, 25 deletions

diff --git a/src/client/elm/View/Events.elm b/src/client/elm/View/Events.elm
index c50fe98..d71d67d 100644
--- a/src/client/elm/View/Events.elm
+++ b/src/client/elm/View/Events.elm
@@ -2,7 +2,7 @@ module View.Events exposing
   ( onSubmitPrevDefault
   )
 
-import Json.Decode as Json
+import Json.Decode as Decode
 import Html exposing (..)
 import Html.Events exposing (..)
 import Html.Attributes exposing (..)
@@ -12,4 +12,4 @@ onSubmitPrevDefault value =
   onWithOptions
     "submit"
     { defaultOptions | preventDefault = True }
-    (Json.succeed value)
+    (Decode.succeed value)
diff --git a/src/client/elm/View/Form.elm b/src/client/elm/View/Form.elm
index dcde47d..7a4965d 100644
--- a/src/client/elm/View/Form.elm
+++ b/src/client/elm/View/Form.elm
@@ -1,5 +1,7 @@
 module View.Form exposing
   ( textInput
+  , colorInput
+  , selectInput
   , radioInputs
   , hiddenSubmit
   )
@@ -13,7 +15,7 @@ import View.Color as Color
 
 import Form exposing (Form, FieldState)
 import Form.Input as Input
-import Form.Error as FormError exposing (Error(..))
+import Form.Error as FormError exposing (ErrorValue(..))
 import Form.Field as Field
 
 import Msg exposing (Msg)
@@ -27,6 +29,7 @@ import Utils.Maybe exposing (isJust)
 textInput : Translations -> Form String a -> String -> String -> Html Form.Msg
 textInput translations form formName fieldName =
   let field = Form.getFieldAsString fieldName form
+      fieldId = formName ++ fieldName
   in  div
         [ classList
             [ ("textInput", True)
@@ -35,21 +38,39 @@ textInput translations form formName fieldName =
         ]
         [ Input.textInput
             field
-            [ id (formName ++ fieldName)
+            [ id fieldId
             , classList [ ("filled", isJust field.value) ]
+            , value (Maybe.withDefault "" field.value)
             ]
         , label
-            [ for (formName ++ fieldName) ]
-            [ text (Translations.getMessage translations (formName ++ fieldName)) ]
+            [ for fieldId ]
+            [ text (Translations.getMessage translations fieldId) ]
         , button
-            [ type' "button"
-            , onClick (Form.Input fieldName Field.EmptyField)
+            [ type_ "button"
+            , onClick (Form.Input fieldName Form.Text Field.EmptyField)
             , tabindex -1
             ]
             [ FontAwesome.times Color.silver 15 ]
-        , case field.liveError of
-            Just error -> formError translations error
-            Nothing -> text ""
+        , formError translations field
+        ]
+
+colorInput : Translations -> Form String a -> String -> String -> Html Form.Msg
+colorInput translations form formName fieldName =
+  let field = Form.getFieldAsString fieldName form
+  in  div
+        [ classList
+            [ ("colorInput", True)
+            , ("error", isJust field.liveError)
+            ]
+        ]
+        [ label
+            [ for (formName ++ fieldName) ]
+            [ text (Translations.getMessage translations (formName ++ fieldName)) ]
+        , Input.textInput
+            field
+            [ id (formName ++ fieldName)
+            , type_ "color"
+            ]
         ]
 
 radioInputs : Translations -> Form String a -> String -> String -> List String -> Html Form.Msg
@@ -67,9 +88,7 @@ radioInputs translations form formName radioName fieldNames =
         , div
             [ class "radioInputs" ]
             (List.map (radioInput translations field formName) fieldNames)
-        , case field.liveError of
-            Just error -> formError translations error
-            Nothing -> text ""
+        , formError translations field
         ]
 
 radioInput : Translations -> FieldState String String -> String -> String -> Html Form.Msg
@@ -89,17 +108,41 @@ radioInput translations field formName fieldName =
         ]
     ]
 
-formError : Translations -> FormError.Error String -> Html msg
-formError translations error =
-  let errorElement error params =
-        div
-          [ class "errorMessage" ]
-          [ text (Translations.getParamMessage params translations error) ]
-  in  case error of
-        CustomError key -> errorElement key []
-        SmallerIntThan n -> errorElement "SmallerIntThan" [toString n]
-        GreaterIntThan n -> errorElement "GreaterIntThan" [toString n]
-        error -> errorElement (toString error) []
+selectInput : Translations -> Form String a -> String -> String -> List (String, String) -> Html Form.Msg
+selectInput translations form formName selectName options =
+  let field = Form.getFieldAsString selectName form
+      fieldId = formName ++ selectName
+  in  div
+        [ classList
+            [ ("selectInput", True)
+            , ("error", isJust field.liveError)
+            ]
+        ]
+        [ label
+            [ for fieldId ]
+            [ text (Translations.getMessage translations fieldId) ]
+        , Input.selectInput
+            (("", "") :: options)
+            field
+            [ id fieldId ]
+        , formError translations field
+        ]
+
+formError : Translations -> FieldState String a -> Html msg
+formError translations field =
+  case field.liveError of
+    Just error ->
+      let errorElement error params =
+            div
+              [ class "errorMessage" ]
+              [ text (Translations.getParamMessage params translations error) ]
+      in  case error of
+            CustomError key -> errorElement key []
+            SmallerIntThan n -> errorElement "SmallerIntThan" [toString n]
+            GreaterIntThan n -> errorElement "GreaterIntThan" [toString n]
+            error -> errorElement (toString error) []
+    Nothing ->
+      text ""
 
 hiddenSubmit : msg -> Html msg
 hiddenSubmit msg =
diff --git a/src/client/elm/View/Header.elm b/src/client/elm/View/Header.elm
index 08a429f..12fb87c 100644
--- a/src/client/elm/View/Header.elm
+++ b/src/client/elm/View/Header.elm
@@ -37,6 +37,7 @@ view model =
              LoggedInView { me, users } ->
                [ item Home "PaymentsTitle"
                , item Income "Income"
+               , item Categories "Categories"
                , item Statistics "Statistics"
                , div
                    [ class "nameSignOut" ]