img.html - hugo - [fork] hugo port for 9front
HTML git clone https://git.drkhsh.at/hugo.git
DIR Log
DIR Files
DIR Refs
DIR Submodules
DIR README
DIR LICENSE
---
img.html (15540B)
---
1 {{/* prettier-ignore-start */ -}}
2 {{- /*
3 Renders the given image using the given filter, if any.
4
5 When using the text filter, provide the arguments in this order:
6
7 0. The text
8 1. The horizontal offset, in pixels, relative to the left of the image (default 20)
9 2. The vertical offset, in pixels, relative to the top of the image (default 20)
10 3. The font size in pixels (default 64)
11 4. The line height (default 1.2)
12 5. The font color (default #ffffff)
13
14 When using the padding filter, provide all arguments in this order:
15
16 0. Padding top
17 1. Padding right
18 2. Padding bottom
19 3. Padding right
20 4. Canvas color
21
22 @param {string} src The path to the image which must be a remote, page, or global resource.
23 @param {string} [filter] The filter to apply to the image (case-insensitive).
24 @param {string} [filterArgs] A comma-delimited list of arguments to pass to the filter.
25 @param {bool} [example=false] If true, renders a before/after example.
26 @param {int} [exampleWidth=384] Image width, in pixels, when rendering a before/after example.
27
28 @example {{< img src="zion-national-park.jpg" >}}
29 @example {{< img src="zion-national-park.jpg" alt="Zion National Park" >}}
30
31 @example {{< img
32 src="zion-national-park.jpg"
33 alt="Zion National Park"
34 filter="grayscale"
35 >}}
36
37 @example {{< img
38 src="zion-national-park.jpg"
39 alt="Zion National Park"
40 filter="process"
41 filterArgs="resize 400x webp"
42 >}}
43
44 @example {{< img
45 src="zion-national-park.jpg"
46 alt="Zion National Park"
47 filter="colorize"
48 filterArgs="180,50,20"
49 >}}
50
51 @example {{< img
52 src="zion-national-park.jpg"
53 alt="Zion National Park"
54 filter="grayscale"
55 example=true
56 >}}
57
58 @example {{< img
59 src="zion-national-park.jpg"
60 alt="Zion National Park"
61 filter="grayscale"
62 example=true
63 exampleWidth=400
64 >}}
65
66 @example {{< img
67 src="images/examples/zion-national-park.jpg"
68 alt="Zion National Park"
69 filter="Text"
70 filterArgs="Zion National Park,25,250,56"
71 example=true
72 >}}
73
74 @example {{< img
75 src="images/examples/zion-national-park.jpg"
76 alt="Zion National Park"
77 filter="Padding"
78 filterArgs="20,50,20,50,#0705"
79 example=true
80 >}}
81 */ -}}
82 {{/* prettier-ignore-end */ -}}
83 {{- /* Initialize. */}}
84 {{- $alt := "" }}
85 {{- $src := "" }}
86 {{- $filter := "" }}
87 {{- $filterArgs := slice }}
88 {{- $example := false }}
89 {{- $exampleWidth := 384 }}
90
91 {{- /* Default values to use with the text filter. */}}
92 {{ $textFilterOpts := dict
93 "xOffset" 20
94 "yOffset" 20
95 "fontSize" 64
96 "lineHeight" 1.2
97 "fontColor" "#ffffff"
98 "fontPath" "https://github.com/google/fonts/raw/refs/heads/main/ofl/lato/Lato-Regular.ttf"
99 }}
100
101 {{- /* Get and validate parameters. */}}
102 {{- with .Get "alt" }}
103 {{- $alt = . }}
104 {{- end }}
105
106 {{- with .Get "src" }}
107 {{- $src = . }}
108 {{- else }}
109 {{- errorf "The %q shortcode requires a file parameter. See %s" .Name .Position }}
110 {{- end }}
111
112 {{- with .Get "filter" }}
113 {{- $filter = . | lower }}
114 {{- end }}
115
116 {{- $validFilters := slice
117 "autoorient" "brightness" "colorbalance" "colorize" "contrast" "dither"
118 "gamma" "gaussianblur" "grayscale" "hue" "invert" "mask" "none" "opacity"
119 "overlay" "padding" "pixelate" "process" "saturation" "sepia" "sigmoid" "text"
120 "unsharpmask"
121 }}
122
123 {{- with $filter }}
124 {{- if not (in $validFilters .) }}
125 {{- errorf "The filter passed to the %q shortcode is invalid. The filter must be one of %s. See %s" $.Name (delimit $validFilters ", " ", or ") $.Position }}
126 {{- end }}
127 {{- end }}
128
129 {{- with .Get "filterArgs" }}
130 {{- $filterArgs = split . "," }}
131 {{- $filterArgs = apply $filterArgs "trim" "." " " }}
132 {{- end }}
133
134 {{- if in (slice "false" false 0) (.Get "example") }}
135 {{- $example = false }}
136 {{- else if in (slice "true" true 1) (.Get "example") }}
137 {{- $example = true }}
138 {{- end }}
139
140 {{- with .Get "exampleWidth" }}
141 {{- $exampleWidth = . | int }}
142 {{- end }}
143
144 {{- /* Get image. */}}
145 {{- $ctx := dict "page" .Page "src" $src "name" .Name "position" .Position }}
146 {{- $i := partial "inline/get-resource.html" $ctx }}
147
148 {{- /* Resize if rendering before/after examples. */}}
149 {{- if $example }}
150 {{- $i = $i.Resize (printf "%dx" $exampleWidth) }}
151 {{- end }}
152
153 {{- /* Create filter. */}}
154 {{- $f := "" }}
155 {{- $ctx := dict "filter" $filter "args" $filterArgs "name" .Name "position" .Position }}
156 {{- if eq $filter "autoorient" }}
157 {{- $ctx = merge $ctx (dict "argsRequired" 0) }}
158 {{- template "validate-arg-count" $ctx }}
159 {{- $f = images.AutoOrient }}
160 {{- else if eq $filter "brightness" }}
161 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
162 {{- template "validate-arg-count" $ctx }}
163 {{- $filterArgs = apply $filterArgs "float" "." }}
164 {{- $ctx = merge $ctx (dict "argName" "percentage" "argValue" (index $filterArgs 0) "min" -100 "max" 100) }}
165 {{- template "validate-arg-value" $ctx }}
166 {{- $f = images.Brightness (index $filterArgs 0) }}
167 {{- else if eq $filter "colorbalance" }}
168 {{- $ctx = merge $ctx (dict "argsRequired" 3) }}
169 {{- template "validate-arg-count" $ctx }}
170 {{- $filterArgs = apply $filterArgs "float" "." }}
171 {{- $ctx = merge $ctx (dict "argName" "percentage red" "argValue" (index $filterArgs 0) "min" -100 "max" 500) }}
172 {{- template "validate-arg-value" $ctx }}
173 {{- $ctx = merge $ctx (dict "argName" "percentage green" "argValue" (index $filterArgs 1) "min" -100 "max" 500) }}
174 {{- template "validate-arg-value" $ctx }}
175 {{- $ctx = merge $ctx (dict "argName" "percentage blue" "argValue" (index $filterArgs 2) "min" -100 "max" 500) }}
176 {{- template "validate-arg-value" $ctx }}
177 {{- $f = images.ColorBalance (index $filterArgs 0) (index $filterArgs 1) (index $filterArgs 2) }}
178 {{- else if eq $filter "colorize" }}
179 {{- $ctx = merge $ctx (dict "argsRequired" 3) }}
180 {{- template "validate-arg-count" $ctx }}
181 {{- $filterArgs = apply $filterArgs "float" "." }}
182 {{- $ctx = merge $ctx (dict "argName" "hue" "argValue" (index $filterArgs 0) "min" 0 "max" 360) }}
183 {{- template "validate-arg-value" $ctx }}
184 {{- $ctx = merge $ctx (dict "argName" "saturation" "argValue" (index $filterArgs 1) "min" 0 "max" 100) }}
185 {{- template "validate-arg-value" $ctx }}
186 {{- $ctx = merge $ctx (dict "argName" "percentage" "argValue" (index $filterArgs 2) "min" 0 "max" 100) }}
187 {{- template "validate-arg-value" $ctx }}
188 {{- $f = images.Colorize (index $filterArgs 0) (index $filterArgs 1) (index $filterArgs 2) }}
189 {{- else if eq $filter "contrast" }}
190 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
191 {{- template "validate-arg-count" $ctx }}
192 {{- $filterArgs = apply $filterArgs "float" "." }}
193 {{- $ctx = merge $ctx (dict "argName" "percentage" "argValue" (index $filterArgs 0) "min" -100 "max" 100) }}
194 {{- template "validate-arg-value" $ctx }}
195 {{- $f = images.Contrast (index $filterArgs 0) }}
196 {{- else if eq $filter "dither" }}
197 {{- $f = images.Dither }}
198 {{- else if eq $filter "gamma" }}
199 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
200 {{- template "validate-arg-count" $ctx }}
201 {{- $filterArgs = apply $filterArgs "float" "." }}
202 {{- $ctx = merge $ctx (dict "argName" "gamma" "argValue" (index $filterArgs 0) "min" 0 "max" 100) }}
203 {{- template "validate-arg-value" $ctx }}
204 {{- $f = images.Gamma (index $filterArgs 0) }}
205 {{- else if eq $filter "gaussianblur" }}
206 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
207 {{- template "validate-arg-count" $ctx }}
208 {{- $filterArgs = apply $filterArgs "float" "." }}
209 {{- $ctx = merge $ctx (dict "argName" "sigma" "argValue" (index $filterArgs 0) "min" 0 "max" 1000) }}
210 {{- template "validate-arg-value" $ctx }}
211 {{- $f = images.GaussianBlur (index $filterArgs 0) }}
212 {{- else if eq $filter "grayscale" }}
213 {{- $ctx = merge $ctx (dict "argsRequired" 0) }}
214 {{- template "validate-arg-count" $ctx }}
215 {{- $f = images.Grayscale }}
216 {{- else if eq $filter "hue" }}
217 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
218 {{- template "validate-arg-count" $ctx }}
219 {{- $filterArgs = apply $filterArgs "float" "." }}
220 {{- $ctx = merge $ctx (dict "argName" "shift" "argValue" (index $filterArgs 0) "min" -180 "max" 180) }}
221 {{- template "validate-arg-value" $ctx }}
222 {{- $f = images.Hue (index $filterArgs 0) }}
223 {{- else if eq $filter "invert" }}
224 {{- $ctx = merge $ctx (dict "argsRequired" 0) }}
225 {{- template "validate-arg-count" $ctx }}
226 {{- $f = images.Invert }}
227 {{- else if eq $filter "mask" }}
228 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
229 {{- template "validate-arg-count" $ctx }}
230 {{- $ctx := dict "src" (index $filterArgs 0) "name" .Name "position" .Position }}
231 {{- $maskImage := partial "inline/get-resource.html" $ctx }}
232 {{- $f = images.Mask $maskImage }}
233 {{- else if eq $filter "opacity" }}
234 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
235 {{- template "validate-arg-count" $ctx }}
236 {{- $filterArgs = apply $filterArgs "float" "." }}
237 {{- $ctx = merge $ctx (dict "argName" "opacity" "argValue" (index $filterArgs 0) "min" 0 "max" 1) }}
238 {{- template "validate-arg-value" $ctx }}
239 {{- $f = images.Opacity (index $filterArgs 0) }}
240 {{- else if eq $filter "overlay" }}
241 {{- $ctx = merge $ctx (dict "argsRequired" 3) }}
242 {{- template "validate-arg-count" $ctx }}
243 {{- $ctx := dict "src" (index $filterArgs 0) "name" .Name "position" .Position }}
244 {{- $overlayImg := partial "inline/get-resource.html" $ctx }}
245 {{- $f = images.Overlay $overlayImg (index $filterArgs 1 | float ) (index $filterArgs 2 | float) }}
246 {{- else if eq $filter "padding" }}
247 {{- $ctx = merge $ctx (dict "argsRequired" 5) }}
248 {{- template "validate-arg-count" $ctx }}
249 {{- $f = images.Padding
250 (index $filterArgs 0 | int)
251 (index $filterArgs 1 | int)
252 (index $filterArgs 2 | int)
253 (index $filterArgs 3 | int)
254 (index $filterArgs 4)
255 }}
256 {{- else if eq $filter "pixelate" }}
257 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
258 {{- template "validate-arg-count" $ctx }}
259 {{- $filterArgs = apply $filterArgs "float" "." }}
260 {{- $ctx = merge $ctx (dict "argName" "size" "argValue" (index $filterArgs 0) "min" 0 "max" 1000) }}
261 {{- template "validate-arg-value" $ctx }}
262 {{- $f = images.Pixelate (index $filterArgs 0) }}
263 {{- else if eq $filter "process" }}
264 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
265 {{- template "validate-arg-count" $ctx }}
266 {{- $f = images.Process (index $filterArgs 0) }}
267 {{- else if eq $filter "saturation" }}
268 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
269 {{- template "validate-arg-count" $ctx }}
270 {{- $filterArgs = apply $filterArgs "float" "." }}
271 {{- $ctx = merge $ctx (dict "argName" "percentage" "argValue" (index $filterArgs 0) "min" -100 "max" 500) }}
272 {{- template "validate-arg-value" $ctx }}
273 {{- $f = images.Saturation (index $filterArgs 0) }}
274 {{- else if eq $filter "sepia" }}
275 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
276 {{- template "validate-arg-count" $ctx }}
277 {{- $filterArgs = apply $filterArgs "float" "." }}
278 {{- $ctx = merge $ctx (dict "argName" "percentage" "argValue" (index $filterArgs 0) "min" 0 "max" 100) }}
279 {{- template "validate-arg-value" $ctx }}
280 {{- $f = images.Sepia (index $filterArgs 0) }}
281 {{- else if eq $filter "sigmoid" }}
282 {{- $ctx = merge $ctx (dict "argsRequired" 2) }}
283 {{- template "validate-arg-count" $ctx }}
284 {{- $filterArgs = apply $filterArgs "float" "." }}
285 {{- $ctx = merge $ctx (dict "argName" "midpoint" "argValue" (index $filterArgs 0) "min" 0 "max" 1) }}
286 {{- template "validate-arg-value" $ctx }}
287 {{- $ctx = merge $ctx (dict "argName" "factor" "argValue" (index $filterArgs 1) "min" -10 "max" 10) }}
288 {{- template "validate-arg-value" $ctx }}
289 {{- $f = images.Sigmoid (index $filterArgs 0) (index $filterArgs 1) }}
290 {{- else if eq $filter "text" }}
291 {{- $ctx = merge $ctx (dict "argsRequired" 1) }}
292 {{- template "validate-arg-count" $ctx }}
293 {{- $ctx := dict "src" $textFilterOpts.fontPath "name" .Name "position" .Position }}
294 {{- $font := or (partial "inline/get-resource.html" $ctx) }}
295 {{- $fontSize := or (index $filterArgs 3 | int) $textFilterOpts.fontSize }}
296 {{- $lineHeight := math.Max (or (index $filterArgs 4 | float) $textFilterOpts.lineHeight) 1 }}
297 {{- $opts := dict
298 "x" (or (index $filterArgs 1 | int) $textFilterOpts.xOffset)
299 "y" (or (index $filterArgs 2 | int) $textFilterOpts.yOffset)
300 "size" $fontSize
301 "linespacing" (mul (sub $lineHeight 1) $fontSize)
302 "color" (or (index $filterArgs 5) $textFilterOpts.fontColor)
303 "font" $font
304 }}
305 {{- $f = images.Text (index $filterArgs 0) $opts }}
306 {{- else if eq $filter "unsharpmask" }}
307 {{- $ctx = merge $ctx (dict "argsRequired" 3) }}
308 {{- template "validate-arg-count" $ctx }}
309 {{- $filterArgs = apply $filterArgs "float" "." }}
310 {{- $ctx = merge $ctx (dict "argName" "sigma" "argValue" (index $filterArgs 0) "min" 0 "max" 500) }}
311 {{- template "validate-arg-value" $ctx }}
312 {{- $ctx = merge $ctx (dict "argName" "amount" "argValue" (index $filterArgs 1) "min" 0 "max" 100) }}
313 {{- template "validate-arg-value" $ctx }}
314 {{- $ctx = merge $ctx (dict "argName" "threshold" "argValue" (index $filterArgs 2) "min" 0 "max" 1) }}
315 {{- template "validate-arg-value" $ctx }}
316 {{- $f = images.UnsharpMask (index $filterArgs 0) (index $filterArgs 1) (index $filterArgs 2) }}
317 {{- end }}
318
319 {{- /* Apply filter. */}}
320 {{- $fi := $i }}
321 {{- with $f }}
322 {{- $fi = $i.Filter . }}
323 {{- end }}
324
325 {{- /* Render. */}}
326 {{- $class := "border-1 border-gray-300 dark:border-gray-500" }}
327 {{- if $example }}
328 <p>Original</p>
329 <img
330 class="{{ $class }}"
331 src="{{ $i.RelPermalink }}"
332 alt="{{ $alt }}">
333 <p>Processed</p>
334 <img
335 class="{{ $class }}"
336 src="{{ $fi.RelPermalink }}"
337 alt="{{ $alt }}">
338 {{- else -}}
339 <img
340 src="{{ $fi.RelPermalink }}"
341 alt="{{ $alt }}">
342 {{- end }}
343
344 {{- define "validate-arg-count" }}
345 {{- $msg := "When using the %q filter, the %q shortcode requires an args parameter with %d %s. See %s" }}
346 {{- if lt (len .args) .argsRequired }}
347 {{- $text := "values" }}
348 {{- if eq 1 .argsRequired }}
349 {{- $text = "value" }}
350 {{- end }}
351 {{- errorf $msg .filter .name .argsRequired $text .position }}
352 {{- end }}
353 {{- end }}
354
355 {{- define "validate-arg-value" }}
356 {{- $msg := "The %q argument passed to the %q shortcode is invalid. Expected a value in the range [%v,%v], but received %v. See %s" }}
357 {{- if or (lt .argValue .min) (gt .argValue .max) }}
358 {{- errorf $msg .argName .name .min .max .argValue .position }}
359 {{- end }}
360 {{- end }}
361
362 {{- define "_partials/inline/get-resource.html" }}
363 {{- $r := "" }}
364 {{- $u := urls.Parse .src }}
365 {{- $msg := "The %q shortcode was unable to resolve %s. See %s" }}
366 {{- if $u.IsAbs }}
367 {{- with try (resources.GetRemote $u.String) }}
368 {{- with .Err }}
369 {{- errorf "%s" . }}
370 {{- else with .Value }}
371 {{- /* This is a remote resource. */}}
372 {{- $r = . }}
373 {{- else }}
374 {{- errorf $msg $.name $u.String $.position }}
375 {{- end }}
376 {{- end }}
377 {{- else }}
378 {{- with .page.Resources.Get (strings.TrimPrefix "./" $u.Path) }}
379 {{- /* This is a page resource. */}}
380 {{- $r = . }}
381 {{- else }}
382 {{- with resources.Get $u.Path }}
383 {{- /* This is a global resource. */}}
384 {{- $r = . }}
385 {{- else }}
386 {{- errorf $msg $.name $u.Path $.position }}
387 {{- end }}
388 {{- end }}
389 {{- end }}
390 {{- return $r }}
391 {{- end -}}