git.roojs.org Git - roojs1/blob - examples/grid/calendar.js

   1 /*
   2  * Based on:
   3  * Ext JS Library 1.1.1
   4  * Copyright(c) 2006-2007, Ext JS, LLC.
   5  *
   6  * Originally Released Under LGPL - original licence link has changed is not relivant.
   7  *
   8  * Fork - LGPL
   9  * <script type="text/javascript">
  10  */
  11
  12 Roo.BLANK_IMAGE_URL  = "../../images/default/s.gif";
  13
  14
  15 var Example = {
  16     init : function(){
  17         // some data yanked off the web
  18         Roo.QuickTips.init ();
  19
  20         // create the Grid
  21         this.grid = new Roo.grid.Calendar('grid-example', {
  22             background: false,
  23             eventStore : {
  24                 xtype: 'Store',
  25                 xns: Roo.data,
  26                 listeners : {
  27                     beforeload : function (_self, o){
  28                         o.params = o.params || {};
  29                         //var d = new Date().format('Y-m-d');
  30                         //if(_this.cal){
  31                         //    d = typeof(_this.cal.activeDate) == 'string' ? _this.cal.activeDate : _this.cal.activeDate.format("Y-m-d");
  32                         //}
  33                         //o.params._activeDate = d
  34                     }
  35                 },
  36                 remoteSort : true,
  37                 sortInfo : { direction : 'ASC', field: 'start_dt' },
  38                 proxy : {
  39                     xtype: 'HttpProxy',
  40                     xns: Roo.data,
  41                     method : 'GET',
  42                     url : 'http://roojs.com/admin.php/Roo/mtrack_ticket?_dc=1396967515369&_future_schedule=1&query%5Bviewtype%5D=active&limit=999&sort=summary&dir=ASC'
  43                 },
  44                 reader : {
  45                     xtype: 'JsonReader',
  46                     xns: Roo.data,
  47                     id : 'id',
  48                     root : 'data',
  49                     totalProperty : 'total',
  50                     fields : [{"name":"id","type":"int"},{"name":"title","type":"string"}]
  51                 }
  52             },
  53             listeners : {
  54                 eventrender : function(c, rec) {
  55                     rec.data.time = ''; // not needed
  56                     rec.data.title = rec.data.developer_id_name + ' ' + rec.data.project_id_name;
  57                     rec.data.qtip  = '#' + rec.data.id + ' ' + rec.data.summary;
  58
  59                     if (rec.data.estimated) {
  60                         rec.data.cls = "Greys-q3-6"; // white...
  61                     }
  62
  63                     rec.data.cls = "x-fixme";
  64
  65                 }
  66             }
  67         });
  68
  69         var gpanel = new Roo.GridPanel(this.grid);
  70         var layout = Roo.BorderLayout.create({
  71             center: {
  72                 margins:{left:3,top:3,right:3,bottom:3},
  73                 panels: [ gpanel ]
  74             }
  75         }, 'grid-panel');
  76
  77         this.grid.render();
  78         this.grid.load();
  79
  80         var gridHead = this.grid.getView().getHeaderPanel(true);
  81         var tb = new Roo.Toolbar(gridHead, [ {
  82                             xtype: 'Button',
  83                             xns: Roo.Toolbar,
  84                             listeners : {
  85                                 click : function (_self, e)
  86                                 {
  87                                     var sd = Date.parseDate(_this.monthField.getValue(), "Y-m-d");
  88                                     sd.setMonth(sd.getMonth()-1);
  89                                     _this.monthField.setValue(sd.format('Y-m-d'));
  90                                     _this.grid.ds.load({});
  91                                 }
  92                             },
  93                             text : "Back"
  94                         },
  95                         {
  96                             xtype: 'Separator',
  97                             xns: Roo.Toolbar
  98                         },
  99                         {
 100                             xtype: 'MonthField',
 101                             xns: Roo.form,
 102                             listeners : {
 103                                 render : function (_self)
 104                                 {
 105                                  //   _this.monthField = _self;
 106                                    // _this.monthField.set  today
 107                                 },
 108                                 select : function (combo, date)
 109                                 {
 110                                    // _this.grid.ds.load({});
 111                                 }
 112                             },
 113                             value : (function() { return new Date(); })()
 114                         },
 115                         {
 116                             xtype: 'Separator',
 117                             xns: Roo.Toolbar
 118                         },
 119
 120                         {
 121                             xtype: 'Fill',
 122                             xns: Roo.Toolbar
 123                         },
 124                         {
 125                             xtype: 'Button',
 126                             xns: Roo.Toolbar,
 127                             listeners : {
 128                                 click : function (_self, e)
 129                                 {
 130                                     var sd = Date.parseDate(_this.monthField.getValue(), "Y-m-d");
 131                                     sd.setMonth(sd.getMonth()+1);
 132                                     _this.monthField.setValue(sd.format('Y-m-d'));
 133                                     _this.grid.ds.load({});
 134                                 }
 135                             },
 136                             text : "Next"
 137                         }
 138             ]);
 139
 140
 141
 142         //grid.getSelectionModel().selectFirstRow();
 143     }
 144 };
 145 Roo.onReady(Example.init, Example);