mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-09-30 10:29:42 +00:00
Apply prettier rules
This commit is contained in:
@@ -1,96 +1,99 @@
|
||||
var mime = require('mime');
|
||||
var mime = require("mime");
|
||||
|
||||
var algo = 'AES-CBC';
|
||||
var algo = "AES-CBC";
|
||||
|
||||
var initializeButtons = (root) => {
|
||||
var
|
||||
buttons = root.querySelectorAll('a[data-download-button]');
|
||||
var buttons = root.querySelectorAll("a[data-download-button]");
|
||||
|
||||
for (let i = 0; i < buttons.length; i ++) {
|
||||
initialize(buttons[i]);
|
||||
}
|
||||
for (let i = 0; i < buttons.length; i++) {
|
||||
initialize(buttons[i]);
|
||||
}
|
||||
};
|
||||
|
||||
var initialize = (button) => {
|
||||
button.addEventListener('click', onClick);
|
||||
button.addEventListener("click", onClick);
|
||||
};
|
||||
|
||||
var onClick = e => download(e.target);
|
||||
var onClick = (e) => download(e.target);
|
||||
|
||||
var download = (button) => {
|
||||
var
|
||||
keyData = JSON.parse(button.dataset.key),
|
||||
ivData = JSON.parse(button.dataset.iv),
|
||||
iv = new Uint8Array(ivData),
|
||||
urlGenerator = button.dataset.tempUrlGetGenerator,
|
||||
hasFilename = 'filename' in button.dataset,
|
||||
filename = button.dataset.filename,
|
||||
labelPreparing = button.dataset.labelPreparing,
|
||||
labelReady = button.dataset.labelReady,
|
||||
mimeType = button.dataset.mimeType,
|
||||
extension = mime.getExtension(mimeType),
|
||||
decryptError = "Error while decrypting file",
|
||||
fetchError = "Error while fetching file",
|
||||
key, url
|
||||
;
|
||||
var keyData = JSON.parse(button.dataset.key),
|
||||
ivData = JSON.parse(button.dataset.iv),
|
||||
iv = new Uint8Array(ivData),
|
||||
urlGenerator = button.dataset.tempUrlGetGenerator,
|
||||
hasFilename = "filename" in button.dataset,
|
||||
filename = button.dataset.filename,
|
||||
labelPreparing = button.dataset.labelPreparing,
|
||||
labelReady = button.dataset.labelReady,
|
||||
mimeType = button.dataset.mimeType,
|
||||
extension = mime.getExtension(mimeType),
|
||||
decryptError = "Error while decrypting file",
|
||||
fetchError = "Error while fetching file",
|
||||
key,
|
||||
url;
|
||||
|
||||
button.textContent = labelPreparing;
|
||||
button.textContent = labelPreparing;
|
||||
|
||||
window.fetch(urlGenerator)
|
||||
.then((r) => {
|
||||
if (r.ok) {
|
||||
return r.json();
|
||||
} else {
|
||||
throw new Error("error while downloading url " + r.status + " " + r.statusText);
|
||||
}
|
||||
})
|
||||
.then(data => {
|
||||
return window.fetch(data.url);
|
||||
})
|
||||
.then(response => {
|
||||
if (response.ok) {
|
||||
return response.arrayBuffer();
|
||||
}
|
||||
throw new Error(response.status + response.statusText);
|
||||
})
|
||||
.then(buffer => {
|
||||
if (keyData.alg !== undefined) {
|
||||
return window.crypto.subtle
|
||||
.importKey('jwk', keyData, { name: algo, iv: iv}, false, ['decrypt'])
|
||||
.then(key => {
|
||||
return window.crypto.subtle.decrypt({ name: algo, iv: iv }, key, buffer);
|
||||
});
|
||||
}
|
||||
return Promise.resolve(buffer);
|
||||
})
|
||||
.then(decrypted => {
|
||||
var
|
||||
blob = new Blob([decrypted], { type: mimeType }),
|
||||
url = window.URL.createObjectURL(blob)
|
||||
;
|
||||
button.href = url;
|
||||
button.target = '_blank';
|
||||
button.type = mimeType;
|
||||
button.textContent = labelReady;
|
||||
if (hasFilename) {
|
||||
|
||||
button.download = filename;
|
||||
if (extension !== false) {
|
||||
button.download = button.download + '.' + extension;
|
||||
}
|
||||
}
|
||||
button.removeEventListener('click', onClick);
|
||||
button.click();
|
||||
})
|
||||
.catch(error => {
|
||||
button.textContent = "";
|
||||
button.appendChild(document.createTextNode("error while handling decrypted file"));
|
||||
})
|
||||
;
|
||||
window
|
||||
.fetch(urlGenerator)
|
||||
.then((r) => {
|
||||
if (r.ok) {
|
||||
return r.json();
|
||||
} else {
|
||||
throw new Error(
|
||||
"error while downloading url " + r.status + " " + r.statusText,
|
||||
);
|
||||
}
|
||||
})
|
||||
.then((data) => {
|
||||
return window.fetch(data.url);
|
||||
})
|
||||
.then((response) => {
|
||||
if (response.ok) {
|
||||
return response.arrayBuffer();
|
||||
}
|
||||
throw new Error(response.status + response.statusText);
|
||||
})
|
||||
.then((buffer) => {
|
||||
if (keyData.alg !== undefined) {
|
||||
return window.crypto.subtle
|
||||
.importKey("jwk", keyData, { name: algo, iv: iv }, false, ["decrypt"])
|
||||
.then((key) => {
|
||||
return window.crypto.subtle.decrypt(
|
||||
{ name: algo, iv: iv },
|
||||
key,
|
||||
buffer,
|
||||
);
|
||||
});
|
||||
}
|
||||
return Promise.resolve(buffer);
|
||||
})
|
||||
.then((decrypted) => {
|
||||
var blob = new Blob([decrypted], { type: mimeType }),
|
||||
url = window.URL.createObjectURL(blob);
|
||||
button.href = url;
|
||||
button.target = "_blank";
|
||||
button.type = mimeType;
|
||||
button.textContent = labelReady;
|
||||
if (hasFilename) {
|
||||
button.download = filename;
|
||||
if (extension !== false) {
|
||||
button.download = button.download + "." + extension;
|
||||
}
|
||||
}
|
||||
button.removeEventListener("click", onClick);
|
||||
button.click();
|
||||
})
|
||||
.catch((error) => {
|
||||
button.textContent = "";
|
||||
button.appendChild(
|
||||
document.createTextNode("error while handling decrypted file"),
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
window.addEventListener('load', function(e) {
|
||||
initializeButtons(e.target);
|
||||
window.addEventListener("load", function (e) {
|
||||
initializeButtons(e.target);
|
||||
});
|
||||
|
||||
export { initializeButtons, download };
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
require('./uploader.js');
|
||||
require('./downloader.js');
|
||||
require("./uploader.js");
|
||||
require("./downloader.js");
|
||||
|
||||
@@ -1,18 +1,22 @@
|
||||
import {CollectionEventPayload} from "../../../../../ChillMainBundle/Resources/public/module/collection";
|
||||
import {createApp} from "vue";
|
||||
import DropFileWidget from "../../vuejs/DropFileWidget/DropFileWidget.vue"
|
||||
import {StoredObject, StoredObjectCreated} from "../../types";
|
||||
import {_createI18n} from "../../../../../ChillMainBundle/Resources/public/vuejs/_js/i18n";
|
||||
import { CollectionEventPayload } from "../../../../../ChillMainBundle/Resources/public/module/collection";
|
||||
import { createApp } from "vue";
|
||||
import DropFileWidget from "../../vuejs/DropFileWidget/DropFileWidget.vue";
|
||||
import { StoredObject, StoredObjectCreated } from "../../types";
|
||||
import { _createI18n } from "../../../../../ChillMainBundle/Resources/public/vuejs/_js/i18n";
|
||||
const i18n = _createI18n({});
|
||||
|
||||
const startApp = (divElement: HTMLDivElement, collectionEntry: null|HTMLLIElement): void => {
|
||||
console.log('app started', divElement);
|
||||
const input_stored_object: HTMLInputElement|null = divElement.querySelector("input[data-stored-object]");
|
||||
const startApp = (
|
||||
divElement: HTMLDivElement,
|
||||
collectionEntry: null | HTMLLIElement,
|
||||
): void => {
|
||||
console.log("app started", divElement);
|
||||
const input_stored_object: HTMLInputElement | null =
|
||||
divElement.querySelector("input[data-stored-object]");
|
||||
if (null === input_stored_object) {
|
||||
throw new Error('input to stored object not found');
|
||||
throw new Error("input to stored object not found");
|
||||
}
|
||||
|
||||
let existingDoc: StoredObject|null = null;
|
||||
let existingDoc: StoredObject | null = null;
|
||||
if (input_stored_object.value !== "") {
|
||||
existingDoc = JSON.parse(input_stored_object.value);
|
||||
}
|
||||
@@ -20,67 +24,77 @@ const startApp = (divElement: HTMLDivElement, collectionEntry: null|HTMLLIElemen
|
||||
divElement.appendChild(app_container);
|
||||
|
||||
const app = createApp({
|
||||
template: '<drop-file-widget :existingDoc="this.$data.existingDoc" :allowRemove="true" @addDocument="this.addDocument" @removeDocument="removeDocument"></drop-file-widget>',
|
||||
template:
|
||||
'<drop-file-widget :existingDoc="this.$data.existingDoc" :allowRemove="true" @addDocument="this.addDocument" @removeDocument="removeDocument"></drop-file-widget>',
|
||||
data(vm) {
|
||||
return {
|
||||
existingDoc: existingDoc,
|
||||
}
|
||||
};
|
||||
},
|
||||
components: {
|
||||
DropFileWidget,
|
||||
},
|
||||
methods: {
|
||||
addDocument: function(object: StoredObjectCreated): void {
|
||||
console.log('object added', object);
|
||||
addDocument: function (object: StoredObjectCreated): void {
|
||||
console.log("object added", object);
|
||||
this.$data.existingDoc = object;
|
||||
input_stored_object.value = JSON.stringify(object);
|
||||
},
|
||||
removeDocument: function(object: StoredObject): void {
|
||||
console.log('catch remove document', object);
|
||||
removeDocument: function (object: StoredObject): void {
|
||||
console.log("catch remove document", object);
|
||||
input_stored_object.value = "";
|
||||
this.$data.existingDoc = null;
|
||||
console.log('collectionEntry', collectionEntry);
|
||||
console.log("collectionEntry", collectionEntry);
|
||||
|
||||
if (null !== collectionEntry) {
|
||||
console.log('will remove collection');
|
||||
console.log("will remove collection");
|
||||
collectionEntry.remove();
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
app.use(i18n).mount(app_container);
|
||||
}
|
||||
window.addEventListener('collection-add-entry', ((e: CustomEvent<CollectionEventPayload>) => {
|
||||
};
|
||||
window.addEventListener("collection-add-entry", ((
|
||||
e: CustomEvent<CollectionEventPayload>,
|
||||
) => {
|
||||
const detail = e.detail;
|
||||
const divElement: null|HTMLDivElement = detail.entry.querySelector('div[data-stored-object]');
|
||||
const divElement: null | HTMLDivElement = detail.entry.querySelector(
|
||||
"div[data-stored-object]",
|
||||
);
|
||||
|
||||
if (null === divElement) {
|
||||
throw new Error('div[data-stored-object] not found');
|
||||
throw new Error("div[data-stored-object] not found");
|
||||
}
|
||||
|
||||
startApp(divElement, detail.entry);
|
||||
}) as EventListener);
|
||||
|
||||
window.addEventListener('DOMContentLoaded', () => {
|
||||
const upload_inputs: NodeListOf<HTMLDivElement> = document.querySelectorAll('div[data-stored-object]');
|
||||
window.addEventListener("DOMContentLoaded", () => {
|
||||
const upload_inputs: NodeListOf<HTMLDivElement> = document.querySelectorAll(
|
||||
"div[data-stored-object]",
|
||||
);
|
||||
|
||||
upload_inputs.forEach((input: HTMLDivElement): void => {
|
||||
// test for a parent to check if this is a collection entry
|
||||
let collectionEntry: null|HTMLLIElement = null;
|
||||
let collectionEntry: null | HTMLLIElement = null;
|
||||
const parent = input.parentElement;
|
||||
console.log('parent', parent);
|
||||
console.log("parent", parent);
|
||||
if (null !== parent) {
|
||||
const grandParent = parent.parentElement;
|
||||
console.log('grandParent', grandParent);
|
||||
console.log("grandParent", grandParent);
|
||||
if (null !== grandParent) {
|
||||
if (grandParent.tagName.toLowerCase() === 'li' && grandParent.classList.contains('entry')) {
|
||||
if (
|
||||
grandParent.tagName.toLowerCase() === "li" &&
|
||||
grandParent.classList.contains("entry")
|
||||
) {
|
||||
collectionEntry = grandParent as HTMLLIElement;
|
||||
}
|
||||
}
|
||||
}
|
||||
startApp(input, collectionEntry);
|
||||
})
|
||||
});
|
||||
});
|
||||
|
||||
export {}
|
||||
export {};
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
var algo = 'AES-CBC';
|
||||
import Dropzone from 'dropzone';
|
||||
import { initializeButtons } from './downloader.js';
|
||||
|
||||
var algo = "AES-CBC";
|
||||
import Dropzone from "dropzone";
|
||||
import { initializeButtons } from "./downloader.js";
|
||||
|
||||
/**
|
||||
*
|
||||
@@ -23,351 +22,335 @@ import { initializeButtons } from './downloader.js';
|
||||
|
||||
// load css
|
||||
//require('dropzone/dist/basic.css');
|
||||
require('dropzone/dist/dropzone.css');
|
||||
require('./index.scss');
|
||||
require("dropzone/dist/dropzone.css");
|
||||
require("./index.scss");
|
||||
//
|
||||
|
||||
// disable dropzone autodiscover
|
||||
Dropzone.autoDiscover = false;
|
||||
|
||||
var keyDefinition = {
|
||||
name: algo,
|
||||
length: 256
|
||||
name: algo,
|
||||
length: 256,
|
||||
};
|
||||
|
||||
var searchForZones = function(root) {
|
||||
var zones = root.querySelectorAll('div[data-stored-object]');
|
||||
for(let i=0; i < zones.length; i++) {
|
||||
initialize(zones[i]);
|
||||
}
|
||||
var searchForZones = function (root) {
|
||||
var zones = root.querySelectorAll("div[data-stored-object]");
|
||||
for (let i = 0; i < zones.length; i++) {
|
||||
initialize(zones[i]);
|
||||
}
|
||||
};
|
||||
|
||||
var getUploadUrl = function(zoneData, files) {
|
||||
var
|
||||
generateTempUrlPost = zoneData.zone.querySelector('input[data-async-file-upload]').dataset.generateTempUrlPost,
|
||||
oReq = new XMLHttpRequest()
|
||||
;
|
||||
var getUploadUrl = function (zoneData, files) {
|
||||
var generateTempUrlPost = zoneData.zone.querySelector(
|
||||
"input[data-async-file-upload]",
|
||||
).dataset.generateTempUrlPost,
|
||||
oReq = new XMLHttpRequest();
|
||||
// arg, dropzone, you cannot handle async upload...
|
||||
oReq.open("GET", generateTempUrlPost, false);
|
||||
oReq.send();
|
||||
|
||||
// arg, dropzone, you cannot handle async upload...
|
||||
oReq.open("GET", generateTempUrlPost, false);
|
||||
oReq.send();
|
||||
if (oReq.readyState !== XMLHttpRequest.DONE) {
|
||||
throw new Error("Error while fetching url to upload");
|
||||
}
|
||||
|
||||
if (oReq.readyState !== XMLHttpRequest.DONE) {
|
||||
throw new Error("Error while fetching url to upload");
|
||||
}
|
||||
zoneData.params = JSON.parse(oReq.responseText);
|
||||
|
||||
zoneData.params = JSON.parse(oReq.responseText);
|
||||
|
||||
return zoneData.params.url;
|
||||
return zoneData.params.url;
|
||||
};
|
||||
|
||||
var encryptFile = function(originalFile, zoneData, done) {
|
||||
var
|
||||
iv = crypto.getRandomValues(new Uint8Array(16)),
|
||||
reader = new FileReader(),
|
||||
jsKey, rawKey
|
||||
;
|
||||
var encryptFile = function (originalFile, zoneData, done) {
|
||||
var iv = crypto.getRandomValues(new Uint8Array(16)),
|
||||
reader = new FileReader(),
|
||||
jsKey,
|
||||
rawKey;
|
||||
|
||||
zoneData.originalType = originalFile.type;
|
||||
zoneData.originalType = originalFile.type;
|
||||
|
||||
reader.onload = e => {
|
||||
window.crypto.subtle.generateKey(keyDefinition, true, [ "encrypt", "decrypt" ])
|
||||
.then(key => {
|
||||
jsKey = key;
|
||||
reader.onload = (e) => {
|
||||
window.crypto.subtle
|
||||
.generateKey(keyDefinition, true, ["encrypt", "decrypt"])
|
||||
.then((key) => {
|
||||
jsKey = key;
|
||||
|
||||
// we register the key somwhere
|
||||
return window.crypto.subtle.exportKey('jwk', key);
|
||||
}).then(exportedKey => {
|
||||
rawKey = exportedKey;
|
||||
// we register the key somwhere
|
||||
return window.crypto.subtle.exportKey("jwk", key);
|
||||
})
|
||||
.then((exportedKey) => {
|
||||
rawKey = exportedKey;
|
||||
|
||||
// we start encryption
|
||||
return window.crypto.subtle.encrypt({ name: algo, iv: iv}, jsKey, e.target.result);
|
||||
})
|
||||
.then(encrypted => {
|
||||
zoneData.crypto = {
|
||||
jsKey: jsKey,
|
||||
rawKey: rawKey,
|
||||
iv: iv
|
||||
};
|
||||
// we start encryption
|
||||
return window.crypto.subtle.encrypt(
|
||||
{ name: algo, iv: iv },
|
||||
jsKey,
|
||||
e.target.result,
|
||||
);
|
||||
})
|
||||
.then((encrypted) => {
|
||||
zoneData.crypto = {
|
||||
jsKey: jsKey,
|
||||
rawKey: rawKey,
|
||||
iv: iv,
|
||||
};
|
||||
|
||||
done(new File( [ encrypted ], zoneData.suffix));
|
||||
});
|
||||
};
|
||||
done(new File([encrypted], zoneData.suffix));
|
||||
});
|
||||
};
|
||||
|
||||
reader.readAsArrayBuffer(originalFile);
|
||||
reader.readAsArrayBuffer(originalFile);
|
||||
};
|
||||
|
||||
var addBelowButton = (btn, zone, zoneData) => {
|
||||
let
|
||||
belowZone = zone.querySelector('.chill-dropzone__below-zone');
|
||||
let belowZone = zone.querySelector(".chill-dropzone__below-zone");
|
||||
|
||||
if (belowZone === null) {
|
||||
belowZone = document.createElement('div');
|
||||
belowZone.classList.add('chill-dropzone__below-zone');
|
||||
zone.appendChild(belowZone);
|
||||
}
|
||||
if (belowZone === null) {
|
||||
belowZone = document.createElement("div");
|
||||
belowZone.classList.add("chill-dropzone__below-zone");
|
||||
zone.appendChild(belowZone);
|
||||
}
|
||||
|
||||
belowZone.appendChild(btn);
|
||||
belowZone.appendChild(btn);
|
||||
};
|
||||
|
||||
var createZone = (zone, zoneData) => {
|
||||
var
|
||||
created = document.createElement('div'),
|
||||
initMessage = document.createElement('div'),
|
||||
initContent = zone.dataset.labelInitMessage,
|
||||
dropzoneI;
|
||||
var created = document.createElement("div"),
|
||||
initMessage = document.createElement("div"),
|
||||
initContent = zone.dataset.labelInitMessage,
|
||||
dropzoneI;
|
||||
|
||||
created.classList.add('dropzone');
|
||||
initMessage.classList.add('dz-message');
|
||||
initMessage.appendChild(document.createTextNode(initContent));
|
||||
console.log(Dropzone);
|
||||
dropzoneI = new Dropzone(created, {
|
||||
url: function(files) {
|
||||
return getUploadUrl(zoneData, files);
|
||||
},
|
||||
dictDefaultMessage: zone.dataset.dictDefaultMessage,
|
||||
dictFileTooBig: zone.dataset.dictFileTooBig,
|
||||
dictRemoveFile: zone.dataset.dictRemoveFile,
|
||||
dictMaxFilesExceeded: zone.dataset.dictMaxFilesExceeded,
|
||||
dictCancelUpload: zone.dataset.dictCancelUpload,
|
||||
dictCancelUploadConfirm: zone.dataset.dictCancelUploadConfirm,
|
||||
dictUploadCanceled: zone.dataset.dictUploadCanceled,
|
||||
maxFiles: 1,
|
||||
addRemoveLinks: true,
|
||||
transformFile: function(file, done) {
|
||||
encryptFile(file, zoneData, done);
|
||||
},
|
||||
renameFile: function(file) {
|
||||
return zoneData.suffix;
|
||||
}
|
||||
});
|
||||
created.classList.add("dropzone");
|
||||
initMessage.classList.add("dz-message");
|
||||
initMessage.appendChild(document.createTextNode(initContent));
|
||||
console.log(Dropzone);
|
||||
dropzoneI = new Dropzone(created, {
|
||||
url: function (files) {
|
||||
return getUploadUrl(zoneData, files);
|
||||
},
|
||||
dictDefaultMessage: zone.dataset.dictDefaultMessage,
|
||||
dictFileTooBig: zone.dataset.dictFileTooBig,
|
||||
dictRemoveFile: zone.dataset.dictRemoveFile,
|
||||
dictMaxFilesExceeded: zone.dataset.dictMaxFilesExceeded,
|
||||
dictCancelUpload: zone.dataset.dictCancelUpload,
|
||||
dictCancelUploadConfirm: zone.dataset.dictCancelUploadConfirm,
|
||||
dictUploadCanceled: zone.dataset.dictUploadCanceled,
|
||||
maxFiles: 1,
|
||||
addRemoveLinks: true,
|
||||
transformFile: function (file, done) {
|
||||
encryptFile(file, zoneData, done);
|
||||
},
|
||||
renameFile: function (file) {
|
||||
return zoneData.suffix;
|
||||
},
|
||||
});
|
||||
|
||||
dropzoneI.on("sending", function(file, xhr, formData) {
|
||||
formData.append("redirect", zoneData.params.redirect);
|
||||
formData.append("max_file_size", zoneData.params.max_file_size);
|
||||
formData.append("max_file_count", zoneData.params.max_file_count);
|
||||
formData.append("expires", zoneData.params.expires);
|
||||
formData.append("signature", zoneData.params.signature);
|
||||
});
|
||||
dropzoneI.on("sending", function (file, xhr, formData) {
|
||||
formData.append("redirect", zoneData.params.redirect);
|
||||
formData.append("max_file_size", zoneData.params.max_file_size);
|
||||
formData.append("max_file_count", zoneData.params.max_file_count);
|
||||
formData.append("expires", zoneData.params.expires);
|
||||
formData.append("signature", zoneData.params.signature);
|
||||
});
|
||||
|
||||
dropzoneI.on("success", function(file, response) {
|
||||
zoneData.currentFile = file;
|
||||
storeDataInForm(zone, zoneData);
|
||||
});
|
||||
dropzoneI.on("success", function (file, response) {
|
||||
zoneData.currentFile = file;
|
||||
storeDataInForm(zone, zoneData);
|
||||
});
|
||||
|
||||
dropzoneI.on("addedfile", function(file) {
|
||||
if (zoneData.hasOwnProperty('currentFile')) {
|
||||
dropzoneI.removeFile(zoneData.currentFile);
|
||||
}
|
||||
});
|
||||
dropzoneI.on("addedfile", function (file) {
|
||||
if (zoneData.hasOwnProperty("currentFile")) {
|
||||
dropzoneI.removeFile(zoneData.currentFile);
|
||||
}
|
||||
});
|
||||
|
||||
dropzoneI.on("removedfile", function(file) {
|
||||
removeDataInForm(zone, zoneData);
|
||||
});
|
||||
dropzoneI.on("removedfile", function (file) {
|
||||
removeDataInForm(zone, zoneData);
|
||||
});
|
||||
|
||||
zone.insertBefore(created, zone.firstChild);
|
||||
zone.insertBefore(created, zone.firstChild);
|
||||
|
||||
let event = new CustomEvent("chill_dropzone_initialized", {
|
||||
detail: {
|
||||
dropzone: dropzoneI,
|
||||
zoneData: zoneData
|
||||
}
|
||||
});
|
||||
window.dispatchEvent(event);
|
||||
let event = new CustomEvent("chill_dropzone_initialized", {
|
||||
detail: {
|
||||
dropzone: dropzoneI,
|
||||
zoneData: zoneData,
|
||||
},
|
||||
});
|
||||
window.dispatchEvent(event);
|
||||
};
|
||||
|
||||
|
||||
var initialize = function(zone) {
|
||||
var
|
||||
allowRemove = zone.dataset.allowRemove,
|
||||
zoneData = { zone: zone, suffix: createFilename(), allowRemove: allowRemove, old: null }
|
||||
;
|
||||
|
||||
if (hasDataInForm(zone, zoneData)) {
|
||||
insertRemoveButton(zone, zoneData);
|
||||
insertDownloadButton(zone, zoneData);
|
||||
} else {
|
||||
createZone(zone, zoneData);
|
||||
}
|
||||
var initialize = function (zone) {
|
||||
var allowRemove = zone.dataset.allowRemove,
|
||||
zoneData = {
|
||||
zone: zone,
|
||||
suffix: createFilename(),
|
||||
allowRemove: allowRemove,
|
||||
old: null,
|
||||
};
|
||||
if (hasDataInForm(zone, zoneData)) {
|
||||
insertRemoveButton(zone, zoneData);
|
||||
insertDownloadButton(zone, zoneData);
|
||||
} else {
|
||||
createZone(zone, zoneData);
|
||||
}
|
||||
};
|
||||
|
||||
var createFilename = () => {
|
||||
var text = "";
|
||||
var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
|
||||
var text = "";
|
||||
var possible =
|
||||
"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
|
||||
|
||||
for (let i = 0; i < 7; i++) {
|
||||
text += possible.charAt(Math.floor(Math.random() * possible.length));
|
||||
}
|
||||
for (let i = 0; i < 7; i++) {
|
||||
text += possible.charAt(Math.floor(Math.random() * possible.length));
|
||||
}
|
||||
|
||||
return text;
|
||||
return text;
|
||||
};
|
||||
|
||||
var storeDataInForm = (zone, zoneData) => {
|
||||
var
|
||||
inputKey = zone.querySelector('input[data-stored-object-key]'),
|
||||
inputIv = zone.querySelector('input[data-stored-object-iv]'),
|
||||
inputObject = zone.querySelector('input[data-async-file-upload]'),
|
||||
inputType = zone.querySelector('input[data-async-file-type]')
|
||||
;
|
||||
var inputKey = zone.querySelector("input[data-stored-object-key]"),
|
||||
inputIv = zone.querySelector("input[data-stored-object-iv]"),
|
||||
inputObject = zone.querySelector("input[data-async-file-upload]"),
|
||||
inputType = zone.querySelector("input[data-async-file-type]");
|
||||
inputKey.value = JSON.stringify(zoneData.crypto.rawKey);
|
||||
inputIv.value = JSON.stringify(Array.from(zoneData.crypto.iv));
|
||||
inputType.value = zoneData.originalType;
|
||||
inputObject.value = zoneData.params.prefix + zoneData.suffix;
|
||||
|
||||
inputKey.value = JSON.stringify(zoneData.crypto.rawKey);
|
||||
inputIv.value = JSON.stringify(Array.from(zoneData.crypto.iv));
|
||||
inputType.value = zoneData.originalType;
|
||||
inputObject.value = zoneData.params.prefix + zoneData.suffix;
|
||||
|
||||
insertDownloadButton(zone);
|
||||
insertDownloadButton(zone);
|
||||
};
|
||||
|
||||
const restoreDataInForm = (zone, zoneData) => {
|
||||
var
|
||||
inputKey = zone.querySelector('input[data-stored-object-key]'),
|
||||
inputIv = zone.querySelector('input[data-stored-object-iv]'),
|
||||
inputObject = zone.querySelector('input[data-async-file-upload]'),
|
||||
inputType = zone.querySelector('input[data-async-file-type]')
|
||||
;
|
||||
var inputKey = zone.querySelector("input[data-stored-object-key]"),
|
||||
inputIv = zone.querySelector("input[data-stored-object-iv]"),
|
||||
inputObject = zone.querySelector("input[data-async-file-upload]"),
|
||||
inputType = zone.querySelector("input[data-async-file-type]");
|
||||
if (zoneData.old === null) {
|
||||
console.log("should not have restored data");
|
||||
return;
|
||||
}
|
||||
|
||||
if (zoneData.old === null) {
|
||||
console.log('should not have restored data');
|
||||
return;
|
||||
}
|
||||
inputKey.value = zoneData.old.key;
|
||||
inputIv.value = zoneData.old.iv;
|
||||
inputType.value = zoneData.old.type;
|
||||
inputObject.value = zoneData.old.obj;
|
||||
|
||||
inputKey.value = zoneData.old.key;
|
||||
inputIv.value = zoneData.old.iv;
|
||||
inputType.value = zoneData.old.type;
|
||||
inputObject.value = zoneData.old.obj;
|
||||
|
||||
insertDownloadButton(zone);
|
||||
insertDownloadButton(zone);
|
||||
};
|
||||
|
||||
const hasDataInForm = (zone, zoneData) => {
|
||||
var
|
||||
inputObject = zone.querySelector('input[data-async-file-upload]')
|
||||
;
|
||||
|
||||
return inputObject.value.length > 0;
|
||||
var inputObject = zone.querySelector("input[data-async-file-upload]");
|
||||
return inputObject.value.length > 0;
|
||||
};
|
||||
|
||||
var removeDataInForm = (zone, zoneData) => {
|
||||
var
|
||||
inputKey = zone.querySelector('input[data-stored-object-key]'),
|
||||
inputIv = zone.querySelector('input[data-stored-object-iv]'),
|
||||
inputObject = zone.querySelector('input[data-async-file-upload]'),
|
||||
inputType = zone.querySelector('input[data-async-file-type]')
|
||||
;
|
||||
var inputKey = zone.querySelector("input[data-stored-object-key]"),
|
||||
inputIv = zone.querySelector("input[data-stored-object-iv]"),
|
||||
inputObject = zone.querySelector("input[data-async-file-upload]"),
|
||||
inputType = zone.querySelector("input[data-async-file-type]");
|
||||
// store data for future usage
|
||||
zoneData.old = {
|
||||
key: inputKey.value,
|
||||
iv: inputIv.value,
|
||||
obj: inputObject.value,
|
||||
type: inputType.value,
|
||||
};
|
||||
// set blank values
|
||||
inputKey.value = "";
|
||||
inputIv.value = "";
|
||||
inputType.value = "";
|
||||
inputObject.value = "";
|
||||
|
||||
// store data for future usage
|
||||
zoneData.old = {
|
||||
key: inputKey.value,
|
||||
iv: inputIv.value,
|
||||
obj: inputObject.value,
|
||||
type: inputType.value
|
||||
};
|
||||
// set blank values
|
||||
inputKey.value = "";
|
||||
inputIv.value = "";
|
||||
inputType.value = "";
|
||||
inputObject.value = "";
|
||||
|
||||
insertDownloadButton(zone);
|
||||
insertDownloadButton(zone);
|
||||
};
|
||||
|
||||
var insertRemoveButton = (zone, zoneData) => {
|
||||
var
|
||||
removeButton = document.createElement('a'),
|
||||
cancelButton = document.createElement('a'),
|
||||
labelRemove = zone.dataset.dictRemove,
|
||||
labelCancel = 'Restaurer'
|
||||
;
|
||||
var removeButton = document.createElement("a"),
|
||||
cancelButton = document.createElement("a"),
|
||||
labelRemove = zone.dataset.dictRemove,
|
||||
labelCancel = "Restaurer";
|
||||
removeButton.classList.add("btn", "btn-delete");
|
||||
removeButton.textContent = labelRemove;
|
||||
|
||||
removeButton.classList.add('btn', 'btn-delete');
|
||||
removeButton.textContent = labelRemove;
|
||||
cancelButton.classList.add("btn", "btn-cancel");
|
||||
cancelButton.textContent = labelCancel;
|
||||
|
||||
cancelButton.classList.add('btn', 'btn-cancel');
|
||||
cancelButton.textContent = labelCancel;
|
||||
|
||||
removeButton.addEventListener('click', (e) => {
|
||||
removeButton.addEventListener("click", (e) => {
|
||||
e.preventDefault();
|
||||
if (zoneData.allowRemove === "true") {
|
||||
removeDataInForm(zone, zoneData);
|
||||
cancelButton.addEventListener("click", (e) => {
|
||||
e.preventDefault();
|
||||
if (zoneData.allowRemove === 'true') {
|
||||
removeDataInForm(zone, zoneData);
|
||||
cancelButton.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
restoreDataInForm(zone, zoneData);
|
||||
restoreDataInForm(zone, zoneData);
|
||||
|
||||
cancelButton.remove();
|
||||
zone.querySelector('.dropzone').remove();
|
||||
cancelButton.remove();
|
||||
zone.querySelector(".dropzone").remove();
|
||||
|
||||
initialize(zone);
|
||||
});
|
||||
}
|
||||
addBelowButton(cancelButton, zone, zoneData);
|
||||
//zone.appendChild(cancelButton);
|
||||
removeButton.remove();
|
||||
createZone(zone, zoneData);
|
||||
});
|
||||
initialize(zone);
|
||||
});
|
||||
}
|
||||
addBelowButton(cancelButton, zone, zoneData);
|
||||
//zone.appendChild(cancelButton);
|
||||
removeButton.remove();
|
||||
createZone(zone, zoneData);
|
||||
});
|
||||
|
||||
addBelowButton(removeButton, zone, zoneData);
|
||||
// zone.appendChild(removeButton);
|
||||
addBelowButton(removeButton, zone, zoneData);
|
||||
// zone.appendChild(removeButton);
|
||||
};
|
||||
|
||||
const removeDownloadButton = (zone, zoneData) => {
|
||||
var
|
||||
existingButtons = zone.querySelectorAll('a[data-download-button]')
|
||||
;
|
||||
|
||||
// remove existing
|
||||
existingButtons.forEach(function(b) {
|
||||
b.remove();
|
||||
});
|
||||
var existingButtons = zone.querySelectorAll("a[data-download-button]");
|
||||
// remove existing
|
||||
existingButtons.forEach(function (b) {
|
||||
b.remove();
|
||||
});
|
||||
};
|
||||
|
||||
var insertDownloadButton = (zone, zoneData) => {
|
||||
var
|
||||
existingButtons = zone.querySelectorAll('a[data-download-button]'),
|
||||
newButton = document.createElement('a'),
|
||||
inputKey = zone.querySelector('input[data-stored-object-key]'),
|
||||
inputIv = zone.querySelector('input[data-stored-object-iv]'),
|
||||
inputObject = zone.querySelector('input[data-async-file-upload]'),
|
||||
inputType = zone.querySelector('input[data-async-file-type]'),
|
||||
labelPreparing = zone.dataset.labelPreparing,
|
||||
labelQuietButton = zone.dataset.labelQuietButton,
|
||||
labelReady = zone.dataset.labelReady,
|
||||
tempUrlGenerator = zone.dataset.tempUrlGenerator,
|
||||
tempUrlGeneratorParams = new URLSearchParams()
|
||||
;
|
||||
var existingButtons = zone.querySelectorAll("a[data-download-button]"),
|
||||
newButton = document.createElement("a"),
|
||||
inputKey = zone.querySelector("input[data-stored-object-key]"),
|
||||
inputIv = zone.querySelector("input[data-stored-object-iv]"),
|
||||
inputObject = zone.querySelector("input[data-async-file-upload]"),
|
||||
inputType = zone.querySelector("input[data-async-file-type]"),
|
||||
labelPreparing = zone.dataset.labelPreparing,
|
||||
labelQuietButton = zone.dataset.labelQuietButton,
|
||||
labelReady = zone.dataset.labelReady,
|
||||
tempUrlGenerator = zone.dataset.tempUrlGenerator,
|
||||
tempUrlGeneratorParams = new URLSearchParams();
|
||||
// remove existing
|
||||
existingButtons.forEach(function (b) {
|
||||
b.remove();
|
||||
});
|
||||
|
||||
// remove existing
|
||||
existingButtons.forEach(function(b) {
|
||||
b.remove();
|
||||
});
|
||||
if (inputObject.value === "") {
|
||||
return;
|
||||
}
|
||||
|
||||
if (inputObject.value === '') {
|
||||
return;
|
||||
}
|
||||
tempUrlGeneratorParams.append("object_name", inputObject.value);
|
||||
|
||||
tempUrlGeneratorParams.append('object_name', inputObject.value);
|
||||
newButton.dataset.downloadButton = true;
|
||||
newButton.dataset.key = inputKey.value;
|
||||
newButton.dataset.iv = inputIv.value;
|
||||
newButton.dataset.mimeType = inputType.value;
|
||||
newButton.dataset.labelPreparing = labelPreparing;
|
||||
newButton.dataset.labelReady = labelReady;
|
||||
newButton.dataset.tempUrlGetGenerator =
|
||||
tempUrlGenerator + "?" + tempUrlGeneratorParams.toString();
|
||||
newButton.classList.add("btn", "btn-download", "dz-bt-below-dropzone");
|
||||
newButton.textContent = labelQuietButton;
|
||||
|
||||
newButton.dataset.downloadButton = true;
|
||||
newButton.dataset.key = inputKey.value;
|
||||
newButton.dataset.iv = inputIv.value;
|
||||
newButton.dataset.mimeType = inputType.value;
|
||||
newButton.dataset.labelPreparing = labelPreparing;
|
||||
newButton.dataset.labelReady = labelReady;
|
||||
newButton.dataset.tempUrlGetGenerator = tempUrlGenerator + '?' + tempUrlGeneratorParams.toString();
|
||||
newButton.classList.add('btn', 'btn-download', 'dz-bt-below-dropzone');
|
||||
newButton.textContent = labelQuietButton;
|
||||
|
||||
addBelowButton(newButton, zone, zoneData);
|
||||
//zone.appendChild(newButton);
|
||||
initializeButtons(zone);
|
||||
addBelowButton(newButton, zone, zoneData);
|
||||
//zone.appendChild(newButton);
|
||||
initializeButtons(zone);
|
||||
};
|
||||
|
||||
window.addEventListener('load', function(e) {
|
||||
searchForZones(document);
|
||||
window.addEventListener("load", function (e) {
|
||||
searchForZones(document);
|
||||
});
|
||||
|
||||
window.addEventListener('collection-add-entry', function(e) {
|
||||
searchForZones(e.detail.entry);
|
||||
window.addEventListener("collection-add-entry", function (e) {
|
||||
searchForZones(e.detail.entry);
|
||||
});
|
||||
|
||||
export { searchForZones };
|
||||
|
||||
@@ -1,53 +1,72 @@
|
||||
import {_createI18n} from "../../../../../ChillMainBundle/Resources/public/vuejs/_js/i18n";
|
||||
import { _createI18n } from "../../../../../ChillMainBundle/Resources/public/vuejs/_js/i18n";
|
||||
import DocumentActionButtonsGroup from "../../vuejs/DocumentActionButtonsGroup.vue";
|
||||
import {createApp} from "vue";
|
||||
import {StoredObject, StoredObjectStatusChange} from "../../types";
|
||||
import {is_object_ready} from "../../vuejs/StoredObjectButton/helpers";
|
||||
import { createApp } from "vue";
|
||||
import { StoredObject, StoredObjectStatusChange } from "../../types";
|
||||
import { is_object_ready } from "../../vuejs/StoredObjectButton/helpers";
|
||||
|
||||
const i18n = _createI18n({});
|
||||
|
||||
window.addEventListener('DOMContentLoaded', function (e) {
|
||||
document.querySelectorAll<HTMLDivElement>('div[data-download-buttons]').forEach((el) => {
|
||||
const app = createApp({
|
||||
components: {DocumentActionButtonsGroup},
|
||||
data() {
|
||||
window.addEventListener("DOMContentLoaded", function (e) {
|
||||
document
|
||||
.querySelectorAll<HTMLDivElement>("div[data-download-buttons]")
|
||||
.forEach((el) => {
|
||||
const app = createApp({
|
||||
components: { DocumentActionButtonsGroup },
|
||||
data() {
|
||||
const datasets = el.dataset as {
|
||||
filename: string;
|
||||
canEdit: string;
|
||||
storedObject: string;
|
||||
buttonSmall: string;
|
||||
davLink: string;
|
||||
davLinkExpiration: string;
|
||||
};
|
||||
|
||||
const datasets = el.dataset as {
|
||||
filename: string,
|
||||
canEdit: string,
|
||||
storedObject: string,
|
||||
buttonSmall: string,
|
||||
davLink: string,
|
||||
davLinkExpiration: string,
|
||||
};
|
||||
const storedObject = JSON.parse(
|
||||
datasets.storedObject,
|
||||
) as StoredObject,
|
||||
filename = datasets.filename,
|
||||
canEdit = datasets.canEdit === "1",
|
||||
small = datasets.buttonSmall === "1",
|
||||
davLink =
|
||||
"davLink" in datasets && datasets.davLink !== ""
|
||||
? datasets.davLink
|
||||
: null,
|
||||
davLinkExpiration =
|
||||
"davLinkExpiration" in datasets
|
||||
? Number.parseInt(datasets.davLinkExpiration)
|
||||
: null;
|
||||
return {
|
||||
storedObject,
|
||||
filename,
|
||||
canEdit,
|
||||
small,
|
||||
davLink,
|
||||
davLinkExpiration,
|
||||
};
|
||||
},
|
||||
template:
|
||||
'<document-action-buttons-group :can-edit="canEdit" :filename="filename" :stored-object="storedObject" :small="small" :dav-link="davLink" :dav-link-expiration="davLinkExpiration" @on-stored-object-status-change="onStoredObjectStatusChange"></document-action-buttons-group>',
|
||||
methods: {
|
||||
onStoredObjectStatusChange: function (
|
||||
newStatus: StoredObjectStatusChange,
|
||||
): void {
|
||||
this.$data.storedObject.status = newStatus.status;
|
||||
this.$data.storedObject.filename = newStatus.filename;
|
||||
this.$data.storedObject.type = newStatus.type;
|
||||
|
||||
const
|
||||
storedObject = JSON.parse(datasets.storedObject) as StoredObject,
|
||||
filename = datasets.filename,
|
||||
canEdit = datasets.canEdit === '1',
|
||||
small = datasets.buttonSmall === '1',
|
||||
davLink = 'davLink' in datasets && datasets.davLink !== '' ? datasets.davLink : null,
|
||||
davLinkExpiration = 'davLinkExpiration' in datasets ? Number.parseInt(datasets.davLinkExpiration) : null
|
||||
;
|
||||
// remove eventual div which inform pending status
|
||||
document
|
||||
.querySelectorAll(
|
||||
`[data-docgen-is-pending="${this.$data.storedObject.id}"]`,
|
||||
)
|
||||
.forEach(function (el) {
|
||||
el.remove();
|
||||
});
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
return { storedObject, filename, canEdit, small, davLink, davLinkExpiration };
|
||||
},
|
||||
template: '<document-action-buttons-group :can-edit="canEdit" :filename="filename" :stored-object="storedObject" :small="small" :dav-link="davLink" :dav-link-expiration="davLinkExpiration" @on-stored-object-status-change="onStoredObjectStatusChange"></document-action-buttons-group>',
|
||||
methods: {
|
||||
onStoredObjectStatusChange: function(newStatus: StoredObjectStatusChange): void {
|
||||
this.$data.storedObject.status = newStatus.status;
|
||||
this.$data.storedObject.filename = newStatus.filename;
|
||||
this.$data.storedObject.type = newStatus.type;
|
||||
|
||||
// remove eventual div which inform pending status
|
||||
document.querySelectorAll(`[data-docgen-is-pending="${this.$data.storedObject.id}"]`)
|
||||
.forEach(function(el) {
|
||||
el.remove();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
app.use(i18n).mount(el);
|
||||
})
|
||||
app.use(i18n).mount(el);
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user