Skip to content

Commit a55d384

Browse files
sprocketcsprocketc
committed
create font utils ns
1 parent 43bce4a commit a55d384

File tree

4 files changed

+81
-75
lines changed

4 files changed

+81
-75
lines changed

‎src/renderer/attribute/impl/font_size.cljs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
(:require
44
[renderer.attribute.hierarchy :as attribute.hierarchy]
55
[renderer.attribute.views :as attribute.views]
6-
[renderer.element.impl.text :as element.impl.text]
6+
[renderer.utils.font :as utils.font]
77
[renderer.utils.length :as utils.length]))
88

99
(defmethod attribute.hierarchy/description [:default :font-size]
@@ -13,7 +13,7 @@
1313

1414
(defmethod attribute.hierarchy/update-attr :font-size
1515
[el attribute f & more]
16-
(let [font-size (:font-size (element.impl.text/get-computed-styles! el))
16+
(let [font-size (:font-size (utils.font/get-computed-styles! el))
1717
font-size (utils.length/unit->px font-size)]
1818
(assoc-in el [:attrs attribute] (str (apply f font-size more)))))
1919

‎src/renderer/attribute/impl/font_style.cljs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
(:require
44
[renderer.attribute.hierarchy :as attribute.hierarchy]
55
[renderer.attribute.views :as attribute.views]
6-
[renderer.element.impl.text :as element.impl.text]
6+
[renderer.utils.font :as utils.font]
77
[renderer.utils.length :as utils.length]))
88

99
(defmethod attribute.hierarchy/description [:default :font-style]
@@ -13,7 +13,7 @@
1313

1414
(defmethod attribute.hierarchy/update-attr :font-style
1515
[el attribute f & more]
16-
(let [font-size (:font-size (element.impl.text/get-computed-styles! el))
16+
(let [font-size (:font-size (utils.font/get-computed-styles! el))
1717
font-size (utils.length/unit->px font-size)]
1818
(assoc-in el [:attrs attribute] (str (apply f font-size more)))))
1919

‎src/renderer/element/impl/text.cljs

Lines changed: 10 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
"https://www.w3.org/TR/SVG/text.html
33
https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Element/text"
44
(:require
5-
["opentype.js" :as opentype]
65
[clojure.core.matrix :as matrix]
76
[clojure.string :as string]
87
[re-frame.core :as rf]
@@ -16,10 +15,9 @@
1615
[renderer.tool.events :as tool.events]
1716
[renderer.tool.handlers :as tool.handlers]
1817
[renderer.tool.subs :as-alias tool.subs]
19-
[renderer.utils.attribute :as utils.attribute]
2018
[renderer.utils.bounds :as utils.bounds]
21-
[renderer.utils.dom :as utils.dom]
2219
[renderer.utils.element :as utils.element]
20+
[renderer.utils.font :as utils.font]
2321
[renderer.utils.length :as utils.length]))
2422

2523
(derive :text ::element.hierarchy/shape)
@@ -119,83 +117,24 @@
119117
:font-size font-size
120118
:font-weight font-weight}}]]))
121119

122-
(defn get-computed-styles!
123-
[{:keys [content] :as el}]
124-
(when-let [svg (utils.dom/canvas-element!)]
125-
(let [dom-el (utils.element/->dom-element el)]
126-
(.appendChild svg dom-el)
127-
(set! (.-innerHTML dom-el) (if (empty? content) "\u00a0" content))
128-
(let [computed-style (.getComputedStyle js/window dom-el nil)
129-
font-style (.getPropertyValue computed-style "font-style")
130-
font-size (.getPropertyValue computed-style "font-size")
131-
font-weight (.getPropertyValue computed-style "font-weight")
132-
bbox (utils.bounds/dom-el->bbox dom-el)]
133-
(.remove dom-el)
134-
{:font-style font-style
135-
:font-size font-size
136-
:font-weight font-weight
137-
:bbox bbox}))))
138-
139-
(defn font-file->path-data
140-
[file content x y font-size]
141-
(-> (.blob file)
142-
(.then (fn [blob]
143-
(-> (.arrayBuffer blob)
144-
(.then (fn [buffer]
145-
(let [font (opentype/parse buffer)
146-
path (.getPath font content x y font-size)]
147-
(.toPathData path)))))))))
148-
149-
(defn includes-prop?
150-
[v prop]
151-
(when v
152-
(string/includes? (string/lower-case v) (string/lower-case prop))))
153-
154-
(defn match-font-by-weight
155-
[weight fonts]
156-
(let [weight-num (js/parseInt weight)
157-
weight-names (get utils.attribute/weight-name-mapping weight)
158-
includes-weight? (fn [font]
159-
(some #(includes-prop? % (.-style font)) weight-names))
160-
matched-weight (filter includes-weight? fonts)]
161-
(if (or (seq matched-weight) (< weight-num 100))
162-
matched-weight
163-
(recur (str (- weight-num 100)) fonts))))
164-
165-
(defn match-font
166-
[fonts family style weight]
167-
(let [matched-family (filter #(includes-prop? family (.-family %)) fonts)
168-
matched-style (filter #(includes-prop? style (.-style %)) matched-family)
169-
matched-weight (match-font-by-weight weight (if (seq matched-style)
170-
matched-style
171-
matched-family))]
172-
(or (first matched-weight)
173-
(first matched-style)
174-
(first matched-family)
175-
(first fonts))))
176-
177-
(defn default-font-path
178-
[font-style font-weight]
179-
(str "./css/files/noto-sans-latin-" font-weight "-" font-style ".woff"))
180-
181120
(defmethod element.hierarchy/path :text
182121
[el]
183122
(let [{:keys [attrs content]} el
184123
{:keys [x y font-family]} attrs
185-
{:keys [font-size font-style font-weight]} (get-computed-styles! el)
124+
{:keys [font-size font-style font-weight]} (utils.font/get-computed-styles! el)
186125
[x y font-size] (mapv utils.length/unit->px [x y font-size])]
187126
(if font-family
188127
(-> (js/window.queryLocalFonts)
189128
(.then (fn [fonts]
190-
(when-let [font (match-font fonts
191-
font-family
192-
font-style
193-
font-weight)]
194-
(font-file->path-data font content x y font-size)))))
195-
(-> (js/fetch (default-font-path font-style font-weight))
129+
(when-let [font (utils.font/match-font fonts
130+
font-family
131+
font-style
132+
font-weight)]
133+
(utils.font/font-file->path-data font content x y font-size)))))
134+
(-> (js/fetch (utils.font/default-font-path font-style font-weight))
196135
(.then (fn [response]
197-
(font-file->path-data response content x y font-size)))))))
136+
(utils.font/font-file->path-data response content x y font-size)))))))
198137

