<!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>
<script language="JavaScript" type="text/javascript">
// funcion para recoger informacion de el iframe a la pagina principal
//calendario
function evento(dia,mes){
this.dia = dia;
this.mes = mes;
}
// día y mes del evento para ponerlo en verde
var eventosG = new Array();
eventosG[0] = new evento(3,4);
eventosG[1] = new evento(7,4);
eventosG[2] = new evento(12,5);
// día y mes del evento para ponerlo en rojo
var eventosR = new Array();
eventosR[0] = new evento(8,4);
eventosR[1] = new evento(9,4);
eventosR[2] = new evento(22,5);
meses = new Array();
meses[0]='Enero';meses[1]='Febrero';meses[2]='Marzo';meses[3]='Abril';meses[4]='Mayo';meses[5]='Junio';
meses[6]='Julio';meses[7]='Agosto';meses[8]='Septiembre';meses[9]='Octubre';meses[10]='Noviembre';meses[11]='Diciembre';
diasemana = new Array();
diasemana[0]='L';diasemana[1]='M';diasemana[2]='X';diasemana[3]='J';
diasemana[4]='V';diasemana[5]='S';diasemana[6]='D';
var fechalunes; var fechaelegida;
var fechaHoy = new Date();
fechaelegida=fechaHoy;
var estado = 'semana';
function escribirCalendario(){
//alert(fechaHoy.getDate() + ' - ' + fechaelegida.getMonth() + ' - ' + eventos[5].dia + ' - ' + eventos[5].mes)
//con esta funcion creamos los primeros elementos del calendario, c_calendario_general es la capa donde se muestra el calendario
obj = document.getElementById("c_calendario_general");
var txt = '<div id="calendario">';
txt+='<div id="Ccabecera">' // y vamos creando las demas capas, en las css les cambiaremos las propiedades
+ '<div class="Cguia" onclick="retrocederAño();"><<<\/div><div class="Cguia" onclick="retrocederMes();"><<\/div>'
+ '<div id="Cmes">' + meses[fechaelegida.getMonth()] + ' ' + fechaelegida.getFullYear() + '<\/div>'
+ '<div class="Cguia" onclick="avanzarMes();">><\/div><div class="Cguia" onclick="avanzarAño();">>><\/div><\/div>';
for (i=0; i<7; i++) txt+='<div class="Ccasillasemana">' + diasemana[i] + '<\/div>';
//variable fechaaux a modo de fecha auxiliar, la situo el dia 1 del mes y año actual
var fechaaux = new Date(fechaelegida.getFullYear(),fechaelegida.getMo nth(),1);
//saco el dia de la semana que es el 1 del mes actual
diaactual = fechaaux.getDay();
//y voy retrasando la fecha de dia en dia hasta que llego a un lunes, una vez llegue a este lunes, sera la primera fecha que se pinte en el calendario
while (diaactual!=1) {
fechaaux.setDate(fechaaux.getDate() - 1); diaactual=fechaaux.getDay();}
// creamos los dias en el calendario, pintamos el dia que contiene fechaaux y la pasamos al dia siguiente
for (i=0; i<6; i++)
for (j=0; j<7;j++)
{
configcolor = ''; // aqui meteremos el codigo adicional para hacer algun cambio de color
// si el día coincide con los valores del los array
day =fechaaux.getDate();
for(var iEventG=0; iEventG < eventosG.length; iEventG++)
{
if( ((fechaelegida.getMonth())==eventosG[iEventG].mes) && (day==eventosG[iEventG].dia) )
configcolor+='style="color:white; background:green;"';
}
for(var iEventR=0; iEventR < eventosR.length; iEventR++)
{
if( ((fechaelegida.getMonth())==eventosR[iEventR].mes) && (day==eventosR[iEventR].dia) )
configcolor+='style="color:white; background:red;"';
}
if (fechaelegida.getDate()==fechaaux.getDate())
configcolor+='style="color:white; background:#000066;"'; //CASILLA DE HOY
else if ((fechaaux.getDay() == 6) || (fechaaux.getDay() == 0)) //si el dia actual es sabado o domingo
{
if (fechaelegida.getMonth() == fechaaux.getMonth()){
configcolor+='style="color:red ;"';//si estoy en el mes actual pintamos de rojo
}else configcolor+='style="color:coral;"';//si estoy en otro mes, se pinta de rojo suave
}
if (fechaelegida.getMonth() == fechaaux.getMonth()) {
txt+='<div class="Ccasilladia"' + configcolor;
txt+=' onclick="cambiarDiaMesAño(' + fechaaux.getDate() + ',' + fechaaux.getMonth() + ',' + fechaaux.getFullYear() + ');mostrarFecha();">';
txt+= fechaaux.getDate() + '<\/div>';
}
else {
txt+='<div class="Ccasilladia" style="cursor:default;"> <\/div>';
}
fechaaux.setDate(fechaaux.getDate() + 1);
}
txt+='<\/div>';
obj.innerHTML=txt;
}
//funciones para los controles del calendario, avanzar un mes, retroceder un mes, y lo mismo para los años
function avanzarMes(){
fechaelegida.setMonth(fechaelegida.getMonth() + 1);escribirCalendario();
var _anio = fechaelegida.getFullYear();
var _mes = fechaelegida.getMonth() + 1;
_mes = _mes < 10 ? '0' + _mes : _mes.toString();
var _dia = fechaelegida.getDate();
_dia = _dia < 10 ? '0' + _dia : _dia.toString();
var fechaSeleccionada = _dia +' / ' + _mes + ' / ' + _anio;
//parent.parent.document.getElementById('contenedor_ ilustrativo').innerHTML = 'Fecha: ' + fechaSeleccionada;
}
function retrocederMes(){
fechaelegida.setMonth(fechaelegida.getMonth() - 1);escribirCalendario();
var _anio = fechaelegida.getFullYear();
var _mes = fechaelegida.getMonth() + 1;
_mes = _mes < 10 ? '0' + _mes : _mes.toString();
var _dia = fechaelegida.getDate();
_dia = _dia < 10 ? '0' + _dia : _dia.toString();
var fechaSeleccionada = _dia +' / ' + _mes + ' / ' + _anio;
//parent.parent.document.getElementById('contenedor_ ilustrativo').innerHTML = 'Fecha: ' + fechaSeleccionada;
}
function avanzarAño(){
fechaelegida.setFullYear(fechaelegida.getFullYear( ) + 1);escribirCalendario();
var _anio = fechaelegida.getFullYear();
var _mes = fechaelegida.getMonth() + 1;
_mes = _mes < 10 ? '0' + _mes : _mes.toString();
var _dia = fechaelegida.getDate();
_dia = _dia < 10 ? '0' + _dia : _dia.toString();
var fechaSeleccionada = _dia +' / ' + _mes + ' / ' + _anio;
//parent.parent.document.getElementById('contenedor_ ilustrativo').innerHTML = 'Fecha: ' + fechaSeleccionada;
}
function retrocederAño(){
fechaelegida.setFullYear(fechaelegida.getFullYear( ) - 1);escribirCalendario();
var _anio = fechaelegida.getFullYear();
var _mes = fechaelegida.getMonth() + 1;
_mes = _mes < 10 ? '0' + _mes : _mes.toString();
var _dia = fechaelegida.getDate();
_dia = _dia < 10 ? '0' + _dia : _dia.toString();
var fechaSeleccionada = _dia +' / ' + _mes + ' / ' + _anio;
//parent.parent.document.getElementById('contenedor_ ilustrativo').innerHTML = 'Fecha: ' + fechaSeleccionada;
}
function cambiarDiaMesAño(dia,mes,año){
// funcion que se ejecuta al pulsar una casilla del calendario, se establece la fecha pulsada como la elejida para pintar, y se reescribe el calendario y la agenda
fechaelegida.setFullYear(año,mes,dia); escribirCalendario();
}
function mostrarFecha()
{
//funcion para mostrar la fecha seleccionada
var _anio = fechaelegida.getFullYear();
var _mes = fechaelegida.getMonth() + 1;//se le suma 1 porque los meses que guarda esto en vez de ir del 1 al 12 van del 0 al 11
_mes = _mes < 10 ? '0' + _mes : _mes.toString();// para que cuando el numero sea inferior a 10 se añada el 0
var _dia = fechaelegida.getDate();
_dia = _dia < 10 ? '0' + _dia : _dia.toString();// para que cuando el numero sea inferior a 10 se añada el 0
var fechaSeleccionada = _dia +'/' + _mes + '/' + _anio;
parent.document.getElementById('imp_text_fecha_ent rada_reservas_ps').value = fechaSeleccionada;
parent.document.getElementById('cp_calendario_entr ada_ps').style.visibility="hidden";
}
</script>
<title>Documento sin título</title>
</head>
<body onload="escribirCalendario();">
<div id="c_calendario_general"></div>
</body>
</html>