From 5b9c92e4d3324cb4dca6d985c9fb83008d6fd9b1 Mon Sep 17 00:00:00 2001
From: LittleSheep <littlesheep.code@hotmail.com>
Date: Thu, 1 Aug 2024 23:44:07 +0800
Subject: [PATCH] :sparkles: Crop image

---
 android/app/src/main/AndroidManifest.xml      |  6 ++
 lib/services.dart                             |  2 +-
 lib/translations/en_us.dart                   |  1 +
 lib/translations/zh_cn.dart                   |  1 +
 .../attachments/attachment_editor.dart        | 78 +++++++++++++++----
 web/index.html                                |  4 +
 6 files changed, 74 insertions(+), 18 deletions(-)

diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml
index 8b82d6c..ec70ee6 100644
--- a/android/app/src/main/AndroidManifest.xml
+++ b/android/app/src/main/AndroidManifest.xml
@@ -70,6 +70,12 @@
                 <category android:name="android.intent.category.LAUNCHER"/>
             </intent-filter>
         </activity>
+
+        <activity
+                android:name="com.yalantis.ucrop.UCropActivity"
+                android:screenOrientation="portrait"
+                android:theme="@style/Theme.AppCompat.Light.NoActionBar"/>
+
         <!-- Don't delete the meta-data below.
              This is used by the Flutter tool to generate GeneratedPluginRegistrant.java -->
         <meta-data
diff --git a/lib/services.dart b/lib/services.dart
index ab41ad8..42253c0 100644
--- a/lib/services.dart
+++ b/lib/services.dart
@@ -1,7 +1,7 @@
 import 'package:get/get.dart';
 
 abstract class ServiceFinder {
-  static const bool devFlag = true;
+  static const bool devFlag = false;
 
   static const String dealerUrl =
       devFlag ? 'http://localhost:8442' : 'https://api.sn.solsynth.dev';
diff --git a/lib/translations/en_us.dart b/lib/translations/en_us.dart
index ff55d03..e1664b4 100644
--- a/lib/translations/en_us.dart
+++ b/lib/translations/en_us.dart
@@ -326,4 +326,5 @@ const i18nEnglish = {
   'themeColorLuka': 'Luka Pink',
   'themeColorApplied': 'Global theme color has been applied.',
   'attachmentSaved': 'Attachment saved to your system album.',
+  'cropImage': 'Crop Image',
 };
diff --git a/lib/translations/zh_cn.dart b/lib/translations/zh_cn.dart
index 95c22f0..958216b 100644
--- a/lib/translations/zh_cn.dart
+++ b/lib/translations/zh_cn.dart
@@ -303,4 +303,5 @@ const i18nSimplifiedChinese = {
   'themeColorLuka': '流音粉',
   'themeColorApplied': '全局主题颜色已应用',
   'attachmentSaved': '附件已保存到系统相册',
+  'cropImage': '裁剪图片',
 };
diff --git a/lib/widgets/attachments/attachment_editor.dart b/lib/widgets/attachments/attachment_editor.dart
index bc3589c..11ddadd 100644
--- a/lib/widgets/attachments/attachment_editor.dart
+++ b/lib/widgets/attachments/attachment_editor.dart
@@ -8,9 +8,10 @@ import 'package:file_picker/file_picker.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 import 'package:get/get.dart';
+import 'package:image_cropper/image_cropper.dart';
 import 'package:image_picker/image_picker.dart';
 import 'package:pasteboard/pasteboard.dart';
-import 'package:path/path.dart' show basename;
+import 'package:path/path.dart' show basename, extension;
 import 'package:solian/exts.dart';
 import 'package:solian/models/attachment.dart';
 import 'package:solian/platform.dart';
@@ -203,6 +204,31 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
     );
   }
 
+  Future<void> _cropAttachment(int queueIndex) async {
+    final task = _uploadController.queueOfUpload[queueIndex];
+    CroppedFile? croppedFile = await ImageCropper().cropImage(
+      sourcePath: task.file.path,
+      uiSettings: [
+        AndroidUiSettings(
+          toolbarTitle: 'cropImage'.tr,
+          toolbarColor: Colors.deepOrange,
+          toolbarWidgetColor: Colors.white,
+          aspectRatioPresets: CropAspectRatioPreset.values,
+        ),
+        IOSUiSettings(
+          title: 'cropImage'.tr,
+          aspectRatioPresets: CropAspectRatioPreset.values,
+        ),
+        WebUiSettings(
+          context: context,
+        ),
+      ],
+    );
+    if (croppedFile == null) return;
+    _uploadController.queueOfUpload[queueIndex].file = File(croppedFile.path);
+    _uploadController.queueOfUpload.refresh();
+  }
+
   Future<void> _deleteAttachment(Attachment element) async {
     setState(() => _isBusy = true);
     try {
@@ -216,6 +242,9 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
   }
 
   Widget _buildQueueEntry(AttachmentUploadTask element, int index) {
+    final extName = extension(element.file.path).substring(1);
+    final canBeCrop = ['png', 'jpg', 'jpeg', 'gif'].contains(extName);
+
     return Container(
       padding: const EdgeInsets.only(left: 16, right: 8, bottom: 16),
       child: Card(
@@ -269,23 +298,38 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
                         child: Icon(Icons.check),
                       ),
                     ),
+                  if (!element.isCompleted && canBeCrop)
+                    Obx(
+                      () => IconButton(
+                        color: Colors.teal,
+                        icon: const Icon(Icons.crop),
+                        visualDensity: const VisualDensity(horizontal: -4),
+                        onPressed: _uploadController.isUploading.value
+                            ? null
+                            : () {
+                                _cropAttachment(index);
+                              },
+                      ),
+                    ),
                   if (!element.isCompleted && !element.isUploading)
-                    IconButton(
-                      color: Colors.green,
-                      icon: const Icon(Icons.play_arrow),
-                      visualDensity: const VisualDensity(horizontal: -4),
-                      onPressed: _uploadController.isUploading.value
-                          ? null
-                          : () {
-                              _uploadController
-                                  .performSingleTask(index)
-                                  .then((r) {
-                                widget.onAdd(r.id);
-                                if (mounted) {
-                                  setState(() => _attachments.add(r));
-                                }
-                              });
-                            },
+                    Obx(
+                      () => IconButton(
+                        color: Colors.green,
+                        icon: const Icon(Icons.play_arrow),
+                        visualDensity: const VisualDensity(horizontal: -4),
+                        onPressed: _uploadController.isUploading.value
+                            ? null
+                            : () {
+                                _uploadController
+                                    .performSingleTask(index)
+                                    .then((r) {
+                                  widget.onAdd(r.id);
+                                  if (mounted) {
+                                    setState(() => _attachments.add(r));
+                                  }
+                                });
+                              },
+                      ),
                     ),
                   if (!element.isCompleted && !element.isUploading)
                     IconButton(
diff --git a/web/index.html b/web/index.html
index d11360a..cbe7334 100644
--- a/web/index.html
+++ b/web/index.html
@@ -26,6 +26,10 @@
     <meta name="apple-mobile-web-app-title" content="solian" />
     <link rel="apple-touch-icon" href="icons/Icon-192.png" />
 
+    <!-- Cropper.js -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.6.2/cropper.css" />
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.6.2/cropper.min.js"></script>
+
     <!-- Favicon -->
     <link rel="icon" type="image/png" href="favicon.png" />