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