I forgot to attach the file for the custom HTML module embedding dhtmlxScheduler… doing it now (zipped to avoid security blocks for attachments in this forum)
calendar_dhtmlx_scheduler_custom_module_html.zip (1.46 KB)
Hi!
Thanks, good work!
Hi,
I followed the instructions above, but this didn’t work for me and my Joomla 2.5.1
My Custom HTML module with the copy/paste code doesn’t appear, however, it does… only the title of the module, but no calender view, nothing.
Do you have any idea…?
Maybe due to the template (Yootheme)?
Greetings,
Reinder
A last note about integrating the calendar as Custom HTML module.
It is actually better to create 2 Custom HTML modules:
- the first should contain all tags and all the Javascript code (no and no
s); e.g.
<script src="/components/com_scheduler/codebase/dhtmlxscheduler.js" type="text/javascript" charset="utf-8"></script> <link rel="stylesheet" href="/components/com_scheduler/codebase/dhtmlxscheduler_wp.css" type="text/css" charset="utf-8"/> <link rel="stylesheet" href="/components/com_scheduler/codebase/dhtmlxscheduler.css" type="text/css" charset="utf-8"/> <script src="/components/com_scheduler/codebase/ext/dhtmlxscheduler_url.js" type="text/javascript" charset="utf-8"></script> <script src="/components/com_scheduler/codebase/ext/dhtmlxscheduler_readonly.js" type="text/javascript" charset="utf-8"></script> <script src="/components/com_scheduler/codebase/ext/dhtmlxscheduler_recurring.js" type="text/javascript" charset="utf-8"></script> <link rel="stylesheet" href="/components/com_scheduler/codebase/ext/dhtmlxscheduler_recurring.css" type="text/css" charset="utf-8"/> <script src="/components/com_scheduler/codebase/ext/dhtmlxscheduler_year_view.js" type="text/javascript" charset="utf-8"></script> <script src="/components/com_scheduler/codebase/ext/dhtmlxscheduler_expand.js" type="text/javascript" charset="utf-8"></script> <script src="/components/com_scheduler/codebase/ext/dhtmlxscheduler_pdf.js" type="text/javascript" charset="utf-8"></script> <script src="/components/com_scheduler/codebase/sources/locale_en.js" type="text/javascript" charset="utf-8"></script> <script src="/components/com_scheduler/codebase/sources/locale_recurring_en.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript" charset="utf-8"> scheduler.config.details_on_create=true; scheduler.config.details_on_dblclick=true; scheduler.config.default_date = "%d %M %Y"; scheduler.config.month_date = "%F %Y"; scheduler.config.week_date = "%l"; scheduler.config.day_date = "%d/%m/%Y"; scheduler.config.hour_date = "%H:%i"; scheduler.config.month_day = "%d"; scheduler.config.api_date = "%Y-%m-%d %H:%i:%s"; scheduler.config.xml_date = "%Y-%m-%d %H:%i:%s"; scheduler.config.time_step = 5; scheduler.config.hour_size_px = 40; scheduler.config.first_hour = 0; scheduler.config.last_hour = 24; scheduler.config.agenda_start = new Date(); scheduler.config.agenda_end = scheduler.date.add(new Date(), 30, "day"); scheduler.config.start_on_monday = true; scheduler.config.multi_day = true; {source} <?php $user = & JFactory::getUser(); if ($user->username == 'userNameOfTheSuperAdminGuy') echo "scheduler.config.readonly = false;"; else echo "scheduler.config.readonly = true;"; ?> {/source} scheduler.templates.event_text=function(start,end,event){ return event.text; }; scheduler.templates.event_header=function(start,end,event){ return scheduler.templates.hour_scale(start) + " - " + scheduler.templates.hour_scale(end); }; scheduler.templates.event_bar_text=function(start,end,event){ return "<span title='"+event.text+"'>" + event.text + "</span>"; }; var default_mode = 'month'; window.onload = function init() { scheduler.locale.labels.section_text = 'Description'; scheduler.config.lightbox.sections=[{name:"text", height:150, map_to:"text", type:"textarea",focus:true}, {name:"recurring", height:115, type:"recurring", map_to:"rec_type", button:"recurring"}, {name:"time", height:72, type:"time", map_to:"auto"}]; scheduler.init("scheduler_here",null,default_mode); scheduler.load("/index.php?option=com_scheduler&view=scheduler&task=loadxml&scheduler_events="+scheduler.uid()); var dp = new dataProcessor("/index.php?option=com_scheduler&view=scheduler&task=loadxml&scheduler_events="+scheduler.uid()); dp.init(scheduler); dp.attachEvent('onAfterUpdate', after_update); function after_update(sid, action, tid, xml_node) { var userid = xml_node.getAttribute('user'); if (action != 'deleted') { var event = scheduler.getEvent(sid); event.user = userid; } } }; </script>Then associate this Custom HTML Module with a location of your Joomla template such that the module code is embedded into the tag of the HTML pages.
- the second should contain just the HTML table, e.g.:
<table class="nopad"> <tr valign="top"> <td> <div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:350px;'> <div class="dhx_cal_navline"> <div class="dhx_cal_prev_button"> </div> <div class="dhx_cal_next_button"> </div> <div class="dhx_cal_today_button"></div> <div class="dhx_cal_date"></div> <div class="dhx_cal_tab" name="month_tab" style="right:84px;"></div> <div class="dhx_cal_tab" name="year_tab" style="right:20px;"></div> </div> <div class="dhx_cal_header"></div> <div class="dhx_cal_data"></div> </div> </td> </tr> </table>then associate this module to the position you like the most.
You can see the calendar integrated in such way in my website: ict.unimo.it/index.php/for-s … urses-2012
(look at HTML source)