Amelioring UX

4 files changed, 48 insertions, 61 deletions

diff --git a/src/Model/Timer.elm b/src/Model/Timer.elm
index 20c0ea8..51d293d 100644
--- a/src/Model/Timer.elm
+++ b/src/Model/Timer.elm
@@ -1,7 +1,6 @@
 module Model.Timer
   ( Timer
   , initialTimer
-  , initTime
   ) where
 
 import List
@@ -23,9 +22,6 @@ initialTimer creationTime =
   in  { creationTime = creationTime
       , name = Nothing
       , initialTime = initialTime
-      , currentTime = initTime initialTime
+      , currentTime = initialTime
       , state = Idle
       }
-
-initTime : Time -> Time
-initTime t = t + 999
diff --git a/src/Update/UpdateTimer.elm b/src/Update/UpdateTimer.elm
index 49593d0..08b9969 100644
--- a/src/Update/UpdateTimer.elm
+++ b/src/Update/UpdateTimer.elm
@@ -25,30 +25,22 @@ updateTimer action timer =
     Pause ->
       { timer | state <- Idle }
     ToggleRunning ->
-      if timer.state == Ringing
-        then
-          { timer
-          | currentTime <- initTime timer.initialTime
-          , state <- Running
-          }
-        else
-          { timer
-          | state <-
-              if timer.currentTime > 0 && timer.state == Idle
-                then Running
-                else Idle
-          }
+      { timer
+      | state <-
+          if timer.currentTime > 0 && timer.state == Idle
+            then Running
+            else Idle
+      }
     Stop ->
       { timer
-      | currentTime <- initTime timer.initialTime
+      | currentTime <- timer.initialTime
       , state <- Idle
       }
     SetTime time ->
-      let augmentedTime = time + 999
-      in  { timer
-          | initialTime <- time
-          , currentTime <- augmentedTime
-          }
+      { timer
+      | initialTime <- time
+      , currentTime <- time
+      }
     SubstractTime time ->
       if timer.state == Running
         then
diff --git a/src/View/Timer.elm b/src/View/Timer.elm
index c4b3bbb..4672594 100644
--- a/src/View/Timer.elm
+++ b/src/View/Timer.elm
@@ -29,18 +29,23 @@ import Utils.Maybe exposing (..)
 timerView : Model -> (Id, Timer) -> Html
 timerView model (id, timer) =
   div
-    [ class "timer" ]
+    [ [ (True, "timer")
+      , (timer.state == Ringing, "isRinging")
+      , (timer.state == Running, "isRunning")
+      ]
+        |> activatedClasses
+    ]
     [ renderMaybeEdition model id Name (nameBlockReadOnly id timer) (nameBlockEdition id timer)
-    , renderMaybeEdition model id Time (timeBlockReadOnly id timer) (timeBlockEdition timer)
-    , playPauseBlock (id, timer)
-    , stopBlock (id, timer)
-    , removeBlock (id, timer)
+    , renderMaybeEdition model id Time (timeBlockReadOnly (id, timer)) (timeBlockEdition (id, timer))
+    , playPauseTimer (id, timer)
+    , stopTimer (id, timer)
+    , removeTimer (id, timer)
     ]
 
 nameBlockReadOnly : Id -> Timer -> Html
 nameBlockReadOnly id timer =
   div
