examples/calendar/src/WeekEventRenderer.js

   1 /*!
   2  * Ext JS Library 3.3.0
   3  * Copyright(c) 2006-2010 Ext JS, Inc.
   4  * licensing@extjs.com
   5  * http://www.extjs.com/license
   6  */
   7 /*
   8  * This is an internal helper class for the calendar views and should not be overridden.
   9  * It is responsible for the base event rendering logic underlying all of the calendar views.
  10  */
  11 Ext.calendar.WeekEventRenderer = function() {
  12
  13     var getEventRow = function(id, week, index) {
  14         var indexOffset = 1,
  15             //skip row with date #'s
  16             evtRow,
  17             wkRow = Ext.get(id + '-wk-' + week);
  18         if (wkRow) {
  19             var table = wkRow.child('.ext-cal-evt-tbl', true);
  20                 evtRow = table.tBodies[0].childNodes[index + indexOffset];
  21             if (!evtRow) {
  22                 evtRow = Ext.DomHelper.append(table.tBodies[0], '<tr></tr>');
  23             }
  24         }
  25         return Ext.get(evtRow);
  26     };
  27
  28     return {
  29         render: function(o) {
  30             var w = 0,
  31                 grid = o.eventGrid,
  32                 dt = o.viewStart.clone(),
  33                 eventTpl = o.tpl,
  34                 max = o.maxEventsPerDay != undefined ? o.maxEventsPerDay: 999,
  35                 weekCount = o.weekCount < 1 ? 6: o.weekCount,
  36                 dayCount = o.weekCount == 1 ? o.dayCount: 7,
  37                 cellCfg;
  38
  39             for (; w < weekCount; w++) {
  40                 if (!grid[w] || grid[w].length == 0) {
  41                     // no events or span cells for the entire week
  42                     if (weekCount == 1) {
  43                         row = getEventRow(o.id, w, 0);
  44                         cellCfg = {
  45                             tag: 'td',
  46                             cls: 'ext-cal-ev',
  47                             id: o.id + '-empty-0-day-' + dt.format('Ymd'),
  48                             html: '&nbsp;'
  49                         };
  50                         if (dayCount > 1) {
  51                             cellCfg.colspan = dayCount;
  52                         }
  53                         Ext.DomHelper.append(row, cellCfg);
  54                     }
  55                     dt = dt.add(Date.DAY, 7);
  56                 } else {
  57                     var row,
  58                         d = 0,
  59                         wk = grid[w],
  60                         startOfWeek = dt.clone(),
  61                         endOfWeek = startOfWeek.add(Date.DAY, dayCount).add(Date.MILLI, -1);
  62
  63                     for (; d < dayCount; d++) {
  64                         if (wk[d]) {
  65                             var ev = emptyCells = skipped = 0,
  66                                 day = wk[d],
  67                                 ct = day.length,
  68                                 evt;
  69
  70                             for (; ev < ct; ev++) {
  71                                 if (!day[ev]) {
  72                                     emptyCells++;
  73                                     continue;
  74                                 }
  75                                 if (emptyCells > 0 && ev - emptyCells < max) {
  76                                     row = getEventRow(o.id, w, ev - emptyCells);
  77                                     cellCfg = {
  78                                         tag: 'td',
  79                                         cls: 'ext-cal-ev',
  80                                         id: o.id + '-empty-' + ct + '-day-' + dt.format('Ymd')
  81                                     };
  82                                     if (emptyCells > 1 && max - ev > emptyCells) {
  83                                         cellCfg.rowspan = Math.min(emptyCells, max - ev);
  84                                     }
  85                                     Ext.DomHelper.append(row, cellCfg);
  86                                     emptyCells = 0;
  87                                 }
  88
  89                                 if (ev >= max) {
  90                                     skipped++;
  91                                     continue;
  92                                 }
  93                                 evt = day[ev];
  94
  95                                 if (!evt.isSpan || evt.isSpanStart) {
  96                                     //skip non-starting span cells
  97                                     var item = evt.data || evt.event.data;
  98                                     item._weekIndex = w;
  99                                     item._renderAsAllDay = item[Ext.calendar.EventMappings.IsAllDay.name] || evt.isSpanStart;
 100                                     item.spanLeft = item[Ext.calendar.EventMappings.StartDate.name].getTime() < startOfWeek.getTime();
 101                                     item.spanRight = item[Ext.calendar.EventMappings.EndDate.name].getTime() > endOfWeek.getTime();
 102                                     item.spanCls = (item.spanLeft ? (item.spanRight ? 'ext-cal-ev-spanboth':
 103                                     'ext-cal-ev-spanleft') : (item.spanRight ? 'ext-cal-ev-spanright': ''));
 104
 105                                     row = getEventRow(o.id, w, ev);
 106                                     cellCfg = {
 107                                         tag: 'td',
 108                                         cls: 'ext-cal-ev',
 109                                         cn: eventTpl.apply(o.templateDataFn(item))
 110                                     };
 111                                     var diff = Ext.calendar.Date.diffDays(dt, item[Ext.calendar.EventMappings.EndDate.name]) + 1,
 112                                         cspan = Math.min(diff, dayCount - d);
 113
 114                                     if (cspan > 1) {
 115                                         cellCfg.colspan = cspan;
 116                                     }
 117                                     Ext.DomHelper.append(row, cellCfg);
 118                                 }
 119                             }
 120                             if (ev > max) {
 121                                 row = getEventRow(o.id, w, max);
 122                                 Ext.DomHelper.append(row, {
 123                                     tag: 'td',
 124                                     cls: 'ext-cal-ev-more',
 125                                     id: 'ext-cal-ev-more-' + dt.format('Ymd'),
 126                                     cn: {
 127                                         tag: 'a',
 128                                         html: '+' + skipped + ' more...'
 129                                     }
 130                                 });
 131                             }
 132                             if (ct < o.evtMaxCount[w]) {
 133                                 row = getEventRow(o.id, w, ct);
 134                                 if (row) {
 135                                     cellCfg = {
 136                                         tag: 'td',
 137                                         cls: 'ext-cal-ev',
 138                                         id: o.id + '-empty-' + (ct + 1) + '-day-' + dt.format('Ymd')
 139                                     };
 140                                     var rowspan = o.evtMaxCount[w] - ct;
 141                                     if (rowspan > 1) {
 142                                         cellCfg.rowspan = rowspan;
 143                                     }
 144                                     Ext.DomHelper.append(row, cellCfg);
 145                                 }
 146                             }
 147                         } else {
 148                             row = getEventRow(o.id, w, 0);
 149                             if (row) {
 150                                 cellCfg = {
 151                                     tag: 'td',
 152                                     cls: 'ext-cal-ev',
 153                                     id: o.id + '-empty-day-' + dt.format('Ymd')
 154                                 };
 155                                 if (o.evtMaxCount[w] > 1) {
 156                                     cellCfg.rowSpan = o.evtMaxCount[w];
 157                                 }
 158                                 Ext.DomHelper.append(row, cellCfg);
 159                             }
 160                         }
 161                         dt = dt.add(Date.DAY, 1);
 162                     }
 163                 }
 164             }
 165         }
 166     };
 167 }();