Click Handlers for Kinetic Calendar

Notes

This functionality was "enhanced" in Kinetic Calendar 2.0. You now can define ClickHandlers as part of the event configuration or Calendar configuration. The notes in this article are for "Prior to Kinetic Calendar 2.0"

Usage

In order to implement this capability - the kinetic.js file must be modified.

The file can be found on the webserver hosting Kinetic Calendar, the typical location is: webapps/KinCal/js/kinetic.js

The function to be modified (roughly line 1500 of the kinetic.js file):

editEvent:function(e,opts)

We want to change the logic.

Original:

1) Read the event clicked

2) If no event found - put out an alert message and exit

3) Open the event in the standard Kinetic Calendar viewer and exit

New process:

1) Read the event clicked

2) If no event found - put out an alert message and exit

3) (If our event) open in our custom viewer and exit

4) Open the event in the standard Kinetic Calendar viewer and exit

Original:

            // find event in calendar cache
            var event;
            for(var cCal in evtCache)
            {
                for(var evtdt in evtCache[cCal])
                {
                    if(evtCache[cCal] && evtCache[cCal][evtdt])
                    {
                        if(evtCache[cCal][evtdt][typeId] && evtCache[cCal][evtdt][typeId][id])
                        {
                            event = evtCache[cCal][evtdt][typeId][id];
                            break;
                        }
                    }
                }
            }
            if(!event)
            {
                alert(Lang.eNotFound);
                return;
            }
            currEvent = event;
            currEventType=event.type;
            // if calendar isn't writable, hide save/delete buttons
            var iswritable = isEventEditable(event);
            // clear the panel for now and then worry about
            // populating it after the callback
            $('furl').value = '';
            $('urllink').href = '';
            $('urllink').style.display = 'none';
            $('relateditems').value = '';

New logic: add your custom logic to execute and return from the editEvent before the standard viewer will execute.

            // find event in calendar cache
            var event;
            for(var cCal in evtCache)
            {
                for(var evtdt in evtCache[cCal])
                {
                    if(evtCache[cCal] && evtCache[cCal][evtdt])
                    {
                        if(evtCache[cCal][evtdt][typeId] && evtCache[cCal][evtdt][typeId][id])
                        {
                            event = evtCache[cCal][evtdt][typeId][id];
                            break;
                        }
                    }
                }
            }
            if(!event)
            {
                alert(Lang.eNotFound);
                return;
            }
  

   
   // ADDED Custom Click Handler
   if (event.calendarName == "Sithco Sample Scheduled Changes") {
window.open("http://demo.kineticdata.com/kinetic/DisplayPage?name=Change_Viewer&eventID="+event.requestId, "_blank");
return;
   }

            currEvent = event;
            currEventType=event.type;
            // if calendar isn't writable, hide save/delete buttons
            var iswritable = isEventEditable(event);
            // clear the panel for now and then worry about
            // populating it after the callback
            $('furl').value = '';
            $('urllink').href = '';
            $('urllink').style.display = 'none';
            $('relateditems').value = '';

Example

This is the end result...

        editEvent:function(e, opts)
        {
            // reset the display fields
            $('exttimerange').style.display = "none";
            var id = opts.id;
            var typeId = opts.typeId;
            // find event in calendar cache
            var event;
            for(var cCal in evtCache)
            {
                for(var evtdt in evtCache[cCal])
                {
                    if(evtCache[cCal] && evtCache[cCal][evtdt])
                    {
                        if(evtCache[cCal][evtdt][typeId] && evtCache[cCal][evtdt][typeId][id])
                        {
                            event = evtCache[cCal][evtdt][typeId][id];
                            break;
                        }
                    }
                }
            }
            if(!event)
            {
                alert(Lang.eNotFound);
                return;
            }
        
   // ADDED Custom Click Handler
   if (event.calendarName == "Sithco Sample Scheduled Changes") {
window.open("http://demo.kineticdata.com/kinetic/DisplayPage?name=Change_Viewer&eventID="+event.requestId, "_blank");
return;
   }
   
            currEvent = event;
            currEventType=event.type;
            // if calendar isn't writable, hide save/delete buttons
            var iswritable = isEventEditable(event);
            // clear the panel for now and then worry about
            // populating it after the callback
            $('furl').value = '';
            $('urllink').href = '';
            $('urllink').style.display = 'none';
            $('relateditems').value = '';
            if(iswritable)
            {
                updateFormFields(true);
                $('btnsave').style.display = '';
                $('btndeletecover').style.display = '';
                KD.calendar.panel.updateRelatedMenu(event, event.type);
            }else{
                updateFormFields(false);
                $('btnsave').style.display = 'none';
                $('btndeletecover').style.display = 'none';
            }

// etc...