fix: formatting and cleanup

This commit is contained in:
Faris Ansari 2021-02-08 13:23:24 +05:30
parent 9b6d353b4d
commit ce4cf6035e

View file

@ -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>