examples/docs/source/MonthViewTemplate.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 <div id="cls-Ext.calendar.MonthViewTemplate"></div>/**\r
  16  * @class Ext.calendar.MonthViewTemplate\r
  17  * @extends Ext.XTemplate\r
  18  * <p>This is the template used to render the {@link Ext.calendar.MonthView MonthView}. Internally this class defers to an\r
  19  * instance of {@link Ext.calerndar.BoxLayoutTemplate} to handle the inner layout rendering and adds containing elements around\r
  20  * that to form the month view.</p> \r
  21  * <p>This template is automatically bound to the underlying event store by the \r
  22  * calendar components and expects records of type {@link Ext.calendar.EventRecord}.</p>\r
  23  * @constructor\r
  24  * @param {Object} config The config object\r
  25  */\r
  26 Ext.calendar.MonthViewTemplate = function(config){\r
  27     \r
  28     Ext.apply(this, config);\r
  29     \r
  30     this.weekTpl = new Ext.calendar.BoxLayoutTemplate(config);\r
  31     this.weekTpl.compile();\r
  32     \r
  33     var weekLinkTpl = this.showWeekLinks ? '<div class="ext-cal-week-link-hd">&nbsp;</div>' : '';\r
  34     \r
  35     Ext.calendar.MonthViewTemplate.superclass.constructor.call(this,\r
  36         '<div class="ext-cal-inner-ct {extraClasses}">',\r
  37             '<div class="ext-cal-hd-ct ext-cal-month-hd">',\r
  38                 weekLinkTpl,\r
  39                 '<table class="ext-cal-hd-days-tbl" cellpadding="0" cellspacing="0">',\r
  40                     '<tbody>',\r
  41                         '<tr>',\r
  42                             '<tpl for="days">',\r
  43                                 '<th class="ext-cal-hd-day{[xindex==1 ? " ext-cal-day-first" : ""]}" title="{.:date("l, F j, Y")}">{.:date("D")}</th>',\r
  44                             '</tpl>',\r
  45                         '</tr>',\r
  46                     '</tbody>',\r
  47                 '</table>',\r
  48             '</div>',\r
  49             '<div class="ext-cal-body-ct">{weeks}</div>',\r
  50         '</div>'\r
  51     );\r
  52 };\r
  53 \r
  54 Ext.extend(Ext.calendar.MonthViewTemplate, Ext.XTemplate, {\r
  55     // private\r
  56     applyTemplate : function(o){\r
  57         var days = [],\r
  58             weeks = this.weekTpl.apply(o),\r
  59             dt = o.viewStart;\r
  60         \r
  61         for(var i = 0; i < 7; i++){\r
  62             days.push(dt.add(Date.DAY, i));\r
  63         }\r
  64         \r
  65         var extraClasses = this.showHeader === true ? '' : 'ext-cal-noheader';\r
  66         if(this.showWeekLinks){\r
  67             extraClasses += ' ext-cal-week-links';\r
  68         }\r
  69         \r
  70         return Ext.calendar.MonthViewTemplate.superclass.applyTemplate.call(this, {\r
  71             days: days,\r
  72             weeks: weeks,\r
  73             extraClasses: extraClasses \r
  74         });\r
  75     }\r
  76 });\r
  77 \r
  78 Ext.calendar.MonthViewTemplate.prototype.apply = Ext.calendar.MonthViewTemplate.prototype.applyTemplate;\r
  79 </pre>
  80 </body>
  81 </html>