Handle calendar event tooltip and onclick with jquery

This commit is contained in:
Hadi Nategh 2014-01-06 15:36:49 +00:00
parent c4e135d64b
commit ac64b6afc4
2 changed files with 38 additions and 36 deletions

View File

@ -1773,16 +1773,7 @@ class calendar_uiviews extends calendar_ui
} }
else else
{ {
if ($event['recur_type'] != MCAL_RECUR_NONE) // Replaced with jquery click handler due to CSP consern
{
$popup = ' onclick="app.calendar.edit_series(event,'.$event['id'].','.$this->bo->date2string($event['start']).');"';
}
else
{
$view_link = egw::link('/index.php',array('menuaction'=>'calendar.calendar_uiforms.edit','cal_id'=>$event['id'],'date'=>$this->bo->date2string($event['start'])));
$popup = ' onclick="'.$this->popup($view_link).'; return false;"';
}
} }
//_debug_array($event); //_debug_array($event);
@ -1799,24 +1790,6 @@ class calendar_uiviews extends calendar_ui
$draggableID = $event['id'].'_O'.$event['owner'].'_C'.($owner<0?str_replace('-','group',$owner):$owner); $draggableID = $event['id'].'_O'.$event['owner'].'_C'.($owner<0?str_replace('-','group',$owner):$owner);
$ttip_options = array(
'BorderWidth' => 0, // as we use our round borders
'Padding' => 0,
'Sticky' => true, // make long tooltips scrollable
'ClickClose' => true,
'FOLLOWMOUSE' => false,
'DELAY' => 600,
//'FIX' => "['".$draggableID."',10,-5]",
'SHADOW' => false,
'WIDTH' => -400,
);
$ie_fix = '';
if (html::$user_agent == 'msie') // add a transparent image to make the event "opaque" to mouse events
{
$ie_fix = $indent."\t".html::image('calendar','transparent.gif','',
html::tooltip($tooltip,False,$ttip_options).
' style="top:0px; left:0px; position:absolute; height:100%; width:100%; z-index:1"') . "\n";
}
if ($this->use_time_grid) if ($this->use_time_grid)
{ {
if($event['whole_day_on_top']) if($event['whole_day_on_top'])
@ -1854,18 +1827,13 @@ class calendar_uiviews extends calendar_ui
{ {
$draggableID = $event['id'].'_O'.$event['owner'].'_C'.($owner<0?str_replace('-','group',$owner):$owner); $draggableID = $event['id'].'_O'.$event['owner'].'_C'.($owner<0?str_replace('-','group',$owner):$owner);
// If a event isn't drag-dropable, the drag drop event handling has to be fully disabled
// for that object. Clicking on it - however - should still bring it to the foreground.
$dd_emulation = ' onmousedown="dd.z++; this.style.zIndex = dd.z; event.cancelBubble=true;"'
.'onmouseup="event.cancelBubble=true;"'
.'onmousemove="event.cancelBubble=true;"';
} }
} }
$tooltip = html::htmlspecialchars(str_replace(array("\n","\r","'",'"'),array('','',"\\'",'&quot;'),$tooltip));
$resizableHelper = $this->bo->date2string($event['start']). '|' .$this->bo->format_date($event['start'],false) . '|' . $this->cal_prefs['interval']; $resizableHelper = $this->bo->date2string($event['start']). '|' .$this->bo->format_date($event['start'],false) . '|' . $this->cal_prefs['interval'];
$html = $indent.'<div id="'.$draggableID.'" data-resize="'.$resizableHelper.' " class="calendar_calEvent'.($is_private ? 'Private' : '').' '.$status_class. $html = $indent.'<div id="'.$draggableID.'" data-tooltip ="'.$tooltip .'" data-resize="'.$resizableHelper.' " class="calendar_calEvent'.($is_private ? 'Private' : '').' '.$status_class.
'" style="'.$style.' border-color: '.$headerbgcolor.'; background: '.$background.'; z-index: '.$z_index.';"'. '" style="'.$style.' border-color: '.$headerbgcolor.'; background: '.$background.'; z-index: '.$z_index.';"'.
$popup.' '.html::tooltip($tooltip,False,$ttip_options). '>'.$prefix_icon."\n".$html."\n".
$dd_emulation.'>'.$prefix_icon."\n".$ie_fix.$html."\n".
$indent."</div>"."\n"; $indent."</div>"."\n";
return $html; return $html;

View File

@ -141,6 +141,7 @@ app.classes.calendar = AppJS.extend(
}, },
}).resizable({ }).resizable({
//scroll:true,
start:function(ui,event) start:function(ui,event)
{ {
var resizeHelper = ui.target.getAttribute('data-resize'); var resizeHelper = ui.target.getAttribute('data-resize');
@ -227,6 +228,39 @@ app.classes.calendar = AppJS.extend(
}); });
//onClick Handler for calender entries
jQuery("div.calendar_calEvent").on({
click:function(ev){
var eventId = ev.currentTarget.id.replace(/drag_/g,'').split("_")[0];
var startDate = ev.currentTarget.getAttribute('data-resize').split("|")[0];
if (ev.currentTarget.id.match(/drag_/g))
{
egw.open(eventId,'calendar','edit');
}
else
{
that.edit_series(event,eventId,startDate);
}
},
mouseover: function(){
var ttp = jQuery(this).tooltip({
items: "[data-tooltip]",
content: function()
{
var elem = jQuery(this);
if (elem.is("[data-tooltip]"))
return this.getAttribute('data-tooltip') ;
},
track:true,
});
ttp.tooltip("enable");
},
mousedown: function(){
jQuery(this).tooltip("disable");
}
});
//onClick Handler for calendar cells //onClick Handler for calendar cells
jQuery("div.calendar_calAddEvent").click(function(ev) jQuery("div.calendar_calAddEvent").click(function(ev)
{ {