Add snapshot button

This commit is contained in:
heyarne 2020-05-03 13:07:14 +02:00
commit 0043cb6a14
3 changed files with 87 additions and 44 deletions

View file

@ -10,9 +10,8 @@
(def events
{:welcome/continue (fn [db _]
(assoc db :status :running))
:running/capture (fn [db _]
(assoc db :current-capture {:img nil
:predictions nil}))})
:running/snapshot (fn [db result]
(assoc-in db [:snapshots :current] result))})
(defn dispatch [[event data]]
(when-let [handler (events event)]
@ -30,26 +29,39 @@ Seit der globalen Covid19-Pandemie sind wir alle dazu gezwungen, auf physischen
[:p "Ich würde mich freuen, wenn du mir dabei hilfst. Folge dazu einfach den Anweisungen. Das Ergebnis wird hoffentlich eine schöne Sammlung von Webcambildern und 3D-Modellen eurer Köpfe" [:sup "1"] "."]
[:button {:on-click #(dispatch [:welcome/continue])} "Weiter"]])
(defn running [{on-faces-detected :on-faces-detected}]
(defn video-snapshot [video-elem]
(let [canvas (js/document.createElement "canvas")
ctx (.getContext canvas "2d")]
(set! (.-width canvas) (.-videoWidth video-elem))
(set! (.-height canvas) (.-videoHeight video-elem))
(.drawImage ctx video-elem 0 0 (.-width canvas) (.-height canvas))
(.getImageData ctx 0 0 (.-width canvas) (.-height canvas))))
(defn running [{:keys [on-faces-detected halt?]}]
(let [result (atom {:video nil
:predictions nil})]
(fn []
(fn [{:keys [on-faces-detected halt?]}]
[:div.container
[:p "Tippe auf den Button um mir das untere Bild zu schicken."]
[webcam-facemesh {:on-faces-detected (fn [ctx video predictions]
(swap! result assoc
:video video
:predictions predictions)
(on-faces-detected ctx video predictions))}]
[:button {:on-click #(dispatch [:running/capture @result])} "Tip"]])))
(on-faces-detected ctx video predictions))
:halt? halt?}]
[:button {:on-click #(dispatch [:running/snapshot (update @result :video video-snapshot)])} "Cheese"]])))
(defn app [{:keys [on-faces-detected]}]
(let [status (:status @state)]
(let [state @state
status (:status state)
halt? (some? (get-in state [:snapshots :current]))]
[:<>
[welcome-message {:hidden? (not= :welcome-message status)}]
(case status
:permission-rejected [:div "Sad :("]
:running [running {:on-faces-detected on-faces-detected}]
:running [running {:on-faces-detected on-faces-detected
:halt? halt?}]
;; default
nil)]))