SD.teacherTools.addPage('mealOrders', {
	title: 'Meals Ordering',
	id: 'meals-panel',
	layout: 'fit',
	hideMode: 'offsets',
	tools: [{
		id: 'help',
		handler: function(btn) {
			helppopup.loadHelpFile("Meal Ordering", 500, 455);
		}
	}],
	tbar: {
		xtype: 'toolbar',
		defaults: {
			style: 'margin-left: 5px;'
		},
		items: [{
			xtype: 'label',
			text: 'Order date:'
		},
		{
			xtype: 'datefield',
			id: 'meals_date',
			tabIndex: 1,
			listeners: {
				setValue: function(datefield, newValue, oldValue) {
					Ext.getCmp('mealsMenuGrid').store.baseParams.date = datefield.value;
					Ext.getCmp('mealsMenuGrid').store.load();
					Ext.getCmp('mealsStudentGrid').store.baseParams.date = datefield.value;
					Ext.getCmp('mealsStudentGrid').store.load();
				},
				render: function() {
					this.setValue(new Date().format('m/d/Y'));
				}
			}
		},
		{
			xtype: 'tbseparator',
			style: 'margin-left: 10px;'
		},
		{
			xtype: 'label',
			text: 'Homeroom:'
		},
		new SchoolDynamics.homeroomCombo({
			id: 'meals_homeroom',
			listeners: {
				setValue: function(combobox, newValue, oldValue) {
					Ext.getCmp('mealsStudentGrid').store.baseParams.homeroom = newValue;
					Ext.getCmp('mealsStudentGrid').store.load();
				}
			}
		}),
		{
			xtype: 'tbseparator',
			style: 'margin-left: 10px;'
		},
		{
			xtype: 'label',
			text: 'Meal:'
		},
		{
			xtype: 'combo',
			width: 100,
			id: 'meals_meal',
			store: new Ext.data.Store({
				url: 'teacher_tools/meals_data.json.php',
				baseParams: {
					command: 'getMeals'
				},
				reader: new Ext.data.JsonReader({
					root: 'meals'
				}, [{
					name: 'mealid'
				},
				{
					name: 'meal'
				}]),
				autoLoad: false
			}),
			listWidth: 100,
			allowBlank: false,
			displayField: 'meal',
			valueField: 'mealid',
			typeAhead: true,
			triggerAction: 'all',
			listeners: {
				setValue: function(combobox, newValue, oldValue) {
					Ext.getCmp('mealsMenuGrid').store.baseParams.meal = newValue;
					Ext.getCmp('mealsMenuGrid').store.load();
					Ext.getCmp('mealsStudentGrid').store.baseParams.meal = newValue;
					Ext.getCmp('mealsStudentGrid').store.load();
				}
			}
		}]
	},
	items: [{
		xtype: 'panel',
		layout: 'uxcolumn',
		defaults: {
			style: {
				padding: 15
			},
			columnWidth: .5
		},
		layoutConfig: {
			fitHeight: true
		},
		border: false,
		items: [
		new mealsMenuGrid(),
		{
			xtype: 'panel',
			border: false,
			columnWidth: 0,
			width: 30,
			style: 'margin: 0;',
			layout: {
				type: 'vbox',
				padding: '5',
				pack: 'center',
				align: 'center'
			},
			defaults: {
				xtype: 'button',
				margins: '0 0 5px 0'
			},
			items: [{
				iconCls: 'arrow_right',
				listeners: {
					click: function(btn) {
						var gridFrom = Ext.getCmp('mealsMenuGrid'),
							gridTo = Ext.getCmp('mealsStudentGrid');
						var menurecords = gridFrom.selModel.getSelections();
						var selectedGroups = gridTo.selModel.getHeaderSelections();
						if (!menurecords.length) {
							Ext.MessageBox.alert('ERROR', 'Please select food choices to order.');
							return false;
						} else if (!selectedGroups.length) {
							Ext.MessageBox.alert('ERROR', 'Please select students to add the food choices to.');
							return false;
						}
						for (var i = 0, mlen = menurecords.length; i < mlen; i++) {
							for (var j = 0, slen = selectedGroups.length; j < slen; j++) {
								gridTo.addItem(menurecords[i].data, selectedGroups[j].first().id)
							}
						}
						gridTo.store.save();
					}
				}
			},
			{
				iconCls: 'arrow_left',
				id: 'meals_removebtn',
				listeners: {
					click: function(btn) {
						var grid = Ext.getCmp('mealsStudentGrid');
						grid.store.remove(grid.selModel.getSelections());
						grid.store.save();
					}
				}
			}]
		},
		new mealsStudentGrid()]
	}],
	listeners: {
		show: function(panel) {
			panel.getTopToolbar().items.item('meals_homeroom').setValue(SchoolDynamics.homeroom);
			panel.getTopToolbar().items.item('meals_meal').setValue(SchoolDynamics.meal);
		},
		render: function(panel) {
			/****************************
			 * drag student data
			 */
			var grid = Ext.getCmp('mealsStudentGrid');
			var firstGridDDGroup = new Ext.dd.DropTarget(panel.getEl().dom, { // drag off of "Students" grid
				ddGroup: 'dd_students_off',
				notifyDrop: function(ddSource, e, data) {
					if (this.invaliddrop) return false;
					var selectedRows = data.selections;
					for (i = 0; i < selectedRows.length; i++) {
						grid.store.remove(selectedRows[i]);
					}
					grid.store.save();
					return true;
				},
				notifyOver: function(ddSource, e, data) {
					grid.addClass(grid.ddGroup);
					if (!Ext.get(e.target).findParentNode("div." + grid.ddGroup)) { //if we're NOT dragging over the originating grid
						this.invaliddrop = false;
						return this.dropAllowed;
					} else {
						this.invaliddrop = true;
						return this.dropNotAllowed;
					}
				}
			});
			//end student drag
		}
	}
});