Ext.namespace('gradebookSummary');


/*************************************************************
 * Generic Gradebook Summary Chart Components 
 */ 
gradebookSummary.charts = function(config) {

   var title = config.title;
   var summaryType = left(title, strpos(title, ' ')).toLowerCase();
   
   gradebookSummary.charts.superclass.constructor.call(this, {
             
             //custom function
             loadChart: function(gridstore, gridrecords) {
                  var gradescale = Ext.getCmp('gradebookGrid').gradescale;
                  var southpanel = this;
                  var chart = southpanel.items.itemAt(southpanel.items.itemAt(0).hidden? 1 : 0);
                  var gradetype = (chart.series[0]!=undefined? chart.series[0].gradetype : chart.series.gradetype );
                  
                  //clear chartstore fields
                  chart.store.removeAll();
                  
                  //loop through records
                  for (var i=0, len=gridrecords.length; i<len; i++) {
                     var field = gridrecords[i].data;
                     var grade = (isnum(gridrecords[i].data.grade)?parseFloat(gridrecords[i].data.grade):field[gradetype]);
                     //calculate lettergrade
                     for (var j=0, glen=gradescale.data.length; j<glen; j++) {
                        var scale = gradescale.data.itemAt(j).data;
                        
                        if (scale.lowvalue<grade && grade<scale.highvalue) {
                           var rec = chart.store.getAt(chart.store.find('lettergrade', scale.lettergrade));
                           var chartRec = Ext.data.Record.create(chart.store.fields.items);
                           if (rec == undefined) {
                              chart.store.add(new chartRec({lettergrade:scale.lettergrade, frequency:0}));
                           } else {
                              rec.set('frequency', rec.data.frequency+1);
                           }
                        }
                     }
                  }
             },
             //end custom function
             xtype: 'panel',
             region: 'south',
             border: false,
             split: true,
             height: 250,
             title: 'Graph',
             collapsedTitle: 'Graph',
             titleCollapse: true,
             collapsible: true,
             tbar: {
                 xtype: 'toolbar',
                 items: [
                     {
                         xtype: 'label',
                         text: 'Graph format:',
                         style: 'margin-left: 5px;'
                     },
                     {
                        //xtype: 'splitbutton',
                        xtype: 'cycle', //dave
                        showText: true, //dave
                        style: 'margin-left: 5px;',
                        //text: 'Line',
                        handler: function(btn) {
                           var southpanel = this.ownerCt.ownerCt;
                           var chart, thecharts = southpanel.items;
                           chartType = btn.text.toLowerCase();
                           if (chartType == 'bar') {
                              chartType = 'column';
                           }
                           if (chartType == 'pie') {
                              thecharts.itemAt(0).show();
                              thecharts.itemAt(1).hide();
                              chart = thecharts.itemAt(0);
                           } else {
                              thecharts.itemAt(0).hide();
                              thecharts.itemAt(1).show();
                              chart = thecharts.itemAt(1);
                           }
                           if (chart.series[0]!=undefined) {
                              chart.series[0].type = chartType;
                           } else {
                              chart.series.type = chartType;
                           }
                           if (chart.rendered) chart.refresh();
                         },
                         items: [
                            {
                                xtype: 'menucheckitem',
                                text: 'Line',
                                checked: true,
                                iconCls: 'chart_line',
                                handler: function(btn) {
                                    this.handler(btn);
                                }
                            },
                            {
                                xtype: 'menucheckitem',
                                text: 'Pie',
                                iconCls: 'chart_pie',
                                handler: function(btn) {
                                    this.handler(btn);
                                }
                            },
                            {
                                xtype: 'menucheckitem',
                                text: 'Bar',  
                                iconCls: 'chart_bar',
                                handler: function(btn) {
                                    this.handler(btn);
                                }
                            }
                         ]
                         /*menu: {
                           items:[
                              {
                                 text: 'Pie',
                                 handler: function(btn) {
                                    this.ownerCt.ownerCt.handler(btn);
                                 }
                              },
                              {
                                 text: 'Column',
                                 handler: function(btn) {
                                    this.ownerCt.ownerCt.handler(btn);
                                 }
                              }
                           ]
                        }*/
                     },
                     {
                         xtype: 'tbseparator',
                         hidden: (summaryType=='student' || summaryType=='task'),
                         style: 'margin-left: 5px; padding-left: 15px;'
                     },
                     {
                         xtype: 'label',
                         hidden: (summaryType=='student' || summaryType=='task'),
                         text: 'Grade type:',
                         style: 'margin-left: 5px;'
                     },
                     {
                         xtype: 'splitbutton',
                         hidden: (summaryType=='student' || summaryType=='task'),
                         style: 'margin-left: 5px;',
                         itemId: 'avg',
                         text: 'Average',
                         handler: function(btn) {
                              var popup = this.ownerCt.ownerCt.ownerCt;
                              var southpanel = this.ownerCt.ownerCt;
                              var grid = popup.items.itemAt(0);
                              var chart = popup.items.itemAt(1).items.itemAt(popup.items.itemAt(1).items.itemAt(0).hidden? 1 : 0);
                              
                              if (chart.series[0]!=undefined) {
                                 chart.series[0].displayName = btn.text;
                              } else {
                                 chart.series.displayName = btn.text;
                              }
                              if (chart.series[0]!=undefined) {
                                 chart.series[0].gradetype = btn.text.toLowerCase();
                              } else {
                                 chart.series.gradetype = btn.text.toLowerCase();
                              }
                              if (chart.xAxis!=undefined) chart.xAxis.title = (summaryType=='course'?btn.text+' ':'') + 'Grade';
                              southpanel.loadChart(grid.store, grid.store.data.items);
                         },
                         menu: {
                           items:[
                              {
                                 text: 'Low',
                                 handler: function(btn) {
                                    this.ownerCt.ownerCt.handler(btn);
                                 }
                              },
                              {
                                 text: 'Median',
                                 handler: function(btn) {
                                    this.ownerCt.ownerCt.handler(btn);
                                 }
                              },
                              {
                                 text: 'High',
                                 handler: function(btn) {
                                    this.ownerCt.ownerCt.handler(btn);
                                 }
                              }
                           ]
                        }
                     }
                 ]
             },
             defaults: {/* generic chart properties */
               url: 'ext/resources/charts.swf', //relative to /v3/
               store: new Ext.data.Store({  
                  reader: new Ext.data.ArrayReader({},[
                     {name:'lettergrade'},
                     {name:'frequency',type:'int',defaultValue:0}
                  ]),
                  listeners: {
                     add: function (store, records, index) {
                        store.sort('lettergrade', 'ASC');
                     }
                  }
               }),
               tipRenderer : function(chart, record, index, series){
                  return (summaryType=='course'?(chart.series[0]!=undefined?chart.series[0]:chart.series).displayName:'')+' Grade: '+record.data.lettergrade+'\nFrequency: '+record.data.frequency;
               }
             },
             items:[
               {/* pie chart */
                  xtype:'piechart',
                  hidden: true,
                  categoryField: 'lettergrade',
                  dataField: 'frequency',
                  extraStyle: {
                     legend: {
                        display: 'bottom',
                        padding: 5,
                        font: { family: 'Tahoma', size: 13 }
                     }
                  },
                  series:{}
               },/* end: pie chart */
              
               {/* column/line chart */
                  xtype: 'columnchart',
                  xField: 'lettergrade',
                  yField: 'frequency',
                  xAxis: new Ext.chart.CategoryAxis({
                      title: 'Grade'
                  }),
                  yAxis: new Ext.chart.NumericAxis({
                      title: 'Frequency'
                  }),
                  chartStyle: {
                      padding: 10,
                      animationEnabled: true,
                      dataTip: { 
                           padding: 5, 
                           border: { color: 0x99bbe8, size:1 },
                           background: { color: 0xDAE7F6, alpha: .9 },
                          font: { name: 'Tahoma', color: 0x15428B, size: 10, bold: true }
                      },
                      xAxis: {
                          color: 0x69aBc8,
                          //labelRotation: -90,
                          majorTicks: {color: 0x69aBc8, length: 4},
                          minorTicks: {color: 0x69aBc8, length: 2},
                          majorGridLines: {size: 1, color: 0xeeeeee}
                      },
                      yAxis: {
                          color: 0x69aBc8,
                          majorTicks: {color: 0x69aBc8, length: 4},
                          minorTicks: {color: 0x69aBc8, length: 2},
                          majorGridLines: {size: 1, color: 0xdfe8f6}
                      }
                  },
                  series: [{
                      type: 'line',
                      yField: 'frequency',
                      gradetype:'average',
                      style: { color:0x1592CB }
                  }]
                }/* end: column/line chart */
             ]
         });
}
Ext.extend(gradebookSummary.charts, Ext.Panel);

