Tidy up the deck editor layout
This commit is contained in:
parent
fcbd583b95
commit
2f38c30ca1
2 changed files with 68 additions and 53 deletions
|
@ -71,49 +71,35 @@ update msg model =
|
||||||
( { model | deck = Failed }, Cmd.none )
|
( { model | deck = Failed }, Cmd.none )
|
||||||
|
|
||||||
|
|
||||||
viewDeck : Model -> E.Element Msg
|
viewDeck : Deck.Deck -> E.Element Msg
|
||||||
viewDeck model =
|
viewDeck deck =
|
||||||
case model.deck of
|
let
|
||||||
Failed ->
|
cardRow card =
|
||||||
E.none
|
E.row
|
||||||
|
[ E.width E.fill
|
||||||
NotFound ->
|
, E.spacing 10
|
||||||
E.none
|
, E.padding 3
|
||||||
|
|
||||||
Loading ->
|
|
||||||
E.el [ E.height E.fill, E.centerX ] <|
|
|
||||||
E.html <|
|
|
||||||
Spinner.view UI.manaSpinner
|
|
||||||
model.spinner
|
|
||||||
|
|
||||||
Ready deck ->
|
|
||||||
let
|
|
||||||
cardRow card =
|
|
||||||
E.row
|
|
||||||
[ E.width E.fill
|
|
||||||
, E.spacing 10
|
|
||||||
, E.padding 3
|
|
||||||
]
|
|
||||||
[ E.column [ E.centerY, E.height E.fill, E.width E.fill, E.clipX ]
|
|
||||||
[ UI.title card.oracle.name
|
|
||||||
, UI.subtitle ("x" ++ String.fromInt card.quantity)
|
|
||||||
]
|
|
||||||
]
|
|
||||||
in
|
|
||||||
E.column [ E.height E.fill, E.width E.fill, E.centerX, E.spacing 5 ] <|
|
|
||||||
[ E.paragraph [ Font.heavy, Font.size 24, Font.center ] [ UI.title deck.name ]
|
|
||||||
, E.column [ E.width E.fill, E.height E.fill, E.scrollbarY ] <|
|
|
||||||
List.map
|
|
||||||
(\dc ->
|
|
||||||
UI.cardRow
|
|
||||||
{ foil = False
|
|
||||||
, subtitle = "x" ++ String.fromInt dc.quantity
|
|
||||||
}
|
|
||||||
[]
|
|
||||||
dc.card
|
|
||||||
)
|
|
||||||
deck.cards
|
|
||||||
]
|
]
|
||||||
|
[ E.column [ E.centerY, E.height E.fill, E.width E.fill, E.clipX ]
|
||||||
|
[ UI.title card.oracle.name
|
||||||
|
, UI.subtitle ("x" ++ String.fromInt card.quantity)
|
||||||
|
]
|
||||||
|
]
|
||||||
|
in
|
||||||
|
E.column [ E.height E.fill, E.width E.fill, E.centerX, E.spacing 5 ] <|
|
||||||
|
[ E.paragraph [ Font.heavy, Font.size 24, Font.center ] [ UI.title deck.name ]
|
||||||
|
, E.column [ E.width E.fill, E.height E.fill, E.scrollbarY ] <|
|
||||||
|
List.map
|
||||||
|
(\dc ->
|
||||||
|
UI.cardRow
|
||||||
|
{ foil = False
|
||||||
|
, subtitle = "x" ++ String.fromInt dc.quantity
|
||||||
|
}
|
||||||
|
[]
|
||||||
|
dc.card
|
||||||
|
)
|
||||||
|
deck.cards
|
||||||
|
]
|
||||||
|
|
||||||
|
|
||||||
view : Model -> E.Element Msg
|
view : Model -> E.Element Msg
|
||||||
|
@ -122,17 +108,32 @@ view model =
|
||||||
[ E.width E.fill
|
[ E.width E.fill
|
||||||
, E.height E.fill
|
, E.height E.fill
|
||||||
]
|
]
|
||||||
[ viewDeck model
|
[ case model.deck of
|
||||||
, E.el
|
Ready deck ->
|
||||||
[ E.height (E.px 50)
|
viewDeck deck
|
||||||
, E.width E.fill
|
|
||||||
, E.padding 10
|
Failed ->
|
||||||
, Font.color UI.colors.text
|
E.none
|
||||||
, Background.color UI.colors.navBar
|
|
||||||
, E.alignBottom
|
NotFound ->
|
||||||
]
|
E.none
|
||||||
<|
|
|
||||||
E.text "Foo"
|
Loading ->
|
||||||
|
E.el [ E.height E.fill, E.centerX ] <|
|
||||||
|
E.html <|
|
||||||
|
Spinner.view UI.manaSpinner
|
||||||
|
model.spinner
|
||||||
|
, UI.footer <|
|
||||||
|
case model.deck of
|
||||||
|
Ready deck ->
|
||||||
|
UI.text <|
|
||||||
|
String.join " "
|
||||||
|
[ String.fromInt (List.sum <| List.map .quantity deck.cards)
|
||||||
|
, "cards"
|
||||||
|
]
|
||||||
|
|
||||||
|
_ ->
|
||||||
|
E.none
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -2,6 +2,7 @@ module UI exposing
|
||||||
( Dimensions
|
( Dimensions
|
||||||
, cardRow
|
, cardRow
|
||||||
, colors
|
, colors
|
||||||
|
, footer
|
||||||
, getViewport
|
, getViewport
|
||||||
, isMobile
|
, isMobile
|
||||||
, manaSpinner
|
, manaSpinner
|
||||||
|
@ -270,3 +271,16 @@ cardRow options attributes card =
|
||||||
setBadge options.foil
|
setBadge options.foil
|
||||||
:: List.map priceBadge prices
|
:: List.map priceBadge prices
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|
||||||
|
footer : E.Element msg -> E.Element msg
|
||||||
|
footer element =
|
||||||
|
E.el
|
||||||
|
[ E.height (E.px 50)
|
||||||
|
, E.width E.fill
|
||||||
|
, E.padding 10
|
||||||
|
, Font.color colors.text
|
||||||
|
, Background.color colors.navBar
|
||||||
|
, E.alignBottom
|
||||||
|
]
|
||||||
|
element
|
||||||
|
|
Loading…
Reference in a new issue