document.addEventListener("DOMContentLoaded", function () {
  var timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;    

  /*var slotMin = new Date("2021-09-13:14:00Z")
  var slotMax = new Date("2021-09-13:23:30Z")

  if(slotMax.getHours()<slotMin.getHours()){
      slotMax.setHours(23)
      slotMax.setMinutes(59)
  }
  console.log(slotMin.toLocaleTimeString(),slotMax.toLocaleTimeString())*/
  
    //document.getElementById("timezone").innerHTML=`Zona Horaria: ${timeZone}`;
    var timeZoneSelectorEl = document.getElementById("time-zone-selector");
    if(timeZone !== "America/Montevideo"){
        var optionEl = document.createElement('option');
        optionEl.value = "local";
        optionEl.innerText = timeZone;
        timeZoneSelectorEl.appendChild(optionEl)
    }
    var calendarEl = document.getElementById("calendar");
    var calendar = new FullCalendar.Calendar(calendarEl, {
      schedulerLicenseKey: "CC-Attribution-NonCommercial-NoDerivatives",

      eventDidMount: function (info) {
        var tooltip = tippy(info.el, {
          content: `<strong>${info.event.title}</strong><br/><strong>${info.event.extendedProps.speaker.nombre}</strong><br/>${info.event.extendedProps.description}`,
          allowHTML: true,
        });
      },
      eventSources: [
        {
          url: "/api/eventos/cursos",
          color: "#755baf",
          /*NO ESTÁ FUNCANDO EL RECUR
              startTime:"13:00",
              endTime:"14:00",
              startRecur:"2021-09-14",
              endRecur:"2021-09-16",*/
        },
        {
          url: "/api/eventos/plenarias",
          color: "#578e44",
        },
        {
          url: "/api/eventos/semiplenarias",
          color: "#3383cb",
        },
        {
          url: "/api/eventos/publicas",
          color: "#a57b00",
        },
        {
          url: "/api/eventos/premiados",
          color: "darkred",
        },
        { url:"/api/eventos/sesiones/",
          color: "gray",
        },
        {
          events: function(info,success,fail){            
            let comisiones = [];
            for(let i=0;i<3;i++){
                comisiones.push({
                  title: "Comisión de Género",
                  start: `2021-09-${14 + i}T18:30-0300`,
                  end: `2021-09-${14 + i}T19:30-0300`,
                  speaker: { nombre: "organizadores" },
                  description: "Reuniones de Comisión de Género de UMALCA",
                  color: "#812c64",
                });
            }
            success(comisiones);
          }  
        },
        {
            events: function(info,success,fail){
            let asamblea = {
                title: "Asamblea UMALCA",
                start: "2021-09-13T19:00-0300",
                end: "2019-09-13T20:00-0300",
                speaker: { nombre: "organizadores" },
                color: "black",
                }
            success([asamblea])
            }
        }
      ],
      
       
      
      headerToolbar: {
        center: "timeGridAll,timeGridThree,timeGridOne",
      },
      eventTimeFormat: {
        hour: "numeric",
        minute: "2-digit",
        meridiem: false,
      },
      timeZone: "America/Montevideo",
      locale: "es",
      initialView: "timeGridAll",
      initialDate: "2021-09-13",
      validRange: {
        start: "2021-09-13",
        end: "2021-09-18",
      },
      nowIndicator: true,
      now: "2021-09-12",
      slotMinTime: "11:00:00",
      slotMaxTime: "21:00:00",
      //slotMinTime:"11:00:00",
      //slotMaxTime:"21:00:00",
      slotDuration: "00:15",
      allDaySlot: false,
      slotLabelFormat: {
        hour: "numeric",
        minute: "2-digit",
        omitZeroMinute: false,
        meridiem: "short",
      },
      eventDisplay: "block",
      views: {
        timeGridAll: {
          type: "timeGrid",
          duration: { days: 5 },
          buttonText: "Todos los dias",
        },
        timeGridThree: {
          type: "timeGrid",
          duration: { days: 2 },
          buttonText: "2 dias",
        },
        timeGridOne: {
          type: "timeGrid",
          duration: { days: 1 },
          buttonText: "1 dia",
        },
        duration: { days: 1 },
      },
    });
  calendar.render();
  timeZoneSelectorEl.addEventListener("change", function () {
    calendar.setOption("timeZone", this.value);
  });
});