change placeholder duration dynamically in fullcalendar - fullcalendar

Question

i'm trying to change external duration on fullcalendar external-dragging example.
https://fullcalendar.io/js/fullcalendar-scheduler-1.2.0/demos/external-dragging.html
the example duration was 02:00:00. but I would like to be changed when drag on calendar.
for example baed on above link, pre-duration of rooms were 02:00:00 and 03:00:00 like "Auditorium A" was 02:00:00 and "Auditorium B" was 03:00:00.
and then, when I drag some external item to calendar. then change the item duration 02:00:00 on "Auditorium A" or 03:00:00 on "Auditorium B".
$(function() { // document ready
/* initialize the external events
-----------------------------------------------------------------*/
$('#external-events .fc-event').each(function() {
// store data so the calendar knows to render an event upon drop
$(this).data('event', {
title: $.trim($(this).text()), // use the element's text as the event title
stick: true // maintain when user navigates (see docs on the renderEvent method)
});
// make the event draggable using jQuery UI
$(this).draggable({
zIndex: 999,
revert: true, // will cause the event to go back to its
revertDuration: 0 // original position after the drag
});
});
/* initialize the calendar
-----------------------------------------------------------------*/
$('#calendar').fullCalendar({
now: '2016-01-07',
editable: true, // enable draggable events
droppable: true, // this allows things to be dropped onto the calendar
aspectRatio: 1.8,
scrollTime: '00:00', // undo default 6am scrollTime
header: {
left: 'today prev,next',
center: 'title',
right: 'timelineDay,timelineThreeDays,agendaWeek,month'
},
defaultView: 'timelineDay',
views: {
timelineThreeDays: {
type: 'timeline',
duration: { days: 3 }
}
},
resourceLabelText: 'Rooms',
resources: [
{ id: 'a', title: 'Auditorium A' },
{ id: 'b', title: 'Auditorium B', eventColor: 'green', start:"09:00", end:"11:00" },
{ id: 'c', title: 'Auditorium C', eventColor: 'orange', start:"13:30",end:"16:00" }
],
events: [
],
drop: function(date, jsEvent, ui, resourceId) {
console.log('drop', date.format(), resourceId);
// is the "remove after drop" checkbox checked?
if ($('#drop-remove').is(':checked')) {
// if so, remove the element from the "Draggable Events" list
$(this).remove();
}
},
eventReceive: function(event) { // called when a proper external event is dropped
console.log('eventReceive', event);
},
eventDrop: function(event) { // called when an event (already on the calendar) is moved
console.log('eventDrop', event);
}
});
});
one of above code, there are start/end attribute in resources. so I would like to be applied start/end time when left side external drag on calendar each of rooms.