From 166cd04e4b28770ede854dafc9ae30eae64102fe Mon Sep 17 00:00:00 2001 From: Joris Date: Mon, 28 Mar 2016 17:51:14 +0200 Subject: Create an empty but reachable user page --- src/client/elm/LoggedIn/Home/View/Date.elm | 59 ++++++++++++++++ src/client/elm/LoggedIn/Home/View/Expand.elm | 25 +++++++ src/client/elm/LoggedIn/Home/View/Paging.elm | 102 +++++++++++++++++++++++++++ src/client/elm/LoggedIn/Home/View/Price.elm | 38 ++++++++++ src/client/elm/LoggedIn/Home/View/Table.elm | 98 +++++++++++++++++++++++++ 5 files changed, 322 insertions(+) create mode 100644 src/client/elm/LoggedIn/Home/View/Date.elm create mode 100644 src/client/elm/LoggedIn/Home/View/Expand.elm create mode 100644 src/client/elm/LoggedIn/Home/View/Paging.elm create mode 100644 src/client/elm/LoggedIn/Home/View/Price.elm create mode 100644 src/client/elm/LoggedIn/Home/View/Table.elm (limited to 'src/client/elm/LoggedIn/Home/View') diff --git a/src/client/elm/LoggedIn/Home/View/Date.elm b/src/client/elm/LoggedIn/Home/View/Date.elm new file mode 100644 index 0000000..2cc55fe --- /dev/null +++ b/src/client/elm/LoggedIn/Home/View/Date.elm @@ -0,0 +1,59 @@ +module LoggedIn.Home.View.Date + ( renderShortDate + , renderLongDate + ) where + +import Date exposing (..) +import String + +import Model.Translations exposing (..) + +renderShortDate : Date -> Translations -> String +renderShortDate date translations = + let params = + [ String.pad 2 '0' (toString (Date.day date)) + , String.pad 2 '0' (toString (getMonthNumber (Date.month date))) + , toString (Date.year date) + ] + in getParamMessage params "ShortDate" translations + +renderLongDate : Date -> Translations -> String +renderLongDate date translations = + let params = + [ toString (Date.day date) + , (getMessage (getMonthKey (Date.month date)) translations) + , toString (Date.year date) + ] + in getParamMessage params "LongDate" translations + +getMonthNumber : Month -> Int +getMonthNumber month = + case month of + Jan -> 1 + Feb -> 2 + Mar -> 3 + Apr -> 4 + May -> 5 + Jun -> 6 + Jul -> 7 + Aug -> 8 + Sep -> 9 + Oct -> 10 + Nov -> 11 + Dec -> 12 + +getMonthKey : Month -> String +getMonthKey month = + case month of + Jan -> "January" + Feb -> "February" + Mar -> "March" + Apr -> "April" + May -> "May" + Jun -> "June" + Jul -> "July" + Aug -> "August" + Sep -> "September" + Oct -> "October" + Nov -> "November" + Dec -> "December" diff --git a/src/client/elm/LoggedIn/Home/View/Expand.elm b/src/client/elm/LoggedIn/Home/View/Expand.elm new file mode 100644 index 0000000..514bf93 --- /dev/null +++ b/src/client/elm/LoggedIn/Home/View/Expand.elm @@ -0,0 +1,25 @@ +module LoggedIn.Home.View.Expand + ( expand + , ExpandType(..) + ) where + +import Html exposing (..) +import Html.Attributes exposing (..) + +import View.Icon exposing (renderIcon) + +type ExpandType = ExpandUp | ExpandDown + +expand : ExpandType -> Bool -> Html +expand expandType isExpanded = + div + [ class "expand" ] + [ renderIcon (chevronIcon expandType isExpanded) ] + +chevronIcon : ExpandType -> Bool -> String +chevronIcon expandType isExpanded = + case (expandType, isExpanded) of + (ExpandUp, True) -> "chevron-down" + (ExpandUp, False) -> "chevron-up" + (ExpandDown, True) -> "chevron-up" + (ExpandDown, False) -> "chevron-down" diff --git a/src/client/elm/LoggedIn/Home/View/Paging.elm b/src/client/elm/LoggedIn/Home/View/Paging.elm new file mode 100644 index 0000000..31aa032 --- /dev/null +++ b/src/client/elm/LoggedIn/Home/View/Paging.elm @@ -0,0 +1,102 @@ +module LoggedIn.Home.View.Paging + ( paymentsPaging + ) where + +import Signal exposing (Address) + +import Html exposing (..) +import Html.Attributes exposing (..) +import Html.Events exposing (..) + +import LoggedIn.Action as LoggedInAction + +import LoggedIn.Home.Action as HomeAction +import LoggedIn.Home.Model as HomeModel + +import Action exposing (..) +import Model.Payment exposing (perPage) + +import View.Icon exposing (renderIcon) + +showedPages : Int +showedPages = 5 + +paymentsPaging : Address Action -> HomeModel.Model -> Html +paymentsPaging address homeModel = + let maxPage = ceiling (toFloat homeModel.paymentsCount / toFloat perPage) + pages = truncatePages homeModel.currentPage [1..maxPage] + in if maxPage == 1 + then + text "" + else + div + [ class "pages" ] + ( ( if homeModel.currentPage > 1 + then [ firstPage address, previousPage address homeModel ] + else [] + ) + ++ ( List.map (paymentsPage address homeModel) pages) + ++ ( if homeModel.currentPage < maxPage + then [ nextPage address homeModel, lastPage address maxPage ] + else [] + ) + ) + +truncatePages : Int -> List Int -> List Int +truncatePages currentPage pages = + let totalPages = List.length pages + showedLeftPages = ceiling ((toFloat showedPages - 1) / 2) + showedRightPages = floor ((toFloat showedPages - 1) / 2) + truncatedPages = + if currentPage < showedLeftPages then + [1..showedPages] + else if currentPage > totalPages - showedRightPages then + [(totalPages - showedPages)..totalPages] + else + [(currentPage - showedLeftPages)..(currentPage + showedRightPages)] + in List.filter (flip List.member pages) truncatedPages + +firstPage : Address Action -> Html +firstPage address = + button + [ class "page" + , onClick address (UpdateLoggedIn << LoggedInAction.HomeAction << HomeAction.UpdatePage <| 1) + ] + [ renderIcon "fast-backward" ] + +previousPage : Address Action -> HomeModel.Model -> Html +previousPage address homeModel = + button + [ class "page" + , onClick address (UpdateLoggedIn << LoggedInAction.HomeAction << HomeAction.UpdatePage <| homeModel.currentPage - 1) + ] + [ renderIcon "backward" ] + +nextPage : Address Action -> HomeModel.Model -> Html +nextPage address homeModel = + button + [ class "page" + , onClick address (UpdateLoggedIn << LoggedInAction.HomeAction << HomeAction.UpdatePage <| homeModel.currentPage + 1) + ] + [ renderIcon "forward" ] + +lastPage : Address Action -> Int -> Html +lastPage address maxPage = + button + [ class "page" + , onClick address (UpdateLoggedIn << LoggedInAction.HomeAction << HomeAction.UpdatePage <| maxPage) + ] + [ renderIcon "fast-forward" ] + +paymentsPage : Address Action -> HomeModel.Model -> Int -> Html +paymentsPage address homeModel page = + let onCurrentPage = page == homeModel.currentPage + in button + [ classList + [ ("page", True) + , ("current", onCurrentPage) + ] + , onClick address <| + if onCurrentPage then Action.NoOp else UpdateLoggedIn << LoggedInAction.HomeAction << HomeAction.UpdatePage <| page + ] + [ text (toString page) ] diff --git a/src/client/elm/LoggedIn/Home/View/Price.elm b/src/client/elm/LoggedIn/Home/View/Price.elm new file mode 100644 index 0000000..a3229a0 --- /dev/null +++ b/src/client/elm/LoggedIn/Home/View/Price.elm @@ -0,0 +1,38 @@ +module LoggedIn.Home.View.Price + ( price + ) where + +import String exposing (..) + +import Model exposing (Model) +import Model.Translations exposing (getMessage) + +price : Model -> Int -> String +price model amount = + ( formatInt amount + ++ " " + ++ model.conf.currency + ) + +formatInt : Int -> String +formatInt n = + abs n + |> toString + |> toList + |> List.reverse + |> group 3 + |> List.intersperse [' '] + |> List.concat + |> List.reverse + |> fromList + |> append (if n < 0 then "-" else "") + +group : Int -> List a -> List (List a) +group n xs = + if List.length xs <= n + then + [xs] + else + let take = List.take n xs + drop = List.drop n xs + in take :: (group n drop) diff --git a/src/client/elm/LoggedIn/Home/View/Table.elm b/src/client/elm/LoggedIn/Home/View/Table.elm new file mode 100644 index 0000000..e49fd05 --- /dev/null +++ b/src/client/elm/LoggedIn/Home/View/Table.elm @@ -0,0 +1,98 @@ +module LoggedIn.Home.View.Table + ( paymentsTable + ) where + +import Dict exposing (..) +import Date exposing (Date) +import Signal exposing (Address) +import String exposing (append) + +import Html exposing (..) +import Html.Attributes exposing (..) +import Html.Events exposing (..) + +import LoggedIn.Action as LoggedInAction + +import LoggedIn.Home.Action as HomeAction +import LoggedIn.Home.Model as HomeModel +import LoggedIn.Home.View.Date exposing (..) +import LoggedIn.Home.View.Price exposing (price) + +import Model exposing (Model) +import Model.User exposing (getUserName) +import Model.Payment exposing (..) +import Model.Translations exposing (getMessage) +import Action exposing (..) + +import View.Icon exposing (renderIcon) + +paymentsTable : Address Action -> Model -> HomeModel.Model -> Html +paymentsTable address model homeModel = + div + [ class "table" ] + ( headerLine model :: paymentLines address model homeModel) + +headerLine : Model -> Html +headerLine model = + div + [ class "header" ] + [ div [ class "cell category" ] [ renderIcon "shopping-cart" ] + , div [ class "cell cost" ] [ text model.conf.currency ] + , div [ class "cell user" ] [ renderIcon "user" ] + , div [ class "cell date" ] [ renderIcon "calendar" ] + , div [ class "cell" ] [] + ] + +paymentLines : Address Action -> Model -> HomeModel.Model -> List Html +paymentLines address model homeModel = + homeModel.payments + |> List.sortBy (Date.toTime << .creation) + |> List.reverse + |> List.drop ((homeModel.currentPage - 1) * perPage) + |> List.take perPage + |> List.map (paymentLine address model homeModel) + +paymentLine : Address Action -> Model -> HomeModel.Model -> Payment -> Html +paymentLine address model homeModel payment = + a + [ classList + [ ("row", True) + , ("edition", homeModel.paymentEdition == Just payment.id) + ] + , onClick address (UpdateLoggedIn << LoggedInAction.HomeAction << HomeAction.ToggleEdit <| payment.id) + ] + [ div [ class "cell category" ] [ text payment.name ] + , div + [ classList + [ ("cell cost", True) + , ("refund", payment.cost < 0) + ] + ] + [ text (price model payment.cost) ] + , div + [ class "cell user" ] + [ payment.userId + |> getUserName homeModel.users + |> Maybe.withDefault "−" + |> text + ] + , div + [ class "cell date" ] + [ span + [ class "shortDate" ] + [ text (renderShortDate payment.creation model.translations) ] + , span + [ class "longDate" ] + [ text (renderLongDate payment.creation model.translations) ] + ] + , if homeModel.account.me == payment.userId + then + div + [ class "cell delete" ] + [ button + [ onClick address (UpdateLoggedIn <| LoggedInAction.HomeAction <| HomeAction.DeletePayment payment Punctual)] + [ renderIcon "times" ] + ] + else + div [ class "cell" ] [] + ] -- cgit v1.2.3