From 7ec5b5601fd655643ad0fe1120d56bc9b71674f6 Mon Sep 17 00:00:00 2001 From: Joris Date: Sun, 26 Jun 2016 15:01:14 +0200 Subject: Set up enter form submi behaviour on dialog --- src/client/elm/Dialog.elm | 31 +++++++++------------- src/client/elm/Dialog/AddPayment/View.elm | 41 ++++++++++++++++------------- src/client/elm/LoggedIn/Home/View/Table.elm | 2 +- src/client/elm/LoggedIn/Income/View.elm | 2 +- src/client/elm/View/Form.elm | 12 ++++++++- 5 files changed, 48 insertions(+), 40 deletions(-) (limited to 'src/client') diff --git a/src/client/elm/Dialog.elm b/src/client/elm/Dialog.elm index 21286eb..3b9e93b 100644 --- a/src/client/elm/Dialog.elm +++ b/src/client/elm/Dialog.elm @@ -27,7 +27,7 @@ type alias Config model msg = , title : String , body : model -> Html msg , confirm : String - , confirmMsg : model -> Result msg msg + , confirmMsg : model -> msg , undo : String } @@ -42,10 +42,10 @@ init model mapMsg = type Msg model modelMsg msg = NoOp - | UpdateModel modelMsg + | Update modelMsg + | UpdateAndClose msg | OpenWithUpdate (Config model msg) modelMsg | Open (Config model msg) - | ConfirmMsg (model -> Result msg msg) | Close update : (modelMsg -> model -> (model, Cmd modelMsg)) -> Msg model modelMsg msg -> model -> Model model modelMsg msg -> (Model model modelMsg msg, Cmd msg) @@ -56,13 +56,19 @@ update updateModel msg baseModel model = , Cmd.none ) - UpdateModel modelMsg -> + Update modelMsg -> case updateModel modelMsg baseModel of (newModel, effects) -> ( { model | model = newModel } - , Cmd.map (model.mapMsg << UpdateModel) effects + , Cmd.map (model.mapMsg << Update) effects ) + UpdateAndClose msg -> + ( { model | config = Nothing } + , Task.succeed () + |> Task.perform (always msg) (always msg) + ) + OpenWithUpdate config modelMsg -> case updateModel modelMsg baseModel of (newModel, effects) -> @@ -70,7 +76,7 @@ update updateModel msg baseModel model = | model = newModel , config = Just config } - , Cmd.map (model.mapMsg << UpdateModel) effects + , Cmd.map (model.mapMsg << Update) effects ) Open config -> @@ -78,17 +84,6 @@ update updateModel msg baseModel model = , Cmd.none ) - ConfirmMsg confirmMsg -> - case confirmMsg baseModel of - Ok msg -> - ( { model | config = Nothing } - , Task.perform (always msg) (always msg) (Task.succeed NoOp) - ) - Err msg -> - ( model - , Task.perform (always msg) (always msg) (Task.succeed NoOp) - ) - Close -> ( { model | config = Nothing } , Cmd.none @@ -156,7 +151,7 @@ dialog model mapMsg { className, title, body, confirm, confirmMsg, undo } = ] [ button [ class "confirm" - , onClick (mapMsg <| ConfirmMsg confirmMsg) + , onClick (confirmMsg model) , style [ ("margin-right", "15px") ] diff --git a/src/client/elm/Dialog/AddPayment/View.elm b/src/client/elm/Dialog/AddPayment/View.elm index 96686b8..30df617 100644 --- a/src/client/elm/Dialog/AddPayment/View.elm +++ b/src/client/elm/Dialog/AddPayment/View.elm @@ -38,13 +38,7 @@ view loggedData frequency = , title = getMessage "AddPayment" loggedData.translations , body = \model -> addPaymentForm loggedData model.addPayment , confirm = getMessage "Confirm" loggedData.translations - , confirmMsg = \model -> ( - case Form.getOutput model.addPayment of - Just data -> - Ok (Msg.UpdateLoggedIn <| LoggedInMsg.AddPayment data.name data.cost data.date data.frequency) - Nothing -> - Err (Msg.Dialog <| Dialog.UpdateModel <| DialogMsg.AddPaymentMsg <| Form.Submit) - ) + , confirmMsg = submitForm << .addPayment , undo = getMessage "Undo" loggedData.translations } currentDate = Date.fromTime loggedData.currentTime @@ -56,15 +50,24 @@ view loggedData frequency = addPaymentForm : LoggedData -> Form String DialogModel.AddPayment -> Html Msg addPaymentForm loggedData addPayment = - Html.map (Msg.Dialog << Dialog.UpdateModel << DialogMsg.AddPaymentMsg) <| - Html.form - [ class "addPayment" - , onSubmitPrevDefault Form.NoOp - ] - [ Form.textInput loggedData.translations addPayment "payment" "name" - , Form.textInput loggedData.translations addPayment "payment" "cost" - , if Form.frequency addPayment == Punctual - then Form.textInput loggedData.translations addPayment "payment" "date" - else text "" - , Form.radioInputs loggedData.translations addPayment "payment" "frequency" [ toString Punctual, toString Monthly ] - ] + let htmlMap = Html.map (Msg.Dialog << Dialog.Update << DialogMsg.AddPaymentMsg) + in Html.form + [ class "addPayment" + , onSubmitPrevDefault Msg.NoOp + ] + [ htmlMap <| Form.textInput loggedData.translations addPayment "payment" "name" + , htmlMap <| Form.textInput loggedData.translations addPayment "payment" "cost" + , if Form.frequency addPayment == Punctual + then htmlMap <| Form.textInput loggedData.translations addPayment "payment" "date" + else text "" + , htmlMap <| Form.radioInputs loggedData.translations addPayment "payment" "frequency" [ toString Punctual, toString Monthly ] + , Form.hiddenSubmit (submitForm addPayment) + ] + +submitForm : Form String DialogModel.AddPayment -> Msg +submitForm addPayment = + case Form.getOutput addPayment of + Just data -> + Msg.Dialog <| Dialog.UpdateAndClose <| Msg.UpdateLoggedIn <| LoggedInMsg.AddPayment data.name data.cost data.date data.frequency + Nothing -> + Msg.Dialog <| Dialog.Update <| DialogMsg.AddPaymentMsg <| Form.Submit diff --git a/src/client/elm/LoggedIn/Home/View/Table.elm b/src/client/elm/LoggedIn/Home/View/Table.elm index b86976c..282f00a 100644 --- a/src/client/elm/LoggedIn/Home/View/Table.elm +++ b/src/client/elm/LoggedIn/Home/View/Table.elm @@ -106,7 +106,7 @@ paymentLine loggedData homeModel frequency payment = , title = getMessage "ConfirmPaymentDelete" loggedData.translations , body = always <| text "" , confirm = getMessage "Confirm" loggedData.translations - , confirmMsg = always <| Ok <| Msg.UpdateLoggedIn <| LoggedInMsg.DeletePayment payment.id + , confirmMsg = always <| Msg.Dialog <| Dialog.UpdateAndClose <| Msg.UpdateLoggedIn <| LoggedInMsg.DeletePayment payment.id , undo = getMessage "Undo" loggedData.translations } in button diff --git a/src/client/elm/LoggedIn/Income/View.elm b/src/client/elm/LoggedIn/Income/View.elm index f6cf8f8..6466f70 100644 --- a/src/client/elm/LoggedIn/Income/View.elm +++ b/src/client/elm/LoggedIn/Income/View.elm @@ -117,7 +117,7 @@ incomeView loggedData (incomeId, income) = , title = getMessage "ConfirmIncomeDelete" loggedData.translations , body = always <| text "" , confirm = getMessage "Confirm" loggedData.translations - , confirmMsg = always <| Ok <| Msg.UpdateLoggedIn <| LoggedInMsg.DeleteIncome incomeId + , confirmMsg = always <| Msg.Dialog <| Dialog.UpdateAndClose <| Msg.UpdateLoggedIn <| LoggedInMsg.DeleteIncome incomeId , undo = getMessage "Undo" loggedData.translations } in button diff --git a/src/client/elm/View/Form.elm b/src/client/elm/View/Form.elm index 1522b1f..5f642fb 100644 --- a/src/client/elm/View/Form.elm +++ b/src/client/elm/View/Form.elm @@ -1,6 +1,7 @@ module View.Form exposing ( textInput , radioInputs + , hiddenSubmit ) import Html exposing (..) @@ -41,7 +42,8 @@ textInput translations form formName fieldName = [ for (formName ++ fieldName) ] [ text (Translations.getMessage (formName ++ fieldName) translations) ] , button - [ onClick (Form.Input fieldName Field.EmptyField) + [ type' "button" + , onClick (Form.Input fieldName Field.EmptyField) , tabindex -1 ] [ FontAwesome.times Color.silver 15 ] @@ -98,3 +100,11 @@ formError translations error = SmallerIntThan n -> errorElement "SmallerIntThan" [toString n] GreaterIntThan n -> errorElement "GreaterIntThan" [toString n] error -> errorElement (toString error) [] + +hiddenSubmit : msg -> Html msg +hiddenSubmit msg = + button + [ style [ ("display", "none") ] + , onClick msg + ] + [] -- cgit v1.2.3