examples/docs/source/WeekEventRenderer.html

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