Fullcalendar y zonas horarias. Ayuda, lo estoy haciendo mal

Question

Lo estoy haciendo mal de alguna manera. Me estoy tropezando en zonas horarias con Fullcalendar. He intentado configurar ignoreTimezone en verdadero y falso, pero no parece importar. Está en el código de abajo en dos lugares porque no estaba seguro del documento a dónde va.

Mi fuente de datos es un campo de formulario oculto. Los datos que van fuera de FullCalendar se ajustan agregando 5 horas (CDT). Los datos que van en a FullCalendar no se ajustan eliminando 5 horas.

En el back-end, sólo estoy ahorrando y devolver la cadena JSON sin procesarlo (o incluso decodificación)

Page Load: 
    Data In: Empty, no data 
    Data Edit: drag from noon to 2pm (CDT), then submit form 
    Data Out: Use clientEvent to get data, and JSON.stringify to put into form field. 
    [{"id":6844,"title":"Open","start":"2011-04-19T17:00:00.000Z","end":"2011-04-19T19:00:00.000Z","allDay":false}] 

Page Load (after submitting form): 
    Data In: Use JSON.parse to load data from hidden form field. This is the incoming data, but the event is shifted to 5pm (CDT) in the control. 
    [{"id":6844,"title":"Open","start":"2011-04-19T17:00:00.000Z","end":"2011-04-19T19:00:00.000Z","allDay":false}] 
    Data Out: Without changing the control, it's now: 
    [{"id":6844,"title":"Open","start":"2011-04-19T22:00:00.000Z","end":"2011-04-20T00:00:00.000Z","allDay":false}] 

I fijó la Fullcalendar así:

// Fullcalendar for business hours page 

jQuery(document).ready(function() { 

    jQuery('#edit-submit').bind("click", business_hours_set); 
    jQuery('#edit-preview').bind("click", business_hours_set); 

    jQuery('#calendar').fullCalendar({ 

    // configure display 
    header: { 
     left: '', 
     center: '', 
     right: '' 
    }, 
    ignoreTimezone: false, 
    defaultView: 'agendaWeek', 
    allDaySlot: false, 
    firstHour: 8, 

    // configure selection for event creation 
    selectable: true, 
    selectHelper: true, 
    select: business_hours_add, 

    // configure data source 
    editable: true, 
    eventSources: [ 
    { 
     events: jQuery.parseJSON(jQuery('#fullcalendar_data').val()), 
     color: '#992B0A', 
     textColor: 'white', 
     ignoreTimezone: false 
    } 
    ], 

    // configure editing 
    eventClick: function(calEvent) { 
     business_hours_delete(calEvent.id); 
    } 
    }); 
    alert(jQuery('#fullcalendar_data').val()); 
}); 

function business_hours_add(startDate, endDate) { 
    var calendar = jQuery('#calendar'); 
    var newid = Math.ceil(Math.random()*64000); 
    calendar.fullCalendar('renderEvent', 
    { 
    id: newid, 
    title: "Open", 
    start: startDate, 
    end: endDate, 
    allDay: false 
    }, 
    true // make the event "stick" 
); 
    calendar.fullCalendar('unselect'); 
} 

var business_hours_selectedId = -1; 
function business_hours_delete(id) { 

    business_hours_selectedId = id; 

    jQuery("#dialog-confirm").dialog({ 
    resizable: false, 
    height:160, 
    modal: true, 
    buttons: { 
     "Yes, delete!": function() { 
     calendar = jQuery('#calendar'); 
     calendar.fullCalendar('removeEvents', business_hours_selectedId); 
     jQuery(this).dialog("close"); 
     }, 
     Cancel: function() { 
     jQuery(this).dialog("close"); 
     } 
    } 
    }, id); 
} 

function business_hours_set() { 
    var data = jQuery('#calendar').fullCalendar('clientEvents'); 

    // data is cyclical. Create a new data structure to stringify. 
    var ret = []; 
    for(var i=0; i<data.length; i++) { 
    var datum = { 
     id: data[i].id, 
     title: data[i].title, 
     start: data[i].start, 
     end: data[i].end, 
     allDay: data[i].allDay 
    } 
    ret[i] = datum; 
    } 
    // stringify and return 
    jQuery('#fullcalendar_data').val(JSON.stringify(ret)); 
    alert(JSON.stringify(ret)); 
} 

¿Qué estoy haciendo mal?

Gracias de antemano, Mike

Answer 1

Usted está serializando fechas ajustadas-CDT como fechas UTC (obteniendo así 5 horas por turno) por lo que cuando se leen en consiguen volver a ajustarse a CDT, y así sucesivamente.

Debido a que no existe una manera de establecer una zona horaria en los objetos de fecha JS, Fullcalendar los representa internamente como fechas UTC, pero se ajusta para el desplazamiento de la zona horaria en el tiempo de entrada.

$.fullCalendar.parseISO8601('2011-04-19T17:00:00.000-05:00'); 
// Tue Apr 19 2011 22:00:00 GMT+0000 (GMT) <-- note time shift 

Por esta razón, al serializar a JSON, se obtiene una cadena con la zona horaria "Zulu" (UTC):

var dt = $.fullCalendar.parseISO8601('2011-04-19T17:00:00.000-05:00'); 
JSON.stringify(dt); // "2011-04-19T22:00:00.000Z" 

Es necesario la fecha de regreso a su zona horaria. No se ve como Fullcalendar tiene esto para que necesita para el trabajo:

// detect local timezone offset 
var localoffset = (new Date()).getTimezoneOffset(); 
// "unadjust" date 
ret = new Date(ret.valueOf() + (localoffset * 60 * 1000)); 

// serialize 
function pad (n) { return String(n).replace(/^(-?)(\d)$/,'$10$2'); } 
JSON.stringify(ret) 
    // replace Z timezone with current 
    .replace('Z', pad(Math.floor(localoffset/60))+':'+ pad(localoffset % 60)); 

// should result in something like: "2011-04-21T19:00:00.000-05:00" 

Puede haber una mejor manera de resolver esto utilizando Fullcalendar pero no estoy familiarizado con él.

El código no se ha probado: Vivo en GMT sin DST y realmente no quiero meterme con mi sistema solo para ver cómo funciona (YMMW). :-)

Answer 2

Tuve el mismo Timeshift en FullCalendar. Revisa tu zona horaria en el servidor, cuando la cambié por la mía me ayudó. Usted puede tratar de hacerlo en algunas de las formas:

En Serer:

[root @ mx ~] # mv/etc/localtime/etc/localtime.edad

[root @ mx ~] # ln -s/usr/share/zoneinfo/Europa/Moscú/etc/localtime

O en el script PHP (que devuelve cadena JSON):

date_default_timezone_set ('Europa/Moscú');

P.S. No se olvide de cambiar "Europa/Moscú" a sus valores :-)

Luego, debe establecer su hora válida en la nueva zona horaria (comando "fecha");