salix/front/core/directives/droppable.js

44 lines
1.2 KiB
JavaScript
Raw Permalink Normal View History

import ngModule from '../module';
import './droppable.scss';
2019-10-16 06:56:13 +00:00
class Controller {
constructor($element, $, $attrs) {
this.element = $element[0];
this.$ = $;
this.$attrs = $attrs;
this.element.addEventListener('dragover',
event => event.preventDefault()); // Prevents page reload
this.element.addEventListener('drop',
event => this.drop(event));
this.element.addEventListener('dragenter',
event => this.dragEnter(event));
this.element.addEventListener('dragleave',
event => this.dragLeave(event));
}
dragEnter(event) {
this.droppedElement = event.target;
this.element.classList.add('dropping');
}
dragLeave(event) {
if (this.droppedElement === event.target)
this.element.classList.remove('dropping');
}
drop(event) {
if (event.defaultPrevented) return;
event.preventDefault();
this.element.classList.remove('dropping');
this.$.$eval(this.$attrs.vnDroppable, {$event: event});
}
}
2019-10-16 06:56:13 +00:00
Controller.$inject = ['$element', '$scope', '$attrs'];
2019-10-16 06:56:13 +00:00
ngModule.directive('vnDroppable', () => {
return {
controller: Controller
};
});