Upgrade to ExtJS 3.3.0 - Released 10/06/2010
[extjs.git] / examples / calendar / src / templates / DayHeaderTemplate.js
diff --git a/examples/calendar/src/templates/DayHeaderTemplate.js b/examples/calendar/src/templates/DayHeaderTemplate.js
new file mode 100644 (file)
index 0000000..911124f
--- /dev/null
@@ -0,0 +1,50 @@
+/*!
+ * Ext JS Library 3.3.0
+ * Copyright(c) 2006-2010 Ext JS, Inc.
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+/**
+ * @class Ext.calendar.DayHeaderTemplate
+ * @extends Ext.XTemplate
+ * <p>This is the template used to render the all-day event container used in {@link Ext.calendar.DayView DayView} and 
+ * {@link Ext.calendar.WeekView WeekView}. Internally the majority of the layout logic is deferred to an instance of
+ * {@link Ext.calendar.BoxLayoutTemplate}.</p> 
+ * <p>This template is automatically bound to the underlying event store by the 
+ * calendar components and expects records of type {@link Ext.calendar.EventRecord}.</p>
+ * <p>Note that this template would not normally be used directly. Instead you would use the {@link Ext.calendar.DayViewTemplate}
+ * that internally creates an instance of this template along with a {@link Ext.calendar.DayBodyTemplate}.</p>
+ * @constructor
+ * @param {Object} config The config object
+ */
+Ext.calendar.DayHeaderTemplate = function(config){
+    
+    Ext.apply(this, config);
+    
+    this.allDayTpl = new Ext.calendar.BoxLayoutTemplate(config);
+    this.allDayTpl.compile();
+    
+    Ext.calendar.DayHeaderTemplate.superclass.constructor.call(this,
+        '<div class="ext-cal-hd-ct">',
+            '<table class="ext-cal-hd-days-tbl" cellspacing="0" cellpadding="0">',
+                '<tbody>',
+                    '<tr>',
+                        '<td class="ext-cal-gutter"></td>',
+                        '<td class="ext-cal-hd-days-td"><div class="ext-cal-hd-ad-inner">{allDayTpl}</div></td>',
+                        '<td class="ext-cal-gutter-rt"></td>',
+                    '</tr>',
+                '</tobdy>',
+            '</table>',
+        '</div>'
+    );
+};
+
+Ext.extend(Ext.calendar.DayHeaderTemplate, Ext.XTemplate, {
+    applyTemplate : function(o){
+        return Ext.calendar.DayHeaderTemplate.superclass.applyTemplate.call(this, {
+            allDayTpl: this.allDayTpl.apply(o)
+        });
+    }
+});
+
+Ext.calendar.DayHeaderTemplate.prototype.apply = Ext.calendar.DayHeaderTemplate.prototype.applyTemplate;