Merge the latest version of Speedometer 2.0 to browserbench.org against at r221119.
[WebKit-https.git] / Websites / browserbench.org / Speedometer2.0 / resources / todomvc / functional-prog-examples / elm / Todo / Task.elm
1 module Todo.Task exposing (..)
2
3 import Html exposing (..)
4 import Html.Attributes exposing (..)
5 import Html.Events exposing (..)
6 import Json.Decode
7 import String
8
9
10 -- MODEL
11
12
13 type alias Model =
14     { description : String
15     , completed : Bool
16     , edits : Maybe String
17     , id : Int
18     }
19
20
21 init : String -> Int -> Model
22 init desc id =
23     { description = desc
24     , completed = False
25     , edits = Nothing
26     , id = id
27     }
28
29
30
31 -- UPDATE
32
33
34 type Msg
35     = Focus String
36     | Edit String
37     | Cancel
38     | Commit
39     | Completed Bool
40     | Delete
41
42
43 update : Msg -> Model -> Maybe Model
44 update msg model =
45     case msg of
46         Focus elementId ->
47             Just { model | edits = Just model.description }
48
49         Edit description ->
50             Just { model | edits = Just description }
51
52         Cancel ->
53             Just { model | edits = Nothing }
54
55         Commit ->
56             case model.edits of
57                 Nothing ->
58                     Just model
59
60                 Just rawDescription ->
61                     let
62                         description =
63                             String.trim rawDescription
64                     in
65                         if String.isEmpty description then
66                             Nothing
67                         else
68                             Just
69                                 { model
70                                     | edits = Nothing
71                                     , description = description
72                                 }
73
74         Completed bool ->
75             Just { model | completed = bool }
76
77         Delete ->
78             Nothing
79
80
81
82 -- VIEW
83
84
85 view : Model -> Html Msg
86 view model =
87     let
88         className =
89             (if model.completed then
90                 "completed "
91              else
92                 ""
93             )
94                 ++ case model.edits of
95                     Just _ ->
96                         "editing"
97
98                     Nothing ->
99                         ""
100
101         description =
102             Maybe.withDefault model.description model.edits
103
104         elementId =
105             "todo-" ++ toString model.id
106     in
107         li
108             [ class className ]
109             [ div
110                 [ class "view" ]
111                 [ input
112                     [ class "toggle"
113                     , type' "checkbox"
114                     , checked model.completed
115                     , onClick (Completed (not model.completed))
116                     ]
117                     []
118                 , label
119                     [ onDoubleClick (Focus elementId) ]
120                     [ text description ]
121                 , button
122                     [ class "destroy"
123                     , onClick Delete
124                     ]
125                     []
126                 ]
127             , input
128                 [ class "edit"
129                 , value description
130                 , name "title"
131                 , id (elementId)
132                 , onInput Edit
133                 , onBlur Commit
134                 , onFinish Commit Cancel
135                 ]
136                 []
137             ]
138
139
140 onFinish : msg -> msg -> Attribute msg
141 onFinish enterMessage escapeMessage =
142     let
143         select key =
144             case key of
145                 13 ->
146                     enterMessage
147
148                 _ ->
149                     -- Not a 'finish' key, such as ENTER or ESCAPE
150                     escapeMessage
151     in
152         on "keydown" (Json.Decode.map select keyCode)