diff --git a/frontend/src/arthur/domain/trace.cljs b/frontend/src/arthur/domain/trace.cljs index 5ea8018..37e2f51 100644 --- a/frontend/src/arthur/domain/trace.cljs +++ b/frontend/src/arthur/domain/trace.cljs @@ -144,7 +144,8 @@ footage showing rather than with a switch to be found first. A take or a scene is the picture itself, and a reference drawn over one would read as part of it, so nothing is switched on for those. Either way it is switched by hand - afterwards, from the bar above the stage or from a face's own timeline row." + afterwards, from the inspector's footage section or from a face's own timeline + row." [clip sid on] (cond-> (set on) (traceable? clip sid) (conj sid))) diff --git a/frontend/src/arthur/events/ui.cljs b/frontend/src/arthur/events/ui.cljs index bd96278..eedb44e 100644 --- a/frontend/src/arthur/events/ui.cljs +++ b/frontend/src/arthur/events/ui.cljs @@ -334,9 +334,9 @@ (rf/reg-event-db ::trace-faces - ;; Every face the open symbol has, from the bar above the stage: switched on - ;; unless they all already are, which is the one gesture a person wants when - ;; there is exactly one face and when there are five. + ;; Every face the open symbol has, from the inspector's footage section: + ;; switched on unless they all already are, which is the one gesture a person + ;; wants when there is exactly one face and when there are five. (fn [db [_ faces]] (let [faces (set faces) on (set (get-in db [:ui :trace :faces]))] diff --git a/frontend/src/arthur/ui/palette.cljs b/frontend/src/arthur/ui/palette.cljs index dcf2f50..2e59458 100644 --- a/frontend/src/arthur/ui/palette.cljs +++ b/frontend/src/arthur/ui/palette.cljs @@ -13,16 +13,12 @@ polygon filled with index 0 is invisible against a stage cleared to index 0, so offering it as a fill is offering a shape that vanishes on creation. - The footage switch is here too, because it is the same kind of thing as the - tone and the tool: something you set before you draw and leave alone, in one - place whatever is selected. In the inspector it was a section that appeared - only once the right row had been found — so the way to see the footage you are - tracing depended on what you had clicked, which is not a thing anyone can be - expected to learn." + The footage switch is NOT here. It is a viewing aid rather than something you + set before you draw, so it is a section of the inspector — one that is there + for whatever the open symbol has faces of, so it still does not come and go + with the selection. See `ui/params`." (:require [arthur.domain.palette :as pal] - [arthur.domain.trace :as trace] [arthur.events.ui :as ui] - [arthur.subs.render :as render] [arthur.subs.ui :as sub] [re-frame.core :as rf])) @@ -43,31 +39,6 @@ :disabled (not pick) :on-click #(rf/dispatch [::ui/set-tone slot-tone])}])) -(defn- tracing - "The footage under the faces the open symbol has, on or off and how strongly. - - ONE SWITCH FOR THE FACES THAT ARE HERE. A face's footage is the face's, not a - placement's, so there is nothing to inherit and nothing to set twice; with - several faces in a take the box says how many are showing and switches the rest - on, and one face alone is switched from its own timeline row." - [] - (let [clip @(rf/subscribe [::render/clip]) - open @(rf/subscribe [::render/open]) - {:keys [faces opacity]} @(rf/subscribe [::render/tracing]) - here (trace/traceable-faces clip open) - on (filterv (set faces) here)] - (when (seq here) - [:<> - [:label.dim {:title (str "show the footage these faces were traced from, over the " - "picture · a reference, never exported")} - [:input {:type "checkbox" :checked (= (count on) (count here)) - :on-change #(rf/dispatch [::ui/trace-faces here])}] - (str " footage" (when (< 1 (count here)) (str " " (count on) "/" (count here))))] - [:input.trace-opacity - {:type "range" :min 0 :max 1 :step 0.05 :title "how strongly the footage draws" - :value (or opacity trace/opacity-default) :disabled (empty? on) - :on-change #(rf/dispatch [::ui/trace-opacity (js/parseFloat (.. % -target -value))])}]]))) - (defn bar [] (let [tone @(rf/subscribe [::sub/tone]) tool @(rf/subscribe [::sub/tool]) @@ -76,7 +47,6 @@ [:div.swatches (doall (map #(swatch % tone) (range slots)))] [:span.dim (name tone)] [:span {:style {:flex 1}}] - [tracing] (if (= :polygon tool) [:<> [:span.dim (str (quot (count draft) 2) " points")] diff --git a/frontend/src/arthur/ui/params.cljs b/frontend/src/arthur/ui/params.cljs index f7e5bd2..f754b69 100644 --- a/frontend/src/arthur/ui/params.cljs +++ b/frontend/src/arthur/ui/params.cljs @@ -356,6 +356,40 @@ [:div {:title why} (str (brief node) " · " (str/join " " (map name channel)) " · " why)]))])]))))) +;; --------------------------------------------------------------------------- +;; the footage showing under the picture + +(defn- footage-section + "The footage under the faces the open symbol has, on or off and how strongly. + `here` is those faces. + + ONE SWITCH FOR THE FACES THAT ARE HERE. A face's footage is the face's, not a + placement's, so there is nothing to inherit and nothing to set twice; with + several faces in a take the box says how many are showing and switches the rest + on, and one face alone is switched from its own timeline row. + + THE OPEN SYMBOL'S FACES AND NOT THE SELECTION'S, which is what lets this live in + the inspector at all: a viewing aid that appeared only once the right row had + been found would make the way to see the footage you are tracing depend on what + you had clicked. So the section is there whenever the picture on the stage has + any footage behind it, wherever the selection happens to be." + [here] + (let [{:keys [faces opacity]} @(rf/subscribe [::render/tracing]) + on (filterv (set faces) here)] + [section "footage" + [:div.row + [:label.dim {:title (str "show the footage these faces were traced from, over the " + "picture \u00b7 a reference, never exported")} + [:input {:type "checkbox" :checked (= (count on) (count here)) + :on-change #(rf/dispatch [::ui/trace-faces here])}] + (str " show" (when (< 1 (count here)) (str " " (count on) "/" (count here))))]] + [:div.row {:style {:margin-top "5px"}} + [:span.dim "opacity"] + [:input.trace-opacity + {:type "range" :min 0 :max 1 :step 0.05 :title "how strongly the footage draws" + :value (or opacity trace/opacity-default) :disabled (empty? on) + :on-change #(rf/dispatch [::ui/trace-opacity (js/parseFloat (.. % -target -value))])}]]])) + ;; --------------------------------------------------------------------------- ;; tracing a face ;; @@ -363,10 +397,10 @@ ;; to an instance of it: which of its frames its drawings were made over, and ;; what its origin does between those frames. See `domain/trace`. ;; -;; Whether the footage is SHOWING is deliberately not here. It is a viewing aid -;; and it belongs with the other things you look through rather than edit, on the -;; bar above the stage — where it is in the same place whatever is selected, -;; instead of appearing in the inspector only once the right row has been found. +;; Whether the footage is SHOWING is `footage-section` above, and not part of this +;; section. It is a viewing aid rather than a fact about a face, and it must not +;; come and go with the selection — so it is keyed to the OPEN symbol's faces, +;; which is a different question from the one this section answers. (defn- trace-keys "The face's trace keys and origin. `frame` is the frame of the FACE that the @@ -566,6 +600,10 @@ placed (node/source (peek node)) face (or placed (when (trace/traceable? clip open) open)) faces (when face (trace/faces clip face)) + ;; Every face the open symbol has, which is what the footage switch is + ;; about: the stage either has footage behind it or it has none, and that + ;; does not depend on what is selected. + here (trace/traceable-faces clip open) ;; Where that face sits, as a row path from the open symbol, so the faces ;; inside it can be selected by their own rows. A selection made on the ;; stage has no path and names a node directly in the open symbol; the @@ -578,6 +616,7 @@ (when node [node-section node]) (when node ^{:key (str (first node) "/" (second node))} [correction-section node]) + (when (seq here) [footage-section here]) (when (and face (or (trace/traceable? clip face) (seq faces))) [tracing-section face faces path]) (when (= :symbol (first selection)) [symbol-section (second selection)]) diff --git a/frontend/src/arthur/ui/timeline.cljs b/frontend/src/arthur/ui/timeline.cljs index f9dd5c0..e154a06 100644 --- a/frontend/src/arthur/ui/timeline.cljs +++ b/frontend/src/arthur/ui/timeline.cljs @@ -478,8 +478,8 @@ (when node? [:span.kind (if via (str "· in " via) (str "·" (name node-kind)))]) ;; A face's row is where its own footage is switched on, next to solo ;; because the two are the same kind of thing: what this row shows, here, - ;; now, and nothing the picture keeps. The bar above the stage does all of - ;; them at once; this is how one face out of a take is singled out. + ;; now, and nothing the picture keeps. The inspector's footage section does + ;; all of them at once; this is how one face out of a take is singled out. (when (contains? (:faces tracing) of) [:button {:class (str "tl-trace" (when (contains? (:on tracing) of) " on")) :title "show the footage this face was traced from" diff --git a/static/arthur/app.css b/static/arthur/app.css index 573477c..bf85903 100644 --- a/static/arthur/app.css +++ b/static/arthur/app.css @@ -723,9 +723,6 @@ button.share-button:hover, button.share-button.on { filter: brightness(1.1); } .tab:hover .close, .tab.on .close { visibility: visible; } .tab .close:hover { background: var(--hair); color: var(--fg); } -.trace-opacity { width: 64px; } -.palette-bar label.dim { display: inline-flex; align-items: center; gap: 2px; white-space: nowrap; } - .palette-bar { display: flex; align-items: center; @@ -817,6 +814,10 @@ button.share-button:hover, button.share-button.on { filter: brightness(1.1); } .section { border-bottom: 1px solid var(--hair); padding: 6px; } .section:last-child { border-bottom: 0; } +/* The footage slider shares its row with the word "opacity", so it takes what is + left rather than the full width the generic range rule gives it. */ +.trace-opacity { flex: 1; min-width: 0; } + .section > h2 { margin: 0 0 5px; font: inherit;