feat(elm): Implement task completion handling

Adds a clickable area to the cards that will inform the backend of a
task being completed.

This of course still looks completely terrible because I don't really
know how frontend works.
This commit is contained in:
Vincent Ambo 2017-12-20 20:03:09 +01:00
parent 6cd75ac184
commit 304f3ae3f1

View file

@ -14,6 +14,7 @@ import Material.Color as Color
import Material.Grid exposing (grid, cell, size, Device(..)) import Material.Grid exposing (grid, cell, size, Device(..))
import Material.Layout as Layout import Material.Layout as Layout
import Material.Scheme as Scheme import Material.Scheme as Scheme
import Material.Options as Options
-- API interface to Gemma -- API interface to Gemma
@ -55,6 +56,20 @@ loadTasks =
Http.send NewTasks request Http.send NewTasks request
completeTask : Task -> Cmd Msg
completeTask task =
let
request =
Http.getString
(String.concat
[ "http://localhost:4242/complete?task="
, task.name
]
)
in
Http.send (\_ -> LoadTasks) request
-- Elm architecture implementation -- Elm architecture implementation
@ -64,6 +79,7 @@ type Msg
| LoadTasks | LoadTasks
| NewTasks (Result Http.Error (List Task)) | NewTasks (Result Http.Error (List Task))
| Mdl (Material.Msg Msg) | Mdl (Material.Msg Msg)
| Complete Task
type alias Model = type alias Model =
@ -79,6 +95,9 @@ update msg model =
LoadTasks -> LoadTasks ->
( model, loadTasks ) ( model, loadTasks )
Complete task ->
( model, completeTask task )
NewTasks (Ok tasks) -> NewTasks (Ok tasks) ->
( { model | tasks = tasks, error = Nothing }, Cmd.none ) ( { model | tasks = tasks, error = Nothing }, Cmd.none )
@ -107,15 +126,30 @@ taskColor task =
Color.Yellow Color.Yellow
within task =
String.concat
[ "This task should be completed within "
, toString task.remaining
, " days."
]
renderTask : Task -> Html Msg renderTask : Task -> Html Msg
renderTask task = renderTask task =
Card.view Card.view
[ Color.background (Color.color (taskColor task) Color.S800) ] [ Color.background (Color.color (taskColor task) Color.S800) ]
[ Card.title [] [ Card.head [ white ] [ text task.name ] ] ] [ Card.title [] [ Card.head [ white ] [ text task.name ] ]
, Card.text [ white ]
[ text (Maybe.withDefault "" task.description)
, text (within task)
-- div [] [ span [] [ ] ] ]
, Card.actions
[ Card.border
, white
, Options.onClick (Complete task)
]
[ text "Done!" ]
]
gemmaView : Model -> Html Msg gemmaView : Model -> Html Msg
@ -131,12 +165,6 @@ view model =
gemmaView model |> Scheme.top gemmaView model |> Scheme.top
-- div [ style [ ( "padding", "2rem" ) ] ]
--
-- |> Scheme.top
main : Program Never Model Msg main : Program Never Model Msg
main = main =
let let