Clojurians Log v2

Thanks, @mattly. (I missed that someone answered 😃 )

Now another question. With reagent I liked to use reanimated for smooth tweening of values. Is there something similar for rum? Reanimated lets me have animated and reactive atoms that I deref and then can trust reagent to react on.

I know in the react world the typical solution would be to just use something like: https://github.com/chenglou/react-motion

but I don't think this translates to cljs well

really if you had easing functions that you could trigger over a local state variable

I thought I knew of a good JS library for just easing functions but can't find it now

basically, take these functions: https://gist.github.com/gre/1650294

do a requestAnimationFrame that increments t as a function of how far along it is from startTime to startTime + animationTime

and then make the result of that plus your easing function the value of a local state var

So rum rerenders on change of local state vars?

I actually have some easing functions and a tween function that I've adapted from some code I found somewhere:

(defn easeOutQuad
  [elapsed-t duration]
  (let [dt (/ elapsed-t duration)]
    (* dt (- 2 dt))))

(defn easeLinear
  [elapsed-t duration]
  (let [dt (/ elapsed-t duration)]
    dt))

#?(:cljs ;; TODO: Add signature for choosing ease function
   (defn tween-to! [state key new-value duration]
     (let [anim-key (keyword (str (name key) "-anim"))
           initial-value (key @state)]
       (letfn [(tick [_]
                 (let [a-map (anim-key @state)
                       t (- (.now js/Date) (::t0 a-map))]
                   (if (< t duration)
                     (let [progress (easeLinear t duration)
                           new-val (+ (::initial-value a-map)
                                      (* progress (::delta a-map)))]
                       (swap! state assoc key new-val
                              ::ticker (js/requestAnimationFrame tick)))
                     (do
                       (js/cancelAnimationFrame (::ticker a-map))
                       (swap! state dissoc anim-key)
                       (swap! state assoc key new-value)))))]

         (swap! state assoc anim-key
                {::t0            (.now js/Date.)
                 ::ticker        (js/requestAnimationFrame tick)
                 ::delta         (- new-value initial-value)
                 ::initial-value initial-value}))))
   :clj
   (defn tween-to! [state key new-value duration]
     (swap! state assoc key new-value)))

But that looks a bit more complicated than what you describe, @mattly. And, for reasons that are yet unclear to me, I don't seem to be able to use it to animate more than one value in a map at a time.

So, before I continued to dig myself deeper down this hole, I started to wonder if there is a library or better pattern to use.