From ce4cf6035ee955db3702e37db760216602f9f18e Mon Sep 17 00:00:00 2001
From: Faris Ansari <netchamp.faris@gmail.com>
Date: Mon, 8 Feb 2021 13:23:24 +0530
Subject: [PATCH] fix: formatting and cleanup

---
 .../js/frappe/file_uploader/FileUploader.vue  | 40 +++++++++----------
 1 file changed, 19 insertions(+), 21 deletions(-)

diff --git a/frappe/public/js/frappe/file_uploader/FileUploader.vue b/frappe/public/js/frappe/file_uploader/FileUploader.vue
index a6a1634fe4..18cfabc5ed 100644
--- a/frappe/public/js/frappe/file_uploader/FileUploader.vue
+++ b/frappe/public/js/frappe/file_uploader/FileUploader.vue
@@ -10,7 +10,7 @@
 		>
 			<div v-if="!is_dragging">
 				<div class="text-center">
-					{{ __('Drag and drop files here or') }}
+					{{ __('Drag and drop files here or upload from') }}
 				</div>
 				<div class="mt-2">
 					<button class="btn btn-file-upload" @click="browse_files">
@@ -28,7 +28,7 @@
 							</linearGradient>
 							</defs>
 						</svg>
-						<div class="mt-1">{{ __('Select File') }}</div>
+						<div class="mt-1">{{ __('My Device') }}</div>
 					</button>
 					<input
 						type="file"
@@ -56,9 +56,10 @@
 						<div class="mt-1">{{ __('Link') }}</div>
 					</button>
 					<button v-if="allow_take_photo" class="btn btn-file-upload" @click="capture_image">
-						<svg width="30" height="30" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
-							<circle cx="15" cy="15" fill="#ce315b" id="svg_1" r="15" transform="matrix(1 0 0 1 0 0)"/>
-							<path d="m22,10l-8,0c0,-0.55 -0.45,-1.5 -1,-1.5l-4,0c-0.55,0 -1,0.95 -1,1.5c-0.55,0 -1,0.45 -1,1l0,9c0,0.55 0.45,1 1,1l14,0c0.55,0 1,-0.45 1,-1l0,-9c0,-0.55 -0.45,-1 -1,-1zm-9,2l-3.5,0l0,0.5l3.5,0l0,-0.5zm7,3.5c0,1.38 -1.13,2.5 -2.5,2.5s-2.5,-1.13 -2.5,-2.5s1.13,-2.5 2.5,-2.5s2.5,1.13 2.5,2.5z" fill="none" id="svg_2" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+						<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+							<circle cx="15" cy="15" r="15" fill="#CE315B"/>
+							<path d="M11.5 10.5H9.5C8.67157 10.5 8 11.1716 8 12V20C8 20.8284 8.67157 21.5 9.5 21.5H20.5C21.3284 21.5 22 20.8284 22 20V12C22 11.1716 21.3284 10.5 20.5 10.5H18.5L17.3 8.9C17.1111 8.64819 16.8148 8.5 16.5 8.5H13.5C13.1852 8.5 12.8889 8.64819 12.7 8.9L11.5 10.5Z" stroke="white" stroke-linejoin="round"/>
+							<circle cx="15" cy="16" r="2.5" stroke="white"/>
 						</svg>
 						<div class="mt-1">{{ __('Camera') }}</div>
 					</button>
@@ -180,12 +181,8 @@ export default {
 			currently_uploading: -1,
 			show_file_browser: false,
 			show_web_link: false,
-			allow_take_photo: false,
 		}
 	},
-	created() {
-		this.allow_take_photo = window.navigator.mediaDevices;
-	},
 	watch: {
 		files(newvalue, oldvalue) {
 			if (!this.allow_multiple && newvalue.length > 1) {
@@ -198,6 +195,9 @@ export default {
 			return this.files.length > 0
 				&& this.files.every(
 					file => file.total !== 0 && file.progress === file.total);
+		},
+		allow_take_photo() {
+			return window.navigator.mediaDevices;
 		}
 	},
 	methods: {
@@ -428,26 +428,24 @@ export default {
 				xhr.send(form_data);
 			});
 		},
-		urltoFile(url, filename, mimeType){
-			return (fetch(url)
-					.then(function(res){return res.arrayBuffer();})
-					.then(function(buf){return new File([buf], filename, {type:mimeType});})
-			);
-		},
 		capture_image() {
 			const capture = new frappe.ui.Capture({
 				animate: false,
 				error: true
 			});
-
 			capture.show();
 			capture.submit(data_url => {
-				let filename = `capture_${frappe.datetime.now_date()}_${frappe.datetime.now_time().replaceAll(":", "-")}.png`;
-				this.urltoFile(data_url, filename, 'image/png').then((file) => {
-					return this.add_files([file])
-				});
+				let filename = `capture_${frappe.datetime.now_datetime().replaceAll(/[: -]/g, '_')}.png`;
+				this.url_to_file(data_url, filename, 'image/png').then((file) =>
+					this.add_files([file])
+				);
 			});
-		}
+		},
+		url_to_file(url, filename, mime_type) {
+			return fetch(url)
+					.then(res => res.arrayBuffer())
+					.then(buffer => new File([buffer], filename, { type: mime_type }));
+		},
 	}
 }
 </script>