1use std::fs;
2use std::path::PathBuf;
3use std::sync::Arc;
4
5use crate::{
6 point, px, size, AbsoluteLength, Asset, Bounds, DefiniteLength, DevicePixels, Element,
7 ElementId, GlobalElementId, Hitbox, ImageData, InteractiveElement, Interactivity, IntoElement,
8 LayoutId, Length, Pixels, SharedUri, Size, StyleRefinement, Styled, SvgSize, UriOrPath,
9 WindowContext,
10};
11use futures::{AsyncReadExt, Future};
12use image::{ImageBuffer, ImageError};
13#[cfg(target_os = "macos")]
14use media::core_video::CVImageBuffer;
15
16use thiserror::Error;
17use util::{http, ResultExt};
18
19/// A source of image content.
20#[derive(Clone, Debug)]
21pub enum ImageSource {
22 /// Image content will be loaded from provided URI at render time.
23 Uri(SharedUri),
24 /// Image content will be loaded from the provided file at render time.
25 File(Arc<PathBuf>),
26 /// Cached image data
27 Data(Arc<ImageData>),
28 // TODO: move surface definitions into mac platform module
29 /// A CoreVideo image buffer
30 #[cfg(target_os = "macos")]
31 Surface(CVImageBuffer),
32}
33
34impl From<SharedUri> for ImageSource {
35 fn from(value: SharedUri) -> Self {
36 Self::Uri(value)
37 }
38}
39
40impl From<&'static str> for ImageSource {
41 fn from(uri: &'static str) -> Self {
42 Self::Uri(uri.into())
43 }
44}
45
46impl From<String> for ImageSource {
47 fn from(uri: String) -> Self {
48 Self::Uri(uri.into())
49 }
50}
51
52impl From<Arc<PathBuf>> for ImageSource {
53 fn from(value: Arc<PathBuf>) -> Self {
54 Self::File(value)
55 }
56}
57
58impl From<PathBuf> for ImageSource {
59 fn from(value: PathBuf) -> Self {
60 Self::File(value.into())
61 }
62}
63
64impl From<Arc<ImageData>> for ImageSource {
65 fn from(value: Arc<ImageData>) -> Self {
66 Self::Data(value)
67 }
68}
69
70#[cfg(target_os = "macos")]
71impl From<CVImageBuffer> for ImageSource {
72 fn from(value: CVImageBuffer) -> Self {
73 Self::Surface(value)
74 }
75}
76
77/// An image element.
78pub struct Img {
79 interactivity: Interactivity,
80 source: ImageSource,
81 grayscale: bool,
82 object_fit: ObjectFit,
83}
84
85/// Create a new image element.
86pub fn img(source: impl Into<ImageSource>) -> Img {
87 Img {
88 interactivity: Interactivity::default(),
89 source: source.into(),
90 grayscale: false,
91 object_fit: ObjectFit::Contain,
92 }
93}
94
95/// How to fit the image into the bounds of the element.
96pub enum ObjectFit {
97 /// The image will be stretched to fill the bounds of the element.
98 Fill,
99 /// The image will be scaled to fit within the bounds of the element.
100 Contain,
101 /// The image will be scaled to cover the bounds of the element.
102 Cover,
103 /// The image will be scaled down to fit within the bounds of the element.
104 ScaleDown,
105 /// The image will maintain its original size.
106 None,
107}
108
109impl ObjectFit {
110 /// Get the bounds of the image within the given bounds.
111 pub fn get_bounds(
112 &self,
113 bounds: Bounds<Pixels>,
114 image_size: Size<DevicePixels>,
115 ) -> Bounds<Pixels> {
116 let image_size = image_size.map(|dimension| Pixels::from(u32::from(dimension)));
117 let image_ratio = image_size.width / image_size.height;
118 let bounds_ratio = bounds.size.width / bounds.size.height;
119
120 let result_bounds = match self {
121 ObjectFit::Fill => bounds,
122 ObjectFit::Contain => {
123 let new_size = if bounds_ratio > image_ratio {
124 size(
125 image_size.width * (bounds.size.height / image_size.height),
126 bounds.size.height,
127 )
128 } else {
129 size(
130 bounds.size.width,
131 image_size.height * (bounds.size.width / image_size.width),
132 )
133 };
134
135 Bounds {
136 origin: point(
137 bounds.origin.x + (bounds.size.width - new_size.width) / 2.0,
138 bounds.origin.y + (bounds.size.height - new_size.height) / 2.0,
139 ),
140 size: new_size,
141 }
142 }
143 ObjectFit::ScaleDown => {
144 // Check if the image is larger than the bounds in either dimension.
145 if image_size.width > bounds.size.width || image_size.height > bounds.size.height {
146 // If the image is larger, use the same logic as Contain to scale it down.
147 let new_size = if bounds_ratio > image_ratio {
148 size(
149 image_size.width * (bounds.size.height / image_size.height),
150 bounds.size.height,
151 )
152 } else {
153 size(
154 bounds.size.width,
155 image_size.height * (bounds.size.width / image_size.width),
156 )
157 };
158
159 Bounds {
160 origin: point(
161 bounds.origin.x + (bounds.size.width - new_size.width) / 2.0,
162 bounds.origin.y + (bounds.size.height - new_size.height) / 2.0,
163 ),
164 size: new_size,
165 }
166 } else {
167 // If the image is smaller than or equal to the container, display it at its original size,
168 // centered within the container.
169 let original_size = size(image_size.width, image_size.height);
170 Bounds {
171 origin: point(
172 bounds.origin.x + (bounds.size.width - original_size.width) / 2.0,
173 bounds.origin.y + (bounds.size.height - original_size.height) / 2.0,
174 ),
175 size: original_size,
176 }
177 }
178 }
179 ObjectFit::Cover => {
180 let new_size = if bounds_ratio > image_ratio {
181 size(
182 bounds.size.width,
183 image_size.height * (bounds.size.width / image_size.width),
184 )
185 } else {
186 size(
187 image_size.width * (bounds.size.height / image_size.height),
188 bounds.size.height,
189 )
190 };
191
192 Bounds {
193 origin: point(
194 bounds.origin.x + (bounds.size.width - new_size.width) / 2.0,
195 bounds.origin.y + (bounds.size.height - new_size.height) / 2.0,
196 ),
197 size: new_size,
198 }
199 }
200 ObjectFit::None => Bounds {
201 origin: bounds.origin,
202 size: image_size,
203 },
204 };
205
206 result_bounds
207 }
208}
209
210impl Img {
211 /// A list of all format extensions currently supported by this img element
212 pub fn extensions() -> &'static [&'static str] {
213 // This is the list in [image::ImageFormat::from_extension] + `svg`
214 &[
215 "avif", "jpg", "jpeg", "png", "gif", "webp", "tif", "tiff", "tga", "dds", "bmp", "ico",
216 "hdr", "exr", "pbm", "pam", "ppm", "pgm", "ff", "farbfeld", "qoi", "svg",
217 ]
218 }
219
220 /// Set the image to be displayed in grayscale.
221 pub fn grayscale(mut self, grayscale: bool) -> Self {
222 self.grayscale = grayscale;
223 self
224 }
225 /// Set the object fit for the image.
226 pub fn object_fit(mut self, object_fit: ObjectFit) -> Self {
227 self.object_fit = object_fit;
228 self
229 }
230}
231
232impl Element for Img {
233 type RequestLayoutState = ();
234 type PrepaintState = Option<Hitbox>;
235
236 fn id(&self) -> Option<ElementId> {
237 self.interactivity.element_id.clone()
238 }
239
240 fn request_layout(
241 &mut self,
242 global_id: Option<&GlobalElementId>,
243 cx: &mut WindowContext,
244 ) -> (LayoutId, Self::RequestLayoutState) {
245 let layout_id = self
246 .interactivity
247 .request_layout(global_id, cx, |mut style, cx| {
248 if let Some(data) = self.source.data(cx) {
249 let image_size = data.size();
250 match (style.size.width, style.size.height) {
251 (Length::Auto, Length::Auto) => {
252 style.size = Size {
253 width: Length::Definite(DefiniteLength::Absolute(
254 AbsoluteLength::Pixels(px(image_size.width.0 as f32)),
255 )),
256 height: Length::Definite(DefiniteLength::Absolute(
257 AbsoluteLength::Pixels(px(image_size.height.0 as f32)),
258 )),
259 }
260 }
261 _ => {}
262 }
263 }
264
265 cx.request_layout(&style, [])
266 });
267 (layout_id, ())
268 }
269
270 fn prepaint(
271 &mut self,
272 global_id: Option<&GlobalElementId>,
273 bounds: Bounds<Pixels>,
274 _request_layout: &mut Self::RequestLayoutState,
275 cx: &mut WindowContext,
276 ) -> Option<Hitbox> {
277 self.interactivity
278 .prepaint(global_id, bounds, bounds.size, cx, |_, _, hitbox, _| hitbox)
279 }
280
281 fn paint(
282 &mut self,
283 global_id: Option<&GlobalElementId>,
284 bounds: Bounds<Pixels>,
285 _: &mut Self::RequestLayoutState,
286 hitbox: &mut Self::PrepaintState,
287 cx: &mut WindowContext,
288 ) {
289 let source = self.source.clone();
290 self.interactivity
291 .paint(global_id, bounds, hitbox.as_ref(), cx, |style, cx| {
292 let corner_radii = style.corner_radii.to_pixels(bounds.size, cx.rem_size());
293
294 if let Some(data) = source.data(cx) {
295 let new_bounds = self.object_fit.get_bounds(bounds, data.size());
296 cx.paint_image(new_bounds, corner_radii, data.clone(), self.grayscale)
297 .log_err();
298 }
299
300 match source {
301 #[cfg(target_os = "macos")]
302 ImageSource::Surface(surface) => {
303 let size = size(surface.width().into(), surface.height().into());
304 let new_bounds = self.object_fit.get_bounds(bounds, size);
305 // TODO: Add support for corner_radii and grayscale.
306 cx.paint_surface(new_bounds, surface);
307 }
308 _ => {}
309 }
310 })
311 }
312}
313
314impl IntoElement for Img {
315 type Element = Self;
316
317 fn into_element(self) -> Self::Element {
318 self
319 }
320}
321
322impl Styled for Img {
323 fn style(&mut self) -> &mut StyleRefinement {
324 &mut self.interactivity.base_style
325 }
326}
327
328impl InteractiveElement for Img {
329 fn interactivity(&mut self) -> &mut Interactivity {
330 &mut self.interactivity
331 }
332}
333
334impl ImageSource {
335 fn data(&self, cx: &mut WindowContext) -> Option<Arc<ImageData>> {
336 match self {
337 ImageSource::Uri(_) | ImageSource::File(_) => {
338 let uri_or_path: UriOrPath = match self {
339 ImageSource::Uri(uri) => uri.clone().into(),
340 ImageSource::File(path) => path.clone().into(),
341 _ => unreachable!(),
342 };
343
344 cx.use_cached_asset::<Image>(&uri_or_path)?.log_err()
345 }
346
347 ImageSource::Data(data) => Some(data.to_owned()),
348 #[cfg(target_os = "macos")]
349 ImageSource::Surface(_) => None,
350 }
351 }
352}
353
354#[derive(Clone)]
355enum Image {}
356
357impl Asset for Image {
358 type Source = UriOrPath;
359 type Output = Result<Arc<ImageData>, ImageCacheError>;
360
361 fn load(
362 source: Self::Source,
363 cx: &mut WindowContext,
364 ) -> impl Future<Output = Self::Output> + Send + 'static {
365 let client = cx.http_client();
366 let scale_factor = cx.scale_factor();
367 let svg_renderer = cx.svg_renderer();
368 async move {
369 let bytes = match source.clone() {
370 UriOrPath::Path(uri) => fs::read(uri.as_ref())?,
371 UriOrPath::Uri(uri) => {
372 let mut response = client.get(uri.as_ref(), ().into(), true).await?;
373 let mut body = Vec::new();
374 response.body_mut().read_to_end(&mut body).await?;
375 if !response.status().is_success() {
376 return Err(ImageCacheError::BadStatus {
377 status: response.status(),
378 body: String::from_utf8_lossy(&body).into_owned(),
379 });
380 }
381 body
382 }
383 };
384
385 let data = if let Ok(format) = image::guess_format(&bytes) {
386 let data = image::load_from_memory_with_format(&bytes, format)?.into_bgra8();
387 ImageData::new(data)
388 } else {
389 let pixmap =
390 svg_renderer.render_pixmap(&bytes, SvgSize::ScaleFactor(scale_factor))?;
391
392 let buffer =
393 ImageBuffer::from_raw(pixmap.width(), pixmap.height(), pixmap.take()).unwrap();
394
395 ImageData::new(buffer)
396 };
397
398 Ok(Arc::new(data))
399 }
400 }
401}
402
403/// An error that can occur when interacting with the image cache.
404#[derive(Debug, Error, Clone)]
405pub enum ImageCacheError {
406 /// An error that occurred while fetching an image from a remote source.
407 #[error("http error: {0}")]
408 Client(#[from] http::Error),
409 /// An error that occurred while reading the image from disk.
410 #[error("IO error: {0}")]
411 Io(Arc<std::io::Error>),
412 /// An error that occurred while processing an image.
413 #[error("unexpected http status: {status}, body: {body}")]
414 BadStatus {
415 /// The HTTP status code.
416 status: http::StatusCode,
417 /// The HTTP response body.
418 body: String,
419 },
420 /// An error that occurred while processing an image.
421 #[error("image error: {0}")]
422 Image(Arc<ImageError>),
423 /// An error that occurred while processing an SVG.
424 #[error("svg error: {0}")]
425 Usvg(Arc<usvg::Error>),
426}
427
428impl From<std::io::Error> for ImageCacheError {
429 fn from(error: std::io::Error) -> Self {
430 Self::Io(Arc::new(error))
431 }
432}
433
434impl From<ImageError> for ImageCacheError {
435 fn from(error: ImageError) -> Self {
436 Self::Image(Arc::new(error))
437 }
438}
439
440impl From<usvg::Error> for ImageCacheError {
441 fn from(error: usvg::Error) -> Self {
442 Self::Usvg(Arc::new(error))
443 }
444}