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:
parent
6cd75ac184
commit
304f3ae3f1
1 changed files with 39 additions and 11 deletions
|
@ -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
|
||||||
|
|
Loading…
Reference in a new issue