gradebookSummary.grid = function(config) {

   
    var columns = [
        { xtype: 'gridcolumn', sortable: true, resizable: true, width: 90, dataIndex: 'field', header: config.fieldHeader, id: 'field' },
        { xtype: 'gridcolumn', sortable: true, resizable: true, width: 90, align:'right', renderer: Ext.util.Format.numberRenderer('0.00'), dataIndex: 'low', header: 'Low Grade', id: 'low' },
        { xtype: 'gridcolumn', sortable: true, resizable: true, width: 90, align:'right', renderer: Ext.util.Format.numberRenderer('0.00'), dataIndex: 'average', header: 'Average Grade', id: 'average' },
        { xtype: 'gridcolumn', sortable: true, resizable: true, width: 90, align:'right', renderer: Ext.util.Format.numberRenderer('0.00'), dataIndex: 'median', header: 'Median Grade', id: 'median' },
        { xtype: 'gridcolumn', sortable: true, resizable: true, width: 70, align:'right', renderer: Ext.util.Format.numberRenderer('0.00'), dataIndex: 'high', header: 'High Grade', id: 'high' },
        { xtype: 'gridcolumn', sortable: true, resizable: true, width: 70, align:'right', renderer: Ext.util.Format.numberRenderer('0.00'), dataIndex: 'grade', header: 'Grade', id: 'grade' },
        { xtype: 'gridcolumn', sortable: true, dataIndex: 'courseid' }
    ];
    
    // allow samples to limit columns
    var limitColumns = config.limitColumns;
    if(limitColumns){
        var cs = [];
        for(var i = 0, len = limitColumns.length; i < len; i++){
            cs.push(columns[limitColumns[i]]);
        }
        columns = cs;
    }
   gradebookSummary.grid.superclass.constructor.call(this, {

       xtype: 'grid',
       region: 'center',
       titleCollapse: true,
       autoExpandColumn: 'field',
       header: false,
       headerAsText: false,
       enableColumnHide: false,
       enableColumnMove: false,
       enableColumnResize: false,
       stripeRows: true,
       border: false,
       split: true,
       autoHeight: false,
       style: 'border-bottom: 1px solid #99bbe8;',
       columns: columns,
       view: new Ext.grid.GroupingView({
            forceFit:true,
            showGroupName: false,
            enableNoGroups:false, // REQUIRED!
            hideGroupedColumn: true,
            groupTextTpl: '{[values.rs[0].data["course"]]} <span class="floatRight">{text}</span>'
       }),
       store: new Ext.data.GroupingStore({
            grid: this,
            url : 'teacher_tools/gradebook_data.json.php',  
            baseParams: config.baseParams,     
            reader: new Ext.data.JsonReader({root: 'graph'}, [
               {name: 'course'},
               {name: 'courseid'},
               {name: 'field'},
               {name: 'low', type:'float'},
               {name: 'average', type:'float'},
               {name: 'median', type:'float'},
               {name: 'high', type:'float'} ,
               {name: 'grade', type:'float'} 
            ]),
            autoLoad : false,
            groupField: 'courseid',
            sortInfo:{field: 'courseid', direction: 'ASC'},
            listeners: {
               beforeload: function (store, options) {
                  var params = config.requiredBaseParams;
                  for (var i=0; i< params.length; i++) {
                     if (store.baseParams[params[i]] == undefined) return false;
                  }
                  return true;
               },
               load: function(store, records, options) {
                  var southpanel = this.grid.ownerCt.items.item(1);
                  var btnAvg = southpanel.getTopToolbar().items.item('avg');
                  btnAvg.handler(btnAvg);
               }
            }
       })
   });
}
Ext.extend(gradebookSummary.grid, Ext.grid.GridPanel);
/************************************************************/

