src/client/elm/View/Form.elm


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53

module View.Form exposing
  ( textInput
  )

import Html exposing (..)
import Html.Attributes exposing (..)

import Form exposing (Form)
import Form.Input as Input
import Form.Error as FormError exposing (Error(..))

import Msg exposing (Msg)

import LoggedData exposing (LoggedData)

import Model.Translations as Translations exposing (Translations)

import Utils.Maybe exposing (isJust)

textInput : Translations -> Form String a -> (Html Form.Msg -> Html msg) -> String -> Html msg
textInput translations form htmlMap fieldName =
  let field = Form.getFieldAsString fieldName form
  in  div
        [ classList
            [ ("textInput", True)
            , ("error", isJust field.liveError)
            ]
        ]
        [ htmlMap <|
            Input.textInput
              field
              [ id fieldName
              , classList [ ("filled", isJust field.value) ]
              ]
        , label
            [ for fieldName ]
            [ text (Translations.getMessage fieldName translations) ]
        , case field.liveError of
            Just error -> errorElement translations error
            Nothing -> text ""
        ]

errorElement : Translations -> FormError.Error String -> Html msg
errorElement translations error =
  case error of
    CustomError key ->
      div [ class "errorMessage" ] [ text (Translations.getMessage key translations) ]
    SmallerIntThan n ->
      div [ class "errorMessage" ] [ text (Translations.getParamMessage [toString n] "SmallerIntThan" translations) ]
    GreaterIntThan n ->
      div [ class "errorMessage" ] [ text (Translations.getParamMessage [toString n] "GreaterIntThan" translations) ]
    error ->
      div [ class "errorMessage" ] [ text (Translations.getMessage (toString error) translations) ]