79 lines
2.4 KiB
JavaScript
79 lines
2.4 KiB
JavaScript
/* -*- Mode: javascript; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
|
|
|
|
(function() {
|
|
/* jshint validthis: true */
|
|
'use strict';
|
|
|
|
/*
|
|
* sgDroppable - Make an element a possible destination while dragging
|
|
* @memberof SOGo.Common
|
|
* @restrict attribute
|
|
* @param {expression} sgDroppable - dropping is accepted only if this expression returs true.
|
|
* One variables is exposed: dragFolder.
|
|
* @param {expression} sgDrop - called when dropping ends on the element.
|
|
* Two variables are exposed: dragFolder and dragMode.
|
|
*
|
|
* @example:
|
|
|
|
<md-list-item sg-droppable="folder.id != dragFolder.id"
|
|
sg-drop="app.dragSelectedMessages(dragFolder, folder, dragMode)">
|
|
*/
|
|
sgDroppable.$inject = ['$parse', '$rootScope', '$document', '$timeout', '$log'];
|
|
function sgDroppable($parse, $rootScope, $document, $timeout, $log) {
|
|
return {
|
|
restrict: 'A',
|
|
link: link
|
|
};
|
|
|
|
function link(scope, element, attrs) {
|
|
var overElement = false, dropAction, droppable,
|
|
deregisterFolderDragStart, deregisterFolderDragEnd;
|
|
|
|
if (!attrs.sgDrop) {
|
|
throw Error('sg-droppable requires a sg-drop action.');
|
|
}
|
|
|
|
overElement = false;
|
|
droppable = $parse(attrs.sgDroppable);
|
|
dropAction = $parse(attrs.sgDrop);
|
|
|
|
// Register listeners of custom events on root scope
|
|
deregisterFolderDragStart = $rootScope.$on('folder:dragstart', function(event, folder) {
|
|
if (droppable(scope, { dragFolder: folder })) {
|
|
element.on('mouseenter', onEnter);
|
|
element.on('mouseleave', onLeave);
|
|
}
|
|
});
|
|
deregisterFolderDragEnd = $rootScope.$on('folder:dragend', function(event, folder, mode) {
|
|
element.off('mouseenter');
|
|
element.off('mouseleave');
|
|
if (overElement) {
|
|
angular.bind(element[0], onLeave)(event);
|
|
dropAction(scope, { dragFolder: folder, dragMode: mode });
|
|
}
|
|
});
|
|
|
|
scope.$on('destroy', function() {
|
|
deregisterFolderDragStart();
|
|
deregisterFolderDragEnd();
|
|
});
|
|
|
|
function onEnter(event) {
|
|
overElement = true;
|
|
element.addClass('sg-droppable-over');
|
|
}
|
|
|
|
function onLeave(event) {
|
|
overElement = false;
|
|
this.classList.remove('sg-droppable-over');
|
|
element.off('mousemove');
|
|
}
|
|
}
|
|
}
|
|
|
|
angular
|
|
.module('SOGo.Common')
|
|
.directive('sgDroppable', sgDroppable);
|
|
})();
|
|
|