use popups even when there are multiple events

This commit is contained in:
Frédéric Péters 2011-11-30 20:13:04 +01:00
parent 6cd1a8c366
commit 9141130d70
1 changed files with 18 additions and 9 deletions

View File

@ -80,7 +80,7 @@
><span tal:attributes="class day/eventclass"><strong>
<a tal:condition="python: day['eventclass'] == 'misc'"
href=""
tal:attributes="href string:list#d${view/year}-${view/month}-${daynumber};
tal:attributes="href string:#d-${view/year}-${view/month}-${daynumber};
title day/eventstring;"
tal:content="daynumber">31</a
><a tal:condition="python: day['eventclass'] != 'misc'"
@ -118,8 +118,9 @@
</div>
<div id="month-events">
<div tal:repeat="event view/getMonthEvents"
tal:attributes="id string:event-${event/id}" style="display:none;">
<div tal:repeat="event view/getMonthEvents" style="display: none;"
tal:attributes="id string:event-${event/id};
class string:d-${event/start/year}-${event/start/month}-${event/start/day}">
<h3><span tal:content="event/longdatetime"/> <span tal:content="event/title"/></h3>
<p tal:condition="event/description" class="description" tal:content="event/description"></p>
<p tal:condition="event/place" class="place" tal:content="event/place"></p>
@ -130,19 +131,27 @@
<script type="text/javascript">
jq('#tabellio-agenda tbody a').click(
function(event) {
if (this.href.indexOf('/list') != -1) {
return true;
if (this.href.indexOf('#d-') != -1) {
/* multiple events */
console.log('multiple events');
console.log('.'+this.href.split('#')[1]);
eventdiv = jq('.'+this.href.split('#')[1]);
} else {
eventdiv = jq('#'+this.href.split('#')[1]);
}
eventdiv = jq('#'+this.href.split('#')[1]);
console.log('event div:', eventdiv);
console.log('event div css:', eventdiv.css('display'));
if (eventdiv.css('display') != 'none') {
eventdiv.fadeOut();
return false;
}
jq('#month-events div').hide();
eventdiv.click(function(event){jq(this).hide();});
eventdiv.css('position', 'absolute').css(
'top', 6+jq(this).position().top).css(
'left', 6+jq(this).position().left).fadeIn()
var boxtop = 6+jq(this).position().top;
eventdiv.css('position', 'absolute').each(function(idx, elem) {
$(elem).css('top', boxtop);
boxtop += $(elem).height() + 40;
}).css('left', 6+jq(this).position().left).fadeIn()
return false;
});
</script>