-    [ class "name block"
+    [ class "name"
     , onClick actions.address (Edit id Name)
     ]
     [ text (timerName id timer) ]
@@ -48,7 +53,7 @@ nameBlockReadOnly id timer =
 nameBlockEdition : Id -> Timer -> Edition -> Html
 nameBlockEdition id timer edition =
   div
-    [ [ (True, "name block edition")
+    [ [ (True, "name edition")
       , (isEmpty edition, "empty")
       ]
         |> activatedClasses
@@ -67,24 +72,18 @@ nameBlockEdition id timer edition =
 timerName : Id -> Timer -> String
 timerName id = Maybe.withDefault ("Timer " ++ toString id) << .name
 
-timeBlockReadOnly : Id -> Timer -> Html
-timeBlockReadOnly id timer =
+timeBlockReadOnly : (Id, Timer) -> Html
+timeBlockReadOnly (id, timer) =
   div
-    [ [ (True, "time block")
-      , (timer.state == Ringing, "isRinging")
-      , (timer.state == Running, "isRunning")
-      ]
-        |> activatedClasses
-    , if timer.state == Ringing
-         then onClick actions.address (UpdateTimer id Stop)
-         else onClick actions.address (Edit id Time)
+    [ class "time"
+    , onClick actions.address (Edit id Time)
     ]
-    [ timeWithProgressBar timer ]
+    [ timeWithProgressBar (id, timer) ]
 
-timeBlockEdition : Timer -> Edition -> Html
-timeBlockEdition timer edition =
+timeBlockEdition : (Id, Timer) -> Edition -> Html
+timeBlockEdition (id, timer) edition =
   div
-    [ [ (True, "time block edition")
+    [ [ (True, "time edition")
       , (isEmpty edition, "empty")
       ]
         |> activatedClasses
@@ -92,7 +91,7 @@ timeBlockEdition timer edition =
     ]
     [ if isEmpty edition
         then
-          timeWithProgressBar timer
+          timeWithProgressBar (id, timer)
         else
           text (editionView edition.chars)
     ]
@@ -104,24 +103,25 @@ editionView numbers =
 
 timeView : Time -> String
 timeView time =
-  let totalSeconds = truncate (time / 1000)
+  let totalSeconds = ceiling (time / 1000)
       totalMinutes = totalSeconds // 60
       restSeconds = totalSeconds `rem` 60
   in  (String.padLeft 2 '0' (toString totalMinutes)) ++ " : " ++ (String.padLeft 2 '0' (toString restSeconds))
 
-timeWithProgressBar : Timer -> Html
-timeWithProgressBar timer =
+timeWithProgressBar : (Id, Timer) -> Html
+timeWithProgressBar (id, timer) =
   div
     []
     [ span
         [ class "progressBar"
         , let width =
-                1 - timer.currentTime / (initTime timer.initialTime)
-                  |> (*) 198
+                1 - timer.currentTime / timer.initialTime
+                  |> (*) 1020
                   |> round
                   |> toString
                   |> flip String.append "px"
           in style [ ("width", width) ]
+        , onClick actions.address (UpdateTimer id Stop)
         ]
         []
     , span
@@ -129,10 +129,10 @@ timeWithProgressBar timer =
         [ text (timeView timer.currentTime) ]
     ]
 
-playPauseBlock : (Id, Timer) -> Html
-playPauseBlock (id, timer) =
+playPauseTimer : (Id, Timer) -> Html
+playPauseTimer (id, timer) =
   button
-    [ class <| "playPause block"
+    [ class <| "playPause"
     , onClick actions.address (UpdateTimer id ToggleRunning)
     ]
     [ let icon = if timer.state == Running then "fa-pause" else "fa-play"
@@ -141,18 +141,18 @@ playPauseBlock (id, timer) =
             []
     ]
 
-stopBlock : (Id, Timer) -> Html
-stopBlock (id, timer) =
+stopTimer : (Id, Timer) -> Html
+stopTimer (id, timer) =
   button
-    [ class <| "stop block"
+    [ class <| "stop"
     , onClick actions.address (UpdateTimer id Stop)
     ]
     [ i [ class "fa fa-fw fa-stop" ] [] ]
 
-removeBlock : (Id, Timer) -> Html
-removeBlock (id, timer) =
+removeTimer : (Id, Timer) -> Html
+removeTimer (id, timer) =
   button
-    [ class <| "remove block"
+    [ class <| "remove"
     , onClick actions.address (RemoveTimer id)
     ]
     [ i [ class "fa fa-fw fa-remove" ] [] ]
diff --git a/src/View/View.elm b/src/View/View.elm
index b3d1dcc..a69d662 100644
--- a/src/View/View.elm
+++ b/src/View/View.elm
@@ -26,7 +26,6 @@ view model =
     , model.timers
         |> Dict.toList
         |> List.sortBy (.creationTime << snd)
-        |> List.reverse
         |> timers model
     ]