angular.module('componentes', [])
.component('boton', {
	templateUrl: 'assets/componentes/boton.html',
	controller: function(){

	},
	bindings: {
		clase: '@',
		titulo: '@'
	}
})
.component('comboBox', {
	templateUrl: 'assets/componentes/comboBox.html',
	controller: function($scope){
		var vm = this;

		$scope.onSelect = function(){
			if (vm.onSelect){
				vm.onSelect({data: vm.fieldModel});
			}
		};
	},
	bindings: {
		titulo: '@',
		opciones: '<',
		fieldModel: '=',
		onSelect: '&', 
		disabled: '<',
		isRequired: '<'
	}
})
.component('fileBox', {
	templateUrl: 'assets/componentes/fileBox.html',
	controller: function(){
		vm = this;
		vm.contenidoCorrecto = true;
	},
	bindings: {
		controlName: '@',
		titulo: '@',
		fileName: '=',
		base64: '=',
		isRequired: '<',
		consideraciones : '@',
		ancho: '<',
		alto: '<'
	}
})
.component('multipleFilesBox', {
	templateUrl: 'assets/componentes/multipleFilesBox.html',
	controller: function(){
		var vm = this;
		vm.idActual = 0;
	},
	bindings: {
		controlName: '@',
		titulo: '@',
		files: '=',
		fileType: '@',
		isRequired: '<',
		consideraciones : '@'
	}
})
.component('textBox', {
	templateUrl: 'assets/componentes/textBox.html',
	controller: function(){

	},
	bindings: {
		controlName: '@',
		titulo: '@',
		fieldModel: '=', 
		disabled: '<',
		isRequired: '<', 
		tipo: '@'
	}
})
.component('multilineBox', {
	templateUrl: 'assets/componentes/multilineBox.html',
	controller: function(){

	},
	bindings: {
		controlName: '@',
		titulo: '@',
		fieldModel: '=', 
		disabled: '<',
		isRequired: '<'
	}
})
.component('timeBox', {
	templateUrl: 'assets/componentes/timeBox.html',
	controller: function($scope, $timeout){
		var vm = this;

		vm.hora = '00';
		vm.minutos = '00';
		var primeraHora = true;
		var primerMinuto = true;

		$scope.$watch('$ctrl.hora', function (hora) {
			if(primeraHora){
				primeraHora = false;
			} else {
	            vm.fieldModel = hora + ':' + (vm.fieldModel && vm.fieldModel.indexOf(':') != -1 ? vm.fieldModel.split(':')[1] : '00') + ':00';
	        }
        }, true);

		$scope.$watch('$ctrl.minutos', function (minutos) {
			if(primerMinuto){
				primerMinuto = false;
			} else {
            	vm.fieldModel = (vm.fieldModel && vm.fieldModel.indexOf(':') != -1 ? vm.fieldModel.split(':')[0] : '00') + ':' + minutos + ':00';
        	}
        }, true);

        function validarHora(){
        	if (vm.fieldModel){
				vm.hora = vm.fieldModel.split(':')[0];
				vm.minutos = vm.fieldModel.split(':')[1];
			}
	    }

		$timeout(validarHora, 500);
	},
	bindings: {
		controlName: '@',
		titulo: '@',
		fieldModel: '=',
		isRequired: '<'
	}
})
.component('dateBox', {
	templateUrl: 'assets/componentes/dateBox.html',
	controller: function($scope){
		var vm = this;

		$scope.onPick = function(){
			if (vm.onChange){
				vm.onChange({data: vm.fieldModel});
			}
		};
	},
	bindings: {
		controlName: '@',
		titulo: '@',
		fieldModel: '=',
		onChange: '&', 
		isRequired: '<'
	}
})
.component('numberBox', {
	templateUrl: 'assets/componentes/numberBox.html',
	controller: function($scope){

	},
	bindings: {
		controlName: '@',
		titulo: '@',
		fieldModel: '=',
		isRequired: '<'
	}
})
.component('checkBox', {
	templateUrl: 'assets/componentes/checkBox.html',
	controller: function($scope, $timeout){
		var vm = this;
		$scope.names = {};

		$scope.updateVal = function(option, i){
			if ($scope.names['val' + i]){
				vm.fieldModel.push({id: option.id, value: option.value});

				if (vm.deletedItems){
					for (var i = 0; i < vm.deletedItems.length; i++){ 
						if (vm.deletedItems[i].id == option.id){
							vm.deletedItems.splice(i, 1);
							
							i = vm.fieldModel.length;
						}
					}
				}
			} else {
				for (var i = 0; i < vm.fieldModel.length; i++){ 
					if (vm.fieldModel[i].id == option.id){
						vm.fieldModel.splice(i, 1);

						i = vm.fieldModel.length;
					}
				}

				if (vm.deletedItems){
					vm.deletedItems.push({id: option.id, value: option.value});
				}
			}
		};

		function inicializarNames(){
			if (vm.options){
				for (var i = 0; i < vm.options.length; i++){ 
					if (vm.options[i].checked){
						$scope.names['val' + i] = parseInt(vm.options[i].id);
					} else {
						$scope.names['val' + i] = false;
					}
				}
			}
		}


		$timeout(inicializarNames, 500);
	},
	bindings: {
		controlName: '@',
		titulo: '@',
		fieldModel: '=',
		deletedItems: '=',
		options: '<',
		isRequired: '<'
	}
})
.component('radioBox', {
	templateUrl: 'assets/componentes/radioBox.html',
	controller: function($scope, $timeout){
		//var vm = this;
		/*$scope.names = {};
		
		$scope.updateVal = function(option, i){
			if ($scope.names['val' + i]){
				vm.fieldModel.push({id: option.id, value: option.value});

				if (vm.deletedItems){
					for (var i = 0; i < vm.deletedItems.length; i++){ 
						if (vm.deletedItems[i].id == option.id){
							vm.deletedItems.splice(i, 1);
							
							i = vm.fieldModel.length;
						}
					}
				}
			} else {
				for (var i = 0; i < vm.fieldModel.length; i++){ 
					if (vm.fieldModel[i].id == option.id){
						vm.fieldModel.splice(i, 1);

						i = vm.fieldModel.length;
					}
				}

				if (vm.deletedItems){
					vm.deletedItems.push({id: option.id, value: option.value});
				}
			}
		};

		function inicializarNames(){
			if (vm.options){
				for (var i = 0; i < vm.options.length; i++){ 
					if (vm.options[i].checked){
						$scope.names['val' + i] = parseInt(vm.options[i].id);
					} else {
						$scope.names['val' + i] = false;
					}
				}
			}
		}


		$timeout(inicializarNames, 500);*/
	},
	bindings: {
		controlName: '@',
		titulo: '@',
		fieldModel: '=',
		options: '<',
		isRequired: '<'
	}
});