Elm 0.19 Browser.Application starter

Main.elm

-- Adapted from https://gist.github.com/roine/a2da44f2047d494cabaf715f06a591db#file-4_application-elm
module Main exposing
    ( Flags
    , Model
    , Msg(..)
    , Navigation
    , Route(..)
    , bodyView
    , fromUrl
    , init
    , main
    , matchers
    , subscriptions
    , update
    , view
    )

import Browser exposing (Document, UrlRequest)
import Browser.Navigation as Navigation exposing (Key)
import Html exposing (Html, a, button, div, header, li, main_, text, ul)
import Html.Attributes exposing (href)
import Html.Events exposing (onClick)
import Url exposing (Url)
import Url.Parser as Parser exposing ((</>), Parser, s)


type alias Flags =
    ()


type alias Model =
    { navigation : Navigation }


type alias Navigation =
    { key : Key
    , route : Route
    }



-- ROUTE


type Route
    = Home
    | About
    | NotFound


matchers : Parser (Route -> b) b
matchers =
    Parser.oneOf
        [ Parser.map Home Parser.top
        , Parser.map About (s "about")
        ]


fromUrl : Url -> Route
fromUrl url =
    url
        |> Parser.parse matchers
        |> Maybe.withDefault NotFound



-- MSG


type Msg
    = UrlRequested UrlRequest
    | UrlChanged Url



-- UPDATE


update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        UrlRequested urlRequest ->
            case urlRequest of
                Browser.Internal url ->
                    let
                        urlString =
                            Url.toString url
                    in
                    ( model, internalUrlNavigation url model.navigation.key )

                Browser.External href ->
                    ( model, Navigation.load href )

        UrlChanged url ->
            let
                navigation =
                    model.navigation
            in
            ( { model | navigation = { navigation | route = fromUrl url } }
            , Cmd.none
            )


internalUrlNavigation : Url -> Key -> Cmd Msg
internalUrlNavigation url key =
    let
        urlString =
            Url.toString url
    in
    -- Open issue with regard to fragments in Internal
    -- urls: https://github.com/elm/browser/issues/39
    case url.fragment of
        Nothing ->
            Navigation.pushUrl key urlString

        Just _ ->
            Navigation.load urlString



-- VIEW


view : Model -> Document Msg
view model =
    { title = "hello title"
    , body = [ bodyView model ]
    }


bodyView : Model -> Html Msg
bodyView { navigation } =
    main_ []
        [ bodyHeader
        , div []
            [ bodyContent navigation.route ]
        ]


bodyHeader : Html Msg
bodyHeader =
    header []
        [ text "hello world"
        , ul []
            [ li [] [ a [ href "/" ] [ text "Home" ] ]
            , li [] [ a [ href "/about" ] [ text "About" ] ]
            ]
        ]


bodyContent : Route -> Html Msg
bodyContent route =
    case route of
        NotFound ->
            text "Page not Found"

        Home ->
            text "Home page"

        About ->
            text "About page"



-- SUBSCRIPTIONS


subscriptions : Model -> Sub Msg
subscriptions model =
    Sub.none



-- INIT


init : Flags -> Url -> Key -> ( Model, Cmd Msg )
init flags url key =
    ( { navigation = { key = key, route = fromUrl url } }
    , Cmd.none
    )


main : Program Flags Model Msg
main =
    Browser.application
        { init = init
        , update = update
        , view = view
        , subscriptions = subscriptions
        , onUrlRequest = UrlRequested
        , onUrlChange = UrlChanged
        }