Ext.onReady(function(){

/***********************************************
* Start Date
***********************************************/
var startDateField = Ext.widget("datefield", {
renderTo: "startDateFld",
width: 95,
allowBlank: false,
maxValue: new Date(),
value: new Date(new Date().getTime() - 86400000), //yesterday
cls: 'middle'
});

/***********************************************
* End Date
***********************************************/
var endDateField = Ext.widget("datefield", {
renderTo: "endDateFld",
width: 95,
allowBlank: false,
maxValue: new Date(),
value: new Date(),
cls: 'middle'
});
var storeStatusJson;

/***********************************************
* Search Button
***********************************************/
/*Ext.widget("button",{
renderTo: 'searchBtn',
text: 'Search',
cls: 'srchBtn',
//href: 'mainStatus.do',
handler: function(){
//window.location="mainStatus.do";
var searchCustomerJsonData = {
StartDate: startDateField.getValue(),
EndDate: endDateField.getValue()
};
storeStatusJson = searchCustomerJsonData;

//reset back to page 1
// mainStoreStatusGrid.getStore().currentPage = 1;
mainStatusStore.load({
jsonData: storeStatusJson,
copyFiltersToJson: true,
copySortToJson: true
});
},
listeners: {
click: function(){
// if (validateFn()) {
var searchCustomerJsonData = {
StartDate: startDateField.getValue(),
EndDate: endDateField.getValue()
};
storeStatusJson = searchCustomerJsonData;

//reset back to page 1
// mainStoreStatusGrid.getStore().currentPage = 1;
mainStatusStore.load({
jsonData: storeStatusJson,
copyFiltersToJson: true,
copySortToJson: true
});
}
// }
}
}); */
/***********************************************
* Search Button
***********************************************/
/*Ext.widget("button",{
renderTo: 'searchBtn',
text: 'Search',
cls: 'srchBtn',
//href: 'mainStatus.do',
handler: function(){
//window.location="mainStatus.do";
//TODO do something, remove href
mainStatusStore.clearFilter();
mainStatusStore.load({
params:{
StartDate: startDateField.getValue(),
EndDate: endDateField.getValue()
}
});
}
});*/

/***********************************************
* New Conversion Button
***********************************************/
Ext.widget("button",{
renderTo: 'newConversionBtn',
text: 'New Conversion',
cls: 'srchBtn',
handler: function(){
window.location="newconversion.do";
}
});




/***********************************************
* Store Status Grid
***********************************************/
Ext.define('StoreStatus', {
extend: 'Ext.data.Model',
fields: ["storeNumber", "rpmsite", "storeName", "user",
{name: "startTime", type: "date", dateFormat: 'time'},
"status",
{name: "endTime", type: "date", dateFormat: 'time'},
{name: "statusId", type: "number"}]
});

var itemsPerPage = 5;

var mainStatusStore = Ext.create("Ext.data.Store", {
pageSize: itemsPerPage,
model: 'StoreStatus',
proxy: {
type: 'ajax',
url : 'storeListStatus.json',
extraParams: {
StartDate: startDateField.getValue(),
EndDate: endDateField.getValue()
},
reader: {
type: 'json',
root: 'items',
totalProperty: 'total'
}
},
listeners: {
beforeload: function(store, operation){
operation.jsonData = storeStatusJson;
operation.copyFiltersToJson = true; //copies "start" and "limit" params to JSON
operation.copySortToJson = true; //copies "sort" params to JSON
}
}
});

/*mainStatusStore.load({
params:{
start:0,
limit: itemsPerPage
}
});*/

var mainStoreStatusGrid = Ext.create('Ext.grid.Panel', {
id: 'mainStatusGridPanel',
title: 'Store Status',
store: mainStatusStore,
renderTo: 'mainStatusTable',
width: '100%',
cls: 'grid',
scroll: 'vertical',
layout: 'fit',
viewConfig: {
trackOver: false,
stripeRows: false,
getRowClass: function(record, rowIndex, rowParams, store){
if(!record) return '';
return getStatusPrefix(record.data.statusId) + 'Row';
}
},
columns: [
{header: 'Store Number', dataIndex: 'storeNumber'},
{header: 'RPM Site', dataIndex: 'rpmsite'},
{header: 'Store Name', dataIndex: 'storeName', flex: 4,
renderer: function(value, meta, record){

if (record.data.status == 'ERROR' || record.data.status == 'Aborted'){
return Ext.String.format(value, record.data.storeNumber, record.data.status,record.data.storeName);
} else {

return Ext.String.format('<a href="detailedStatus.do?storeInfo={1} - {3}&status={2}">{0}</a>',
value, record.data.storeNumber, record.data.status,record.data.storeName);
}
}
},
{header: 'Initiated By', dataIndex: 'user', flex: 2},
{header: 'Start Time', dataIndex: 'startTime',flex: 5, xtype: 'datecolumn', format: 'Y-m-d h:i A'},
{header: 'Status', dataIndex: 'status',flex: 3,
renderer: function(value, meta, record){

var css = getStatusPrefix(record.data.statusId) + "Label";

if (value == 'ERROR'){
return Ext.String.format('<span class="{0}">{1}</span>',
css, value, record.data.storeNumber);
} else {
return Ext.String.format('<span class="{0}">{1}</span>', css, value);
}
}
},
{header: 'End Time', dataIndex: 'endTime',flex: 6, xtype: 'datecolumn', format: 'Y-m-d h:i A'},
{flex: 7, sortable: false}
],
// paging bar on the bottom
bbar: Ext.create('Ext.PagingToolbar', {
store: mainStatusStore,
displayInfo: true
})
});

/**
* Get the remaining space of the viewport for the grid height
*/
function getGridHeight(){
return getRemainingHeight("mainStatusGridPanel", ["mainHeader", "header"]);
}

//Have to set the grid height after the widget is created
//so it can grab the padding values for the grid
mainStoreStatusGrid.setHeight(getGridHeight());

Ext.EventManager.onWindowResize(function(){
mainStoreStatusGrid.setHeight(getGridHeight());
mainStoreStatusGrid.forceComponentLayout();
}, mainStoreStatusGrid);

/***********************************************
* Search Button
***********************************************/
Ext.widget("button",{
renderTo: 'searchBtn',
text: 'Search',
cls: 'srchBtn',
//href: 'mainStatus.do',
/*handler: function(){
//window.location="mainStatus.do";
var searchCustomerJsonData = {
StartDate: startDateField.getValue(),
EndDate: endDateField.getValue()
};
storeStatusJson = searchCustomerJsonData;

//reset back to page 1
// mainStoreStatusGrid.getStore().currentPage = 1;
mainStatusStore.load({
jsonData: storeStatusJson,
copyFiltersToJson: true,
copySortToJson: true
});
},*/
listeners: {
click: function(){
// if (validateFn()) {
var searchCustomerJsonData = {
StartDate: startDateField.getValue(),
EndDate: endDateField.getValue()
};
storeStatusJson = searchCustomerJsonData;

//reset back to page 1
// mainStoreStatusGrid.getStore().currentPage = 1;
mainStatusStore.load({
jsonData: storeStatusJson,
copyFiltersToJson: true,
copySortToJson: true
});
}
// }
}
});
});