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
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
|
module View.Page
( renderPage
) where
import Html exposing (..)
import Html as H
import Html.Attributes exposing (..)
import Html.Attributes as A
import Html.Events exposing (..)
import Date
import Date exposing (Date)
import String exposing (append)
import Json.Decode as Json
import Model exposing (Model)
import Model.Payment exposing (Payments, Payment)
import Model.View exposing (..)
import Model.View.SignIn exposing (..)
import Update exposing (..)
import Update.SignIn exposing (..)
import ServerCommunication as SC
import ServerCommunication exposing (serverCommunications)
import View.Icon exposing (renderIcon)
renderPage : Model -> Html
renderPage model =
div
[]
[ renderHeader model
, renderMain model
]
renderHeader : Model -> Html
renderHeader model =
header
[]
[ h1
[]
[ text "Shared Cost" ]
, case model.view of
LoadingView ->
text ""
SignInView _ ->
text ""
PaymentView _ ->
button
[ class "signOut"
, onClick serverCommunications.address SC.SignOut
]
[ renderIcon "power-off" ]
]
renderMain : Model -> Html
renderMain model =
case model.view of
LoadingView ->
loadingView
SignInView signIn ->
signInView signIn
PaymentView payments ->
paymentsView payments
loadingView : Html
loadingView = text ""
signInView : SignIn -> Html
signInView signIn =
div
[ class "signIn" ]
[ div
[ class "form" ]
[ input
[ value signIn.login
, on "input" targetValue (Signal.message actions.address << UpdateSignIn << UpdateLogin)
, onEnter serverCommunications.address (SC.SignIn signIn.login)
]
[]
, button
[ onClick serverCommunications.address (SC.SignIn signIn.login) ]
[ text "Sign in" ]
]
, div
[ class "result" ]
[ signInResult signIn ]
]
onEnter : Signal.Address a -> a -> Attribute
onEnter address value =
on "keydown"
(Json.customDecoder keyCode (\code -> if code == 13 then Ok () else Err ""))
(\_ -> Signal.message address value)
signInResult : SignIn -> Html
signInResult signIn =
case signIn.result of
Just result ->
case result of
Ok login ->
div
[ class "success" ]
[ text ("We send you an email, please click to the provided link in order to sign in.") ]
Err error ->
div
[ class "error" ]
[ text error ]
Nothing ->
text ""
paymentsView : Payments -> Html
paymentsView payments =
table
[]
([ tr
[]
[ th [] [ renderIcon "user" ]
, th [] [ renderIcon "shopping-cart" ]
, th [] [ renderIcon "euro" ]
, th [] [ renderIcon "calendar" ]
]
] ++ (paymentLines payments))
paymentLines : Payments -> List Html
paymentLines payments =
payments
|> List.sortBy (Date.toTime << .creation)
|> List.reverse
|> List.map paymentLine
paymentLine : Payment -> Html
paymentLine payment =
tr
[]
[ td [] [ text payment.userName ]
, td [] [ text payment.name ]
, td [] [ text ((toString payment.cost) ++ " €") ]
, td [] [ text (renderDate payment.creation) ]
]
renderDate : Date -> String
renderDate date =
toString (Date.day date)
|> flip append (" " ++ (toString (Date.month date)) ++ ".")
|> flip append (" " ++ (toString (Date.year date)))
|
