Merge pull request #125 from kumkee/main

added an example of ussing a shared model flags

examples/17-shared-subscriptions/.gitignore

@@ -0,0 +1,7 @@
+/dist
+/.elm-land
+/.env
+/elm-stuff
+/node_modules
+.DS_Store
+*.pem

examples/17-shared-subscriptions/elm-land.json

@@ -0,0 +1,26 @@
+{
+  "app": {
+    "elm": {
+      "development": { "debugger": true },
+      "production": { "debugger": false }
+    },
+    "env": [],
+    "html": {
+      "attributes": {
+        "html": { "lang": "en" },
+        "head": {}
+      },
+      "title": "Elm Land",
+      "meta": [
+        { "charset": "UTF-8" },
+        { "http-equiv": "X-UA-Compatible", "content": "IE=edge" },
+        { "name": "viewport", "content": "width=device-width, initial-scale=1.0" }
+      ],
+      "link": [],
+      "script": []
+    },
+    "router": {
+      "useHashRouting": false
+    }
+  }
+}

examples/17-shared-subscriptions/elm.json

@@ -0,0 +1,25 @@
+{
+    "type": "application",
+    "source-directories": [
+        "src",
+        ".elm-land/src"
+    ],
+    "elm-version": "0.19.1",
+    "dependencies": {
+        "direct": {
+            "elm/browser": "1.0.2",
+            "elm/core": "1.0.5",
+            "elm/html": "1.0.0",
+            "elm/json": "1.1.3",
+            "elm/url": "1.0.0"
+        },
+        "indirect": {
+            "elm/time": "1.0.0",
+            "elm/virtual-dom": "1.0.3"
+        }
+    },
+    "test-dependencies": {
+        "direct": {},
+        "indirect": {}
+    }
+}

examples/17-shared-subscriptions/src/Pages/Home_.elm

@@ -0,0 +1,80 @@
+module Pages.Home_ exposing (Model, Msg, page)
+
+import Effect exposing (Effect)
+import Html
+import Page exposing (Page)
+import Route exposing (Route)
+import Shared
+import View exposing (View)
+
+
+page : Shared.Model -> Route () -> Page Model Msg
+page shared route =
+    Page.new
+        { init = init
+        , update = update
+        , subscriptions = subscriptions
+        , view = view shared
+        }
+
+
+
+-- INIT
+
+
+type alias Model =
+    {}
+
+
+init : () -> ( Model, Effect Msg )
+init () =
+    ( {}
+    , Effect.none
+    )
+
+
+
+-- UPDATE
+
+
+type Msg
+    = ExampleMsgReplaceMe
+
+
+update : Msg -> Model -> ( Model, Effect Msg )
+update msg model =
+    case msg of
+        ExampleMsgReplaceMe ->
+            ( model
+            , Effect.none
+            )
+
+
+
+-- SUBSCRIPTIONS
+
+
+subscriptions : Model -> Sub Msg
+subscriptions model =
+    Sub.none
+
+
+
+-- VIEW
+
+
+view : Shared.Model -> Model -> View Msg
+view shared model =
+    let
+        toStr field =
+            field shared |> String.fromInt
+    in
+    { title = "Pages.Home_"
+    , body =
+        [ "Window Size: "
+            ++ toStr .windowWidth
+            ++ " × "
+            ++ toStr .windowHeight
+            |> Html.text
+        ]
+    }

examples/17-shared-subscriptions/src/Shared.elm

@@ -0,0 +1,85 @@
+module Shared exposing
+    ( Flags, decoder
+    , Model, Msg
+    , init, update, subscriptions
+    )
+
+{-|
+
+@docs Flags, decoder
+@docs Model, Msg
+@docs init, update, subscriptions
+
+-}
+
+import Browser.Events
+import Effect exposing (Effect)
+import Json.Decode
+import Route exposing (Route)
+import Route.Path
+import Shared.Model
+import Shared.Msg exposing (Msg(..))
+
+
+
+-- FLAGS
+
+
+type alias Flags =
+    Model
+
+
+decoder : Json.Decode.Decoder Flags
+decoder =
+    Json.Decode.map2 Shared.Model.Model
+        (Json.Decode.field "width" Json.Decode.int)
+        (Json.Decode.field "height" Json.Decode.int)
+
+
+
+-- INIT
+
+
+type alias Model =
+    Shared.Model.Model
+
+
+init : Result Json.Decode.Error Flags -> Route () -> ( Model, Effect Msg )
+init flagsResult route =
+    let
+        flags : Flags
+        flags =
+            case flagsResult of
+                Ok size ->
+                    size
+
+                Err _ ->
+                    { windowWidth = 0, windowHeight = 0 }
+    in
+    ( flags, Effect.none )
+
+
+
+-- UPDATE
+
+
+type alias Msg =
+    Shared.Msg.Msg
+
+
+update : Route () -> Msg -> Model -> ( Model, Effect Msg )
+update route msg model =
+    case msg of
+        WindowResized w h ->
+            ( Shared.Model.Model w h
+            , Effect.none
+            )
+
+
+
+-- SUBSCRIPTIONS
+
+
+subscriptions : Route () -> Model -> Sub Msg
+subscriptions route model =
+    Browser.Events.onResize WindowResized

examples/17-shared-subscriptions/src/Shared/Model.elm

@@ -0,0 +1,14 @@
+module Shared.Model exposing (Model)
+
+{-| -}
+
+
+{-| Normally, this value would live in "Shared.elm"
+but that would lead to a circular dependency import cycle.
+
+For that reason, both `Shared.Model` and `Shared.Msg` are in their
+own file, so they can be imported by `Effect.elm`
+
+-}
+type alias Model =
+    { windowWidth : Int, windowHeight : Int }

examples/17-shared-subscriptions/src/Shared/Msg.elm

@@ -0,0 +1,14 @@
+module Shared.Msg exposing (Msg(..))
+
+{-| -}
+
+
+{-| Normally, this value would live in "Shared.elm"
+but that would lead to a circular dependency import cycle.
+
+For that reason, both `Shared.Model` and `Shared.Msg` are in their
+own file, so they can be imported by `Effect.elm`
+
+-}
+type Msg
+    = WindowResized Int Int

examples/17-shared-subscriptions/src/interop.ts

@@ -0,0 +1,3 @@
+export const flags = () => { // env to be included as an argument
+  return { width: window.innerWidth, height: window.innerHeight }
+}

examples/README.md

@@ -20,6 +20,7 @@
 - [SCSS and assets](./14-scss-and-assets/)
 - [Custom 404 pages](./15-custom-404-pages/)
 - [Hash-bashed routing](./16-hash-based-routing/)
+- [Shared subscriptions](./17-shared-subscriptions/)
 
 ## 1. Hello world!