Setting Image Grayscale (Cljs)

I am trying to programmatically set grayscale for images using:

(defn styleimg [img-id gray?]
  (let [stylecss (. (. js/document (getElementById img-id)) -style)]
    (set! (. stylecss -filter) (if gray? "grayscale(100%) opacity(0.3)" "grayscale(0) opacity(1)"))))

(defn apply-grayscale []
  (for [x (map :Id @rawdata/img-data)]
    (if (= "ONLINE" ((keyword x) rawdata/img-status))
      (styleimg x false)
      (styleimg x true))))

Running (apply-grayscale) from the REPL does the intended grayscaling. However, I want to monitor changes in @rawdata/img-data.

Calling (apply-grayscale) inside a go-loop has no affect.

What’s the best way to go about this?

Not sure about the best way :smile:, but at least one way is to add a watcher to rawdata/mage-data, and call apply-grayscale with the new values. See: https://clojuredocs.org/clojure.core/add-watch

1 Like

Hey thanks @PEZ!! I didn’t know about add-watch… Will check it out!

1 Like

Will (@lilactown) helped me on the Slack and pointed out that for loops are lazy so until something consumes them, they don’t get evaluated.

doseq worked :slight_smile:

I now saw the convo on Slack. What was missing from the question here was that you are using reagent. :smile:

Those lazy seqs bites me often, btw.

1 Like