Unique period time for appointment

Hi everybody, first of all i want to thank you for this application

Now i need to put a unique time period of 30 minutes, so i don’t need to choose the time period; and also the registered users must take only one appointment per day.

How can i do these two things?

I hope you can help me, thanks in advance

As for 30 minutes, you can use

scheduler.config.time_step = 30;

or

scheduler.config.auto_end_date = true;
scheduler.config.event_duration = 30;

Hi stanislav, thanks for answer

I made the changes, but i still can create muli-day events, how can i disable event end time and multi-day events?

Another question, how can i change the hour scale from 1 hour to 30 minutes at the left of the scheduler?

Thanks for your time

Hello,

What do you mean by disabling event end time?

scheduler.config.time_step = 30;

Will set the step by which event time is increased (used on the lightbox form and drag’n’drop operations).

This change would require modifying source code.
scheduler\sources\ext\ext_collision.js
Locate function collision_check(ev){ line and change there

var tevs = scheduler.getEvents(evs_dates[k].start_date, evs_dates[k].end_date);

with

var tstart = scheduler.date.day_start(new Date(evs_dates[k].start_date)); var tend = scheduler.date.day_start(new Date(evs_dates[k].end_date)); var tevs = scheduler.getEvents(tstart, tend);
Also change

evs = scheduler.getEvents(ev.start_date, ev.end_date);

with

var tstart = scheduler.date.day_start(new Date(ev.start_date)); var tend = scheduler.date.day_start(new Date(ev.end_date)); evs = scheduler.getEvents(tstart, tend);
And be sure to include this file instead of compressed version in your project.

It’s possible to customize hour scale through scheduler.templates.hour_scale function which is called for every displayed hour.
Here is the example:

var format = scheduler.date.date_to_str("%H:%i"); scheduler.templates.hour_scale = function(date){ var tdate = new Date(date); var dateA = format(tdate); var dateB = format(scheduler.date.add(tdate,30,"minute")); var div_template = "<div class='scale' style='height: "+scheduler.config.hour_size_px/2+"px; line-height: "+scheduler.config.hour_size_px/2+"px;'>" return div_template+dateA+"</div>"+div_template+dateB+"</div>"; }
Best regards,
Ilya

Hi Ilyan,

I made the changes you said, and my problem in the

1st question is that i create appointments of 30 minutes but i can choose an end date and create multi-days events and i don’t want that, i just need to create 1 event of 30 minutes per day and per user, so i made the changes that you told me for the

2nd question, but it doesn’t work, i still can create more than 1 event per day, i changed the code of dhtmlxscheduler_collision.js for this

[code](function(){

var temp_section,temp_time;
var before;

scheduler.config.collision_limit = 1;
scheduler.attachEvent(“onBeforeDrag”,function(id){
var pr = scheduler._props?scheduler._props[this._mode]:null;
var matrix = scheduler.matrix?scheduler.matrix[this._mode]:null;
var checked_mode = pr||matrix;
if(pr)
var map_to = checked_mode.map_to;
if(matrix)
var map_to = checked_mode.y_property;

if ((checked_mode) && id){
	temp_section = this.getEvent(id)[map_to];
	temp_time = this.getEvent(id).start_date;
}
return true;

});
scheduler.attachEvent(“onBeforeLightbox”,function(id){
var ev = scheduler.getEvent(id);
before = [ev.start_date, ev.end_date];
return true;
});
scheduler.attachEvent(“onEventChanged”,function(id){
if (!id) return true;
var ev = scheduler.getEvent(id);
if (!collision_check(ev)){
if (!before) return false;
ev.start_date = before[0];
ev.end_date = before[1];
ev._timed=this.is_one_day_event(ev);
};
return true;
});
scheduler.attachEvent(“onBeforeEventChanged”,function(ev,e,is_new){
return collision_check(ev);
});
scheduler.attachEvent(“onEventSave”,function(id, edited_ev){
//var ev = scheduler.getEvent(id);
if(edited_ev.rec_type)
scheduler._roll_back_dates(edited_ev);

return collision_check(edited_ev);

});

function collision_check(ev){
var evs = [];

if (ev.rec_type) {
	var evs_dates = scheduler.getRecDates(ev);
	for(var k=0; k<evs_dates.length; k++) {
		var tstart = scheduler.date.day_start(new Date(evs_dates[k].start_date));
		var tend = scheduler.date.day_start(new Date(evs_dates[k].end_date));
		var tevs = scheduler.getEvents(tstart, tend);
		for(var j=0; j<tevs.length; j++) { 
			if ((tevs[j].event_pid || tevs[j].id) != ev.id )
				evs.push(tevs[j]);
		}
	}
	evs.push(ev);
} else {
	var tstart = scheduler.date.day_start(new Date(ev.start_date));
	var tend = scheduler.date.day_start(new Date(ev.end_date));      
	evs = scheduler.getEvents(tstart, tend);
}

var pr = scheduler._props?scheduler._props[scheduler._mode]:null;
var matrix = scheduler.matrix?scheduler.matrix[scheduler._mode]:null;

var checked_mode = pr||matrix;
if(pr)
	var map_to = checked_mode.map_to;
if(matrix)
	var map_to = checked_mode.y_property;

var single = true;
if (checked_mode) {
	var count = 0;

	for (var i = 0; i < evs.length; i++) 
		if (evs[i][map_to] == ev[map_to]) 
			count++;
			
	if (count > scheduler.config.collision_limit) {
		scheduler._drag_event.start_date = temp_time;
		ev[map_to] = temp_section;
		single = false;
	}
}
else {
	if (evs.length > scheduler.config.collision_limit) 
		single = false;
}
		
if (!single) return !scheduler.callEvent("onEventCollision",[ev,evs]);
return single;

};

})();[/code]

Thanks in advance for your help, have a nice day

Hello,

If you want to disable end time select controls when you will have to locate them on the lightbox form and disable them.
Something like:

[code]scheduler.config.auto_end_date = true;
scheduler.config.event_duration = 30;

scheduler.attachEvent(‘onLightbox’, function() {
var time_section_selects = scheduler._lightbox.childNodes[1].lastChild.getElementsByTagName(‘SELECT’);
for(var i=7; i>3; i–) { // there 8 of them, first 4 for start date, next - end date
time_section_selects[i].disabled = true;
}
});[/code]

Found a problem, here is the correct code:

[code] (function(){

var temp_section,temp_time;
var before;

scheduler.config.collision_limit = 1;   
scheduler.attachEvent("onBeforeDrag",function(id){
   var pr = scheduler._props?scheduler._props[this._mode]:null;
   var matrix = scheduler.matrix?scheduler.matrix[this._mode]:null;
   var checked_mode = pr||matrix;
   if(pr)
      var map_to = checked_mode.map_to;
   if(matrix)
      var map_to = checked_mode.y_property;

   if ((checked_mode) && id){
      temp_section = this.getEvent(id)[map_to];
      temp_time = this.getEvent(id).start_date;
   }
   return true;
});
scheduler.attachEvent("onBeforeLightbox",function(id){
   var ev = scheduler.getEvent(id);
   before = [ev.start_date, ev.end_date];
   return true;
});
scheduler.attachEvent("onEventChanged",function(id){
   if (!id) return true;
   var ev = scheduler.getEvent(id);
   if (!collision_check(ev)){
      if (!before) return false;
      ev.start_date = before[0];
      ev.end_date = before[1];
      ev._timed=this.is_one_day_event(ev);
   };
   return true;
});
scheduler.attachEvent("onBeforeEventChanged",function(ev,e,is_new){
   return collision_check(ev);
});
scheduler.attachEvent("onEventSave",function(id, edited_ev){
   //var ev = scheduler.getEvent(id);
   if(edited_ev.rec_type)
      scheduler._roll_back_dates(edited_ev);
   
   return collision_check(edited_ev);
});


function collision_check(ev){
   var evs = [];
   
   if (ev.rec_type) {
      var evs_dates = scheduler.getRecDates(ev);
      for(var k=0; k<evs_dates.length; k++) {
         var tstart = scheduler.date.day_start(new Date(evs_dates[k].start_date));
		 var tend = scheduler.date.add(new Date(tstart), 1, "day");
         var tevs = scheduler.getEvents(tstart, tend);
         for(var j=0; j<tevs.length; j++) {
            if ((tevs[j].event_pid || tevs[j].id) != ev.id )
               evs.push(tevs[j]);
         }
      }
      evs.push(ev);
   } else {
      var tstart = scheduler.date.day_start(new Date(ev.start_date));
      var tend = scheduler.date.add(new Date(tstart), 1, "day");  
      evs = scheduler.getEvents(tstart, tend);
   }
   
   var pr = scheduler._props?scheduler._props[scheduler._mode]:null;
   var matrix = scheduler.matrix?scheduler.matrix[scheduler._mode]:null;
   
   var checked_mode = pr||matrix;
   if(pr)
      var map_to = checked_mode.map_to;
   if(matrix)
      var map_to = checked_mode.y_property;
   
   var single = true;
   if (checked_mode) {
      var count = 0;

      for (var i = 0; i < evs.length; i++)
         if (evs[i][map_to] == ev[map_to])
            count++;
            
      if (count > scheduler.config.collision_limit) {
         scheduler._drag_event.start_date = temp_time;
         ev[map_to] = temp_section;
         single = false;
      }
   }
   else {
      if (evs.length > scheduler.config.collision_limit)
         single = false;
   }
         
   if (!single) return !scheduler.callEvent("onEventCollision",[ev,evs]);
   return single;
   
};

})();[/code]

Best regards,
Ilya

Hello Ilya, i hope you are fine :slight_smile:

I made the changes and i resolved the first question, thanks.

But in the second I need to be able to create many appointments per day, but just one per user in the same day. So with your code I just can create one appointment per day and another user can’t create an event if there is one in that day.

Thank you so much for your patience and time.

Hello,

It works fine locally with the units or timeline extension. Do you use them? If not then how do you organize events-units connection?

Best regards,
Ilya

Hi Ilya, I am working with the wordpress plugin and in the week view I need to create just one appointment in the same day per user subscribed to the site.

So each subscribed user can add just one appointment per day, but he/she could create other appointment in other day, and in my scheduler I can see many appointments in a day, but each one of them belongs just to one user.

Thanks for your help

If you are using scheduler in “private” mode, you can enable “prevent events overlapping” checkbox in the admin panel. So each user will not be able to create second event, for already occupied timeslot.