gradebookSummary.window = function(config) {

   var title = config.title;
   var summaryType = left(title, strpos(title, ' ')).toLowerCase();
   
   gradebookSummary.window.superclass.constructor.call(this, {
   
       title: title,
       width: 550,
       height: 550,
       layout: 'border',
       resizable: true,
       closeAction:'hide',
       plain: false,
       tbar: [
         { /************ Student Dropdown ************/
             xtype: 'label',
             text: 'Student:',
             hidden: (summaryType!='student'),
             style: 'margin-left: 5px;'
         },
         {
            itemId: 'gb_summary_studentid',
            hidden: (summaryType!='student'),
            xtype: 'combo',
            displayField: 'student', 
            valueField: 'studentid', 
            allowBlank: true,    
            valueNotFoundText:'', 
            editable: false,
            typeAhead: true,
            triggerAction: 'all',
            store: new Ext.data.Store({
               url : 'schooldynamics_data.json.php',
               baseParams: {command: 'getStudentsInCourse'},
               reader: new Ext.data.JsonReader({root: 'students'}, [            
                  {name: 'studentid'},
                  {name: 'student'},             
               ]),
               autoLoad : false,
               listeners: {
                  beforeload: function(store, options) {
                     return (store.baseParams.courseid != undefined);
                  }
               }
            }), 
            listeners: {
               setValue: function(combo, newValue, oldValue) {
                  var store = this.ownerCt.ownerCt.items.item(0).store;
                  store.baseParams.studentid = newValue;
                  store.load();
               }
            }
         },
         { /************ Course Dropdown ************/
             xtype: 'label',
             text: 'Course:',
             hidden: (summaryType!='course'),
             style: 'margin-left: 5px;'
         },
         new SchoolDynamics.coursesCombo({
               itemId: 'gb_summary_courseid',
               hidden: (summaryType!='course'),
               listeners: {
                  setValue: function(combo, newValue, oldValue) {
                     if (newValue!=undefined) {
                        var store = this.ownerCt.ownerCt.items.item(0).store;
                        store.baseParams.courseid = SchoolDynamics.currentCourseID = newValue;
                        store.load();
                     }
                  }
               }
         }),
         {
             xtype: 'label',
             text: 'Quarter:',
             style: 'margin-left: 5px;margin-right: 5px;'
         },
         new SchoolDynamics.quarterCombo({
               itemId: 'gb_summary_quarter',
                   listeners: {
                        setValue: function(combo, newValue, oldValue) {
                           if (isnum(newValue) && 0<newValue) {
                              var store = this.ownerCt.ownerCt.items.item(0).store;
                              store.baseParams.quarter = SchoolDynamics.currentQtr = newValue;
                              store.load();
                           }
                        }
                   }
               })
       ],
       items: [
         new gradebookSummary.grid(config),
         new gradebookSummary.charts(config)
     ],
      fbar: [
         {
            xtype: 'button',
            text: 'Close',
            handler: function() {
               this.ownerCt.ownerCt.hide();
            }
         }
      ],
      listeners: {
         show: function(popup) {
            var toolbar = popup.getTopToolbar();
            if (summaryType=='student') toolbar.items.item('gb_summary_studentid').store.baseParams.courseid = SchoolDynamics.currentCourseID;
            if (summaryType=='course') toolbar.items.item('gb_summary_courseid').setValue(SchoolDynamics.currentCourseID);
            toolbar[summaryType=='task'?'hide':'show']();
            toolbar.items.item('gb_summary_quarter').setValue(SchoolDynamics.currentQtr);
            popup.items.itemAt(0).store.groupBy(summaryType!='teacher'?'':'courseid');
         }
      }
   });
}

Ext.extend(gradebookSummary.window, Ext.Window);