******************* html file ****************

after the form and before the ******************* page.js file ****************** var calendar, organizer; var serverData; $(function () { $('#rblInvitados input').click(function () { var valueI = $('#rblInvitados input:checked').val(); if (valueI === "S") { $("#divInvitados").show(); } if (valueI === "N") { $("#divInvitados").hide(); } }); $('#rblAgente input').click(function () { var valueA = $('#rblAgente input:checked').val(); if (valueA === "S") { $("#divAgente").show(); } if (valueA === "N") { $("#divAgente").hide(); } }); // initializing a new calendar object, that will use an html container to create itself calendar = new Calendar("calendarContainer", // id of html container for calendar "small", // size of calendar, can be small | medium | large [ "Sunday", // left most day of calendar labels 3 // maximum length of the calendar labels ], [ "#E91E63", // primary color "#C2185B", // primary dark color "#FFFFFF", // text color "#F8BBD0" // text dark color ] ); // initializing a new organizer object, that will use an html container to create itself var organizer = new Organizer("organizerContainer", // id of html container for calendar calendar, // defining the calendar that the organizer is related to serverData // giving the organizer the static data that should be displayed ); organizer.setOnClickListener('days-blocks', function (callback) { consultaDisponibilidad2(organizer.calendar.date, function (data) { organizer.data = data; callback(); }); }); // The Months Slider Left and Right Arrows Click Listeners! organizer.setOnClickListener('month-slider', function (callback) { consultaDisponibilidad2(organizer.calendar.date, function (data) { organizer.data = data; callback(); }); }, function (callback) { consultaDisponibilidad2(organizer.calendar.date, function (data) { organizer.data = data; callback(); }); } ); // The Years Slider Left and Right Arrows Click Listeners! organizer.setOnClickListener('year-slider', function (callback) { consultaDisponibilidad2(organizer.calendar.date, function (data) { organizer.data = data; callback(); }); }, function (callback) { consultaDisponibilidad2(organizer.calendar.date, function (data) { organizer.data = data; callback(); }); } ); }) function consultaDisponibilidad2(date, callback) { var hotel = $("#dplHotel").val() PageMethods.ObtenerDisp( hotel, date, consultaDisponibilidad_CallBack ); } function consultaDisponibilidad_CallBack(response) { try { if (!response) { alert("no se recuperaron datos") return false; } //var inicio = moment(); //var fin = moment(); "use strict"; serverData = {}; var anio = ""; var anio2 = ""; var mes = ""; var mes2 = ""; var dia = ""; var dia2 = ""; response.data.forEach(function (valor, indice, array) { anio = valor.fecha.substr(0, 4); mes = valor.fecha.substr(5, 2); dia = valor.fecha.substr(8, 2); if (indice == 0) { serverData[anio] = {}; serverData[anio][mes] = {}; serverData[anio][mes][dia] = []; anio2 = valor.fecha.substr(0, 4); mes2 = valor.fecha.substr(5, 2); dia2 = valor.fecha.substr(8, 2); } if (anio != anio2) { anio2 = anio; serverData[anio] = {}; } if (mes != mes2) { mes2 = mes; serverData[anio][mes] = {}; } if (dia != dia2) { dia2 = dia; serverData[anio][mes][dia] = []; } serverData[anio][mes][dia].push({ startTime: valor.horaini, endTime: valor.horafin, text: "AVAILABLE" }); }); } catch (ex) { } }