angular.module('homepage').
directive('timepicker', ['$compile', function($compile) {
	function datepickerLinker(scope, element, attribute, controller) {
		element.append('<span class="date" ng-click="toggleTimeWidget($event)">{{time.date | date:"hh:mm a"}}</span>');
		element.append('<timeselection></timeselection>');
		$compile(element)(scope);
	}

	return {
		controller: 'timepickerController',
		link: datepickerLinker,
		scope: {
			/**
			 * @type {Date} date Object with attribute 'date' Date object
		     * @type {Number} hour (Optional) Object with attribute hour from date object
		     * @type {Number} mins (Optional) Object with attribute minutes from date object
			 * @type {Number} secs (Optional) Object with attribute minutes from date object
			 * @type {Number} ampm (Optional) Object with attribute ampm for date object
			 */
			time: '='
		},
		restrict: 'E',
		replace: true,
		template: '<span class="timepicker"></span>'
	};
}]).
controller('timepickerController', ['$scope', '$timeout', function($scope, $timeout) {
	$scope.selected = {};
	var options = {
		seperator: ':',
		clockType: '12HR'
	};

	initialise();

	function initialise() {
		$scope.selected.date = new Date();

		// INITIALISE DATE HERE
		if($scope.time.date) {
			$scope.selected.date.setTime($scope.time.date.getTime());
		}
		else {
			$scope.time.date = new Date();
		}

		setTime($scope.selected);
	}

	function setTime(time) {
		time.mins = time.date.getMinutes();
	}

	$scope.setTimeObj = function() {
		// Check for hour=12 else it would increment the date by one day
		$scope.time.date.setHours($scope.selected.date.getHours());
		$scope.time.date.setMinutes($scope.selected.mins);
	};
	$scope.resetTimeObj = function() {
		$scope.selected.date.setTime($scope.time.date.getTime());
		setTime($scope.selected);
	};

	$scope.isTimePickerVisible = false;
	$scope.getTimePickerVisibility = function() {
		return $scope.isTimePickerVisible;
	};
	$scope.setTimePickerVisibility = function(isVisible) {
		$scope.isTimePickerVisible = isVisible;
		// hack to update isTimePickerVisible
		$timeout(function () { });
	};
	$scope.toggleTimeWidget = function($event) {
		var isVisible = $scope.getTimePickerVisibility();
		$scope.setTimePickerVisibility(!isVisible);
		$scope.time.isDateSet = true;
	};
}]).
directive('timeselection', function() {
	return {
		controller: 'timepickerwidgetController',
		restrict: 'E',
		require: '^timepicker',
		replace: true,
		templateUrl: 'components/common-components/timepicker/timepicker.html'
	};
}).
controller('timepickerwidgetController', ['$scope', function($scope) {
	$scope.setHour = function(increment) {
		var hour = $scope.selected.date.getHours();
		hour = hour + increment;
		if(hour > 23) {
			hour = hour - 24;
		}
		else if(hour < 0) {
			hour = hour + 24;
		}
		$scope.selected.date.setHours(hour);
	};
	$scope.setMins = function(increment) {
		$scope.selected.mins = parseInt($scope.selected.mins);
		var modulus = $scope.selected.mins % 5;
		if(increment == 5) {
			if($scope.selected.mins + increment >= 60) {
				$scope.selected.mins = 0;
			}
			else {
				if(modulus !== 0) {
					$scope.selected.mins += 5 - modulus;
				}
				else {
					$scope.selected.mins += increment;
				}
			}
		}
		else if(increment == -5) {
			if($scope.selected.mins <= 0) {
				$scope.selected.mins = 55;
			}
			else {
				if(modulus !== 0) {
					$scope.selected.mins -= modulus;
				}
				else {
					$scope.selected.mins += increment;
				}
			}
		}
	};
	$scope.setAMPM = function() {
		var hour = $scope.selected.date.getHours();
		if(hour > 12) {
			hour = hour - 12;
		}
		else {
			hour = hour + 12;
		}
		$scope.selected.date.setHours(hour);
	};
	$scope.resetTimeAndHide = function() {
		$scope.resetTimeObj();
		$scope.toggleTimeWidget();
	};
	$scope.setTimeAndHide = function () {
		$scope.setTimeObj();
		$scope.toggleTimeWidget();
	};
}]);