image_viewer.rs

  1use gpui::{
  2    canvas, div, fill, img, opaque_grey, point, size, AnyElement, AppContext, Bounds, Context,
  3    EventEmitter, FocusHandle, FocusableView, Img, InteractiveElement, IntoElement, Model,
  4    ObjectFit, ParentElement, Render, Styled, Task, View, ViewContext, VisualContext, WeakView,
  5    WindowContext,
  6};
  7use persistence::IMAGE_VIEWER;
  8use ui::prelude::*;
  9
 10use file_icons::FileIcons;
 11use project::{Project, ProjectEntryId, ProjectPath};
 12use settings::Settings;
 13use std::{ffi::OsStr, path::PathBuf};
 14use workspace::{
 15    item::{Item, ProjectItem, SerializableItem, TabContentParams},
 16    ItemId, ItemSettings, Pane, Workspace, WorkspaceId,
 17};
 18
 19const IMAGE_VIEWER_KIND: &str = "ImageView";
 20
 21pub struct ImageItem {
 22    path: PathBuf,
 23    project_path: ProjectPath,
 24}
 25
 26impl project::Item for ImageItem {
 27    fn try_open(
 28        project: &Model<Project>,
 29        path: &ProjectPath,
 30        cx: &mut AppContext,
 31    ) -> Option<Task<gpui::Result<Model<Self>>>> {
 32        let path = path.clone();
 33        let project = project.clone();
 34
 35        let ext = path
 36            .path
 37            .extension()
 38            .and_then(OsStr::to_str)
 39            .map(str::to_lowercase)
 40            .unwrap_or_default();
 41        let ext = ext.as_str();
 42
 43        // Only open the item if it's a binary image (no SVGs, etc.)
 44        // Since we do not have a way to toggle to an editor
 45        if Img::extensions().contains(&ext) && !ext.contains("svg") {
 46            Some(cx.spawn(|mut cx| async move {
 47                let abs_path = project
 48                    .read_with(&cx, |project, cx| project.absolute_path(&path, cx))?
 49                    .ok_or_else(|| anyhow::anyhow!("Failed to find the absolute path"))?;
 50
 51                cx.new_model(|_| ImageItem {
 52                    path: abs_path,
 53                    project_path: path,
 54                })
 55            }))
 56        } else {
 57            None
 58        }
 59    }
 60
 61    fn entry_id(&self, _: &AppContext) -> Option<ProjectEntryId> {
 62        None
 63    }
 64
 65    fn project_path(&self, _: &AppContext) -> Option<ProjectPath> {
 66        Some(self.project_path.clone())
 67    }
 68}
 69
 70pub struct ImageView {
 71    path: PathBuf,
 72    focus_handle: FocusHandle,
 73}
 74
 75impl Item for ImageView {
 76    type Event = ();
 77
 78    fn tab_content(&self, params: TabContentParams, _cx: &WindowContext) -> AnyElement {
 79        let title = self
 80            .path
 81            .file_name()
 82            .unwrap_or_else(|| self.path.as_os_str())
 83            .to_string_lossy()
 84            .to_string();
 85        Label::new(title)
 86            .single_line()
 87            .color(params.text_color())
 88            .italic(params.preview)
 89            .into_any_element()
 90    }
 91
 92    fn tab_icon(&self, cx: &WindowContext) -> Option<Icon> {
 93        ItemSettings::get_global(cx)
 94            .file_icons
 95            .then(|| FileIcons::get_icon(self.path.as_path(), cx))
 96            .flatten()
 97            .map(Icon::from_path)
 98    }
 99
100    fn clone_on_split(
101        &self,
102        _workspace_id: Option<WorkspaceId>,
103        cx: &mut ViewContext<Self>,
104    ) -> Option<View<Self>>
105    where
106        Self: Sized,
107    {
108        Some(cx.new_view(|cx| Self {
109            path: self.path.clone(),
110            focus_handle: cx.focus_handle(),
111        }))
112    }
113}
114
115impl SerializableItem for ImageView {
116    fn serialized_item_kind() -> &'static str {
117        IMAGE_VIEWER_KIND
118    }
119
120    fn deserialize(
121        _project: Model<Project>,
122        _workspace: WeakView<Workspace>,
123        workspace_id: WorkspaceId,
124        item_id: ItemId,
125        cx: &mut ViewContext<Pane>,
126    ) -> Task<gpui::Result<View<Self>>> {
127        cx.spawn(|_pane, mut cx| async move {
128            let image_path = IMAGE_VIEWER
129                .get_image_path(item_id, workspace_id)?
130                .ok_or_else(|| anyhow::anyhow!("No image path found"))?;
131
132            cx.new_view(|cx| ImageView {
133                path: image_path,
134                focus_handle: cx.focus_handle(),
135            })
136        })
137    }
138
139    fn cleanup(
140        workspace_id: WorkspaceId,
141        alive_items: Vec<ItemId>,
142        cx: &mut WindowContext,
143    ) -> Task<gpui::Result<()>> {
144        cx.spawn(|_| IMAGE_VIEWER.delete_unloaded_items(workspace_id, alive_items))
145    }
146
147    fn serialize(
148        &mut self,
149        workspace: &mut Workspace,
150        item_id: ItemId,
151        _closing: bool,
152        cx: &mut ViewContext<Self>,
153    ) -> Option<Task<gpui::Result<()>>> {
154        let workspace_id = workspace.database_id()?;
155
156        Some(cx.background_executor().spawn({
157            let image_path = self.path.clone();
158            async move {
159                IMAGE_VIEWER
160                    .save_image_path(item_id, workspace_id, image_path)
161                    .await
162            }
163        }))
164    }
165
166    fn should_serialize(&self, _event: &Self::Event) -> bool {
167        false
168    }
169}
170
171impl EventEmitter<()> for ImageView {}
172impl FocusableView for ImageView {
173    fn focus_handle(&self, _cx: &AppContext) -> FocusHandle {
174        self.focus_handle.clone()
175    }
176}
177
178impl Render for ImageView {
179    fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
180        let checkered_background = |bounds: Bounds<Pixels>, _, cx: &mut WindowContext| {
181            let square_size = 32.0;
182
183            let start_y = bounds.origin.y.0;
184            let height = bounds.size.height.0;
185            let start_x = bounds.origin.x.0;
186            let width = bounds.size.width.0;
187
188            let mut y = start_y;
189            let mut x = start_x;
190            let mut color_swapper = true;
191            // draw checkerboard pattern
192            while y <= start_y + height {
193                // Keeping track of the grid in order to be resilient to resizing
194                let start_swap = color_swapper;
195                while x <= start_x + width {
196                    let rect =
197                        Bounds::new(point(px(x), px(y)), size(px(square_size), px(square_size)));
198
199                    let color = if color_swapper {
200                        opaque_grey(0.6, 0.4)
201                    } else {
202                        opaque_grey(0.7, 0.4)
203                    };
204
205                    cx.paint_quad(fill(rect, color));
206                    color_swapper = !color_swapper;
207                    x += square_size;
208                }
209                x = start_x;
210                color_swapper = !start_swap;
211                y += square_size;
212            }
213        };
214
215        let checkered_background = canvas(|_, _| (), checkered_background)
216            .border_2()
217            .border_color(cx.theme().styles.colors.border)
218            .size_full()
219            .absolute()
220            .top_0()
221            .left_0();
222
223        div()
224            .track_focus(&self.focus_handle)
225            .size_full()
226            .child(checkered_background)
227            .child(
228                div()
229                    .flex()
230                    .justify_center()
231                    .items_center()
232                    .w_full()
233                    // TODO: In browser based Tailwind & Flex this would be h-screen and we'd use w-full
234                    .h_full()
235                    .child(
236                        img(self.path.clone())
237                            .object_fit(ObjectFit::ScaleDown)
238                            .max_w_full()
239                            .max_h_full(),
240                    ),
241            )
242    }
243}
244
245impl ProjectItem for ImageView {
246    type Item = ImageItem;
247
248    fn for_project_item(
249        _project: Model<Project>,
250        item: Model<Self::Item>,
251        cx: &mut ViewContext<Self>,
252    ) -> Self
253    where
254        Self: Sized,
255    {
256        Self {
257            path: item.read(cx).path.clone(),
258            focus_handle: cx.focus_handle(),
259        }
260    }
261}
262
263pub fn init(cx: &mut AppContext) {
264    workspace::register_project_item::<ImageView>(cx);
265    workspace::register_serializable_item::<ImageView>(cx)
266}
267
268mod persistence {
269    use anyhow::Result;
270    use std::path::PathBuf;
271
272    use db::{define_connection, query, sqlez::statement::Statement, sqlez_macros::sql};
273    use workspace::{ItemId, WorkspaceDb, WorkspaceId};
274
275    define_connection! {
276        pub static ref IMAGE_VIEWER: ImageViewerDb<WorkspaceDb> =
277            &[sql!(
278                CREATE TABLE image_viewers (
279                    workspace_id INTEGER,
280                    item_id INTEGER UNIQUE,
281
282                    image_path BLOB,
283
284                    PRIMARY KEY(workspace_id, item_id),
285                    FOREIGN KEY(workspace_id) REFERENCES workspaces(workspace_id)
286                    ON DELETE CASCADE
287                ) STRICT;
288            )];
289    }
290
291    impl ImageViewerDb {
292        query! {
293           pub async fn update_workspace_id(
294                new_id: WorkspaceId,
295                old_id: WorkspaceId,
296                item_id: ItemId
297            ) -> Result<()> {
298                UPDATE image_viewers
299                SET workspace_id = ?
300                WHERE workspace_id = ? AND item_id = ?
301            }
302        }
303
304        query! {
305            pub async fn save_image_path(
306                item_id: ItemId,
307                workspace_id: WorkspaceId,
308                image_path: PathBuf
309            ) -> Result<()> {
310                INSERT OR REPLACE INTO image_viewers(item_id, workspace_id, image_path)
311                VALUES (?, ?, ?)
312            }
313        }
314
315        query! {
316            pub fn get_image_path(item_id: ItemId, workspace_id: WorkspaceId) -> Result<Option<PathBuf>> {
317                SELECT image_path
318                FROM image_viewers
319                WHERE item_id = ? AND workspace_id = ?
320            }
321        }
322
323        pub async fn delete_unloaded_items(
324            &self,
325            workspace: WorkspaceId,
326            alive_items: Vec<ItemId>,
327        ) -> Result<()> {
328            let placeholders = alive_items
329                .iter()
330                .map(|_| "?")
331                .collect::<Vec<&str>>()
332                .join(", ");
333
334            let query = format!("DELETE FROM image_viewers WHERE workspace_id = ? AND item_id NOT IN ({placeholders})");
335
336            self.write(move |conn| {
337                let mut statement = Statement::prepare(conn, query)?;
338                let mut next_index = statement.bind(&workspace, 1)?;
339                for id in alive_items {
340                    next_index = statement.bind(&id, next_index)?;
341                }
342                statement.exec()
343            })
344            .await
345        }
346    }
347}