Sha256: 7451fcab8e8e064c65e906c6e718a7d1a800a43a98c4ed1efcc094137f67e3c5
Contents?: true
Size: 1.76 KB
Versions: 8
Compression:
Stored size: 1.76 KB
Contents
import { CocoComponent } from "@js/coco";
export default CocoComponent("imageUploader", ({ click, drop }) => {
return {
file: null,
errors: [],
active: false,
clickable: click,
droppable: drop,
input: null,
get fileName() {
return this.file && this.file.name;
},
get fileType() {
return this.file && this.file.type;
},
get fileSize() {
return this.file && this.file.size;
},
get fileData() {
return this.file && this.file.data;
},
init() {
this.input = this.$refs.input;
this.$watch("file", (file) => {
const dataTransfer = new DataTransfer();
if (file && file.file instanceof File) {
dataTransfer.items.add(file.file);
}
this.input.files = dataTransfer.files;
});
},
setFile(file) {
this.file = file;
},
openPicker() {
this.input.click();
},
clear() {
this.file = null;
this.input.value = null;
this.$dispatch("image-uploader:clear");
},
handleDrop(event) {
const files = event.detail.files || event.dataTransfer.files;
this.handleFiles(files);
},
handleFiles(files) {
Array.from(files).forEach((file) => this.readFile(file));
},
readFile(file) {
const reader = new FileReader();
reader.addEventListener("load", () => {
this.file = {
name: file.name,
size: file.size,
type: file.type,
file: file,
data: reader.result,
};
this.$dispatch("image-uploader:load", { file: this.file });
});
reader.addEventListener("error", () => {
this.errors.push(`Error reading file: ${file.name}`);
});
reader.readAsDataURL(file);
},
};
});
Version data entries
8 entries across 8 versions & 1 rubygems