mirror of
https://github.com/ryan-haskell/elm-spa.git
synced 2024-11-25 18:56:16 +03:00
its happening... its HAPPENING
This commit is contained in:
parent
5dfc02a8a4
commit
329efa7944
@ -20,8 +20,7 @@ view =
|
|||||||
, ( "Counter", Route.Counter () )
|
, ( "Counter", Route.Counter () )
|
||||||
, ( "Cats", Route.Random () )
|
, ( "Cats", Route.Random () )
|
||||||
, ( "User", Route.Users_Slug "alice" )
|
, ( "User", Route.Users_Slug "alice" )
|
||||||
, ( "Account settings", Route.Settings (Settings.Account ()) )
|
, ( "Settings", Route.Settings (Settings.Account ()) )
|
||||||
, ( "User settings", Route.Settings (Settings.User ()) )
|
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|
||||||
|
@ -88,7 +88,7 @@ users_slug_posts_slug =
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
init : Route -> ( Model, Cmd Msg )
|
init : Route -> Application.Init Model Msg
|
||||||
init route =
|
init route =
|
||||||
case route of
|
case route of
|
||||||
Route.Homepage params ->
|
Route.Homepage params ->
|
||||||
|
@ -69,7 +69,7 @@ user =
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
init : Route -> ( Model, Cmd Msg )
|
init : Route -> Application.Init Model Msg
|
||||||
init route =
|
init route =
|
||||||
case route of
|
case route of
|
||||||
Route.Account params ->
|
Route.Account params ->
|
||||||
|
@ -2,7 +2,7 @@ module Application exposing
|
|||||||
( Application, create
|
( Application, create
|
||||||
, Layout
|
, Layout
|
||||||
, Page, Recipe
|
, Page, Recipe
|
||||||
, Bundle, keep
|
, Init, Bundle, keep
|
||||||
, Static, static
|
, Static, static
|
||||||
, Sandbox, sandbox
|
, Sandbox, sandbox
|
||||||
, Element, element
|
, Element, element
|
||||||
@ -27,7 +27,7 @@ module Application exposing
|
|||||||
|
|
||||||
@docs Page, Recipe
|
@docs Page, Recipe
|
||||||
|
|
||||||
@docs Bundle, keep
|
@docs Init, Bundle, keep
|
||||||
|
|
||||||
@docs Static, static
|
@docs Static, static
|
||||||
|
|
||||||
@ -75,30 +75,26 @@ create :
|
|||||||
, transition : Transition (Html msg)
|
, transition : Transition (Html msg)
|
||||||
}
|
}
|
||||||
, pages :
|
, pages :
|
||||||
{ init : route -> ( model, Cmd msg )
|
{ init : route -> Init model msg
|
||||||
, update : msg -> model -> ( model, Cmd msg )
|
, update : msg -> model -> ( model, Cmd msg )
|
||||||
, bundle : model -> Page.Bundle msg
|
, bundle : model -> Bundle msg
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
-> Application flags model msg
|
-> Application flags model msg
|
||||||
create config =
|
create config =
|
||||||
let
|
|
||||||
(Transition.Transition transition) =
|
|
||||||
config.layout.transition
|
|
||||||
in
|
|
||||||
Browser.application
|
Browser.application
|
||||||
{ init =
|
{ init =
|
||||||
init
|
init
|
||||||
{ init = config.pages.init
|
{ init = config.pages.init
|
||||||
, fromUrl = config.routing.fromUrl
|
, fromUrl = config.routing.fromUrl
|
||||||
, speed = transition.speed
|
, speed = Transition.speed config.layout.transition
|
||||||
}
|
}
|
||||||
, update =
|
, update =
|
||||||
update
|
update
|
||||||
{ fromUrl = config.routing.fromUrl
|
{ fromUrl = config.routing.fromUrl
|
||||||
, init = config.pages.init
|
, init = config.pages.init
|
||||||
, update = config.pages.update
|
, update = config.pages.update
|
||||||
, speed = transition.speed
|
, speed = Transition.speed config.layout.transition
|
||||||
}
|
}
|
||||||
, subscriptions =
|
, subscriptions =
|
||||||
subscriptions
|
subscriptions
|
||||||
@ -112,7 +108,7 @@ create config =
|
|||||||
\model ->
|
\model ->
|
||||||
config.pages.bundle model Page.Initial |> .view
|
config.pages.bundle model Page.Initial |> .view
|
||||||
, layout = config.layout
|
, layout = config.layout
|
||||||
, transition = transition.strategy
|
, transition = Transition.strategy config.layout.transition
|
||||||
}
|
}
|
||||||
, onUrlChange = Url
|
, onUrlChange = Url
|
||||||
, onUrlRequest = Link
|
, onUrlRequest = Link
|
||||||
@ -128,12 +124,13 @@ type alias Model flags model =
|
|||||||
, flags : flags
|
, flags : flags
|
||||||
, key : Nav.Key
|
, key : Nav.Key
|
||||||
, page : Transitionable model
|
, page : Transitionable model
|
||||||
|
, speed : Int
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
init :
|
init :
|
||||||
{ fromUrl : Url -> route
|
{ fromUrl : Url -> route
|
||||||
, init : route -> ( model, Cmd msg )
|
, init : route -> Init model msg
|
||||||
, speed : Int
|
, speed : Int
|
||||||
}
|
}
|
||||||
-> flags
|
-> flags
|
||||||
@ -143,21 +140,20 @@ init :
|
|||||||
init config flags url key =
|
init config flags url key =
|
||||||
url
|
url
|
||||||
|> config.fromUrl
|
|> config.fromUrl
|
||||||
|> config.init
|
|> (\route -> config.init route { parentSpeed = config.speed })
|
||||||
|> Tuple.mapBoth
|
|> (\page ->
|
||||||
(\page ->
|
( { flags = flags
|
||||||
{ flags = flags
|
|
||||||
, url = url
|
, url = url
|
||||||
, key = key
|
, key = key
|
||||||
, page = Transitionable.Ready page
|
, page = Transitionable.Ready page.model
|
||||||
|
, speed = page.speed
|
||||||
}
|
}
|
||||||
)
|
, Cmd.batch
|
||||||
(\cmd ->
|
[ handleJumpLinks url page.cmd
|
||||||
Cmd.batch
|
, Utils.delay page.speed TransitionComplete
|
||||||
[ handleJumpLinks url cmd
|
|
||||||
, Utils.delay config.speed TransitionComplete
|
|
||||||
]
|
]
|
||||||
)
|
)
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
handleJumpLinks : Url -> Cmd msg -> Cmd (Msg msg)
|
handleJumpLinks : Url -> Cmd msg -> Cmd (Msg msg)
|
||||||
@ -197,7 +193,7 @@ type Msg msg
|
|||||||
|
|
||||||
update :
|
update :
|
||||||
{ fromUrl : Url -> route
|
{ fromUrl : Url -> route
|
||||||
, init : route -> ( model, Cmd msg )
|
, init : route -> Init model msg
|
||||||
, update : msg -> model -> ( model, Cmd msg )
|
, update : msg -> model -> ( model, Cmd msg )
|
||||||
, speed : Int
|
, speed : Int
|
||||||
}
|
}
|
||||||
@ -217,15 +213,12 @@ update config msg model =
|
|||||||
( model, Nav.load (Url.toString url) )
|
( model, Nav.load (Url.toString url) )
|
||||||
|
|
||||||
else
|
else
|
||||||
( { model
|
( if navigatingToNewLayout { old = model.url, new = url } then
|
||||||
| page =
|
{ model | page = Transitionable.begin model.page }
|
||||||
if navigatingToNewLayout { old = model.url, new = url } then
|
|
||||||
Transitionable.begin model.page
|
|
||||||
|
|
||||||
else
|
else
|
||||||
Transitionable.complete model.page
|
{ model | page = Transitionable.complete model.page }
|
||||||
}
|
, Utils.delay model.speed (TransitionTo url)
|
||||||
, Utils.delay config.speed (TransitionTo url)
|
|
||||||
)
|
)
|
||||||
|
|
||||||
Link (Browser.External url) ->
|
Link (Browser.External url) ->
|
||||||
@ -246,10 +239,16 @@ update config msg model =
|
|||||||
Url url ->
|
Url url ->
|
||||||
url
|
url
|
||||||
|> config.fromUrl
|
|> config.fromUrl
|
||||||
|> config.init
|
|> (\route -> config.init route { parentSpeed = config.speed })
|
||||||
|> Tuple.mapBoth
|
|> (\page ->
|
||||||
(\page -> { model | url = url, page = Transitionable.Complete page })
|
( { model
|
||||||
(handleJumpLinks url)
|
| url = url
|
||||||
|
, page = Transitionable.Complete page.model
|
||||||
|
, speed = page.speed
|
||||||
|
}
|
||||||
|
, handleJumpLinks url page.cmd
|
||||||
|
)
|
||||||
|
)
|
||||||
|
|
||||||
Page pageMsg ->
|
Page pageMsg ->
|
||||||
Tuple.mapBoth
|
Tuple.mapBoth
|
||||||
@ -342,6 +341,10 @@ type alias Recipe params pageModel pageMsg model msg =
|
|||||||
Page.Recipe params pageModel pageMsg model msg
|
Page.Recipe params pageModel pageMsg model msg
|
||||||
|
|
||||||
|
|
||||||
|
type alias Init model msg =
|
||||||
|
Page.Init model msg
|
||||||
|
|
||||||
|
|
||||||
type alias Bundle msg =
|
type alias Bundle msg =
|
||||||
Page.Bundle msg
|
Page.Bundle msg
|
||||||
|
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
module Internals.Page exposing
|
module Internals.Page exposing
|
||||||
( Page, Recipe
|
( Page, Recipe
|
||||||
, Bundle
|
, Init, Bundle
|
||||||
, Static, static
|
, Static, static
|
||||||
, Sandbox, sandbox
|
, Sandbox, sandbox
|
||||||
, Element, element
|
, Element, element
|
||||||
@ -12,7 +12,7 @@ module Internals.Page exposing
|
|||||||
|
|
||||||
@docs Page, Recipe
|
@docs Page, Recipe
|
||||||
|
|
||||||
@docs Bundle
|
@docs Init, Bundle
|
||||||
|
|
||||||
@docs Static, static
|
@docs Static, static
|
||||||
|
|
||||||
@ -26,6 +26,7 @@ module Internals.Page exposing
|
|||||||
|
|
||||||
import Html exposing (Html, div, text)
|
import Html exposing (Html, div, text)
|
||||||
import Internals.Layout exposing (Layout)
|
import Internals.Layout exposing (Layout)
|
||||||
|
import Internals.Transition as Transition
|
||||||
|
|
||||||
|
|
||||||
type alias Page params pageModel pageMsg model msg =
|
type alias Page params pageModel pageMsg model msg =
|
||||||
@ -36,7 +37,7 @@ type alias Page params pageModel pageMsg model msg =
|
|||||||
|
|
||||||
|
|
||||||
type alias Recipe params pageModel pageMsg model msg =
|
type alias Recipe params pageModel pageMsg model msg =
|
||||||
{ init : params -> ( model, Cmd msg )
|
{ init : params -> Init model msg
|
||||||
, update : pageMsg -> pageModel -> ( model, Cmd msg )
|
, update : pageMsg -> pageModel -> ( model, Cmd msg )
|
||||||
, bundle : pageModel -> Bundle msg
|
, bundle : pageModel -> Bundle msg
|
||||||
}
|
}
|
||||||
@ -48,6 +49,16 @@ type TransitionStatus
|
|||||||
| Entering
|
| Entering
|
||||||
|
|
||||||
|
|
||||||
|
type alias Init model msg =
|
||||||
|
{ parentSpeed : Int
|
||||||
|
}
|
||||||
|
->
|
||||||
|
{ model : model
|
||||||
|
, cmd : Cmd msg
|
||||||
|
, speed : Int
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
type alias Bundle msg =
|
type alias Bundle msg =
|
||||||
TransitionStatus
|
TransitionStatus
|
||||||
->
|
->
|
||||||
@ -69,7 +80,12 @@ static :
|
|||||||
Static
|
Static
|
||||||
-> Page params () Never model msg
|
-> Page params () Never model msg
|
||||||
static page { toModel, toMsg } =
|
static page { toModel, toMsg } =
|
||||||
{ init = \_ -> ( toModel (), Cmd.none )
|
{ init =
|
||||||
|
\_ { parentSpeed } ->
|
||||||
|
{ model = toModel ()
|
||||||
|
, cmd = Cmd.none
|
||||||
|
, speed = parentSpeed
|
||||||
|
}
|
||||||
, update = \_ model -> ( toModel model, Cmd.none )
|
, update = \_ model -> ( toModel model, Cmd.none )
|
||||||
, bundle =
|
, bundle =
|
||||||
\_ _ ->
|
\_ _ ->
|
||||||
@ -94,7 +110,12 @@ sandbox :
|
|||||||
Sandbox params pageModel pageMsg
|
Sandbox params pageModel pageMsg
|
||||||
-> Page params pageModel pageMsg model msg
|
-> Page params pageModel pageMsg model msg
|
||||||
sandbox page { toModel, toMsg } =
|
sandbox page { toModel, toMsg } =
|
||||||
{ init = \params -> ( toModel (page.init params), Cmd.none )
|
{ init =
|
||||||
|
\params { parentSpeed } ->
|
||||||
|
{ model = toModel (page.init params)
|
||||||
|
, cmd = Cmd.none
|
||||||
|
, speed = parentSpeed
|
||||||
|
}
|
||||||
, update =
|
, update =
|
||||||
\msg model ->
|
\msg model ->
|
||||||
( page.update msg model |> toModel
|
( page.update msg model |> toModel
|
||||||
@ -125,7 +146,14 @@ element :
|
|||||||
-> Page params pageModel pageMsg model msg
|
-> Page params pageModel pageMsg model msg
|
||||||
element page { toModel, toMsg } =
|
element page { toModel, toMsg } =
|
||||||
{ init =
|
{ init =
|
||||||
page.init >> Tuple.mapBoth toModel (Cmd.map toMsg)
|
\params { parentSpeed } ->
|
||||||
|
page.init params
|
||||||
|
|> (\( model, cmd ) ->
|
||||||
|
{ model = toModel model
|
||||||
|
, cmd = Cmd.map toMsg cmd
|
||||||
|
, speed = parentSpeed
|
||||||
|
}
|
||||||
|
)
|
||||||
, update =
|
, update =
|
||||||
\msg model ->
|
\msg model ->
|
||||||
page.update msg model
|
page.update msg model
|
||||||
@ -149,7 +177,7 @@ type alias Glue params layoutModel layoutMsg =
|
|||||||
|
|
||||||
|
|
||||||
type alias Pages params layoutModel layoutMsg =
|
type alias Pages params layoutModel layoutMsg =
|
||||||
{ init : params -> ( layoutModel, Cmd layoutMsg )
|
{ init : params -> Init layoutModel layoutMsg
|
||||||
, update : layoutMsg -> layoutModel -> ( layoutModel, Cmd layoutMsg )
|
, update : layoutMsg -> layoutModel -> ( layoutModel, Cmd layoutMsg )
|
||||||
, bundle : layoutModel -> Bundle layoutMsg
|
, bundle : layoutModel -> Bundle layoutMsg
|
||||||
}
|
}
|
||||||
@ -160,7 +188,14 @@ glue :
|
|||||||
-> Page params layoutModel layoutMsg model msg
|
-> Page params layoutModel layoutMsg model msg
|
||||||
glue options { toModel, toMsg } =
|
glue options { toModel, toMsg } =
|
||||||
{ init =
|
{ init =
|
||||||
options.pages.init >> Tuple.mapBoth toModel (Cmd.map toMsg)
|
\params _ ->
|
||||||
|
options.pages.init params { parentSpeed = Transition.speed options.layout.transition }
|
||||||
|
|> (\page ->
|
||||||
|
{ model = toModel page.model
|
||||||
|
, cmd = Cmd.map toMsg page.cmd
|
||||||
|
, speed = page.speed
|
||||||
|
}
|
||||||
|
)
|
||||||
, update =
|
, update =
|
||||||
\msg model ->
|
\msg model ->
|
||||||
options.pages.update msg model
|
options.pages.update msg model
|
||||||
|
@ -1,12 +1,19 @@
|
|||||||
module Internals.Transition exposing
|
module Internals.Transition exposing
|
||||||
( Options
|
( Transition, Options, Strategy
|
||||||
, Strategy
|
, fade, custom, none
|
||||||
, Transition(..)
|
, speed, strategy
|
||||||
, custom
|
|
||||||
, fade
|
|
||||||
, none
|
|
||||||
)
|
)
|
||||||
|
|
||||||
|
{-|
|
||||||
|
|
||||||
|
@docs Transition, Options, Strategy
|
||||||
|
|
||||||
|
@docs fade, custom, none
|
||||||
|
|
||||||
|
@docs speed strategy
|
||||||
|
|
||||||
|
-}
|
||||||
|
|
||||||
import Html exposing (Html, div)
|
import Html exposing (Html, div)
|
||||||
import Html.Attributes as Attr
|
import Html.Attributes as Attr
|
||||||
|
|
||||||
@ -15,6 +22,21 @@ type Transition view
|
|||||||
= Transition (Options view)
|
= Transition (Options view)
|
||||||
|
|
||||||
|
|
||||||
|
unwrap : Transition view -> Options view
|
||||||
|
unwrap (Transition options) =
|
||||||
|
options
|
||||||
|
|
||||||
|
|
||||||
|
speed : Transition view -> Int
|
||||||
|
speed =
|
||||||
|
unwrap >> .speed
|
||||||
|
|
||||||
|
|
||||||
|
strategy : Transition view -> Strategy view
|
||||||
|
strategy =
|
||||||
|
unwrap >> .strategy
|
||||||
|
|
||||||
|
|
||||||
type alias Options view =
|
type alias Options view =
|
||||||
{ speed : Int
|
{ speed : Int
|
||||||
, strategy : Strategy view
|
, strategy : Strategy view
|
||||||
@ -35,10 +57,10 @@ type alias Views view =
|
|||||||
|
|
||||||
|
|
||||||
fade : Int -> Transition (Html msg)
|
fade : Int -> Transition (Html msg)
|
||||||
fade speed =
|
fade speed_ =
|
||||||
let
|
let
|
||||||
transition =
|
transition =
|
||||||
"opacity " ++ String.fromInt speed ++ "ms"
|
"opacity " ++ String.fromInt speed_ ++ "ms"
|
||||||
|
|
||||||
styles =
|
styles =
|
||||||
{ invisible =
|
{ invisible =
|
||||||
@ -54,7 +76,7 @@ fade speed =
|
|||||||
}
|
}
|
||||||
in
|
in
|
||||||
Transition
|
Transition
|
||||||
{ speed = speed
|
{ speed = speed_
|
||||||
, strategy =
|
, strategy =
|
||||||
{ beforeLoad =
|
{ beforeLoad =
|
||||||
\{ layout, page } ->
|
\{ layout, page } ->
|
||||||
|
Loading…
Reference in New Issue
Block a user