Commits: 2
Evolve the Main program into Browser.element
index d1066f3..939218f 100644
--- a/src/Main.elm
+++ b/src/Main.elm
@@ -12,13 +12,18 @@ import Result.Extra as Result
=
=
=main =
- Browser.sandbox
+ Browser.element
= { init = init
= , view = view
= , update = update
+ , subscriptions = subscriptions
= }
=
=
+type alias Flags =
+ ()
+
+
=type alias Model =
= { counter : Counter.Model }
=
@@ -27,9 +32,12 @@ type Msg
= = CounterMsg Counter.Msg
=
=
-init =
- { counter = Counter.init
- }
+init : Flags -> ( Model, Cmd Msg )
+init flags =
+ ( { counter = Counter.init
+ }
+ , Cmd.none
+ )
=
=
=view : Model -> Html Msg
@@ -42,10 +50,18 @@ view model =
= |> Element.layout []
=
=
+update : Msg -> Model -> ( Model, Cmd Msg )
=update msg model =
= case msg of
= CounterMsg m ->
- { model | counter = Counter.update m model.counter }
+ ( { model | counter = Counter.update m model.counter }
+ , Cmd.none
+ )
+
+
+subscriptions : Model -> Sub Msg
+subscriptions model =
+ Sub.none
=
=
=type alias Styling =Separate markup content to own file, fetch it with HTTP
The newly released elm/http 2.0.0 requires updated versions of elm/core and elm/json.
index d305cfa..c770fd4 100644
--- a/elm.json
+++ b/elm.json
@@ -7,9 +7,10 @@
= "dependencies": {
= "direct": {
= "elm/browser": "1.0.0",
- "elm/core": "1.0.0",
+ "elm/core": "1.0.2",
= "elm/html": "1.0.0",
- "elm/json": "1.0.0",
+ "elm/http": "2.0.0",
+ "elm/json": "1.1.2",
= "elm/svg": "1.0.1",
= "elm-community/basics-extra": "4.0.0",
= "elm-community/list-extra": "8.1.0",
@@ -22,6 +23,8 @@
= "turboMaCk/any-dict": "1.0.1"
= },
= "indirect": {
+ "elm/bytes": "1.0.7",
+ "elm/file": "1.0.1",
= "elm/parser": "1.1.0",
= "elm/time": "1.0.0",
= "elm/url": "1.0.0",
@@ -35,4 +38,4 @@
= "direct": {},
= "indirect": {}
= }
-}
\ No newline at end of file
+}new file mode 100644
index 0000000..5dc347c
--- /dev/null
+++ b/index.txt
@@ -0,0 +1,39 @@
+| header
+ To do:
+
+Steps to reproduce the tree:
+
+Make a dot
+
+ Centered (Elm UI, viewBox, cartesian coordinates)
+
+Make a line
+
+ Play with transformations (union types)
+
+Gradients
+
+Multiple lines
+
+ Rosettes (different kinds)
+
+Groups and transformations
+
+ Spiral (recursion)
+
+Tree
+
+
+| header
+ Before the course begins
+
+Setup the development environment
+
+| list
+ - Elm
+ - Node.js
+
+
+| counter
+
+Last sentenceindex 939218f..b8450ee 100644
--- a/src/Main.elm
+++ b/src/Main.elm
@@ -6,6 +6,7 @@ import Element exposing (Element)
=import Element.Border as Border
=import Element.Input as Input
=import Html exposing (Html)
+import Http
=import Mark
=import Mark.Custom
=import Result.Extra as Result
@@ -25,34 +26,64 @@ type alias Flags =
=
=
=type alias Model =
- { counter : Counter.Model }
+ { markup : Maybe String
+ , counter : Counter.Model
+ }
=
=
=type Msg
- = CounterMsg Counter.Msg
+ = DocumentFetched (Result Http.Error String)
+ | CounterMsg Counter.Msg
=
=
=init : Flags -> ( Model, Cmd Msg )
=init flags =
- ( { counter = Counter.init
+ ( { markup = Nothing
+ , counter = Counter.init
= }
- , Cmd.none
+ , Http.get
+ { url = "/index.txt"
+ , expect = Http.expectString DocumentFetched
+ }
= )
=
=
=view : Model -> Html Msg
=view model =
- content
- |> Mark.parseWith options
- |> Result.mapError Debug.toString
- |> Result.map (\fn -> fn model)
- |> Result.extract Element.text
- |> Element.layout []
+ let
+ content =
+ case model.markup of
+ Nothing ->
+ Element.el [ Element.centerX, Element.centerY ] <|
+ Element.text "Loading content..."
+
+ Just markup ->
+ markup
+ |> Mark.parseWith options
+ |> Result.mapError Debug.toString
+ |> Result.map (\fn -> fn model)
+ |> Result.extract Element.text
+ in
+ Element.layout
+ [ Element.width Element.fill
+ , Element.height Element.fill
+ ]
+ content
=
=
=update : Msg -> Model -> ( Model, Cmd Msg )
=update msg model =
- case msg of
+ case Debug.log "update" msg of
+ DocumentFetched (Ok markup) ->
+ ( { model | markup = Just markup }
+ , Cmd.none
+ )
+
+ DocumentFetched (Err markup) ->
+ ( { model | markup = Nothing }
+ , Cmd.none
+ )
+
= CounterMsg m ->
= ( { model | counter = Counter.update m model.counter }
= , Cmd.none
@@ -101,50 +132,3 @@ options =
= | blocks =
= counterBlock :: Mark.defaultBlocks
= }
-
-
-content =
- """
-| header
- To do:
-
-Steps to reproduce the tree:
-
-Make a dot
-
- Centered (Elm UI, viewBox, cartesian coordinates)
-
-Make a line
-
- Play with transformations (union types)
-
-Gradients
-
-Multiple lines
-
- Rosettes (different kinds)
-
-Groups and transformations
-
- Spiral (recursion)
-
-Tree
-
-
-| header
- Before the course begins
-
-Setup the development environment
-
-| list
- - Elm
- - Node.js
-
-
-| counter
-
-Last sentence
-
-| counter
-
-"""