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"; // grey...
  61                     } else {
  62                         rec.data.cls = 'RdYlGn-q' + rec.data.priority_id_seqid +'-7'
  63                     }
  64
  65
  66
  67                 }
  68             }
  69         });
  70
  71         var gpanel = new Roo.GridPanel(this.grid);
  72         var layout = Roo.BorderLayout.create({
  73             center: {
  74                 margins:{left:3,top:3,right:3,bottom:3},
  75                 panels: [ gpanel ]
  76             }
  77         }, 'grid-panel');
  78
  79         this.grid.render();
  80         this.grid.load();
  81
  82         var gridHead = this.grid.getView().getHeaderPanel(true);
  83         var tb = new Roo.Toolbar(gridHead, [ {
  84                             xtype: 'Button',
  85                             xns: Roo.Toolbar,
  86                             listeners : {
  87                                 click : function (_self, e)
  88                                 {
  89                                     var sd = Date.parseDate(_this.monthField.getValue(), "Y-m-d");
  90                                     sd.setMonth(sd.getMonth()-1);
  91                                     _this.monthField.setValue(sd.format('Y-m-d'));
  92                                     _this.grid.ds.load({});
  93                                 }
  94                             },
  95                             text : "Back"
  96                         },
  97                         {
  98                             xtype: 'Separator',
  99                             xns: Roo.Toolbar
 100                         },
 101                         {
 102                             xtype: 'MonthField',
 103                             xns: Roo.form,
 104                             listeners : {
 105                                 render : function (_self)
 106                                 {
 107                                  //   _this.monthField = _self;
 108                                    // _this.monthField.set  today
 109                                 },
 110                                 select : function (combo, date)
 111                                 {
 112                                    // _this.grid.ds.load({});
 113                                 }
 114                             },
 115                             value : (function() { return new Date(); })()
 116                         },
 117                         {
 118                             xtype: 'Separator',
 119                             xns: Roo.Toolbar
 120                         },
 121
 122                         {
 123                             xtype: 'Fill',
 124                             xns: Roo.Toolbar
 125                         },
 126                         {
 127                             xtype: 'Button',
 128                             xns: Roo.Toolbar,
 129                             listeners : {
 130                                 click : function (_self, e)
 131                                 {
 132                                     var sd = Date.parseDate(_this.monthField.getValue(), "Y-m-d");
 133                                     sd.setMonth(sd.getMonth()+1);
 134                                     _this.monthField.setValue(sd.format('Y-m-d'));
 135                                     _this.grid.ds.load({});
 136                                 }
 137                             },
 138                             text : "Next"
 139                         }
 140             ]);
 141
 142
 143
 144         //grid.getSelectionModel().selectFirstRow();
 145     }
 146 };
 147 Roo.onReady(Example.init, Example);