/* 
 * Codificación UTF-8
 * Eventos asociados a los elementos de un formulario
 */

//$('input[type=file][data-gvhWindow='+ambito+']').on({
$('#gvhPage').offon( 'change', 'input[type=file]', function(e) {
	    e.preventDefault();
		e.stopImmediatePropagation();
console.log(' ** UPDATE FILE '+$(this).attr('id'));
		var fileCollection = new Object();
		/*fileCollection['name'] = new Array();
		fileCollection['type'] = new Array();
		fileCollection['tmp_name'] = new Array();
		fileCollection['error'] = new Array();
		fileCollection['size'] = new Array();*/
		var panel = $(this).attr('data-gvhPanelOn');
		var panelJSON = $(this).attr('data-gvhPanelJSON');
		var claseM = $(this).attr('data-gvhClaseManejadora');
		var iter = $(this).attr('data-gvhIterActual');
		var actualizaA = $(this).attr('data-gvhActualizaA');
		var id = $(this).attr('id');
		var campoJSON = id;
		if (panel != 'fil')
			campoJSON = id.split('___')[1];

		idToUpload = "toUpload_"+id;
		var files = e.target.files;
		var count = files.length;
		var tmp_files = '';	
		
		toUpload = $('span[id='+idToUpload+']');
		toUpload.map(function()
		{
			$(this).empty();
		});
		id_ulFile = 'ulFile_'+id;
		$('#'+id_ulFile).empty();
		toUpload.append("<ul id='"+id_ulFile+"'>");	
		padre = $('#progress_bar').parent().attr('id');
    	$('#progress_bar').addClass('progress_bar');
        $("#percent").css("width", "5%");
        $("#percent").text("0%");

		formData = new FormData();
		$.each(files, function(i, file)
		{
			console.log(file);
			console.log(file.tmp_name);
			/*fileCollection['name'][i] = file.name;
			fileCollection['type'][i] = file.type;
			fileCollection['error'][i] = file.error;
			fileCollection['size'][i] = file.size;*/
			fileCollection[i] = file;
        	formData.append('file[]', file );
			var reader = new FileReader();
			reader.readAsDataURL(file);
			// Barra progreso
			reader.onprogress = function(data) {
				if (data.lengthComputable) {
					var percentLoaded = Math.round((data.loaded / data.total) * 100);
				    if (percentLoaded < 100) {
				    	$("#percent").css("width", percentLoaded+"%");
				        $("#percent").text(file.name+' '+percentLoaded+"%");
				    }
				}			
			};
			reader.onload = function(e)
			{
				//console.log(e);
				$('#'+id_ulFile).append('<li class="list">'+file.name+'</li>');
				if (!--count)
				{
					$('#'+idToUpload).append("</ul>");
					$('#'+idToUpload).css('visibility', 'visible');
				}
			    $("#percent").css("width", "100%");
			    $("#percent").text(file.name+" 100%");
			    //formData.append('image',fileCollection);
			    setTimeout("$('#progress_bar').removeClass()", 4000);
			}
            //console.log( file );
		});
		numReg = id.split('___')[2].split('_')[1];
		// Mostramos el progreso
		Pace.restart();
		document.body.className = document.body.className; // Forzamos a actualizar la interfaz
	    $.ajax({
	        type:'POST',
			url: 'phrame.php?action=ManageUpload__upFile',
	        data:formData,
	        processData: false,
			contentType: false,
			enctype: 'multipart/form-data',
	        cache: false,
	        success:function(data) {
	        	console.log(data);
	    		datosJSON[claseM][panelJSON]['data'][numReg]['gvhJS_fields'][campoJSON]['files'] = data;
	    		datosJSON[claseM][panelJSON]['dataPerform']['data'][numReg]['gvhJS_fields'][campoJSON]['files'] = data;
		    	$("#percent").css("width", "100%");
		        $("#percent").text("...100%");
	        },
	        error: function(data) {
	            console.log(data);
	        }
	    });
});