Upgrade to ExtJS 3.3.0 - Released 10/06/2010

[extjs.git] / examples / calendar / src / templates / MonthViewTemplate.js

diff --git a/examples/calendar/src/templates/MonthViewTemplate.js b/examples/calendar/src/templates/MonthViewTemplate.js
new file mode 100644 (file)
index 0000000..15da063
--- /dev/null
+++ b/examples/calendar/src/templates/MonthViewTemplate.js
@@ -0,0 +1,70 @@
+/*!
+ * Ext JS Library 3.3.0
+ * Copyright(c) 2006-2010 Ext JS, Inc.
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+/**\r
+ * @class Ext.calendar.MonthViewTemplate\r
+ * @extends Ext.XTemplate\r
+ * <p>This is the template used to render the {@link Ext.calendar.MonthView MonthView}. Internally this class defers to an\r
+ * instance of {@link Ext.calerndar.BoxLayoutTemplate} to handle the inner layout rendering and adds containing elements around\r
+ * that to form the month view.</p> \r
+ * <p>This template is automatically bound to the underlying event store by the \r
+ * calendar components and expects records of type {@link Ext.calendar.EventRecord}.</p>\r
+ * @constructor\r
+ * @param {Object} config The config object\r
+ */\r
+Ext.calendar.MonthViewTemplate = function(config){\r
+    \r
+    Ext.apply(this, config);\r
+    \r
+    this.weekTpl = new Ext.calendar.BoxLayoutTemplate(config);\r
+    this.weekTpl.compile();\r
+    \r
+    var weekLinkTpl = this.showWeekLinks ? '<div class="ext-cal-week-link-hd">&nbsp;</div>' : '';\r
+    \r
+    Ext.calendar.MonthViewTemplate.superclass.constructor.call(this,\r
+        '<div class="ext-cal-inner-ct {extraClasses}">',\r
+            '<div class="ext-cal-hd-ct ext-cal-month-hd">',\r
+                weekLinkTpl,\r
+                '<table class="ext-cal-hd-days-tbl" cellpadding="0" cellspacing="0">',\r
+                    '<tbody>',\r
+                        '<tr>',\r
+                            '<tpl for="days">',\r
+                                '<th class="ext-cal-hd-day{[xindex==1 ? " ext-cal-day-first" : ""]}" title="{.:date("l, F j, Y")}">{.:date("D")}</th>',\r
+                            '</tpl>',\r
+                        '</tr>',\r
+                    '</tbody>',\r
+                '</table>',\r
+            '</div>',\r
+            '<div class="ext-cal-body-ct">{weeks}</div>',\r
+        '</div>'\r
+    );\r
+};\r
+\r
+Ext.extend(Ext.calendar.MonthViewTemplate, Ext.XTemplate, {\r
+    // private\r
+    applyTemplate : function(o){\r
+        var days = [],\r
+            weeks = this.weekTpl.apply(o),\r
+            dt = o.viewStart;\r
+        \r
+        for(var i = 0; i < 7; i++){\r
+            days.push(dt.add(Date.DAY, i));\r
+        }\r
+        \r
+        var extraClasses = this.showHeader === true ? '' : 'ext-cal-noheader';\r
+        if(this.showWeekLinks){\r
+            extraClasses += ' ext-cal-week-links';\r
+        }\r
+        \r
+        return Ext.calendar.MonthViewTemplate.superclass.applyTemplate.call(this, {\r
+            days: days,\r
+            weeks: weeks,\r
+            extraClasses: extraClasses \r
+        });\r
+    }\r
+});\r
+\r
+Ext.calendar.MonthViewTemplate.prototype.apply = Ext.calendar.MonthViewTemplate.prototype.applyTemplate;\r