Merge pull request #27 from CharlonTank/v2

Fix steps resetting to initial states + Added an example for animating a timeline

examples-new/elm.json

@@ -1,7 +1,7 @@
 {
     "type": "application",
     "source-directories": [
-        ".",
+        "src",
         "../src"
     ],
     "elm-version": "0.19.1",
@@ -9,33 +9,35 @@
         "direct": {
             "avh4/elm-color": "1.0.0",
             "elm/browser": "1.0.2",
-            "elm/core": "1.0.2",
+            "elm/core": "1.0.5",
             "elm/html": "1.0.0",
             "elm/json": "1.1.3",
             "elm/svg": "1.0.1",
             "elm/time": "1.0.0",
             "elm/url": "1.0.0",
-            "ianmackenzie/elm-geometry": "2.0.0",
-            "ianmackenzie/elm-units": "2.2.0",
-            "terezka/line-charts": "2.0.0"
+            "ianmackenzie/elm-geometry": "4.0.0",
+            "ianmackenzie/elm-units": "2.10.0",
+            "mdgriffith/elm-bezier": "1.0.0",
+            "terezka/line-charts": "2.0.2"
         },
         "indirect": {
             "debois/elm-dom": "1.3.0",
             "elm/parser": "1.1.0",
-            "elm/virtual-dom": "1.0.2",
+            "elm/random": "1.0.0",
+            "elm/virtual-dom": "1.0.3",
             "ianmackenzie/elm-1d-parameter": "1.0.1",
             "ianmackenzie/elm-float-extra": "1.1.0",
-            "ianmackenzie/elm-interval": "2.0.0",
-            "ianmackenzie/elm-triangular-mesh": "1.0.2",
-            "ianmackenzie/elm-units-interval": "1.0.0",
-            "justinmimbs/date": "3.2.0",
-            "justinmimbs/time-extra": "1.1.0",
-            "myrho/elm-round": "1.0.4",
-            "ryannhg/date-format": "2.3.0"
+            "ianmackenzie/elm-interval": "3.1.0",
+            "ianmackenzie/elm-triangular-mesh": "1.1.0",
+            "ianmackenzie/elm-units-interval": "3.2.0",
+            "justinmimbs/date": "4.1.0",
+            "justinmimbs/time-extra": "1.2.0",
+            "myrho/elm-round": "1.0.5",
+            "ryan-haskell/date-format": "1.0.0"
         }
     },
     "test-dependencies": {
         "direct": {},
         "indirect": {}
     }
-}
+}

examples-new/src/AnimationX.elm

@@ -0,0 +1,92 @@
+module AnimationX exposing (main)
+
+import Animator
+import Animator.Timeline
+import Animator.Transition
+import Animator.Value
+import Browser
+import Browser.Events
+import Html
+import Html.Events
+import Time
+
+
+main : Program () Model Msg
+main =
+    Browser.element
+        { init = always init
+        , update = update
+        , subscriptions = subscriptions
+        , view = view
+        }
+
+
+type alias Model =
+    { timeline : Animator.Timeline.Timeline Float }
+
+
+type Msg
+    = NewPosix Time.Posix
+    | Start
+
+
+init : ( Model, Cmd Msg )
+init =
+    let
+        initialTimeline : Animator.Timeline.Timeline Float
+        initialTimeline =
+            Animator.Timeline.init 10
+
+        queuedSteps : List (Animator.Timeline.Step Float)
+        queuedSteps =
+            [ Animator.Timeline.transitionTo (Animator.ms 1000) 100
+            , Animator.Timeline.transitionTo (Animator.ms 1000) 50
+            , Animator.Timeline.transitionTo (Animator.ms 1000) 5
+            ]
+
+        timelineWithSteps : Animator.Timeline.Timeline Float
+        timelineWithSteps =
+            Animator.Timeline.scale 3 <| Animator.Timeline.queue queuedSteps initialTimeline
+    in
+    ( { timeline = timelineWithSteps }
+    , Cmd.none
+    )
+
+
+update : Msg -> Model -> ( Model, Cmd Msg )
+update msg model =
+    case msg of
+        NewPosix posix ->
+            ( { model | timeline = Animator.Timeline.update posix model.timeline }, Cmd.none )
+
+        Start ->
+            init
+
+
+subscriptions : Model -> Sub Msg
+subscriptions model =
+    if Animator.Timeline.isRunning model.timeline then
+        Browser.Events.onAnimationFrame NewPosix
+
+    else
+        Sub.none
+
+
+view : Model -> Html.Html Msg
+view model =
+    let
+        positionStandard : Float
+        positionStandard =
+            Animator.Value.float model.timeline Animator.Value.to
+
+        positionLinear : Float
+        positionLinear =
+            Animator.Value.float model.timeline (Animator.Value.withTransition Animator.Transition.linear << Animator.Value.to)
+    in
+    Html.div []
+        [ Html.div []
+            [ Html.div [] [ Html.text ("Position Standard: " ++ String.fromFloat positionStandard) ]
+            , Html.div [] [ Html.text ("Position Linear: " ++ String.fromFloat positionLinear) ]
+            ]
+        , Html.button [ Html.Events.onClick Start ] [ Html.text "Re-Start" ]
+        ]

src/Animator/Value.elm

@@ -99,9 +99,7 @@ movement timeline lookup =
                     Timeline.startTime target
 
                 isHappening =
-                    (Time.thisAfterOrEqualThat now startTransition
-                        && Time.thisBeforeOrEqualThat now arrived
-                    )
+                    Time.thisAfterOrEqualThat now startTransition
                         || (List.isEmpty future
                                 && Time.thisAfterThat now interruptedOrEnd
                            )