/* 
 * Codificación UTF-8
 * Eventos asociados al componente upload
 */

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

		idToUpload = "toUpload_"+id;
		let files = e.target.files;
		let count = files.length;
		let tmp_files = '';	
		
		gvh.blockExit( false, statePanel, panel, claseM );
		
		let 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');
        $("#percent").css("width", "5%");
        $("#percent").text("0%");

		formData = new FormData();
		$.each(files, function(i, file) {
			gvh.showConsoleMsg('log',file);
			gvh.showConsoleMsg('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) {
				    	$('.listFiles').show();
				    	$("#percent").css("width", percentLoaded+"%");
				        $("#percent").text(file.name+' '+percentLoaded+"%");
				        $('#progress_bar').show();
				    }
				}			
			} 
			reader.onload = function(e) {
				//gvh.showConsoleMsg('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);
			    $('.listFiles').show();
			    $('.listFiles .paper').show();
			}
            //gvh.showConsoleMsg('log', file );
		} );
		//regJSON = id.split('___')[2].split('_')[1];

		let regJSON = 0;
		// Según el panel se calcula indice del datosJSON
		let raizJSON = gvh.getRoot(claseM,panelJSON);
		let modoPanel = gvh.getStatePanel(objPanel); 
		if (modoPanel == 'I')
		{
			switch( panelJSON )
			{
				case 'lis':
					var row = idCampo.split('___')[2].split('_')[1];
					regJSON = gvh.indexDataJSON( raizJSON, row, modoPanel );
					var sufijo = panel+'_'+row;
				break;
				case 'edi': 
					regJSON = gvh.getPagIns(raizJSON);
				break;
				default:
					regJSON = 0;
				break;
			}
		}
		else {
			switch( panelJSON )
			{
				case 'fil':
					regJSON = 0;
				break;
				case 'lis':
					var row = idCampo.split('___')[2].split('_')[1];
					regJSON = gvh.indexDataJSON( raizJSON, row );
					var sufijo = panel+'_'+row;	
				break;
				case 'edi':
					var pagActual = gvh.getPagActive(raizJSON); 
					regJSON = pagActual;
				break;
				default:
					regJSON = 0;
				break;
			}
		}
		// 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) {
	        	gvh.showConsoleMsg('log',data);
	    		//datosJSON[claseM][panelJSON]['data'][regJSON]['gvhJS_fields'][campoJSON]['files'] = data;
	    		//datosJSON[claseM][panelJSON]['dataPerform']['data'][regJSON]['gvhJS_fields'][campoJSON]['files'] = data;
	    		gvh.setFilesUp(raizJSON,campoJSON,regJSON,data);
		    	$("#percent").css("width", "100%");
		        $("#percent").text("...100%");
		        $('#progress_bar').hide();
		        if (statePanel == 'I')
		        	operacion = 'inserted'; 
		        else if (statePanel == 'W')
		        	operacion = 'updated';	
		        gvh.setStateReg(raizJSON, operacion, regJSON );
		        gvh.setSelectedReg(raizJSON,regJSON,'add');
		        
		        // Marcamos el panel como modificado.
		    	if( objPanel.length > 0 )
		    	{
		    		objPanel.attr( 'data-gvhchanged', 'true' );
		    	}
	        } ,
	        error: function(data) {
	            console.hide(data);
	        }
	    } );
} );