Scheduler for Word Press

I wanted to start by saying this has been great plug-in for WP, I wanted just a few basic features for a calendar and 95% of what I wanted is out-of-box. There are only a couple of other things I’d like to do and am looking for a little direction on where to start.

  1. How to resize the Add/Edit Event Modal Window
    ** right now it’s having issues cause I’ve added 3 select lists in addition to the default description.
    ** the 5 line description is now only showing 1/2 a line, not usable. I think it’s due to height.

  2. How to change the Date/Time selection to Date only
    ** I created a family event calendar and I’m only dealing with full days

  3. Where can I hook into the save/edit event to trigger my own event?
    ** I want to send a email/sms to myself when somebody adds something

I only had some slight issues when installing but it’s been great.

Thank you.

  1. How to resize the Add/Edit Event Modal Window
    The form itself can’t be resized but size of text-area section can be adjusted in “Custom field” wizard
  1. How to change the Date/Time selection to Date only
    Will require some js code modifications.
    scheduler.form_blocks.time.render can be redefined with necessary logic.
    viewtopic.php?f=6&t=13117&start=0
    ( js code in the plugin is compressed, so you can grab a separate scheduler package for reference )
  1. Where can I hook into the save/edit event to trigger my own event?
    dhtmlxSchedulerConfigurator.php , line 604
$this->scheduler->event->attach("beforeProcessing", Array($this, "delete_related"));

You can attach your custom code here in similar manner

$this->scheduler->event->attach("beforeProcessing", "custom_function_name");

docs.dhtmlx.com/doku.php?id=dhtm … foreupdate

Thank you so much for the quick response, I’ll try working on this for a few hours tonight to see if I can complete my shared family calendar!

I’ve looked over this a few times and I don’t see how I can disable the time input and convert the input to a single date input box. Here is where I’m at.

Control Code:
/wp-content/plugins/event-calendar-scheduler/codebase/ext/dhtmlxscheduler_minical.js

Code Blurp about Minutes:

scheduler.form_blocks.calendar_time._init_once(G,F);G.value=scheduler.templates.calendar_time(F);G._date=scheduler.date.date_part(new Date(F))}var B=D.getElementsByTagName("input");A(B[0],C.start_date);A(B[1],C.end_date);scheduler.form_blocks.calendar_time._init_once=function(){};var B=D.getElementsByTagName("select");B[0].value=C.start_date.getHours()*60+C.start_date.getMinutes();B[1].value=C.end_date.getHours()*60+C.end_date.getMinutes()},get_value:function(D,C){var A=D.getElementsByTagName("input");var B=D.getElementsByTagName("select");C.start_date=scheduler.date.add(A[0]._date,B[0].value,"minute");C.end_date=scheduler.date.add(A[1]._date,B[1].value,"minute");if(C.end_date<=C.start_date){C.end_date=scheduler.date.add(C.start_date,scheduler.config.time_step,"minute")}},focus:function(A){}};

Can you tell if I’m in the right spot? I see the references to Minutes but can’t tell if this is the spot doing the generation/binding of the control. I also looked for the source (uncompressed code) in the source folder, but I only found language files there. Any tips… Thank you!

a) grab full package
dhtmlx.com/docs/products/dhtmlxS … eduler.zip
b) replace content of plugins/event-calendar-scheduler/codebase/ext/dhtmlxscheduler_minical.js with sources/ext/ext_minical.js
c) in readable code, you can locate and replace

html+=" <select>"; html+="</select>";
as

html="<span></span>"

and comment code which sets and gets values in|from selects (set_value and get_value methods in the same js file)

Stanislav,

Thanks for the additional information, this wasn’t the right file to edit but I found the one I needed. The change to remove time needs to be made to plugins/event-calendar-scheduler/codebase/dhtmlxscheduler.js. I found a debug version in the code/link you sent me but it’s causing a “DataProcessor” window to popup and display the entire time. Do you have any ideas how I can disable this for the dhtmlxscheduler_debug.js, or is there a different version of the file I can use. I would prefer not to hack through the compressed version, since I made multiple changes on multiple lines.

If anybody wants to do this in the future, here is how to remove the “time” from the select list. See all comment lines with “ZH @ …”.

