angular.module('fasit')
    .directive('fbDroppable', [function () {

        var link = function (
            scope: fb.IFbDroppableScope,
            element: ng.IRootElementService,
            attrs: ng.IAttributes
            ) {

            var el = element[0];

            scope.dragoverHandler = function (e) {
                var rect = el.getBoundingClientRect();

                if ((e.clientX - rect.left - (element.width() / 2)) < 0) {
                    element.removeClass('right-drop');
                    element.addClass('left-drop');
                } else {
                    element.removeClass('left-drop');
                    element.addClass('right-drop');
                }

                //Förhindra att text i en textarea droppas
                e.dataTransfer.dropEffect = (e.srcElement.localName !== 'textarea') ? 'move' : 'none';

                // allows us to drop
                if (e.preventDefault) {
                    e.preventDefault();
                }
                return false;
            }

            el.addEventListener('dragenter', function (e) {
                e.preventDefault();
            }, false);

            el.addEventListener('dragover', scope.dragoverHandler ,false);

            scope.dragleaveHandler = function (e) {
                var rect = el.getBoundingClientRect();
                if (e.clientX <= (rect.left +5) || e.clientX >= (rect.right -5) || e.clientY <= (rect.top +5) || e.clientY >= (rect.bottom -5) ) {
                    element.removeClass('left-drop');
                    element.removeClass('right-drop');
                }
                return false;
            }

            el.addEventListener('dragleave', scope.dragleaveHandler,false);

            scope.dropHandler = function (e) {
                // Stops some browsers from redirecting.
                if (e.stopPropagation) {
                    e.stopPropagation();
                }

                if (e.preventDefault) {
                    e.preventDefault();
                }

                element.removeClass('left-drop');
                element.removeClass('right-drop');

                var rect = el.getBoundingClientRect();

                var left;
                if ((e.clientX - rect.left - (element.width() / 2)) < 0) {
                    left = true;
                } else {
                    left = false;
                }
                
                var binId = scope.id;
                var itemId = e.dataTransfer.getData('Text');

                // call the passed drop function
                scope.$apply(function (scope: fb.IFbDroppableScope) {
                    var fn = scope.drop();
                    if ('undefined' !== typeof fn) {
                        fn(itemId, binId, left);
                    }
                });

                return false;
            }

            el.addEventListener('drop', scope.dropHandler, false);
            var cleanup = function () {
                el.removeEventListener('drop', scope.dropHandler);
                el.removeEventListener('dragleave', scope.dragleaveHandler);
                el.removeEventListener('dragover', scope.dragoverHandler); 
            };
            scope.$on('$destroy', cleanup);
        }

        return {
            scope: {
                id: '@',
                drop: '&',
                // prevElement: '&',
                // postElement:'&'
            },
            link: link
        }
}]);