'use strict';

var directives = angular.module('mpk.directives', []);

directives.directive('colorSelector', function(){
	return {
		restrict: 'E',
		scope: { options: '=', model: '=ngModel', prefix: '@', showRadios: '=', showHexCode: '='},
		require: 'ngModel',
		template: '<div class="pull-left" ng-repeat="option in options" ng-model="option">\n'+
				'	<label class="colorBox" for="{{prefix}}{{option}}" ng-class="{selected: option == model}" style="background-color: #{{option}};" ng-click="selectColor(option)"></label>\n'+
                '	<br ng-show="showRadios"/>\n'+
                '	<input type="radio" id="{{prefix}}{{option}}" name="{{prefix}}" value="{{option}}" ng-show="showRadios" ng-model="model"/>\n'+
                '</div>\n',
        link: function(scope) {
            if (scope.model === undefined || scope.model === ''){
                scope.model = scope.options[0];
            }

            scope.selectColor = function(color){
                scope.model = color;
            };
        }
	};
});


directives.directive('focusMe', function($timeout){
	return {
		link: function(scope, element, attrs) {
			if (attrs.focusMe){
				scope.$watch(attrs.focusMe, function(value) {
					if(value === true) {
						$timeout(function() {
							element[0].focus();
						});
					}
				});
			} else {
				$timeout(function() {
					element[0].focus();
				});
			}
		}
	};
});



/*
jQuery UI Sortable plugin wrapper

@param [ui-sortable] {object} Options to pass to $.fn.sortable() merged onto ui.config
*/
directives.value('uiSortableConfig',{}).directive('uiSortable', [
		'uiSortableConfig', '$timeout',
		function(uiSortableConfig, $timeout) {
			return {
				require: '?ngModel',
				link: function(scope, element, attrs, ngModel) {
					var savedNodes;

					function combineCallbacks(first,second){
						if(second && (typeof second === 'function')) {
							return function(e, ui) {
								first(e, ui);
								second(e, ui);
							};
						}
						return first;
					}

					var opts = {};

					var callbacks = {
						receive: null,
						remove:null,
						start:null,
						stop:null,
						update:null
					};

					angular.extend(opts, uiSortableConfig);

					if (!ngModel) {
						console.log('ui.sortable: ngModel not provided!', element);
						return;
					}

					// When we add or remove elements, we need the sortable to 'refresh'
					// so it can find the new/removed elements.
					scope.$watch(attrs.ngModel+'.length', function() {
						// Timeout to let ng-repeat modify the DOM
						$timeout(function() {
							element.sortable('refresh');
						});
					});

					callbacks.start = function(e, ui) {
						// Save the starting position of dragged item
						ui.item.sortable = {
							index: ui.item.index(),
							cancel: function () {
								ui.item.sortable._isCanceled = true;
							},
							isCanceled: function () {
								return ui.item.sortable._isCanceled;
							},
							_isCanceled: false
						};
					};

					callbacks.activate = function() {
						// We need to make a copy of the current element's contents so
						// we can restore it after sortable has messed it up.
						// This is inside activate (instead of start) in order to save
						// both lists when dragging between connected lists.
						savedNodes = element.contents();

						// If this list has a placeholder (the connected lists won't),
						// don't inlcude it in saved nodes.
						var placeholder = element.sortable('option','placeholder');

						// placeholder.element will be a function if the placeholder, has
						// been created (placeholder will be an object).  If it hasn't
						// been created, either placeholder will be false if no
						// placeholder class was given or placeholder.element will be
						// undefined if a class was given (placeholder will be a string)
						if (placeholder && placeholder.element && typeof placeholder.element === 'function') {
							var phElement = placeholder.element();
							// workaround for jquery ui 1.9.x,
							// not returning jquery collection
							if (!phElement.jquery) {
								phElement = angular.element(phElement);
							}

							// exact match with the placeholder's class attribute to handle
							// the case that multiple connected sortables exist and
							// the placehoilder option equals the class of sortable items
							var excludes = element.find('[class="' + phElement.attr('class') + '"]');

							savedNodes = savedNodes.not(excludes);
						}
					};

					callbacks.update = function(e, ui) {
						// Save current drop position but only if this is not a second
						// update that happens when moving between lists because then
						// the value will be overwritten with the old value
						if(!ui.item.sortable.received) {
							ui.item.sortable.dropindex = ui.item.index();
							ui.item.sortable.droptarget = ui.item.parent();

							// Cancel the sort (let ng-repeat do the sort for us)
							// Don't cancel if this is the received list because it has
							// already been canceled in the other list, and trying to cancel
							// here will mess up the DOM.
							element.sortable('cancel');
						}

						// Put the nodes back exactly the way they started (this is very
						// important because ng-repeat uses comment elements to delineate
						// the start and stop of repeat sections and sortable doesn't
						// respect their order (even if we cancel, the order of the
						// comments are still messed up).
						savedNodes.detach();
						if (element.sortable('option','helper') === 'clone') {
							// first detach all the savedNodes and then restore all of them
							// except .ui-sortable-helper element (which is placed last).
							// That way it will be garbage collected.
							savedNodes = savedNodes.not(savedNodes.last());
						}
						savedNodes.appendTo(element);

						// If received is true (an item was dropped in from another list)
						// then we add the new item to this list otherwise wait until the
						// stop event where we will know if it was a sort or item was
						// moved here from another list
						if(ui.item.sortable.received && !ui.item.sortable.isCanceled()) {
							scope.$apply(function () {
								ngModel.$modelValue.splice(ui.item.sortable.dropindex, 0,
																					ui.item.sortable.moved);
							});
						}
					};

					callbacks.stop = function(e, ui) {
						// If the received flag hasn't be set on the item, this is a
						// normal sort, if dropindex is set, the item was moved, so move
						// the items in the list.
						if(!ui.item.sortable.received &&
							('dropindex' in ui.item.sortable) &&
							!ui.item.sortable.isCanceled()) {

							scope.$apply(function () {
								ngModel.$modelValue.splice(
									ui.item.sortable.dropindex, 0,
									ngModel.$modelValue.splice(ui.item.sortable.index, 1)[0]);
							});
						} else {
							// if the item was not moved, then restore the elements
							// so that the ngRepeat's comment are correct.
							if((!('dropindex' in ui.item.sortable) || ui.item.sortable.isCanceled()) && element.sortable('option','helper') !== 'clone') {
								savedNodes.detach().appendTo(element);
							}
						}
					};

					callbacks.receive = function(e, ui) {
						// An item was dropped here from another list, set a flag on the item.
						ui.item.sortable.received = true;
					};

					callbacks.remove = function(e, ui) {
						// Remove the item from this list's model and copy data into item,
						// so the next list can retrive it
						if (!ui.item.sortable.isCanceled()) {
							scope.$apply(function () {
								ui.item.sortable.moved = ngModel.$modelValue.splice(ui.item.sortable.index, 1)[0];
							});
						}
					};

					scope.$watch(attrs.uiSortable, function(newVal /*, oldVal*/) {
						angular.forEach(newVal, function(value, key) {
							if(callbacks[key]) {
								if( key === 'stop' ){
									// call apply after stop
									value = combineCallbacks(value, function() { scope.$apply(); });
								}
								// wrap the callback
								value = combineCallbacks(callbacks[key], value);
							}
							element.sortable('option', key, value);
						});
					}, true);

					angular.forEach(callbacks, function(value, key) {
						opts[key] = combineCallbacks(value, opts[key]);
					});

					// Create sortable
					element.sortable(opts);
				}
			};
		}
	]);