[code]scheduler.form_blocks={
textarea:{
render:function(sns){
var height=(sns.height||“130”)+“px”;
return “

”;
},
set_value:function(node,value,ev){
node.firstChild.value=value||"";
},
get_value:function(node,ev){
return node.firstChild.value;
},
focus:function(node){
var a=node.firstChild; a.select(); a.focus();
}
},
select:{
render:function(sns){
var height=(sns.height||“23”)+“px”;
var html="
";
for (var i=0; i < sns.options.length; i++)
html+=""+sns.options[i].label+"";
html+="
";
return html;
},
set_value:function(node,value,ev){
if (typeof value == “undefined”)
value = (node.firstChild.options[0]||{}).value;
node.firstChild.value=value||"";
},
get_value:function(node,ev){
return node.firstChild.value;
},
focus:function(node){
var a=node.firstChild; a.select(); a.focus();
}
},
time:{
render:function(){
//hours
var cfg = scheduler.config;
var dt = this.date.date_part(new Date());
var last = 2460, first = 0;
if(scheduler.config.limit_time_select){
last = 60
cfg.last_hour+1;
first = 60cfg.first_hour;
dt.setHours(cfg.first_hour);
}
var html="";
/
ZH @ REMOVED TIME <-------------------------------------
var html+="";
for (var i=first; i<last; i+=this.config.time_step*1){
var time=this.templates.time_picker(dt);
html+=""+time+"";
dt=this.date.add(dt,this.config.time_step,“minute”);
}
html+="";
*/
//days
html+="";
for (var i=1; i < 32; i++)
html+=""+i+"";
		//month
		html+="</select> <select>";
		for (var i=0; i < 12; i++) 
			html+="<option value='"+i+"'>"+this.locale.date.month_full[i]+"</option>";
		
		//year
		html+="</select> <select>";
		dt = dt.getFullYear()-5; //maybe take from config?
		for (var i=0; i < 10; i++) 
			html+="<option value='"+(dt+i)+"'>"+(dt+i)+"</option>";
		html+="</select> ";
		
		return "<div style='height:30px; padding-top:0px; font-size:inherit;' class='dhx_cal_lsection dhx_section_time'>"+html+"<span style='font-weight:normal; font-size:10pt;'> &nbsp;&ndash;&nbsp; </span>"+html+"</div>";
	},
	set_value:function(node,value,ev){
		function _fill_lightbox_select(s,i,d){
			
			/* ZH @ REMOVED TIME SET (Changed Array OffSets to compensates fro 2 less SELECT controls)<------------------------------------- s[i+0].value=Math.round((d.getHours()*60+d.getMinutes())/scheduler.config.time_step)*scheduler.config.time_step;	*/
			s[i+0].value=d.getDate();
			s[i+1].value=d.getMonth();
			s[i+2].value=d.getFullYear();
		}
		var s=node.getElementsByTagName("select");
		_fill_lightbox_select(s,0,ev.start_date);
		_fill_lightbox_select(s,3,ev.end_date);
	},
	get_value:function(node,ev){
		s=node.getElementsByTagName("select");
		// ZH @ REMOVE TIME  <------------------------------------- 
		ev.start_date=new Date(s[2].value,s[1].value,s[0].value); 
		// ZH @ REMOVE TIME  <------------------------------------- 
		ev.end_date=new Date(s[5].value,s[4].value,s[3].value);
		if (ev.end_date<=ev.start_date) 
			ev.end_date=scheduler.date.add(ev.start_date,scheduler.config.time_step,"minute");
	},
	focus:function(node){
		node.getElementsByTagName("select")[0].focus(); 
	}
}

}
[/code]

The change to remove time needs to be made
Yep, if you are using mini-calendar - change need to be done in the extension, if you are using default time picker - in dhtmlxscheduler.js

Uncompressed version of dhtmlxscheduler ( without debug code ) is attached.
dhtmlxscheduler22_not_compressed.zip (29.3 KB)

Stanislav,

I have one more question… You mentioned that you thought I was using the mini calendar, is there a way to enable this control to replace the 4 default select boxes used to select the scheduler start and end dates? This was my first goal but I was unable to find any documentation about switching from the 4 select boxes (time, day, month, year) to a calendar control. I would prefer this solution to my own hack, since my current solution will prevent me from using any updates to the dhtmlxScheduler.

Once again, thank you very much for your support. I’ve already showed a few friends/family scheduler control and they love the simplicity of just clicking a date to add a event (BBQ, Birthday Part, etc…). Thanks for the great product!

Zach

Just wanted to update that I found this link under the documentation, but I’m still a bit confused.

docs.dhtmlx.com/doku.php?id=dhtm … nicalendar

It talks about making 2 changes but I don’t know where either change should be made. I checked to see if there was any template that had similar lines but I didn’t find any. Can you tell me where to make the changes referenced in the example (below is the excerpt):

This first blurp of code is referenced as “can apply “calendar_time” section type”.

scheduler.config.lightbox.sections = [ { name:"description", height:200, map_to:"text", type:"textarea" , focus:true }, { name:"time", height:72, type:"calendar_time", map_to:"auto" } ];

This secodn blurp of code is referenced as “Templating”.

//top label of calendar scheduler.templates.calendar_month = scheduler.date.date_to_str("%F %Y"); //week label of calendar scheduler.templates.calendar_scale_date = scheduler.date.date_to_str("%D");

After poking around in the files I don’t see where to put these changes.

Zach

In case of plugin - just set related checkbox in admin part of scheduler (“Mini-calendar navigation”)

In case of standalone scheduler - defining custom “scheduler.config.lightbox.sections” is enough, all other steps are optional

Stanislav,

Your awesome, that worked perfectly. I also used the other info you gave me to take out the time so now I have exactly what I need. Thank you very much for all your help!

Zach