Mirrors/BookStack
1
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2024-10-30 07:32:39 +01:00
Code Issues Releases Wiki Activity

Removed jquery from dropzone

Browse Source 
Also added fadeout to custom animation lib
This commit is contained in:
Dan Brown 2019-07-06 15:08:26 +01:00
parent 15c39c1976
commit f7f7cd464c
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
2 changed files with 19 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
resources/assets/js/services/animations.js
View File

@ -1,3 +1,18 @@
/**
* Fade out the given element.
* @param {Element} element
* @param {Number} animTime
* @param {Function|null} onComplete
*/
export function fadeOut(element, animTime = 400, onComplete = null) {
animateStyles(element, {
opacity: ['1', '0']
}, animTime, () => {
element.style.display = 'none';
if (onComplete) onComplete();
});
}
/**
* Hide the element by sliding the contents upwards.
* @param {Element} element

7
resources/assets/js/vues/components/dropzone.js
View File

@ -1,4 +1,5 @@
import DropZone from "dropzone";
import { fadeOut } from "../../services/animations";
const template = `
<div class="dropzone-container">
@ -8,7 +9,6 @@ const template = `
const props = ['placeholder', 'uploadUrl', 'uploadedTo'];
// TODO - Remove jQuery usage
function mounted() {
const container = this.$el;
const _this = this;
@ -37,7 +37,7 @@ function mounted() {
dz.on('success', function (file, data) {
_this.$emit('success', {file, data});
$(file.previewElement).fadeOut(400, function () {
fadeOut(file.previewElement, 800, () => {
dz.removeFile(file);
});
});
@ -46,7 +46,8 @@ function mounted() {
_this.$emit('error', {file, errorMessage, xhr});
function setMessage(message) {
$(file.previewElement).find('[data-dz-errormessage]').text(message);
const messsageEl = file.previewElement.querySelector('[data-dz-errormessage]');
messsageEl.textContent = message;
}
if (xhr && xhr.status === 413) {