199138
(defmethod element.hierarchy/bbox :text
200139
[el]
201-
(:bbox (get-computed-styles! el)))
140+
(:bbox (utils.font/get-computed-styles! el)))

‎src/renderer/utils/font.cljs

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
(ns renderer.utils.font
2+
(:require
3+
["opentype.js" :as opentype]
4+
[clojure.string :as string]
5+
[renderer.utils.attribute :as utils.attribute]
6+
[renderer.utils.bounds :as utils.bounds]
7+
[renderer.utils.dom :as utils.dom]
8+
[renderer.utils.element :as utils.element]))
9+
10+
(defn get-computed-styles!
11+
[{:keys [content] :as el}]
12+
(when-let [svg (utils.dom/canvas-element!)]
13+
(let [dom-el (utils.element/->dom-element el)]
14+
(.appendChild svg dom-el)
15+
(set! (.-innerHTML dom-el) (if (empty? content) "\u00a0" content))
16+
(let [computed-style (.getComputedStyle js/window dom-el nil)
17+
font-style (.getPropertyValue computed-style "font-style")
18+
font-size (.getPropertyValue computed-style "font-size")
19+
font-weight (.getPropertyValue computed-style "font-weight")
20+
bbox (utils.bounds/dom-el->bbox dom-el)]
21+
(.remove dom-el)
22+
{:font-style font-style
23+
:font-size font-size
24+
:font-weight font-weight
25+
:bbox bbox}))))
26+
27+
(defn font-file->path-data
28+
[file content x y font-size]
29+
(-> (.blob file)
30+
(.then (fn [blob]
31+
(-> (.arrayBuffer blob)
32+
(.then (fn [buffer]
33+
(let [font (opentype/parse buffer)
34+
path (.getPath font content x y font-size)]
35+
(.toPathData path)))))))))
36+
37+
(defn includes-prop?
38+
[v prop]
39+
(when v
40+
(string/includes? (string/lower-case v) (string/lower-case prop))))
41+
42+
(defn match-font-by-weight
43+
[weight fonts]
44+
(let [weight-num (js/parseInt weight)
45+
weight-names (get utils.attribute/weight-name-mapping weight)
46+
includes-weight? (fn [font]
47+
(some #(includes-prop? % (.-style font)) weight-names))
48+
matched-weight (filter includes-weight? fonts)]
49+
(if (or (seq matched-weight) (< weight-num 100))
50+
matched-weight
51+
(recur (str (- weight-num 100)) fonts))))
52+
53+
(defn match-font
54+
[fonts family style weight]
55+
(let [matched-family (filter #(includes-prop? family (.-family %)) fonts)
56+
matched-style (filter #(includes-prop? style (.-style %)) matched-family)
57+
matched-weight (match-font-by-weight weight (if (seq matched-style)
58+
matched-style
59+
matched-family))]
60+
(or (first matched-weight)
61+
(first matched-style)
62+
(first matched-family)
63+
(first fonts))))
64+
65+
(defn default-font-path
66+
[font-style font-weight]
67+
(str "./css/files/noto-sans-latin-" font-weight "-" font-style ".woff"))

0 commit comments

Comments
 (0)