From 973a039b54327df74396605410ea9abe19c8a4e7 Mon Sep 17 00:00:00 2001 From: Joris Date: Sun, 4 Sep 2016 21:21:11 +0200 Subject: Upgrade to elm 0.17.1 --- src/Timer/View.elm | 175 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 175 insertions(+) create mode 100644 src/Timer/View.elm (limited to 'src/Timer/View.elm') diff --git a/src/Timer/View.elm b/src/Timer/View.elm new file mode 100644 index 0000000..561ae8f --- /dev/null +++ b/src/Timer/View.elm @@ -0,0 +1,175 @@ +module Timer.View exposing + ( view + ) + +import Html exposing (..) +import Html.Attributes exposing (..) +import Html.Events exposing (..) +import Time exposing (Time) +import Maybe +import List +import String + +import Msg exposing (Msg) + +import Model exposing (..) +import Model.Id exposing (..) + +import Timer.Model exposing (..) +import Timer.Model.State exposing (..) +import Timer.Update exposing (..) +import Timer.Msg as Timer + +import Edition.Model exposing (..) +import Edition.Model.Name exposing (..) +import Edition.Model.Time exposing (..) + +import Update exposing (..) + +import Utils.Maybe exposing (..) + +view : Model -> (Id, Timer) -> Html Msg +view model (id, timer) = + div + [ [ ("timer", True) + , ("isRinging", timer.state == Ringing) + , ("isRunning", timer.state == Running) + ] + |> classList + ] + [ renderMaybeEdition model id Name (nameBlockReadOnly id timer) (nameBlockEdition 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 Msg +nameBlockReadOnly id timer = + div + [ class "name" + , onClick (Msg.Edit id Name) + ] + [ text (timerName id timer) ] + +nameBlockEdition : Id -> Timer -> Edition -> Html Msg +nameBlockEdition id timer edition = + div + [ [ ("name", True) + , ("edition", True) + , ("empty", isEmpty edition) + ] + |> classList + , onClick Msg.NoOp + ] + [ if isEmpty edition + then + text (timerName id timer) + else + edition.chars + |> renderNameEdition + |> flip String.append "_" + |> text + ] + +timerName : Id -> Timer -> String +timerName id = Maybe.withDefault ("Timer " ++ toString id) << .name + +timeBlockReadOnly : (Id, Timer) -> Html Msg +timeBlockReadOnly (id, timer) = + div + [ class "time" + , onClick (Msg.Edit id Time) + ] + [ timeWithProgressBar (id, timer) ] + +timeBlockEdition : (Id, Timer) -> Edition -> Html Msg +timeBlockEdition (id, timer) edition = + div + [ [ ("time", True) + , ("edition", True) + , ("empty", isEmpty edition) + ] + |> classList + , onClick Msg.NoOp + ] + [ if isEmpty edition + then + timeWithProgressBar (id, timer) + else + text (editionView edition.chars) + ] + +editionView : List Char -> String +editionView numbers = + let (minutes, seconds) = toMinutesAndSeconds numbers + in minutes ++ " : " ++ seconds + +timeView : Time -> String +timeView time = + 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 : (Id, Timer) -> Html Msg +timeWithProgressBar (id, timer) = + div + [] + [ span + [ class "progressBar" + , let width = + 1 - timer.time / timer.initialTime + |> (*) 1020 + |> round + |> toString + |> flip String.append "px" + in style [ ("width", width) ] + , onClick (Msg.UpdateTimer id Timer.Stop) + ] + [] + , span + [ class "text" ] + [ text (timeView timer.time) ] + ] + +playPauseTimer : (Id, Timer) -> Html Msg +playPauseTimer (id, timer) = + button + [ class <| "playPause" + , onClick (Msg.UpdateTimer id Timer.ToggleRunning) + ] + [ let icon = if timer.state == Running then "fa-pause" else "fa-play" + in i + [ class <| "fa fa-fw " ++ icon ] + [] + ] + +stopTimer : (Id, Timer) -> Html Msg +stopTimer (id, timer) = + button + [ class <| "stop" + , onClick (Msg.UpdateTimer id Timer.Stop) + ] + [ i [ class "fa fa-fw fa-stop" ] [] ] + +removeTimer : (Id, Timer) -> Html Msg +removeTimer (id, timer) = + button + [ class <| "remove" + , onClick (Msg.RemoveTimer id) + ] + [ i [ class "fa fa-fw fa-remove" ] [] ] + +renderMaybeEdition : Model -> Id -> Kind -> Html Msg -> (Edition -> Html Msg) -> Html Msg +renderMaybeEdition model id kind readOnlyView editionView = + let maybeEdition = filterMaybe (\edition -> edition.id == id) model.edition + in case maybeEdition of + Just edition -> + if edition.kind == kind + then + editionView edition + else + readOnlyView + Nothing -> + readOnlyView -- cgit v1.2.3