save elm capture with api post request, #55

assets/elm.json

@@ -8,10 +8,13 @@
         "direct": {
             "elm/browser": "1.0.2",
             "elm/core": "1.0.4",
-            "elm/html": "1.0.0"
+            "elm/html": "1.0.0",
+            "elm/http": "2.0.0",
+            "elm/json": "1.1.3"
         },
         "indirect": {
-            "elm/json": "1.1.3",
+            "elm/bytes": "1.0.8",
+            "elm/file": "1.0.5",
             "elm/time": "1.0.0",
             "elm/url": "1.0.0",
             "elm/virtual-dom": "1.0.2"

assets/src/Main.elm

@@ -1,9 +1,13 @@
 module Main exposing (main)
 
 import Browser
-import Html exposing (Html, button, div, text, textarea)
-import Html.Events exposing (onInput)
-import Html.Attributes exposing (class)
+import Html exposing (Html, button, div, p, text, textarea)
+import Html.Attributes exposing (class, value)
+import Html.Events exposing (onClick, onInput)
+import Http exposing (..)
+import Json.Decode as JD
+import Json.Encode as JE
+
 
 main =
     Browser.element
@@ -19,7 +23,7 @@ main =
 
 
 type alias Model =
-    { capture : String }
+    { capture : String, message : String }
 
 
 
@@ -28,6 +32,8 @@ type alias Model =
 
 type Msg
     = Capture String
+    | CreateCapture
+    | SaveCaptureResult (Result Http.Error String)
 
 
 
@@ -36,7 +42,7 @@ type Msg
 
 initModel : Model
 initModel =
-    { capture = "" }
+    { capture = "", message = "" }
 
 
 type alias Flags =
@@ -54,6 +60,34 @@ update msg model =
         Capture text ->
             ( { model | capture = text }, Cmd.none )
 
+        CreateCapture ->
+            ( model, saveCapture model.capture )
+
+        SaveCaptureResult (Ok response) ->
+            ( { model | capture = "", message = "Capture saved" }, Cmd.none )
+
+        SaveCaptureResult (Err e) ->
+            ( { model | message = "The capture couldn't be saved" }, Cmd.none )
+
+
+saveCapture : String -> Cmd Msg
+saveCapture capture =
+    Http.post
+        { url = "/api/captures/create"
+        , body = Http.jsonBody (captureEncode capture)
+        , expect = Http.expectJson SaveCaptureResult captureDecoder
+        }
+
+
+captureEncode : String -> JE.Value
+captureEncode capture =
+    JE.object [ ( "text", JE.string capture ) ]
+
+
+captureDecoder : JD.Decoder String
+captureDecoder =
+    JD.field "text" JD.string
+
 
 subscriptions : Model -> Sub Msg
 subscriptions _ =
@@ -63,6 +97,7 @@ subscriptions _ =
 view : Model -> Html Msg
 view model =
     div []
-        [ textarea [ onInput Capture ] []
-        , button [class "db"] [ text "Save capture" ]
+        [ p [] [ text model.message ]
+        , textarea [ onInput Capture, value model.capture ] []
+        , button [ class "db", onClick CreateCapture ] [ text "Save capture" ]
         ]

assets/webpack.config.js

@@ -37,9 +37,7 @@ module.exports = (env, options) => ({
         exclude: [/elm-stuff/, /node_modules/],
         use: {
           loader: 'elm-webpack-loader',
-          options: {
-            optimize: true
-          }
+          options: {}
         }
       }
     ]