if (this.eventStore) {
this.eventStore= Roo.factory(this.eventStore, Roo.data);
this.eventStore.on('load',this.onLoad, this);
+ this.eventStore.on('beforeload',this.clearEvents, this);
}
* @param {Calendar} this
* @param {event}
*/
- 'eventclick': true
+ 'eventclick': true,
+ /**
+ * @event eventrender
+ * Fires before each cell is rendered, so you can modify the contents, like cls / title / qtip
+ * @param {Calendar} this
+ * @param {data} data to be modified
+ */
+ 'eventrender': true
+
});
Roo.grid.Grid.superclass.constructor.call(this);
return ret;
},
- findCells : function(ev) {
- var s = ev.start_dt.clone().clearTime().getTime();
+ findCells : function(rec) {
+ var s = rec.data.start_dt.clone().clearTime().getTime();
// Roo.log(s);
- var e= ev.end_dt.clone().clearTime().getTime();
+ var e= rec.data.end_dt.clone().clearTime().getTime();
// Roo.log(e);
var ret = [];
this.cells.each(function(c){
},
- addItem : function(ev)
+ addItem : function(rec)
{
// look for vertical location slot in
- var cells = this.findCells(ev);
+ var cells = this.findCells(rec);
- ev.row = this.findBestRow(cells);
+ rec.row = this.findBestRow(cells);
// work out the location.
}
rows.push(crow);
- ev.els = [];
- ev.rows = rows;
- ev.cells = cells;
+ rec.els = [];
+ rec.rows = rows;
+ rec.cells = cells;
for (var i = 0; i < cells.length;i++) {
- cells[i].rows = Math.max(cells[i].rows || 0 , ev.row + 1 );
+ cells[i].rows = Math.max(cells[i].rows || 0 , rec.row + 1 );
}
- this.calevents.push(ev);
+
},
clearEvents: function() {
- if(!this.calevents){
+ if (!this.eventStore.getCount()) {
return;
}
-
+ // reset number of rows in cells.
Roo.each(this.cells.elements, function(c){
c.rows = 0;
});
- Roo.each(this.calevents, function(e) {
- Roo.each(e.els, function(el) {
+ this.eventStore.each(function(e) {
+ this.clearEvent(e);
+ },this);
+
+ },
+
+ clearEvent : function(ev)
+ {
+ if (ev.els) {
+ Roo.each(ev.els, function(el) {
el.un('mouseenter' ,this.onEventEnter, this);
el.un('mouseleave' ,this.onEventLeave, this);
el.remove();
},this);
- },this);
-
+ ev.els = [];
+ }
},
-
+ renderEvent : function(ev,ctr) {
+ if (!ctr) {
+ ctr = this.view.el.select('.fc-event-container',true).first();
+ }
+
+
+ this.clearEvent(ev);
+ //code
+
+
+
+ ev.els = [];
+ var cells = ev.cells;
+ var rows = ev.rows;
+ this.fireEvent('eventrender', this, ev);
+
+ for(var i =0; i < rows.length; i++) {
+
+ cls = '';
+ if (i == 0) {
+ cls += ' fc-event-start';
+ }
+ if ((i+1) == rows.length) {
+ cls += ' fc-event-end';
+ }
+
+ //Roo.log(ev.data);
+ // how many rows should it span..
+ var cg = this.eventTmpl.append(ctr,Roo.apply({
+ fccls : cls
+
+ }, ev.data) , true);
+
+
+ cg.on('mouseenter' ,this.onEventEnter, this, ev);
+ cg.on('mouseleave' ,this.onEventLeave, this, ev);
+ cg.on('click', this.onEventClick, this, ev);
+
+ ev.els.push(cg);
+
+ var sbox = rows[i].start.select('.fc-day-content',true).first().getBox();
+ var ebox = rows[i].end.select('.fc-day-content',true).first().getBox();
+ //Roo.log(cg);
+
+ cg.setXY([sbox.x +2, sbox.y +(ev.row * 20)]);
+ cg.setWidth(ebox.right - sbox.x -2);
+ }
+ },
renderEvents: function()
{
this.eventTmpl = new Roo.Template(
'<div class="roo-dynamic fc-event fc-event-hori fc-event-draggable ui-draggable {fccls} {cls}" style="position: absolute" unselectable="on">' +
'<div class="fc-event-inner">' +
- '<span class="fc-event-time">{time}</span>', +
- '<span class="fc-event-title" qtip="{qtip}">{title}</span>', +
+ '<span class="fc-event-time">{time}</span>' +
+ '<span class="fc-event-title" qtip="{qtip}">{title}</span>' +
'</div>' +
'<div class="ui-resizable-heandle ui-resizable-e"> </div>' +
'</div>'
this.cells.each(function(c) {
- Roo.log(c.select('.fc-day-content div',true).first());
+ //Roo.log(c.select('.fc-day-content div',true).first());
c.select('.fc-day-content div',true).first().setHeight(Math.max(34, (c.rows || 1) * 20));
});
var ctr = this.view.el.select('.fc-event-container',true).first();
var cls;
- for (var e = 0; e < this.calevents.length; e++) {
- var ev = this.calevents[e];
- ev.els = [];
- var cells = ev.cells;
- var rows = ev.rows;
- var rec = ev.rec;
-
- for(var i =0; i < rows.length; i++) {
-
- cls = '';
- if (i == 0) {
- cls += ' fc-event-start';
- }
- if ((i+1) == rows.length) {
- cls += ' fc-event-end';
- }
-
-
- // how many rows should it span..
- var cg = this.eventTmpl.append(ctr,Roo.apply({
- fccls : cls
-
- }, rec.data) , true);
-
-
- cg.on('mouseenter' ,this.onEventEnter, this, ev);
- cg.on('mouseleave' ,this.onEventLeave, this, ev);
- cg.on('click', this.onEventClick, this, ev);
-
- ev.els.push(cg);
-
- var sbox = rows[i].start.select('.fc-day-content',true).first().getBox();
- var ebox = rows[i].end.select('.fc-day-content',true).first().getBox();
- //Roo.log(cg);
-
- cg.setXY([sbox.x +2, sbox.y +(ev.row * 20)]);
- cg.setWidth(ebox.right - sbox.x -2);
- }
-
+ this.eventStore.each(function(ev){
- }
+ this.renderEvent(ev);
+
+
+ }, this);
this.view.layout();
},
onLoad: function () {
- this.clearEvents();
//Roo.log('calendar onload');
-//
- this.calevents = [];
-
+//
if(this.eventStore.getCount() > 0){
- this.eventStore.data.each(function(d){
+ this.eventStore.each(function(d){
// FIXME..
this.addItem(d);
-
- // other than the 'required' coluns, we should just pass the data from the store.
-
-
- /*cal.addItem({
- id : d.data.id,
- start: new Date(d.data.start_dt),
- end : new Date(d.data.end_dt),
- time : d.data.start_time,
- title : d.data.title,
- description : d.data.description,
- venue : d.data.venue
- });*/
+
},this);
}