elm/lootalot-client
1
0
Fork 0
Code Issues 3 Pull Requests Releases Wiki Activity

works on design, completes AddLoot form

Browse Source
This commit is contained in:
Arthur Gerbaud
2019-11-11 23:57:13 +01:00
parent 873c7bb61a
commit e19bba7e3a
2 changed files with 140 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
src/Page/Chest.elm
View File

@@ -133,11 +133,11 @@ debugSandbox =
viewHeaderBar : String -> Model -> Html Msg viewHeaderBar : String -> Model -> Html Msg
viewHeaderBar title model = viewHeaderBar title model =
nav [ class "navbar container", class "is-info" ] nav [ class "navbar", class "is-transparent" ]
[ div [ class "navbar-brand" ] [ div [ class "navbar-brand" ]
[ a [ class "navbar-item", href "/" ] [ a [ class "navbar-item", href "/" ]
[ renderIcon { icon = "fab fa-d-and-d", size = "medium", ratio = "2x" } [ renderIcon { icon = "fab fa-d-and-d", size = "medium", ratio = "2x" }
, span [] [ text title ] , span [ class "title is-4" ] [ text title ]
] ]
, a [ class "navbar-burger is-active" ] , a [ class "navbar-burger is-active" ]
[ span [ attribute "aria-hidden" "true" ] [] [ span [ attribute "aria-hidden" "true" ] []
@@ -183,14 +183,19 @@ viewHeaderBar title model =
viewPlayerBar : Api.Player -> List (Html Msg) -> Html Msg viewPlayerBar : Api.Player -> List (Html Msg) -> Html Msg
viewPlayerBar player actionControls = viewPlayerBar player actionControls =
section [ class "level container is-mobile box" ] section [ class "hero is-dark is-bold" ]
[ div [ class "hero-body" ]
[ div [ class "level container is-mobile" ]
[ div [ class "level-left" ] [ div [ class "level-left" ]
([ div [ class "level-item" ] ([ div [ class "level-item" ]
[ p [ class "title is-3" ] [ text player.name ] ]
, div [ class "level-item" ]
[ span [ class "icon is-large" ] [ span [ class "icon is-large" ]
[ i [ class "fas fa-2x fa-piggy-bank" ] [] ] [ i [ class "fas fa-2x fa-piggy-bank" ] [] ]
] ]
] ]
++ viewWealth player.wealth ++ viewWealth player.wealth
++ [ span [ class "icon has-text-danger" ] [ i [ class "fas fa-tools" ] [] ] ]
++ (if player.debt > 0 then ++ (if player.debt > 0 then
[ div [ class "level-item" ] [ div [ class "level-item" ]
[ p [ class "heading is-size-4 has-text-danger" ] [ p [ class "heading is-size-4 has-text-danger" ]
@@ -204,6 +209,8 @@ viewPlayerBar player actionControls =
) )
, div [ class "level-right" ] actionControls , div [ class "level-right" ] actionControls
] ]
]
]
viewWealth : Wealth -> List (Html Msg) viewWealth : Wealth -> List (Html Msg)
@@ -219,7 +226,7 @@ showWealthField : String -> String -> Html Msg
showWealthField name value = showWealthField name value =
div [ class "level-item" ] div [ class "level-item" ]
[ p [ class "has-text-right" ] [ p [ class "has-text-right" ]
[ strong [ class "heading is-marginless" ] [ text name ] [ strong [ class "heading is-marginless has-text-white" ] [ text name ]
, span [ class <| "is-size-4" ] [ text value ] , span [ class <| "is-size-4" ] [ text value ]
] ]
] ]
@@ -281,6 +288,7 @@ view model =
, main_ , main_
[ class "container" ] [ class "container" ]
[ viewNotification model.state.notification [ viewNotification model.state.notification
-- TODO: viewAddLoot when in Add mode -- TODO: viewAddLoot when in Add mode
, case model.state.mode of , case model.state.mode of
Add -> Add ->
@@ -288,39 +296,39 @@ view model =
_ -> _ ->
text "" text ""
, viewLoot header model.searchText rowRenderer canSelect isSelected <| shownItems model , viewLoot header model.searchText rowRenderer canSelect isSelected <| shownItems model
] ]
, hr [] [] , hr [] []
, section [ class "container" ] [ viewDebugSection model ] , section [ class "container" ] [ viewDebugSection model ]
] ]
{- {-
module ActionMode module ActionMode
type Model type Model
= Add = Add
| Sell | Sell
| ... | ...
rowRenderer mode = rowRenderer mode =
... ...
controlButtons mode = controlButtons mode =
... ...
cancelAction toMsg mode = cancelAction toMsg mode =
... ...
confirmAction toMsg items mode = confirmAction toMsg items mode =
... ...
-} -}
-- VIEW LOOT -- VIEW LOOT
@@ -329,7 +337,7 @@ viewLoot header searchText maybeRowRenderer canSelect isSelected items =
let let
filteredItems = filteredItems =
List.filter List.filter
(\i -> String.toLower i.name |> String.contains (String.toLower searchText) ) (\i -> String.toLower i.name |> String.contains (String.toLower searchText))
items items
in in
article article
@@ -354,9 +362,12 @@ viewSearchBar : String -> Html Msg
viewSearchBar textValue = viewSearchBar textValue =
div [ class "field" ] div [ class "field" ]
[ p [ class "control has-icons-left" ] [ p [ class "control has-icons-left" ]
[ input [ class "input" [ input
[ class "input"
, onInput SearchTextChanged , onInput SearchTextChanged
, value textValue ] [] , value textValue
]
[]
, span [ class "icon is-left" ] [ i [ class "fas fa-search" ] [] ] , span [ class "icon is-left" ] [ i [ class "fas fa-search" ] [] ]
] ]
] ]
@@ -433,50 +444,92 @@ viewItemTableRow isSelected canSelect rowRenderer item =
] ]
] ]
-- Adding new loot -- Adding new loot
-- --
viewAddLoot : Model -> Html Msg viewAddLoot : Model -> Html Msg
viewAddLoot model = viewAddLoot model =
let let
showCompletionTips = True showCompletionTips =
newItem = Item 0 "New one #1" 2000 False
newItem =
Item 0 "New one #1" 2000
itemIsValid =
False
in in
div [ class "box is-primary container" ] div [ class "box is-primary" ]
[ div [ class "field is-horizontal" ] [ div [ class "field is-horizontal" ]
[ div [ class "field-label" ] [ div [ class "field-label is-medium" ] [ label [ class "label" ] [ text "Source du loot" ] ]
[ label [ class "label" ] [ text "Nouvel objet" ]]
, div [ class "field-body" ] , div [ class "field-body" ]
[ div [ class "field" ] [ div [ class "field" ]
[ div [ class "control is-expanded" ] [ div [ class "control is-expanded" ]
[ input [ class "input", type_ "text" ] [] ] [ input
, div [ class "dropdown" [ class "input"
, classList [("is-active", showCompletionTips)] ] , type_ "text"
]
[]
]
, p [ class "help" ] [ text "Personnage, lieu ou événement d'où provient ce loot." ]
]
]
]
, hr [] []
, div [ class "field is-horizontal" ]
[ div [ class "field-label is-medium" ] [ label [ class "label" ] [ text "Nouvel objet" ] ]
, div [ class "field-body" ]
[ div [ class "field" ]
[ div [ class "control" ]
[ input
[ class "input"
, type_ "text"
, value newItem.name
]
[]
]
, div
[ class "dropdown"
, classList [ ( "is-active", showCompletionTips ) ]
]
[ div [ class "dropdown-menu" ] [ div [ class "dropdown-menu" ]
[ div [ class "dropdown-content" ] [ div [ class "dropdown-content" ]
[ a [ class "dropdown-item" ] [ text "item" ] ] [ a [ class "dropdown-item" ] [ text "item" ] ]
] ]
] ]
] ]
, div [ class "field is-expanded has-addons" ] , div [ class "field is-narrow" ]
[ p [ class "control" ] [ a [class "button is-static"] [ text "PO" ] ] [ div [ class "field has-addons" ]
[ p [ class "control" ] [ a [ class "button is-static" ] [ text "PO" ] ]
, p [ class "control" ] , p [ class "control" ]
[ input [ type_ "text" [ input
[ type_ "number"
, class "input" , class "input"
, classList [ ("is-danger", True) ]] , value <| String.fromInt newItem.base_price
, classList [ ( "is-danger", True ) ]
]
[] []
] ]
] ]
, div [ class "field" ] , p [ class "help has-text-danger" ] [ text "Vous devez renseigner le prix !" ]
]
, div [ class "field is-narrow" ]
[ div [ class "control" ] [ div [ class "control" ]
[ button [ class "button is-primary" [ button
, disabled True [ class "button is-primary"
, onClick <| NewItemAdded newItem ] , disabled <| not itemIsValid
[ text "Ajouter au coffre" ] ] , onClick <| NewItemAdded newItem
]
[ text "Ajouter au coffre" ]
]
] ]
] ]
] ]
, div [ class "field is-horizontal" ] , div [ class "field is-horizontal" ]
[ div [ class "field-label" ] [ label [ class "label" ] [ text "ou" ] ] [ div [ class "field-label is-medium" ] [ label [ class "label" ] [ text "ou" ] ]
, div [ class "field-body" ] , div [ class "field-body" ]
[ div [ class "control" ] [ div [ class "control" ]
[ button [ class "button" ] [ text "Depuis une liste" ] ] [ button [ class "button" ] [ text "Depuis une liste" ] ]
@@ -485,6 +538,7 @@ viewAddLoot model =
] ]
-- ACTION MODES -- ACTION MODES
-- --
@@ -555,9 +609,11 @@ update msg model =
case msg of case msg of
NewItemAdded item -> NewItemAdded item ->
let let
state = model.state state =
model.state
in in
( { model | state = { state | newLoot = item :: state.newLoot } }, Cmd.none ) ( { model | state = { state | newLoot = item :: state.newLoot } }, Cmd.none )
ApiMsg apiMsg -> ApiMsg apiMsg ->
case apiMsg of case apiMsg of
Api.GotActionResult response -> Api.GotActionResult response ->

2
src/Utils.elm
View File

@@ -11,7 +11,7 @@ renderIcon params =
actionButton msg t icon color = actionButton msg t icon color =
button button
[ class <| "button level-item is-" ++ color [ class <| "button is-medium level-item is-" ++ color
, onClick msg , onClick msg
] ]
[ span [ class "icon" ] [ i [ Svg.Attributes.class <| "fas fa-" ++ icon ] [] ] [ span [ class "icon" ] [ i [ Svg.Attributes.class <| "fas fa-" ++ icon ] [] ]