Browse Source

publish muk_web_utils - 12.0

pull/48/head
MuK IT GmbH 5 years ago
parent
commit
54bba16331
  1. 2
      muk_web_utils/__manifest__.py
  2. 35
      muk_web_utils/static/src/js/core/dropzone.js
  3. 23
      muk_web_utils/static/src/js/libs/jquery.js
  4. 4
      muk_web_utils/static/src/scss/dropzone.scss

2
muk_web_utils/__manifest__.py

@ -20,7 +20,7 @@
{
"name": "MuK Web Utils",
"summary": """Utility Features""",
"version": "12.0.2.8.4",
"version": "12.0.2.8.5",
"category": "Extra Tools",
"license": "AGPL-3",
"author": "MuK IT",

35
muk_web_utils/static/src/js/core/dropzone.js

@ -27,28 +27,39 @@ var QWeb = core.qweb;
var DropzoneMixin = {
dropzoneData: {},
dropzoneClasses: 'mk_dropzone',
dropzoneEvents: {
'dragenter .mk_dropzone': '_dragenterDropzone',
'dragover .mk_dropzone': '_dragoverDropzone',
'dragleave .mk_dropzone': '_dragleaveDropzone',
'drop .mk_dropzone': '_dropDropzone',
},
dropzoneClasses: ['mk_dropzone'],
_checkDropzoneEvent: function(event) {
return true;
},
_renderDropzone: function($dropzone) {
_startDropzone: function($dropzone) {
if(this.$dropzone) {
this._destroyDropzone();
}
this.$dropzone = $dropzone;
this.$dropzone.dndHover().on({
'dndHoverStart': this._hoverDropzoneEnter.bind(this),
'dndHoverEnd': this._hoverDropzoneLeave.bind(this),
'dndHoverStart.dropzone': this._hoverDropzoneEnter.bind(this),
'dndHoverEnd.dropzone': this._hoverDropzoneLeave.bind(this),
});
this.$dropzone.on('dragenter.dropzone', this._dragenterDropzone.bind(this));
this.$dropzone.on('dragover.dropzone', this._dragoverDropzone.bind(this));
this.$dropzone.on('dragleave.dropzone', this._dragleaveDropzone.bind(this));
this.$dropzone.on('drop.dropzone', this._dropDropzone.bind(this));
_.each(this.dropzoneData, function(value, key) {
this.$dropzone.attr(key, value)
}, this);
},
_destroyDropzone: function() {
if(this.$dropzone) {
this.$dropzone.off('.dropzone');
this.$dropzone.dndHover('destroy');
_.each(this.dropzoneData, function(value, key) {
this.$dropzone.removeAttr(key)
}, this);
this.$dropzone = false;
}
},
_toggleDropzone: function(state) {
this.$dropzone.toggleClass(this.dropzoneClasses, state);
this.$dropzone.toggleClass(this.dropzoneClasses.join(" "), state);
},
_hoverDropzoneEnter: function(event, originalEvent) {
if(this._checkDropzoneEvent(originalEvent)) {
@ -96,7 +107,7 @@ var FileDropzoneMixin = _.extend({}, DropzoneMixin, {
dropzoneData: {
'data-dropzone-text': _t("Drop files here to upload!"),
},
dropzoneClasses: DropzoneMixin.dropzoneClasses + ' mk_dropzone_file',
dropzoneClasses: DropzoneMixin.dropzoneClasses.concat(['mk_dropzone_file']),
dropzoneCheck: window.File && window.FileReader && window.FileList && window.Blob,
_checkDropzoneEvent: function(event) {
var dataTransfer = event.originalEvent && event.originalEvent.dataTransfer;

23
muk_web_utils/static/src/js/libs/jquery.js

@ -24,28 +24,37 @@ $.fn.textWidth = function(text, font) {
};
$.fn.dndHover = function(options) {
return this.each(function() {
return this.each(function() {
var self = $(this);
var collection = $();
self.on('dragenter', function(event) {
var dragenter = function(event) {
if (collection.size() === 0) {
self.trigger('dndHoverStart', [event]);
}
collection = collection.add(event.target);
});
self.on('dragleave', function(event) {
};
var dragleave = function(event) {
setTimeout(function() {
collection = collection.not(event.target);
if (collection.size() === 0) {
self.trigger('dndHoverEnd', [event]);
}
}, 1);
});
self.on('drop', function(event) {
};
var drop = function(event) {
setTimeout(function() {
collection = $();
self.trigger('dndHoverEnd', [event]);
}, 1);
});
};
if(options && options === 'destroy') {
self.off('dragenter.dnd_hover');
self.off('dragleave.dnd_hover');
self.off('drop.dnd_hover');
} else {
self.on('dragenter.dnd_hover', dragenter);
self.on('dragleave.dnd_hover', dragleave);
self.on('drop.dnd_hover', drop);
}
});
};

4
muk_web_utils/static/src/scss/dropzone.scss

@ -27,10 +27,10 @@
align-items: center;
justify-content: center;
width: #{"calc(100% - 20px)"};
height: #{"calc(100% - 10px)"};
height: #{"calc(100% - 20px)"};
border: 2px dashed gray('700');
@include gradient-y($white, gray('100'));
@include o-position-absolute(0, 0, 0, 10px);
@include o-position-absolute(10px, 0, 0, 10px);
}
&:after {
display:flex;

Loading…
Cancel
Save