dnsmanager-webclient/src/Web/Input.purs

module Web.Input where

import Prelude (($), (<>))
import Web.Field

import DOM.HTML.Indexed.AutocompleteType (AutocompleteType(..))

import DOM.HTML.Indexed as DHI
import Halogen.HTML as HH
import Halogen.HTML.Properties as HP
import Halogen.HTML.Events as HE

import CSSClasses as C

input_classes :: Array HH.ClassName
input_classes = [C.input, C.is_small, C.is_info]

username_input :: forall w i. String -> String -> (String -> i) -> HH.HTML w i
username_input title value action
  = div_field []
      [ div_field_label "username" title
      , div_field_content $ HH.input
        [ HE.onValueInput action
        , HP.type_ HP.InputText
        , HP.value value
        , HP.name "username"
        , HP.autocomplete AutocompleteUsername
        , HP.placeholder "Username"
        , HP.id "username"
        , HP.classes input_classes
        ]
      ]

email_input :: forall w i. String -> String -> (String -> i) -> HH.HTML w i
email_input title value action
  = div_field []
      [ div_field_label "email" title
      , div_field_content $ HH.input
        [ HE.onValueInput action
        , HP.type_ HP.InputEmail
        , HP.value value
        , HP.name "email"
        , HP.autocomplete AutocompleteEmail
        , HP.placeholder "email@example.com"
        , HP.id "email"
        , HP.classes input_classes
        ]
      ]

password_input :: forall w i. String -> String -> (String -> i) -> HH.HTML w i
password_input title value action
  = div_field []
      [ div_field_label "password" title
      , div_field_content $ HH.input
        [ HE.onValueInput action
        , HP.type_ HP.InputPassword
        , HP.value value
        , HP.name "password"
        , HP.autocomplete AutocompleteCurrentPassword
        , HP.placeholder ""
        , HP.id "password"
        , HP.classes input_classes
        ]
      ]

password_input_new :: forall w i. String -> String -> (String -> i) -> HH.HTML w i
password_input_new title value action
  = div_field []
      [ div_field_label "password" title
      , div_field_content $ HH.input
        [ HE.onValueInput action
        , HP.type_ HP.InputPassword
        , HP.value value
        , HP.name "password"
        , HP.autocomplete AutocompleteNewPassword
        , HP.placeholder ""
        , HP.id "password"
        , HP.classes input_classes
        ]
      ]

password_input_confirmation :: forall w i. String -> String -> (String -> i) -> HH.HTML w i
password_input_confirmation title value action
  = div_field []
      [ div_field_label "password_confirmation" title
      , div_field_content $ HH.input
        [ HE.onValueInput action
        , HP.type_ HP.InputPassword
        , HP.value value
        , HP.name "password_confirmation"
        , HP.autocomplete AutocompleteOff
        , HP.placeholder ""
        , HP.id "password_confirmation"
        , HP.classes input_classes
        ]
      ]

token_input :: forall w i. String -> String -> (String -> i) -> HH.HTML w i
token_input title value action
  = div_field []
      [ div_field_label "token" title
      , div_field_content $ HH.input
        [ HE.onValueInput action
        , HP.type_ HP.InputText
        , HP.value value
        , HP.name "token"
        , HP.autocomplete AutocompleteOff
        , HP.placeholder ""
        , HP.id "token"
        , HP.classes input_classes
        ]
      ]

box_input_ :: forall w i.
  (HP.IProp DHI.HTMLinput i) -> String -> String -> String -> (String -> i) -> String -> HH.HTML w i
box_input_ = field_inner false

box_password_ :: forall w i.
  (HP.IProp DHI.HTMLinput i) -> String -> String -> String -> (String -> i) -> String -> HH.HTML w i
box_password_ = field_inner true

box_input :: forall w i. String -> String -> String -> (String -> i) -> String -> HH.HTML w i
box_input = box_input_ (HP.enabled true)

box_password :: forall w i. String -> String -> String -> (String -> i) -> String -> HH.HTML w i
box_password = box_password_ (HP.enabled true)

-- | Basic input field with a read-only side text.
-- |
-- |```
-- |div [field is-horizontal]
-- |  div [field-label normal]
-- |    label [label for-id]
-- |      text
-- |  div [field-body]
-- |    div [has-addons field]
-- |      p [control]
-- |        input
-- |      p [control]
-- |        a [button is-small is-static]
-- |          text
-- |```
input_with_side_text :: forall w i.
  String -> String -> String -> (String -> i) -> String -> String -> HH.HTML w i
input_with_side_text id title placeholder action value sidetext
  = HH.div [HP.classes [C.field, C.is_horizontal]]
      [ HH.div [ HP.classes [C.field_label, C.normal] ]
               [HH.label [ HP.classes [C.label], HP.for id ] [ HH.text title ]]
      , HH.div [ HP.classes [C.field_body] ]
          [ HH.div [ HP.classes [C.has_addons, C.field] ]
              [ HH.p [HP.classes [C.control]]
                  [ HH.input $
                    [ HE.onValueInput action
                    , HP.value value
                    , HP.placeholder placeholder
                    , HP.classes $ input_classes
                    , HP.id id
                    ]
                  ]
              , HH.p [HP.classes [C.control]]
                  [ HH.a [HP.classes [C.button, C.is_small, C.is_static]]
                         [HH.text sidetext] ]
              ]
          ]
      ]

render_input :: forall w i.
  Boolean -> String -> String -> (String -> i) -> String -> (HP.IProp DHI.HTMLinput i) -> HH.HTML w i
render_input password id placeholder action value cond
  = HH.input $
      [ HE.onValueInput action
      , HP.value value
      , HP.placeholder placeholder
      , HP.classes $ input_classes
      , HP.id id
      , cond
      ] <> case password of
        false -> []
        true -> [ HP.type_ HP.InputPassword ]

field_inner :: forall w i.
  Boolean -> (HP.IProp DHI.HTMLinput i) -> String -> String -> String -> (String -> i) -> String -> HH.HTML w i
field_inner ispassword cond id title placeholder action value
  = field_entry id title $ render_input ispassword id placeholder action value cond