diff --git a/frontend/src/uxbox/main/ui/settings/profile.cljs b/frontend/src/uxbox/main/ui/settings/profile.cljs index e0f3b1a71..82c901397 100644 --- a/frontend/src/uxbox/main/ui/settings/profile.cljs +++ b/frontend/src/uxbox/main/ui/settings/profile.cljs @@ -103,7 +103,6 @@ :on-change (fm/on-input-change form :theme)} [:option {:value "light"} "Default"]] - [:input.btn-primary {:type "submit" :class (when-not (:valid form) "btn-disabled") diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/circle.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/circle.cljs index 41eac204a..fe5df7677 100644 --- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/circle.cljs +++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/circle.cljs @@ -10,138 +10,14 @@ (ns uxbox.main.ui.workspace.sidebar.options.circle (:require [rumext.alpha :as mf] - [uxbox.common.data :as d] - [uxbox.builtins.icons :as i] - [uxbox.main.data.workspace :as udw] - [uxbox.main.geom :as geom] - [uxbox.main.store :as st] [uxbox.main.ui.workspace.sidebar.options.fill :refer [fill-menu]] - [uxbox.main.ui.workspace.sidebar.options.stroke :refer [stroke-menu]] - [uxbox.util.dom :as dom] - [uxbox.util.geom.point :as gpt] - [uxbox.util.i18n :as i18n :refer [tr t]] - [uxbox.util.math :as math])) - -(mf/defc measures-menu - [{:keys [shape] :as props}] - (let [locale (i18n/use-locale) - - on-size-change - (fn [event attr] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-circle-dimensions (:id shape) attr value)))) - - on-proportion-lock-change - (fn [event] - (st/emit! (udw/toggle-shape-proportion-lock (:id shape)))) - - on-size-rx-change #(on-size-change % :rx) - on-size-ry-change #(on-size-change % :ry) - - on-position-change - (fn [event attr] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-position (:id shape) {attr value})))) - - on-pos-cx-change #(on-position-change % :x) - on-pos-cy-change #(on-position-change % :y) - - on-rotation-change - (fn [event] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-shape (:id shape) {:rotation value})))) - - on-radius-change - (fn [event] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-shape (:id shape) {:rx value :ry value}))))] - - [:div.element-set - [:div.element-set-content - - ;; SIZE - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.size")] - [:div.lock-size {:class (when (:proportion-lock shape) "selected") - :on-click on-proportion-lock-change} - (if (:proportion-lock shape) - i/lock - i/unlock)] - [:div.input-element.pixels - [:input.input-text {:type "number" - :min "0" - :on-change on-size-rx-change - :value (str (-> (:rx shape) - (d/coalesce 0) - (math/round)))}]] - [:div.input-element.pixels - [:input.input-text {:type "number" - :min "0" - :on-change on-size-ry-change - :value (str (-> (:ry shape) - (d/coalesce 0) - (math/round)))}]]] - - ;; POSITION - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.position")] - [:div.input-element.pixels - [:input.input-text {:type "number" - :on-change on-pos-cx-change - :value (str (-> (:cx shape) - (d/coalesce 0) - (math/round)))}]] - [:div.input-element.pixels - [:input.input-text {:type "number" - :on-change on-pos-cy-change - :value (str (-> (:cy shape) - (d/coalesce 0) - (math/round)))}]]] - - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.rotation")] - [:div.input-element.degrees - [:input.input-text - {:type "number" - :min "0" - :max "360" - :on-change on-rotation-change - :value (str (-> (:rotation shape) - (d/coalesce 0) - (math/round)))}]] - - [:input.slidebar - {:type "range" - :min "0" - :max "360" - :on-change on-rotation-change - :value (str (-> (:rotation shape) - (d/coalesce 0) - (math/round))) - :step "1"}]] - - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.radius")] - [:div.input-element.pixels - [:input.input-text - {:type "number" - :on-change on-radius-change - :value (str (-> (:rx shape) - (d/coalesce 0) - (math/round)))}]] - [:div.input-element]]]])) + [uxbox.main.ui.workspace.sidebar.options.measures :refer [measures-menu]] + [uxbox.main.ui.workspace.sidebar.options.stroke :refer [stroke-menu]])) (mf/defc options [{:keys [shape] :as props}] [:div - [:& measures-menu {:shape shape}] + [:& measures-menu {:shape shape + :options #{:circle-size :position :rotation}}] [:& fill-menu {:shape shape}] [:& stroke-menu {:shape shape}]]) diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/icon.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/icon.cljs index eb913474f..406242c67 100644 --- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/icon.cljs +++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/icon.cljs @@ -5,150 +5,14 @@ ;; This Source Code Form is "Incompatible With Secondary Licenses", as ;; defined by the Mozilla Public License, v. 2.0. ;; -;; Copyright (c) 2015-2020 Andrey Antukh -;; Copyright (c) 2015-2020 Juan de la Cruz +;; Copyright (c) 2020 UXBOX Labs SL (ns uxbox.main.ui.workspace.sidebar.options.icon (:require [rumext.alpha :as mf] - [uxbox.common.data :as d] - [uxbox.builtins.icons :as i] - [uxbox.main.data.workspace :as udw] - [uxbox.main.geom :as geom] - [uxbox.main.store :as st] + [uxbox.main.ui.workspace.sidebar.options.measures :refer [measures-menu]] [uxbox.main.ui.workspace.sidebar.options.fill :refer [fill-menu]] - [uxbox.main.ui.workspace.sidebar.options.stroke :refer [stroke-menu]] - [uxbox.util.dom :as dom] - [uxbox.util.geom.point :as gpt] - [uxbox.util.i18n :as i18n :refer [tr t]] - [uxbox.util.math :as math])) - -(mf/defc measures-menu - [{:keys [shape] :as props}] - (let [locale (i18n/use-locale) - - on-size-change - (fn [event attr] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-rect-dimensions (:id shape) attr value)))) - - on-proportion-lock-change - (fn [event] - (st/emit! (udw/toggle-shape-proportion-lock (:id shape)))) - - on-position-change - (fn [event attr] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-position (:id shape) {attr value})))) - - on-rotation-change - (fn [event] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-shape (:id shape) {:rotation value})))) - - on-radius-change - (fn [event] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-shape (:id shape) {:rx value :ry value})))) - - on-width-change #(on-size-change % :width) - on-height-change #(on-size-change % :height) - on-pos-x-change #(on-position-change % :x) - on-pos-y-change #(on-position-change % :y)] - - [:div.element-set - [:div.element-set-content - - ;; WIDTH & HEIGHT - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.size")] - [:div.lock-size {:class (when (:proportion-lock shape) "selected") - :on-click on-proportion-lock-change} - (if (:proportion-lock shape) - i/lock - i/unlock)] - [:div.input-element.pixels - [:input.input-text {:type "number" - :min "0" - :no-validate true - :on-change on-width-change - :value (str (-> (:width shape) - (d/coalesce 0) - (math/round)))}]] - - - [:div.input-element.pixels - [:input.input-text {:type "number" - :min "0" - :no-validate true - :on-change on-height-change - :value (str (-> (:height shape) - (d/coalesce 0) - (math/round)))}]]] - - ;; POSITION - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.position")] - [:div.input-element.pixels - [:input.input-text {:placeholder "x" - :type "number" - :no-validate true - :on-change on-pos-x-change - :value (str (-> (:x shape) - (d/coalesce 0) - (math/round)))}]] - [:div.input-element.pixels - [:input.input-text {:placeholder "y" - :type "number" - :no-validate true - :on-change on-pos-y-change - :value (str (-> (:y shape) - (d/coalesce 0) - (math/round)))}]]] - - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.rotation")] - [:div.input-element.degrees - [:input.input-text - {:placeholder "" - :type "number" - :no-validate true - :min "0" - :max "360" - :on-change on-rotation-change - :value (str (-> (:rotation shape) - (d/coalesce 0) - (math/round)))}]] - [:input.slidebar - {:type "range" - :min "0" - :max "360" - :step "1" - :no-validate true - :on-change on-rotation-change - :value (str (-> (:rotation shape) - (d/coalesce 0)))}]] - - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.radius")] - [:div.input-element.pixels - [:input.input-text - {:placeholder "rx" - :type "number" - :on-change on-radius-change - :value (str (-> (:rx shape) - (d/coalesce 0) - (math/round)))}]] - [:div.input-element]]]])) - + [uxbox.main.ui.workspace.sidebar.options.stroke :refer [stroke-menu]])) (mf/defc options [{:keys [shape] :as props}] diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/image.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/image.cljs index f130fc535..30df2914c 100644 --- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/image.cljs +++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/image.cljs @@ -2,153 +2,17 @@ ;; License, v. 2.0. If a copy of the MPL was not distributed with this ;; file, You can obtain one at http://mozilla.org/MPL/2.0/. ;; -;; Copyright (c) 2015-2017 Andrey Antukh -;; Copyright (c) 2015-2017 Juan de la Cruz +;; This Source Code Form is "Incompatible With Secondary Licenses", as +;; defined by the Mozilla Public License, v. 2.0. +;; +;; Copyright (c) 2020 UXBOX Labs SL (ns uxbox.main.ui.workspace.sidebar.options.image (:require [rumext.alpha :as mf] - [uxbox.common.data :as d] - [uxbox.builtins.icons :as i] - [uxbox.main.data.workspace :as udw] - [uxbox.main.geom :as geom] - [uxbox.main.store :as st] - [uxbox.util.dom :as dom] - [uxbox.util.geom.point :as gpt] - [uxbox.util.i18n :as i18n :refer [t]] - [uxbox.util.math :as math])) - - -(mf/defc measures-menu - [{:keys [shape] :as props}] - (let [locale (i18n/use-locale) - - on-size-change - (fn [event attr] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-rect-dimensions (:id shape) attr value)))) - - on-proportion-lock-change - (fn [event] - (st/emit! (udw/toggle-shape-proportion-lock (:id shape)))) - - on-position-change - (fn [event attr] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-position (:id shape) {attr value})))) - - on-rotation-change - (fn [event] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-shape (:id shape) {:rotation value})))) - - on-radius-change - (fn [event] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-shape (:id shape) {:rx value :ry value})))) - - on-width-change #(on-size-change % :width) - on-height-change #(on-size-change % :height) - on-pos-x-change #(on-position-change % :x) - on-pos-y-change #(on-position-change % :y)] - - [:div.element-set - [:div.element-set-content - - ;; WIDTH & HEIGHT - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.size")] - [:div.lock-size {:class (when (:proportion-lock shape) "selected") - :on-click on-proportion-lock-change} - (if (:proportion-lock shape) - i/lock - i/unlock)] - [:div.input-element.pixels - [:input.input-text {:type "number" - :min "0" - :no-validate true - :on-change on-width-change - :value (str (-> (:width shape) - (d/coalesce 0) - (math/round)))}]] - - - [:div.input-element.pixels - [:input.input-text {:type "number" - :min "0" - :no-validate true - :on-change on-height-change - :value (str (-> (:height shape) - (d/coalesce 0) - (math/round)))}]]] - - ;; POSITION - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.position")] - [:div.input-element.pixels - [:input.input-text {:placeholder "x" - :type "number" - :no-validate true - :on-change on-pos-x-change - :value (str (-> (:x shape) - (d/coalesce 0) - (math/round)))}]] - [:div.input-element.pixels - [:input.input-text {:placeholder "y" - :type "number" - :no-validate true - :on-change on-pos-y-change - :value (str (-> (:y shape) - (d/coalesce 0) - (math/round)))}]]] - - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.rotation")] - [:div.input-element.degrees - [:input.input-text - {:placeholder "" - :type "number" - :no-validate true - :min "0" - :max "360" - :on-change on-rotation-change - :value (str (-> (:rotation shape) - (d/coalesce 0) - (math/round)))}]] - [:input.slidebar - {:type "range" - :min "0" - :max "360" - :step "1" - :no-validate true - :on-change on-rotation-change - :value (str (-> (:rotation shape) - (d/coalesce 0)))}]] - - [:div.row-flex - [:span.element-set-subtitle (t locale "workspace.options.radius")] - [:div.input-element.pixels - [:input.input-text - {:placeholder "rx" - :type "number" - :on-change on-radius-change - :value (str (-> (:rx shape) - (d/coalesce 0) - (math/round)))}]] - [:div.input-element]]]])) - + [uxbox.main.ui.workspace.sidebar.options.measures :refer [measures-menu]])) (mf/defc options [{:keys [shape] :as props}] [:div - [:& measures-menu {:shape shape}] - #_[:& fill-menu {:shape shape}] - #_[:& stroke-menu {:shape shape}]]) + [:& measures-menu {:shape shape}]]) diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/measures.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/measures.cljs index fdfd63490..51f1c67d0 100644 --- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/measures.cljs +++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/measures.cljs @@ -30,6 +30,13 @@ (d/parse-integer 0))] (st/emit! (udw/update-rect-dimensions (:id shape) attr value)))) + on-circle-size-change + (fn [event attr] + (let [value (-> (dom/get-target event) + (dom/get-value) + (d/parse-integer 0))] + (st/emit! (udw/update-circle-dimensions (:id shape) attr value)))) + on-proportion-lock-change (fn [event] (st/emit! (udw/toggle-shape-proportion-lock (:id shape)))) @@ -58,7 +65,9 @@ on-width-change #(on-size-change % :width) on-height-change #(on-size-change % :height) on-pos-x-change #(on-position-change % :x) - on-pos-y-change #(on-position-change % :y)] + on-pos-y-change #(on-position-change % :y) + on-size-rx-change #(on-circle-size-change % :rx) + on-size-ry-change #(on-circle-size-change % :ry)] [:div.element-set [:div.element-set-content @@ -91,6 +100,30 @@ (d/coalesce 0) (math/round)))}]]]) + ;; Circle RX RY + (when (options :circle-size) + [:div.row-flex + [:span.element-set-subtitle (t locale "workspace.options.size")] + [:div.lock-size {:class (when (:proportion-lock shape) "selected") + :on-click on-proportion-lock-change} + (if (:proportion-lock shape) + i/lock + i/unlock)] + [:div.input-element.pixels + [:input.input-text {:type "number" + :min "0" + :on-change on-size-rx-change + :value (str (-> (:rx shape) + (d/coalesce 0) + (math/round)))}]] + [:div.input-element.pixels + [:input.input-text {:type "number" + :min "0" + :on-change on-size-ry-change + :value (str (-> (:ry shape) + (d/coalesce 0) + (math/round)))}]]]) + ;; POSITION (when (options :position) [:div.row-flex diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/page.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/page.cljs index ba3bd3bd4..22776af74 100644 --- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/page.cljs +++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/page.cljs @@ -2,8 +2,10 @@ ;; License, v. 2.0. If a copy of the MPL was not distributed with this ;; file, You can obtain one at http://mozilla.org/MPL/2.0/. ;; -;; Copyright (c) 2015-2016 Andrey Antukh -;; Copyright (c) 2015-2016 Juan de la Cruz +;; This Source Code Form is "Incompatible With Secondary Licenses", as +;; defined by the Mozilla Public License, v. 2.0. +;; +;; Copyright (c) 2020 UXBOX Labs SL (ns uxbox.main.ui.workspace.sidebar.options.page "Page options menu entries." @@ -13,52 +15,14 @@ [okulary.core :as l] [uxbox.common.data :as d] [uxbox.builtins.icons :as i] - [uxbox.main.constants :as c] - [uxbox.main.data.workspace :as udw] + [uxbox.main.data.workspace :as dw] [uxbox.main.refs :as refs] [uxbox.main.store :as st] [uxbox.main.ui.modal :as modal] [uxbox.main.ui.workspace.colorpicker :refer [colorpicker-modal]] - [uxbox.util.data :refer [parse-int]] [uxbox.util.dom :as dom] [uxbox.util.i18n :refer [tr]])) -;; (mf/defc metadata-options -;; [{:keys [page] :as props}] -;; (let [metadata (:metadata page) -;; change-color -;; (fn [color] -;; #_(st/emit! (->> (assoc metadata :background color) -;; (udp/update-metadata (:id page))))) -;; on-color-change -;; (fn [event] -;; (let [value (dom/event->value event)] -;; (change-color value))) - -;; show-color-picker -;; (fn [event] -;; (let [x (.-clientX event) -;; y (.-clientY event) -;; props {:x x :y y -;; :default "#ffffff" -;; :value (:background metadata) -;; :transparent? true -;; :on-change change-color}] -;; (modal/show! colorpicker-modal props)))] - -;; [:div.element-set -;; [:div.element-set-title (tr "workspace.options.page-measures")] -;; [:div.element-set-content -;; [:span (tr "workspace.options.background-color")] -;; [:div.row-flex.color-data -;; [:span.color-th -;; {:style {:background-color (:background metadata "#ffffff")} -;; :on-click show-color-picker}] -;; [:div.color-info -;; [:input -;; {:on-change on-color-change -;; :value (:background metadata "#ffffff")}]]]]])) - (def default-options "Default data for page metadata." {:grid-x 10 @@ -78,18 +42,18 @@ (let [value (-> (dom/get-target event) (dom/get-value) (d/parse-integer 0))] - (st/emit! (udw/update-options {:grid-x value})))) + (st/emit! (dw/update-options {:grid-x value})))) on-y-change (fn [event] (let [value (-> (dom/get-target event) (dom/get-value) (d/parse-integer 0))] - (st/emit! (udw/update-options {:grid-y value})))) + (st/emit! (dw/update-options {:grid-y value})))) change-color (fn [color] - (st/emit! (udw/update-options {:grid-color color}))) + (st/emit! (dw/update-options {:grid-color color}))) on-color-change (fn [event] diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/path.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/path.cljs index cccb9de03..1e2824411 100644 --- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/path.cljs +++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/path.cljs @@ -2,8 +2,10 @@ ;; License, v. 2.0. If a copy of the MPL was not distributed with this ;; file, You can obtain one at http://mozilla.org/MPL/2.0/. ;; -;; Copyright (c) 2015-2016 Juan de la Cruz -;; Copyright (c) 2015-2019 Andrey Antukh +;; This Source Code Form is "Incompatible With Secondary Licenses", as +;; defined by the Mozilla Public License, v. 2.0. +;; +;; Copyright (c) 2020 UXBOX Labs SL (ns uxbox.main.ui.workspace.sidebar.options.path (:require diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/rect.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/rect.cljs index f75b68014..5f5fcf7b1 100644 --- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/rect.cljs +++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/rect.cljs @@ -11,8 +11,8 @@ (:require [rumext.alpha :as mf] [uxbox.main.ui.workspace.sidebar.options.fill :refer [fill-menu]] - [uxbox.main.ui.workspace.sidebar.options.stroke :refer [stroke-menu]] - [uxbox.main.ui.workspace.sidebar.options.measures :refer [measures-menu]])) + [uxbox.main.ui.workspace.sidebar.options.measures :refer [measures-menu]] + [uxbox.main.ui.workspace.sidebar.options.stroke :refer [stroke-menu]])) (mf/defc options [{:keys [shape] :as props}] diff --git a/frontend/src/uxbox/main/ui/workspace/sidebar/options/text.cljs b/frontend/src/uxbox/main/ui/workspace/sidebar/options/text.cljs index 15a68033d..8ca243ec1 100644 --- a/frontend/src/uxbox/main/ui/workspace/sidebar/options/text.cljs +++ b/frontend/src/uxbox/main/ui/workspace/sidebar/options/text.cljs @@ -2,136 +2,21 @@ ;; License, v. 2.0. If a copy of the MPL was not distributed with this ;; file, You can obtain one at http://mozilla.org/MPL/2.0/. ;; -;; Copyright (c) 2015-2020 Andrey Antukh -;; Copyright (c) 2015-2020 Juan de la Cruz +;; This Source Code Form is "Incompatible With Secondary Licenses", as +;; defined by the Mozilla Public License, v. 2.0. +;; +;; Copyright (c) 2020 UXBOX Labs SL (ns uxbox.main.ui.workspace.sidebar.options.text (:require [rumext.alpha :as mf] - [potok.core :as ptk] - [uxbox.common.data :as d] - [uxbox.main.store :as st] - [uxbox.main.geom :as geom] - [uxbox.main.data.workspace :as udw] [uxbox.builtins.icons :as i] - [uxbox.util.i18n :refer (tr)] - [uxbox.util.router :as r] + [uxbox.common.data :as d] + [uxbox.main.data.workspace :as dw] + [uxbox.main.store :as st] + [uxbox.main.ui.workspace.sidebar.options.measures :refer [measures-menu]] [uxbox.util.dom :as dom] - [uxbox.util.geom.point :as gpt] - [uxbox.util.math :as math :refer [precision-or-0]] - [uxbox.util.data :refer [parse-int - parse-float - read-string - index-by-id]])) - - -(mf/defc measures-menu - [{:keys [shape] :as props}] - (let [on-size-change - (fn [event attr] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-rect-dimensions (:id shape) attr value)))) - - on-proportion-lock-change - (fn [event] - (st/emit! (udw/toggle-shape-proportion-lock (:id shape)))) - - on-position-change - (fn [event attr] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer))] - (st/emit! (udw/update-position (:id shape) {attr value})))) - - on-rotation-change - (fn [event] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-integer 0))] - (st/emit! (udw/update-shape (:id shape) {:rotation value})))) - - on-radius-change - (fn [event] - (let [value (-> (dom/get-target event) - (dom/get-value) - (d/parse-double 0))] - (st/emit! (udw/update-shape (:id shape) {:rx value :ry value})))) - - on-width-change #(on-size-change % :width) - on-height-change #(on-size-change % :height) - on-pos-x-change #(on-position-change % :x) - on-pos-y-change #(on-position-change % :y)] - - [:div.element-set - [:div.element-set-content - - ;; WIDTH & HEIGHT - [:div.row-flex - [:span (tr "workspace.options.size")] - [:div.input-element.pixels - [:input.input-text {:type "number" - :min "0" - :on-change on-width-change - :value (-> (:width shape) - (math/precision 2) - (d/coalesce-str "0"))}]] - - [:div.lock-size {:class (when (:proportion-lock shape) "selected") - :on-click on-proportion-lock-change} - (if (:proportion-lock shape) - i/lock - i/unlock)] - - [:div.input-element.pixels - [:input.input-text {:type "number" - :min "0" - :on-change on-height-change - :value (-> (:height shape) - (math/precision 2) - (d/coalesce-str "0"))}]]] - - ;; POSITION - [:span (tr "workspace.options.position")] - [:div.row-flex - [:div.input-element.pixels - [:input.input-text {:placeholder "x" - :type "number" - :on-change on-pos-x-change - :value (-> (:x shape) - (math/precision 2) - (d/coalesce-str "0"))}]] - [:div.input-element.pixels - [:input.input-text {:placeholder "y" - :type "number" - :on-change on-pos-y-change - :value (-> (:y shape) - (math/precision 2) - (d/coalesce-str "0"))}]]] - - [:span (tr "workspace.options.rotation-radius")] - [:div.row-flex - [:div.input-element.degrees - [:input.input-text {:placeholder "" - :type "number" - :min 0 - :max 360 - :on-change on-rotation-change - :value (-> (:rotation shape 0) - (math/precision 2) - (d/coalesce-str "0"))}]] - - [:div.input-element.pixels - [:input.input-text - {:placeholder "rx" - :type "number" - :on-change on-radius-change - :value (-> (:rx shape) - (math/precision 2) - (d/coalesce-str "0"))}]]]]])) - - + [uxbox.util.i18n :refer [tr]])) (declare +fonts+) @@ -155,7 +40,7 @@ attrs {:font-family value :font-weight "normal" :font-style "normal"}] - (st/emit! (udw/update-shape id attrs)))) + (st/emit! (dw/update-shape id attrs)))) on-font-size-change (fn [event] @@ -163,7 +48,7 @@ (dom/get-value) (d/parse-integer 0)) attrs {:font-size value}] - (st/emit! (udw/update-shape id attrs)))) + (st/emit! (dw/update-shape id attrs)))) on-font-letter-spacing-change (fn [event] @@ -171,7 +56,7 @@ (dom/get-value) (d/parse-double 0)) attrs {:letter-spacing value}] - (st/emit! (udw/update-shape id attrs)))) + (st/emit! (dw/update-shape id attrs)))) on-font-line-height-change (fn [event] @@ -179,12 +64,12 @@ (dom/get-value) (d/parse-double 0)) attrs {:line-height value}] - (st/emit! (udw/update-shape id attrs)))) + (st/emit! (dw/update-shape id attrs)))) on-font-align-change (fn [event value] (let [attrs {:text-align value}] - (st/emit! (udw/update-shape id attrs)))) + (st/emit! (dw/update-shape id attrs)))) on-font-style-change (fn [event] @@ -193,7 +78,7 @@ (d/read-string)) attrs {:font-style style :font-weight weight}] - (st/emit! (udw/update-shape id attrs)))) + (st/emit! (dw/update-shape id attrs)))) ] [:div.element-set [:div.element-set-title (tr "workspace.options.font-options")] @@ -262,7 +147,7 @@ [:div.row-flex [:div.input-icon [:span.icon-before.tooltip.tooltip-bottom - {:alt "Line height"} + {:alt "Line height"} i/line-height] [:input.input-text {:type "number" :step "0.1" @@ -274,7 +159,7 @@ :on-change on-font-line-height-change}]] [:div.input-icon [:span.icon-before.tooltip.tooltip-bottom - {:alt "Letter spacing"} + {:alt "Letter spacing"} i/letter-spacing] [:input.input-text {:type "number" :step "0.1"