<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">						
<html>
	<head>
	
	<link rel="stylesheet" href="css/dragcss.css" media="screen" type="text/css" />
	<!-- <script type="text/javascript" src='js/drag.js'></script> -->
	<link rel="stylesheet" href="css/font-awesome.min.css">
	<link rel="stylesheet" href="css/styles.css">
	<script src="js/jquery-3.6.3.min.js"></script>
	
	<script type="text/javascript">
     $(document).ready(function() {
			
        $("#player_name").change(function(){
				
            $.ajax({
            url: "_functions_aux.php",
            type: "POST",
            data: {
                player_name : $("#player_name").val(),
				query : "data_player"
            },
            success: function (jsonStr) {

				var json = jsonStr;

				document.getElementById('res_x').setAttribute('value', json.res_x);
				document.getElementById('res_y').setAttribute('value', json.res_y);
				document.getElementById('x0').setAttribute('value', json.x0);
				document.getElementById('y0').setAttribute('value', json.y0);
				$("#time3 option[value='"+json.hour_start+":"+json.min_start+"']").attr("selected", true);
				$("#time4 option[value='"+json.hour_end+":"+json.min_end+"']").attr("selected", true);

            }
			});
		});
	 });
	 
	
	
	function calcular(v1,v2)
{
	inicio=v1.split(":"); /*Mediante la función split separamos el string por ":" y lo convertimos en array. */ 
	fin=v2.split(":");
	for(a=0;a<2;a++) /*bucle para tratar la hora, los minutos y los segundos*/
	{
		inicio[a]=(isNaN(parseInt(inicio[a])))?0:parseInt(inicio[a]) /*si horas1[a] es NaN lo convertimos a 0, sino convertimos el valor en entero*/
		fin[a]=(isNaN(parseInt(fin[a])))?0:parseInt(fin[a])
	}

	inicio[2] = ((inicio[0]*60) + inicio[1]); //Paso a minutos
	fin[2] = ((fin[0]*60) + fin[1]); //Paso a minutos

	difminutos = fin[2] - inicio[2];
	horas = parseInt(difminutos/60);
	minutos = difminutos % 60;

	if(horas < 0)
	{
		horas = horas*-1;
		document.getElementById("dif").style.color = "#FF0000";
	}
	else
	{
		document.getElementById("dif").style.color = "#444444";
	}
	if(minutos < 0)
	{
		minutos = minutos*-1;
		document.getElementById("dif").style.color = "#FF0000";
	}
	else
	{
		document.getElementById("dif").style.color = "#444444";
	}
	if(horas < 10)
	{
		horas = "0" + horas;
	}
	if(minutos < 10)
	{
		minutos = "0" + minutos;
	}
	document.getElementById("dif").value = horas+":"+minutos;//+":"+minutossobrantes;
}

</script>
<?php
require_once 'conf/link.php';

function escribir_horainicio()	{
	$horarios = "";
	for($h=0; $h<=23; $h++)	{
		if($h < 10)	{
			$h = "0".$h;
		}
		for($m=0; $m<=59; $m=$m+15)	{
			if($m < 10)	{
				$m = "0".$m;
			}
			if(($h == '07')&&($m == '00'))	{
				$horarios .= "<option value='".$h.":".$m."'>".$h.":".$m."</option>";
			}
			else	{
				$horarios .= "<option value='".$h.":".$m."'>".$h.":".$m."</option>";
			}
		}
	}
	$horarios .= "<option value='23:59'>23:59</option>";
	return $horarios;
}
			
function escribir_horafin()	{
	$horarios = "";
	for($h=0; $h<=23; $h++)	{
		if($h < 10)	{
			$h = "0".$h;
		}
		for($m=0; $m<=59; $m=$m+15)	{
			if($m < 10)	{
				$m = "0".$m;
			}
			$horarios .= "<option value='".$h.":".$m."'>".$h.":".$m."</option>";
		}
	}
	$horarios .= "<option value='23:59' selected >23:59</option>";
	return $horarios;
}
?>
	</head>
	<body>
		<form method='post' action='_player_edit.php' name='formlist' id='formlist' >
			Nombre de Reproductor : <select name='player_name' id='player_name' >
			<option value="">Seleccione un reproductor</option>
			<?php
			$sql_player = 'SELECT * FROM players';
			$result_player = mysqli_query($conexion, $sql_player);
			while($row_player = mysqli_fetch_array($result_player))	{
				echo '<option value="'.$row_player["player_name"].'">'.$row_player["player_name"].'</option>';
			}
			?>
			
			</select>
			<br>
			<div id="result-playername"></div>
			
			
			Lista de Reproducción Asociada : <select name='lst_assoc' id='lst_assoc' >
			<option value="">Seleccione una Lista de Reproducción</option>
			
			<?php
			$sql_lista = 'SELECT * FROM listas';
			$result_lista = mysqli_query($conexion, $sql_lista);
			while($row_lista = mysqli_fetch_array($result_lista))	{
				echo '<option value="'.$row_lista["nombre_lista"].'">'.$row_lista["nombre_lista"].'</option>';
			}
			?>
			</select>
			
			<br>
			<br>
			<label>Resolución de reproducción</label><br>
			Ancho x Alto ( px )<br>
			<input type='number' name='res_x' id='res_x' size='5' required />&nbsp;&nbsp;x&nbsp;&nbsp;<input type='number' name='res_y' id='res_y' size='5' required />px<br>
			
			<br>
			<br>
			Posicion Inicial de Reproducción( Vértice Superior Izquierdo )<br>
			Eje X    Eje Y  ( Cero, cero (0, 0) o vacio )<br>
			<input type='number' name='x0' id='x0' size='5' required />&nbsp;&nbsp;x&nbsp;&nbsp;<input type='number' name='y0' id='y0' size='5' required />px<br>
			
			<br>
			<br>
			
			Hora Inicio  : <select id="time3" name='time3' onChange="calcular(document.getElementById('time3').value, document.getElementById('time4').value);"/><?php echo escribir_horainicio(); ?></select><br>
			Hora Termino : <select id="time4" name='time4' onChange="calcular(document.getElementById('time3').value, document.getElementById('time4').value);"/><?php echo escribir_horafin(); ?></select><br>
			<!-- Horas de Reproducción : <input type="text" id="dif" name='dif' size="10" style='color: #444;' value="16:59" /> -->
			<br>
			<button>Actualizar</button>
		</form>
	</body>
</html>