From d6136b0df1693960c6f54cb247c0a0b8810d9c60 Mon Sep 17 00:00:00 2001
From: David <dgx.arnold@gmail.com>
Date: Fri, 20 Sep 2024 14:09:21 +0200
Subject: [PATCH 1/2] feat: add more config options

---
 .../js/frappe/file_uploader/FilePreview.vue   | 20 ++++++++++++----
 .../js/frappe/file_uploader/FileUploader.vue  | 23 +++++++++++++++----
 .../file_uploader/file_uploader.bundle.js     |  8 +++++++
 3 files changed, 42 insertions(+), 9 deletions(-)

diff --git a/frappe/public/js/frappe/file_uploader/FilePreview.vue b/frappe/public/js/frappe/file_uploader/FilePreview.vue
index 9c6159334a..6f81e4c5fb 100644
--- a/frappe/public/js/frappe/file_uploader/FilePreview.vue
+++ b/frappe/public/js/frappe/file_uploader/FilePreview.vue
@@ -19,14 +19,14 @@
 			</div>
 
 			<div class="flex config-area">
-				<label v-if="is_optimizable" class="frappe-checkbox"
+				<label v-if="allow_toggle_optimize" class="frappe-checkbox"
 					><input
 						type="checkbox"
 						:checked="optimize"
 						@change="emit('toggle_optimize')"
 					/>{{ __("Optimize") }}</label
 				>
-				<label class="frappe-checkbox"
+				<label v-if="allow_toggle_private" class="frappe-checkbox"
 					><input
 						type="checkbox"
 						:checked="file.private"
@@ -79,6 +79,12 @@ let emit = defineEmits(["toggle_optimize", "toggle_private", "toggle_image_cropp
 // props
 const props = defineProps({
 	file: Object,
+	allow_toggle_private: {
+		default: true,
+	},
+	allow_toggle_optimize: {
+		default: true,
+	},
 });
 
 // variables
@@ -98,9 +104,15 @@ let uploaded = computed(() => {
 let is_image = computed(() => {
 	return props.file.file_obj.type.startsWith("image");
 });
-let is_optimizable = computed(() => {
+let allow_toggle_optimize = computed(() => {
 	let is_svg = props.file.file_obj.type == "image/svg+xml";
-	return is_image.value && !is_svg && !uploaded.value && !props.file.failed;
+	return (
+		props.allow_toggle_optimize &&
+		is_image.value &&
+		!is_svg &&
+		!uploaded.value &&
+		!props.file.failed
+	);
 });
 let is_cropable = computed(() => {
 	let croppable_types = ["image/jpeg", "image/png"];
diff --git a/frappe/public/js/frappe/file_uploader/FileUploader.vue b/frappe/public/js/frappe/file_uploader/FileUploader.vue
index 59b0f4c38a..a5fb16a04e 100644
--- a/frappe/public/js/frappe/file_uploader/FileUploader.vue
+++ b/frappe/public/js/frappe/file_uploader/FileUploader.vue
@@ -181,6 +181,8 @@
 					v-for="(file, i) in files"
 					:key="file.name"
 					:file="file"
+					:allow_toggle_private="allow_toggle_private"
+					:allow_toggle_optimize="allow_toggle_optimize"
 					@remove="remove_file(file)"
 					@toggle_private="file.private = !file.private"
 					@toggle_optimize="file.optimize = !file.optimize"
@@ -196,9 +198,6 @@
 						{{ __("Upload {0} files", [files.length]) }}
 					</span>
 				</button>
-				<div class="text-muted text-medium">
-					{{ __("Click on the lock icon to toggle public/private") }}
-				</div>
 			</div>
 		</div>
 		<ImageCropper
@@ -274,6 +273,18 @@ const props = defineProps({
 	upload_notes: {
 		default: null, // "Images or video, upto 2MB"
 	},
+	allow_web_link: {
+		default: true,
+	},
+	allow_take_photo: {
+		default: true,
+	},
+	allow_toggle_private: {
+		default: true,
+	},
+	allow_toggle_optimize: {
+		default: true,
+	},
 });
 
 // variables
@@ -291,14 +302,16 @@ let trigger_upload = ref(false);
 let close_dialog = ref(false);
 let hide_dialog_footer = ref(false);
 let allow_take_photo = ref(false);
-let allow_web_link = ref(true);
 let google_drive_settings = ref({
 	enabled: false,
 });
 let wrapper_ready = ref(false);
 
 // created
-allow_take_photo.value = window.navigator.mediaDevices;
+if (props.allow_take_photo) {
+	allow_take_photo.value = window.navigator.mediaDevices;
+}
+
 if (frappe.user_id !== "Guest") {
 	frappe.call({
 		// method only available after login
diff --git a/frappe/public/js/frappe/file_uploader/file_uploader.bundle.js b/frappe/public/js/frappe/file_uploader/file_uploader.bundle.js
index b886c7703d..d8afadf79d 100644
--- a/frappe/public/js/frappe/file_uploader/file_uploader.bundle.js
+++ b/frappe/public/js/frappe/file_uploader/file_uploader.bundle.js
@@ -21,6 +21,10 @@ class FileUploader {
 		attach_doc_image,
 		frm,
 		make_attachments_public,
+		allow_web_link,
+		allow_take_photo,
+		allow_toggle_private,
+		allow_toggle_optimize,
 	} = {}) {
 		frm && frm.attachments.max_reached(true);
 
@@ -55,6 +59,10 @@ class FileUploader {
 			disable_file_browser,
 			attach_doc_image,
 			make_attachments_public,
+			allow_web_link,
+			allow_take_photo,
+			allow_toggle_private,
+			allow_toggle_optimize,
 		});
 		SetVueGlobals(app);
 		this.uploader = app.mount(this.wrapper);

From 06126d3439e3c2176698588b6534efba8f2e3f5a Mon Sep 17 00:00:00 2001
From: David <dgx.arnold@gmail.com>
Date: Fri, 20 Sep 2024 18:50:07 +0200
Subject: [PATCH 2/2] fix: button alignment

---
 frappe/public/js/frappe/file_uploader/FileUploader.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/frappe/public/js/frappe/file_uploader/FileUploader.vue b/frappe/public/js/frappe/file_uploader/FileUploader.vue
index a5fb16a04e..d4fd952c8c 100644
--- a/frappe/public/js/frappe/file_uploader/FileUploader.vue
+++ b/frappe/public/js/frappe/file_uploader/FileUploader.vue
@@ -189,7 +189,10 @@
 					@toggle_image_cropper="toggle_image_cropper(i)"
 				/>
 			</div>
-			<div class="flex align-center" v-if="show_upload_button && currently_uploading === -1">
+			<div
+				class="flex align-items-center justify-content-end"
+				v-if="show_upload_button && currently_uploading === -1"
+			>
 				<button class="btn btn-primary btn-sm margin-right" @click="() => upload_files()">
 					<span v-if="files.length === 1">
 						{{ __("Upload file") }}