editor: more crop options (fix #546)

Signed-off-by: Varun Patil <radialapps@gmail.com>

CHANGELOG.md

@@ -13,6 +13,7 @@ All notable changes to this project will be documented in this file.
 - **Feature**: Allow disabling autoplay of live photo ([#591](https://github.com/pulsejet/memories/issues/591))
 - **Feature**: Improvements in admin interface
 - **Feature**: A `.nomemories` file will now hide a folder from Memories without affecting other apps ([#777](https://github.com/pulsejet/memories/issues/777))
+- **Feature**: More crop options for image editor ([#546](https://github.com/pulsejet/memories/issues/546))
 - **Bugfix**: You can now configure the transpose strategy of the transcoder (required for QSV)
 
 ## [v5.2.1] - 2023-07-03

src/components/viewer/ImageEditor.vue

@@ -18,6 +18,11 @@ import { IImageInfo, IPhoto } from '../../types';
 import * as utils from '../../services/Utils';
 import { fetchImage } from '../frame/XImgCache';
 
+// Crop preset icons
+import LandscapeIcon from '@scaleflex/icons/landscape';
+import PortraitIcon from '@scaleflex/icons/portrait';
+import SquareIcon from '@scaleflex/icons/square';
+
 let TABS, TOOLS: any;
 type FilerobotImageEditor = import('filerobot-image-editor').default;
 let FilerobotImageEditor: typeof import('filerobot-image-editor').default;
@@ -79,6 +84,29 @@ export default defineComponent({
           componentType: 'buttons',
         },
 
+        Crop: {
+          presetsItems: [
+            {
+              titleKey: 'landscape',
+              descriptionKey: '4:3',
+              ratio: 4 / 3,
+              icon: LandscapeIcon,
+            },
+            {
+              titleKey: 'portrait',
+              descriptionKey: '3:4',
+              ratio: 3 / 4,
+              icon: PortraitIcon,
+            },
+            {
+              titleKey: 'square',
+              descriptionKey: '1:1',
+              ratio: 1,
+              icon: SquareIcon,
+            },
+          ],
+        },
+
         // Translations
         translations,