module View.Payments.Add
  ( addPayment
  ) where

import Html as H exposing (..)
import Html.Attributes exposing (..)
import Html.Events exposing (..)
import Reads exposing (readInt)
import Result exposing (..)

import ServerCommunication as SC exposing (serverCommunications)

import Update exposing (..)
import Update.Payment exposing (..)
import Update.Payment.Add exposing (..)

import Model.View.Payment.Add exposing (..)

import View.Events exposing (onSubmitPrevDefault)

import Utils.Maybe exposing (isJust)
import Utils.Either exposing (toMaybeError)

addPayment : AddPayment -> Html
addPayment addPayment =
  H.form
    [ class "add"
    , case (validateName addPayment.name, validateCost addPayment.cost) of
        (Ok name, Ok cost) ->
          onSubmitPrevDefault serverCommunications.address (SC.AddPayment name cost)
        (resName, resCost) ->
          onSubmitPrevDefault actions.address (UpdatePayment <| UpdateAdd <| AddError (toMaybeError resName) (toMaybeError resCost))
    ]
    [ div
        [ class "name" ]
        [ label
            [ for "nameInput" ]
            [ text "Category" ]
        , input
            [ id "nameInput"
            , class (if isJust addPayment.nameError then "error" else "")
            , value addPayment.name
            , on "input" targetValue (Signal.message actions.address << UpdatePayment << UpdateAdd << UpdateName)
            ]
            []
        , case addPayment.nameError of
            Just error ->
              div [ class "errorMessage" ] [ text error ]
            Nothing ->
              text ""
        ]
    , div
        [ class "cost" ]
        [ label
            [ for "costInput" ]
            [ text "Cost" ]
        , input
            [ id "costInput"
            , class (if isJust addPayment.costError then "error" else "")
            , value addPayment.cost
            , on "input" targetValue (Signal.message actions.address << UpdatePayment << UpdateAdd << UpdateCost)
            ]
            []
        , case addPayment.costError of
            Just error ->
              div [ class "errorMessage" ] [ text error ]
            Nothing ->
              text ""
        , button
            [ type' "submit" ]
            [ text "Add" ]
        ]
    ]