moves headerbar out of chest page
This commit is contained in:
166
src/Main.elm
166
src/Main.elm
@@ -36,11 +36,36 @@ main =
|
||||
-- Model
|
||||
|
||||
|
||||
type Model
|
||||
type alias Model =
|
||||
{ navbar : Navbar
|
||||
, page : Page
|
||||
}
|
||||
|
||||
|
||||
type alias Navbar =
|
||||
{ menuOpen : Bool
|
||||
, navKey : Nav.Key
|
||||
}
|
||||
|
||||
|
||||
initNavbar key =
|
||||
Navbar False key
|
||||
|
||||
|
||||
type Page
|
||||
= Chest Chest.Model
|
||||
-- | Admin Admin.Model
|
||||
| About
|
||||
| Loading Nav.Key
|
||||
| Loading
|
||||
|
||||
|
||||
type alias HasPage r =
|
||||
{ r | page : Page }
|
||||
|
||||
|
||||
setPage : Page -> HasPage r -> HasPage r
|
||||
setPage page model =
|
||||
{ model | page = page }
|
||||
|
||||
|
||||
|
||||
@@ -59,35 +84,34 @@ type Model
|
||||
|
||||
init : () -> Url.Url -> Nav.Key -> ( Model, Cmd Msg )
|
||||
init _ _ key =
|
||||
( Loading key, Session.init SessionLoaded key )
|
||||
( { navbar = initNavbar key
|
||||
, page = Loading
|
||||
}
|
||||
, Session.init SessionLoaded key
|
||||
)
|
||||
|
||||
|
||||
|
||||
{-
|
||||
case flags of
|
||||
Just id ->
|
||||
let
|
||||
session =
|
||||
Session.playerSession key id
|
||||
|
||||
( chest, cmd ) =
|
||||
Chest.init session
|
||||
in
|
||||
( Chest chest, Cmd.map GotChestMsg cmd )
|
||||
|
||||
Nothing ->
|
||||
( About, Cmd.none )
|
||||
-}
|
||||
---
|
||||
-- VIEWS
|
||||
---
|
||||
-- VIEW
|
||||
|
||||
|
||||
view : Model -> Browser.Document Msg
|
||||
view model =
|
||||
let
|
||||
( title, header, content ) =
|
||||
viewPage model.page
|
||||
in
|
||||
{ title = title
|
||||
, body =
|
||||
viewHeaderBar header.title header.links model.navbar
|
||||
:: content
|
||||
}
|
||||
|
||||
|
||||
viewPage page =
|
||||
let
|
||||
( title, content ) =
|
||||
case model of
|
||||
case page of
|
||||
Chest chest ->
|
||||
( "Loot-a-lot", List.map (Html.map GotChestMsg) (Chest.view chest) )
|
||||
|
||||
@@ -96,18 +120,85 @@ view model =
|
||||
About ->
|
||||
( "A propos", [ p [] [ text "A propos" ] ] )
|
||||
|
||||
Loading _ ->
|
||||
( "Chargement...", [ p [] [ text "Chargement" ] ] )
|
||||
Loading ->
|
||||
( "Veuillez patienter...", [ p [] [ text "Chargement" ] ] )
|
||||
|
||||
navbarTitle =
|
||||
case page of
|
||||
Chest chest ->
|
||||
chest.state.player.name
|
||||
|
||||
About ->
|
||||
"Loot-a-lot"
|
||||
|
||||
Loading ->
|
||||
"Loot-a-(...)"
|
||||
|
||||
navbarLinks =
|
||||
case page of
|
||||
Chest chest ->
|
||||
let
|
||||
linkWithGem =
|
||||
navLink "fas fa-gem"
|
||||
in
|
||||
{ title = title
|
||||
, body = content
|
||||
}
|
||||
[ navLink "fas fa-store-alt" "Marchand" "/marchand"
|
||||
, if chest.state.player.id == 0 then
|
||||
linkWithGem "Nouveau loot" "/nouveau-tresor"
|
||||
|
||||
else
|
||||
linkWithGem "Coffre de groupe" "/coffre"
|
||||
]
|
||||
|
||||
_ ->
|
||||
[]
|
||||
in
|
||||
( title, { title = navbarTitle, links = navbarLinks }, content )
|
||||
|
||||
|
||||
|
||||
-- HEADER SECTION
|
||||
|
||||
|
||||
navLink icon linkText url =
|
||||
a [ class "navbar-item", href url ]
|
||||
[ renderIcon { icon = icon, ratio = "1x", size = "medium" }
|
||||
, span [] [ text linkText ]
|
||||
]
|
||||
|
||||
|
||||
viewHeaderBar : String -> List (Html Msg) -> Navbar -> Html Msg
|
||||
viewHeaderBar navbarTitle navbarLinks navbar =
|
||||
nav [ class "navbar", class "is-transparent" ]
|
||||
[ div [ class "navbar-brand" ]
|
||||
[ a [ class "navbar-item", href "/" ]
|
||||
[ renderIcon { icon = "fab fa-d-and-d", size = "medium", ratio = "2x" }
|
||||
, span [ class "title is-4", style "padding-left" "0.4em" ] [ text navbarTitle ]
|
||||
]
|
||||
, a
|
||||
[ class "navbar-burger"
|
||||
, classList [ ( "is-active", navbar.menuOpen ) ]
|
||||
, onClick SwitchMenuOpen
|
||||
]
|
||||
[ span [ attribute "aria-hidden" "true" ] []
|
||||
, span [ attribute "aria-hidden" "true" ] []
|
||||
, span [ attribute "aria-hidden" "true" ] []
|
||||
]
|
||||
]
|
||||
, div [ class "navbar-menu", classList [ ( "is-active", navbar.menuOpen ) ] ]
|
||||
[ div [ class "navbar-end" ] navbarLinks
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
|
||||
-- UPDATE
|
||||
|
||||
|
||||
type Msg
|
||||
= UrlChanged Url.Url
|
||||
| LinkClicked Browser.UrlRequest
|
||||
| SessionLoaded (Maybe Session)
|
||||
| SwitchMenuOpen
|
||||
| GotChestMsg Chest.Msg
|
||||
|
||||
|
||||
@@ -115,19 +206,20 @@ type Msg
|
||||
-- | GotAdminMsg Admin.Msg
|
||||
|
||||
|
||||
update : Msg -> Model -> ( Model, Cmd Msg )
|
||||
update msg model =
|
||||
let
|
||||
updateChest chestMsg =
|
||||
case model of
|
||||
case model.page of
|
||||
Chest chest ->
|
||||
let
|
||||
( newChest, cmd ) =
|
||||
Chest.update chestMsg chest
|
||||
in
|
||||
( Chest newChest, Cmd.map GotChestMsg cmd )
|
||||
( setPage (Chest newChest) model, Cmd.map GotChestMsg cmd )
|
||||
|
||||
_ ->
|
||||
( About, Cmd.none )
|
||||
( model |> setPage About, Cmd.none )
|
||||
in
|
||||
case msg of
|
||||
SessionLoaded session ->
|
||||
@@ -137,17 +229,17 @@ update msg model =
|
||||
( chest, cmd ) =
|
||||
Chest.init logged
|
||||
in
|
||||
( Chest chest, Cmd.map GotChestMsg cmd )
|
||||
( model |> setPage (Chest chest), Cmd.map GotChestMsg cmd )
|
||||
|
||||
Nothing ->
|
||||
( About, Cmd.none )
|
||||
( model |> setPage About, Cmd.none )
|
||||
|
||||
LinkClicked urlRequest ->
|
||||
case model of
|
||||
case model.page of
|
||||
Chest chestModel ->
|
||||
case urlRequest of
|
||||
Browser.Internal url ->
|
||||
( model, Nav.pushUrl chestModel.navKey (Url.toString url) )
|
||||
( model, Nav.pushUrl model.navbar.navKey (Url.toString url) )
|
||||
|
||||
Browser.External href ->
|
||||
( model, Cmd.none )
|
||||
@@ -165,14 +257,16 @@ update msg model =
|
||||
updateChest (Chest.SetContent content)
|
||||
|
||||
_ ->
|
||||
( About, Cmd.none )
|
||||
( model |> setPage About, Cmd.none )
|
||||
|
||||
GotChestMsg chestMsg ->
|
||||
updateChest chestMsg
|
||||
|
||||
SwitchMenuOpen ->
|
||||
( { model | navbar = Navbar (not model.navbar.menuOpen) model.navbar.navKey }, Cmd.none )
|
||||
|
||||
|
||||
|
||||
-- STATE Utils
|
||||
-- SUBSCRIPTIONS
|
||||
--
|
||||
|
||||
|
||||
@@ -27,8 +27,7 @@ import Utils exposing (..)
|
||||
|
||||
|
||||
type alias State =
|
||||
{ menuOpen : Bool
|
||||
, mode : ActionMode
|
||||
{ mode : ActionMode
|
||||
, error : Maybe String
|
||||
, notification : Maybe String
|
||||
|
||||
@@ -73,7 +72,6 @@ init (Player navKey playerId) =
|
||||
( Model
|
||||
navKey
|
||||
(State
|
||||
False
|
||||
View
|
||||
Nothing
|
||||
Nothing
|
||||
@@ -130,103 +128,6 @@ viewNotification model =
|
||||
|
||||
|
||||
|
||||
-- DEBUG SECTION
|
||||
|
||||
|
||||
viewDebugSection : Model -> Html Msg
|
||||
viewDebugSection model =
|
||||
div [ class "panel is-danger" ]
|
||||
[ p [ class "panel-heading" ] [ text "Debug" ]
|
||||
, p [ class "panel-block has-text-danger" ] [ text <| Maybe.withDefault "" model.state.error ]
|
||||
, p [ class "panel-block" ] [ text ("Shown content : " ++ Debug.toString model.shown) ]
|
||||
, p [ class "panel-block" ] [ text ("Active Mode : " ++ Debug.toString model.state.mode) ]
|
||||
, p [ class "panel-block" ] [ text ("Selection : " ++ Debug.toString model.selection) ]
|
||||
, p [ class "panel-block" ] [ text ("Claims : " ++ Debug.toString model.claims) ]
|
||||
, p [] debugSandbox
|
||||
]
|
||||
|
||||
|
||||
stackedIcon name =
|
||||
span [ class "icon is-medium" ]
|
||||
[ span [ class "fa-stack" ]
|
||||
[ i [ class "fas fa-circle fa-stack-2x" ] []
|
||||
, i [ class (name ++ " fa-inverse fa-stack-1x") ] []
|
||||
, text ""
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
debugSandbox =
|
||||
[ stackedIcon "fas fa-coins"
|
||||
, stackedIcon "fab fa-d-and-d"
|
||||
, stackedIcon "fas fa-praying-hands"
|
||||
, stackedIcon "fas fa-gem"
|
||||
, stackedIcon "fas fa-pen"
|
||||
, stackedIcon "fas fa-percentage"
|
||||
, stackedIcon "fas fa-store-alt"
|
||||
, stackedIcon "fas fa-cart-plus"
|
||||
, stackedIcon "fas fa-angry"
|
||||
, stackedIcon "fas fa-plus"
|
||||
, stackedIcon "fas fa-tools"
|
||||
, stackedIcon "fas fa-search"
|
||||
]
|
||||
|
||||
|
||||
|
||||
-- HEADER SECTION
|
||||
|
||||
|
||||
viewHeaderBar : String -> Model -> Html Msg
|
||||
viewHeaderBar title model =
|
||||
nav [ class "navbar", class "is-transparent" ]
|
||||
[ div [ class "navbar-brand" ]
|
||||
[ a [ class "navbar-item", href "/" ]
|
||||
[ renderIcon { icon = "fab fa-d-and-d", size = "medium", ratio = "2x" }
|
||||
, span [ class "title is-4", style "padding-left" "0.4em" ] [ text title ]
|
||||
]
|
||||
, a
|
||||
[ class "navbar-burger"
|
||||
, classList [ ( "is-active", model.state.menuOpen ) ]
|
||||
, onClick SwitchMenuOpen
|
||||
]
|
||||
[ span [ attribute "aria-hidden" "true" ] []
|
||||
, span [ attribute "aria-hidden" "true" ] []
|
||||
, span [ attribute "aria-hidden" "true" ] []
|
||||
]
|
||||
]
|
||||
, div [ class "navbar-menu", classList [ ( "is-active", model.state.menuOpen ) ] ]
|
||||
[ div [ class "navbar-end" ]
|
||||
[ a [ class "navbar-item", href "/marchand" ]
|
||||
[ renderIcon { icon = "fas fa-store-alt", ratio = "1x", size = "medium" }
|
||||
, span [] [ text "Marchand" ]
|
||||
]
|
||||
, a
|
||||
[ class "navbar-item"
|
||||
, href
|
||||
(if model.state.player.id == 0 then
|
||||
"/nouveau-tresor"
|
||||
|
||||
else
|
||||
"/coffre"
|
||||
)
|
||||
]
|
||||
[ renderIcon { icon = "fas fa-gem", ratio = "1x", size = "medium" }
|
||||
, span []
|
||||
[ text
|
||||
(if model.state.player.id == 0 then
|
||||
"Nouveau loot"
|
||||
|
||||
else
|
||||
"Coffre de groupe"
|
||||
)
|
||||
]
|
||||
]
|
||||
]
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
|
||||
-- PLAYER BAR
|
||||
|
||||
|
||||
@@ -236,14 +137,11 @@ viewPlayerBar player actionControls ( editing, amount ) =
|
||||
[ div [ class "hero-body" ]
|
||||
[ div [ class "level container is-mobile" ]
|
||||
[ div [ class "level-left" ]
|
||||
([ div [ class "level-item" ]
|
||||
[ p [ class "title is-3" ] [ text player.name ] ]
|
||||
, div [ class "level-item" ]
|
||||
(div [ class "level-item" ]
|
||||
[ span [ class "icon is-large" ] [ i [ class "fas fa-2x fa-piggy-bank" ] [] ]
|
||||
, span [ class "icon", onClick EditWealth ] [ i [ class "fas fa-tools" ] [] ]
|
||||
]
|
||||
]
|
||||
++ (if editing then
|
||||
:: (if editing then
|
||||
viewUpdateWealth amount
|
||||
|
||||
else
|
||||
@@ -438,8 +336,7 @@ view model =
|
||||
|> List.filter
|
||||
(\i -> String.toLower i.name |> String.contains (String.toLower model.searchText))
|
||||
in
|
||||
[ viewHeaderBar "Mon coffre" model
|
||||
, viewPlayerBar model.state.player renderControls ( model.state.editWealth, model.state.wealthAmount )
|
||||
[ viewPlayerBar model.state.player renderControls ( model.state.editWealth, model.state.wealthAmount )
|
||||
, main_
|
||||
[ class "container" ]
|
||||
[ viewNotification model
|
||||
@@ -864,7 +761,6 @@ type Msg
|
||||
| GotPlayer (HttpResult Api.Player)
|
||||
-- Chest UI
|
||||
| ClearNotification
|
||||
| SwitchMenuOpen
|
||||
| SetContent ChestContent
|
||||
| SearchTextChanged String
|
||||
-- Selection
|
||||
@@ -896,7 +792,7 @@ switchEditWealth state =
|
||||
|
||||
setWealthAmount state amount =
|
||||
{ state
|
||||
| wealthAmount = amount
|
||||
| wealthAmount = String.replace "," "." amount
|
||||
}
|
||||
|
||||
|
||||
@@ -950,15 +846,6 @@ update msg model =
|
||||
, Cmd.none
|
||||
)
|
||||
|
||||
SwitchMenuOpen ->
|
||||
let
|
||||
state =
|
||||
model.state
|
||||
in
|
||||
( { model | state = { state | menuOpen = not model.state.menuOpen } }
|
||||
, Cmd.none
|
||||
)
|
||||
|
||||
AddMsg addMsg ->
|
||||
case addMsg of
|
||||
NewItemsFromList newLoot maybeErrors ->
|
||||
|
||||
Reference in New Issue
Block a user