git.roojs.org Git - roojs1/blob - Roo/CalendarPanel.js

   1 /*
   2  * - LGPL
   3  *
   4  * based on jquery fullcalendar
   5  *
   6  */
   7
   8
   9 /**
  10  * @class Roo.Calendar
  11  * @extends Roo.Component
  12  * Bootstrap Calendar class
  13
  14  * @constructor
  15  * Create a new Container
  16  * @param {Object} config The config object
  17  */
  18
  19 Roo.CalendarPanel = function(config){
  20
  21     Roo.log("cal panel ctr");
  22
  23     this.wrapper = Roo.DomHelper.append(document.body, // wrapper for IE7 strict & safari scroll issue
  24         {tag: "div", cls: "x-layout-grid-wrapper x-layout-inactive-content"}, true);
  25
  26     //this.wrapper.dom.appendChild(grid.getGridEl().dom);
  27
  28     Roo.CalendarPanel.superclass.constructor.call(this, this.wrapper, config);
  29
  30     Roo.log(this.el);
  31
  32     if(this.toolbar){
  33         this.toolbar.el.insertBefore(this.wrapper.dom.firstChild);
  34     }
  35     // xtype created footer. - not sure if will work as we normally have to render first..
  36     if (this.footer && !this.footer.el && this.footer.xtype) {
  37
  38         //this.footer.container = this.grid.getView().getFooterPanel(true);
  39         //this.footer.dataSource = this.grid.dataSource;
  40         //this.footer = Roo.factory(this.footer, Roo);
  41
  42     }
  43     this.view = new Roo.calendar.View(config);
  44
  45
  46     this.on('activate', function()
  47     {
  48         Roo.log('activate');
  49
  50         //console.log('render tree');
  51         this.render();
  52     },this);
  53
  54     this.addEvents({
  55         /**
  56              * @event select
  57              * Fires when a date is selected
  58              * @param {DatePicker} this
  59              * @param {Date} date The selected date
  60              */
  61         'select': true,
  62         /**
  63              * @event monthchange
  64              * Fires when the displayed month changes
  65              * @param {DatePicker} this
  66              * @param {Date} date The selected month
  67              */
  68         'monthchange': true,
  69         /**
  70              * @event evententer
  71              * Fires when mouse over an event
  72              * @param {Calendar} this
  73              * @param {event} Event
  74              */
  75         'evententer': true,
  76         /**
  77              * @event eventleave
  78              * Fires when the mouse leaves an
  79              * @param {Calendar} this
  80              * @param {event}
  81              */
  82         'eventleave': true,
  83         /**
  84              * @event eventclick
  85              * Fires when the mouse click an
  86              * @param {Calendar} this
  87              * @param {event}
  88              */
  89         'eventclick': true,
  90         /**
  91              * @event rendered
  92              * Fires when the grid is rendered
  93              * @param {Calendar} this
  94
  95              */
  96         'rendered': true
  97
  98
  99     });
 100     this.relayEvents(this.view, ["select","monthchange","evententer","eventleave","rendered"]);
 101
 102     //this.grid = grid;
 103     //this.grid.getGridEl().replaceClass("x-layout-inactive-content", "x-layout-component-panel");
 104 };
 105
 106
 107 Roo.extend(Roo.CalendarPanel, Roo.ContentPanel, {
 108
 109
 110     render : function()
 111     {
 112         var ct = this.el.appendChild(document.createElement("div"));
 113         this.onRender(this.el, false)
 114     },
 115
 116     onRender : function(ct, position)
 117     {
 118         if (this.rendered) {
 119             return;
 120         }
 121         this.rendered = true;
 122
 123         Roo.log("render calendar");
 124
 125
 126         //Roo.bootstrap.Component.superclass.onRender.call(this, ct, position);
 127
 128
 129         var cfg = Roo.apply({},  this.getAutoCreate());
 130         cfg.id = Roo.id();
 131
 132         // fill in the extra attributes
 133         if (this.xattr && typeof(this.xattr) =='object') {
 134             for (var i in this.xattr) {
 135                 cfg[i] = this.xattr[i];
 136             }
 137         }
 138
 139         if(this.dataId){
 140             cfg.dataId = this.dataId;
 141         }
 142
 143         if (this.cls) {
 144             cfg.cls = (typeof(cfg.cls) == 'undefined') ? this.cls : cfg.cls + ' ' + this.cls;
 145         }
 146
 147         if (this.style) { // fixme needs to support more complex style data.
 148             cfg.style = this.style;
 149         }
 150
 151         if(this.name){
 152             cfg.name = this.name;
 153         }
 154
 155         this.el = ct.createChild(cfg, position);
 156
 157         if(this.tabIndex !== undefined){
 158             this.el.dom.setAttribute('tabIndex', this.tabIndex);
 159         }
 160
 161
 162         this.initEvents();
 163         this.fireEvent('rendered');
 164     }
 165
 166
 167
 168
 169 });
 170
 171
 172
 173 Roo.each([
 174     'getAutoCreate',
 175     'initEvents',
 176     'resize',
 177     'showPrevMonth',
 178     'showToday',
 179     'showNextMonth',
 180     'showPrevYear',
 181     'showNextYear',
 182     'update',
 183     'findCell',
 184     'findCells',
 185     'findBestRow',
 186     'addItem',
 187     'clearEvents',
 188     'renderEvents',
 189     'onEventEnter',
 190     'onEventLeave',
 191     'onEventClick',
 192     'onMonthChange',
 193     'onLoad'
 194
 195
 196 ], function(p) {
 197     Roo.log('add' + p);
 198     Roo.CalendarPanel.prototype[p] = Roo.bootstrap.Calendar.prototype[p];
 199
 200 });