From 2f38c30ca1f6abd3954091d5c86e58ea880f59e8 Mon Sep 17 00:00:00 2001
From: Correl Roush <correl@gmail.com>
Date: Tue, 10 Jan 2023 21:36:57 -0500
Subject: [PATCH] Tidy up the deck editor layout

---
 www/src/Pages/DeckEditor.elm | 107 ++++++++++++++++++-----------------
 www/src/UI.elm               |  14 +++++
 2 files changed, 68 insertions(+), 53 deletions(-)

diff --git a/www/src/Pages/DeckEditor.elm b/www/src/Pages/DeckEditor.elm
index 71d9672..d4f6bcd 100644
--- a/www/src/Pages/DeckEditor.elm
+++ b/www/src/Pages/DeckEditor.elm
@@ -71,49 +71,35 @@ update msg model =
             ( { model | deck = Failed }, Cmd.none )
 
 
-viewDeck : Model -> E.Element Msg
-viewDeck model =
-    case model.deck of
-        Failed ->
-            E.none
-
-        NotFound ->
-            E.none
-
-        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
+viewDeck : Deck.Deck -> E.Element Msg
+viewDeck 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
+        ]
 
 
 view : Model -> E.Element Msg
@@ -122,17 +108,32 @@ view model =
         [ E.width E.fill
         , E.height E.fill
         ]
-        [ viewDeck model
-        , E.el
-            [ E.height (E.px 50)
-            , E.width E.fill
-            , E.padding 10
-            , Font.color UI.colors.text
-            , Background.color UI.colors.navBar
-            , E.alignBottom
-            ]
-          <|
-            E.text "Foo"
+        [ case model.deck of
+            Ready deck ->
+                viewDeck deck
+
+            Failed ->
+                E.none
+
+            NotFound ->
+                E.none
+
+            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
         ]
 
 
diff --git a/www/src/UI.elm b/www/src/UI.elm
index b80df85..6f3448c 100644
--- a/www/src/UI.elm
+++ b/www/src/UI.elm
@@ -2,6 +2,7 @@ module UI exposing
     ( Dimensions
     , cardRow
     , colors
+    , footer
     , getViewport
     , isMobile
     , manaSpinner
@@ -270,3 +271,16 @@ cardRow options attributes card =
             setBadge options.foil
                 :: 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