1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
|
module LoggedIn.Home.View.Paging exposing
( view
)
import Color exposing (Color)
import FontAwesome
import Html exposing (..)
import Html.Attributes exposing (..)
import Html.Events exposing (..)
import LoggedIn.Msg as LoggedInMsg
import LoggedIn.Home.Msg as HomeMsg
import LoggedIn.Home.Model as HomeModel
import Msg exposing (Msg)
import LoggedData exposing (LoggedData)
import Model.Payment as Payment exposing (Payments, perPage)
showedPages : Int
showedPages = 5
view : HomeModel.Model -> Payments -> Html Msg
view homeModel payments =
let maxPage = ceiling (toFloat (List.length payments) / toFloat perPage)
pages = truncatePages homeModel.currentPage [1..maxPage]
in if maxPage <= 1
then
text ""
else
div
[ class "pages" ]
( [ firstPage homeModel, previousPage homeModel ]
++ ( List.map (paymentsPage homeModel) pages)
++ [ nextPage homeModel maxPage, lastPage homeModel maxPage ]
)
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 + 1)..totalPages]
else
[(currentPage - showedLeftPages)..(currentPage + showedRightPages)]
in List.filter (flip List.member pages) truncatedPages
firstPage : HomeModel.Model -> Html Msg
firstPage homeModel =
button
[ classList
[ ("page", True)
, ("disable", homeModel.currentPage <= 1)
]
, onClick (Msg.UpdateLoggedIn << LoggedInMsg.HomeMsg << HomeMsg.UpdatePage <| 1)
]
[ FontAwesome.fast_backward grey 13 ]
previousPage : HomeModel.Model -> Html Msg
previousPage homeModel =
button
[ class "page"
, onClick <|
if homeModel.currentPage > 1
then (Msg.UpdateLoggedIn << LoggedInMsg.HomeMsg << HomeMsg.UpdatePage <| homeModel.currentPage - 1)
else Msg.NoOp
]
[ FontAwesome.backward grey 13 ]
nextPage : HomeModel.Model -> Int -> Html Msg
nextPage homeModel maxPage =
button
[ class "page"
, onClick <|
if homeModel.currentPage < maxPage
then (Msg.UpdateLoggedIn << LoggedInMsg.HomeMsg << HomeMsg.UpdatePage <| homeModel.currentPage + 1)
else Msg.NoOp
]
[ FontAwesome.forward grey 13 ]
lastPage : HomeModel.Model -> Int -> Html Msg
lastPage homeModel maxPage =
button
[ class "page"
, onClick (Msg.UpdateLoggedIn << LoggedInMsg.HomeMsg << HomeMsg.UpdatePage <| maxPage)
]
[ FontAwesome.fast_forward grey 13 ]
paymentsPage : HomeModel.Model -> Int -> Html Msg
paymentsPage homeModel page =
let onCurrentPage = page == homeModel.currentPage
in button
[ classList
[ ("page", True)
, ("current", onCurrentPage)
]
, onClick <|
if onCurrentPage
then Msg.NoOp
else Msg.UpdateLoggedIn << LoggedInMsg.HomeMsg << HomeMsg.UpdatePage <| page
]
[ text (toString page) ]
grey : Color
grey = Color.greyscale 0.35
|
