<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8"/>
<title>APLICACIÓN de RESERVAS de la ETSINF (versión jquery)</title>
<link type="text/css" href="css/jquery.mcdropdown.css" rel="stylesheet" media="all" />
<!--<script type="text/javascript" src="js/jquery.bgiframe.js"></script>
<script type="text/javascript" src="js/jquery.mcdropdown.js"></script>-->
<?php
require "config.php";
require "connect_db.php";
require "functions.php";
?>
<script type="text/javascript">
$(function(){
$.ajaxSetup({cache:false});
// Estilo del botón Buscar
$(".botReserva").button();
$("#botResSel").button();
$( "#botConfig" ).button({
icons: {
primary: "ui-icon-gear",
secondary: "ui-icon-triangle-1-s"
}
});
$("#combobox" ).combobox({
text: false,
icons: {
primary: "ui-icon-check",
secondary: "ui-icon-triangle-1-s"
},
});
//Activar el botón de reserva cuando se seleccione un aula
$(".aulaRes").click(function activarBoton(){
var $elem = $(this);
$elem.siblings('button').attr('disabled',!$elem.is(':checked'));
});
//Para que carge el script del formulario
$("#botReserva, #botResSel").click(function(e){
e.preventDefault();
var fIni= $("#varFIni").val();
console.log ("Fecha Inicio infobusqueda.php" + fIni);
var fFin= $("#varFFin").val();
var hIni= $("#varHini").val();
var hFin=$("#varHfin").val();
var seleAulas = new Array();
$("input[name='aulaRes']:checked").each(function(){
seleAulas.push($(this).val());
});
param="fIni="+fIni+"&fFin="+fFin+"&seleAulas="+seleAulas+"&hIni="+hIni+"&hFin="+hFin;
console.log ("param para formularioReserva.php: "+ param);
$.ajax({
type: "POST",
url: "formularioReserva.php",
data: param,
success: function(datos){
$("#cargarForm").html(datos);
}
});//ajax
return false;
});//click
});
</script>
<style type="text/css">
body{ font: 62.5% "Trebuchet MS", sans-serif; }
#margen{margin:35px; }
.formEspacios div{margin-bottom: 1px; /* esto los separara un poco */}
#toolbar {padding: 10px 4px;}
.error{ color: red; font-weight: bold; font-size:11px; }
</style>
</head>
<body>
<?php
//Recogemos los valores de las variables que nos manda index.php
$fechaInicio=$_REQUEST["fechaIni"];
$fechaFin=$_REQUEST["fechaFin"];
$horaInicio=$_REQUEST["horaIni"];
$horaFin=$_REQUEST["horaFin"];
$opcPeriodica=$_REQUEST["periodica"];//Si esta checkeada, su valor sera "Periodica", si no el valor sera "no"
$opcSelEspacios=$_REQUEST["selEspacios"];//Lista de espacios, separados por una coma
$opcSelDias=$_REQUEST["selDias"];
$opcEdif=$_REQUEST["edif"];//Solo tendra un edificio.
//Pasar el estring de dias seleccionados en la periodicidad a array
$dia=explode(',', $opcSelDias);
$opcEspacios=explode(',', $opcSelEspacios);
//pasar los dias de la semana a valor numerico
$diaNumerico="";
for($aux=0; $aux<count($dia); $aux++){
if($aux==0){
switch($dia[$aux]){
case "Lunes": {$diaNumerico="1"; break;}
case "Martes": {$diaNumerico="2"; break;}
case "Miercoles": {$diaNumerico="3"; break;}
case "Jueves": {$diaNumerico="4"; break;}
default: {$diaNumerico="5"; break;}
}
}
else{
switch($dia[$aux]){
case "Lunes": {$diaNumerico=$diaNumerico.",1"; break;}
case "Martes": {$diaNumerico=$diaNumerico.",2"; break;}
case "Miercoles": {$diaNumerico=$diaNumerico.",3"; break;}
case "Jueves": {$diaNumerico=$diaNumerico.",4"; break;}
default: {$diaNumerico=$diaNumerico.",5"; break;}
}
}
}
//Si no esta seleccionada la periodicidad, deja la variable $diaNumerico vacia
if(strcmp($opcPeriodica, "Periodica")!=0) $diaNumerico="";
//Si esta seleccionada la opcion de "Todos los edificios", deja la variable $opcEdif vacia
if(strcmp($opcEdif, "TodosEdif")==0) $opcEdif="";
//FECHAS SELECCIONADAS EN FORMATO PARA BDA
//Para pasar el formato de la fecha al mismo que el de la base de datos
$auxFini=explode('/', $fechaInicio);
$auxFfin=explode('/', $fechaFin);
$FeIniBD=$auxFini[2]."-".$auxFini[1]."-".$auxFini[0];
$FeFinBD=$auxFfin[2]."-".$auxFfin[1]."-".$auxFfin[0];
?>
<form id="mostrarAulas">
<!--Botones iniciales-->
<span id="toolbar" class="ui-widget-header ui-corner-all">
<select id="combobox">
<option value="Todos">Todos</option>
<option value="Nada">Nada</option>
</select>
<button id="botResSel">Reservar selección</button>
<button id="botConfig">Configuración</button>
</span>
<label> <h2>Espacios Disponibles </h2>
<h4>(Criterios de búsqueda: Fecha Inicio: <?php echo $fechaInicio;?>, Fecha Fin: <?php echo $fechaFin;?>, Hora Inicio: <?php echo $horaInicio;?>, Hora Fin: <?php echo $horaFin;?>,</br> Tipo Espacio:
<?php
//Para mostrar los espacios seleccionados
for($aux=0; $aux<count($opcEspacios); $aux++){
if($aux==0) echo $opcEspacios[$aux];
else echo " - ".$opcEspacios[$aux];
}
?>, Tipo Edificio: <?php echo $opcEdif;?>
<?php
//Para incluir si hay periodicidad
if(strcmp($opcPeriodica, "Periodica")==0){ echo ", Repetir cada: ";
for($aux=0; $aux<count($dia); $aux++){
if($aux==0) echo $dia[$aux];
else echo " - ".$dia[$aux];
}
echo " )";
}
else echo ")";
?>
</h4></label>
<div id="margen" >
<?php
$sql="execute proc_resweb_espacios_disponibles '".$FeIniBD."','".$FeFinBD."','".$horaInicio."','".$horaFin."','".$diaNumerico."','''".$opcEspacios[0]."'',''".$opcEspacios[2]."'',''".$opcEspacios[1]."''','".$opcEdif."'";
$esp=db_query($database_name, $sql);
while($espacios=fetch_array($esp)){
?>
<div style="background:#E0F2F7">
<input type="checkbox" name="aulaRes" class="aulaRes" id="aulaRes" value="<?php echo $espacios["ALIAS"]; ?>"/><?php echo $espacios["ALIAS"]." - ".htmlentities($espacios["OBSERVACIONES"])." "; ?>
<button id="botReserva" class="botReserva" disabled="disabled"> Reservar</button>
</div>
<br>
<?php
}
?>
<!--CAMPOS OCULTOS PARA PASAR LOS DATOS AL SCRIPT DEL FORMULARIO:-->
<input type="hidden" id="varFIni" value="<?php echo $fechaInicio;?>">
<input type="hidden" id="varFFin" value="<?php echo $fechaFin;?>">
<input type="hidden" id="varHini" value="<?php echo $horaInicio;?>">
<input type="hidden" id="varHfin" value="<?php echo $horaFin;?>">
</form>
</div>
<!--Este div, carga el forumlario-->
<div id="cargarForm"></div>
</body>
</html>
