/*
 * Copyright(c) 2008, Soft Idiom 
 * www.softidiom.com | www.4dsites.com
 */

var entity = 'user';
var entities = 'users';
var grid, store;
Ext.BLANK_IMAGE_URL = '/shared/ext/v2.2/resources/images/default/s.gif';

Ext.override( Ext.ux.grid.GridFilters , {
	buildQuery : function(filters) {
		return {filters: Ext.encode(filters)};
	}
});

Ext.onReady(function(){
	window.onbeforeunload = confirmExit;
	Ext.QuickTips.init();
	Ext.ux.menu.RangeMenu.prototype.icons = {
		gt: '/shared/img/v1/icons/greater_than.png', 
		lt: '/shared/img/v1/icons/less_than.png',
		eq: '/shared/img/v1/icons/equals.png'
	};
	Ext.ux.grid.filter.StringFilter.prototype.icon = '/shared/img/v1/icons/find.png';
	var filters = new Ext.ux.grid.GridFilters({filters:[
		{type: 'string', dataIndex: 'name'},
		{type: 'date', dataIndex: 'dob'},
		{type: 'string', dataIndex: 'location'},
		{type: 'numeric', dataIndex: 'uploads'},
		{type: 'boolean', dataIndex: 'featured'}
	]});

    // create the Data Store
    store = new Ext.data.GroupingStore({
        proxy: new Ext.data.HttpProxy({
            url: './php/v1/get.php'
        }),
        // create reader that reads the records
        reader: new Ext.data.JsonReader({
            root: 'results',
            totalProperty: 'total',
            id: 'id',
            fields: [
                'id','userid','name','avatar',{name:'dob',type:'date',dateFormat:'Y-m-d'},'location','summary','uploads','featured'
            ]
        }),
        sortInfo: {field:'name', direction:'ASC'},
        remoteSort: true
    });

	store.on('beforeload', function() {
	    if(formIsDirty()) {
	      var answer = confirm('Save unsaved changes first?');
	      if (answer) { saveGrid() }
	    }
	});

    //selection model
    var sm = new Ext.grid.CheckboxSelectionModel();

    // the column model
    var cm = new Ext.grid.ColumnModel([
    	//sm,
    	{
    		header: 'Avatar', dataIndex: 'avatar', width: 60,
    		renderer: function(v) {return '<img style="cursor:pointer" src="'+Ext.util.Format.htmlEncode(v)+'" width="50" height="50" alt="" />'}
    	},
		{
			header: 'Name', dataIndex: 'name', width: 260,
			renderer: function(v) {return '<span class="mixlink" title="View Profile of: '+Ext.util.Format.htmlEncode(v)+'">'+Ext.util.Format.htmlEncode(v)+'</span>'}
		},
		{
			header: 'Born', dataIndex: 'dob', width: 70, align: 'right',
			renderer: function(v) {
				return v ? v.dateFormat('d/m/Y') : '';
			}
		},
		{
			header: 'Location', dataIndex: 'location', width: 140,
			renderer: Ext.util.Format.htmlEncode
		},
		{
			header: 'Uploads', dataIndex: 'uploads', align: 'right', width: 70
		},
		{
			header: 'Featured', dataIndex: 'featured', align: 'center', width: 70,
			renderer: function(v) {
				if(v == 1) return 'Yes';
				return 'No';
			}
		}
	]);

    // by default columns are sortable
    cm.defaultSortable = true;
    
    var grid = new Ext.grid.GridPanel({
        renderTo: 'copy',
        width:692,
        height:458,
        store: store,
        cm: cm,
        clicksToEdit: 1,
        trackMouseOver: false,
        sm: sm,
        loadMask: true,
        border: false,
        stripeRows: true,
		plugins: filters,
        bbar: new Ext.PagingToolbar({
            plugins: [
            	new Ext.ux.Andrie.pPageSize({afterText: ' '+entities, variations: [7,15,20,25,30,35,40,45,50,100,200,500,1000,5000]}),
            	filters
            	],
	        pageSize: 7,
	        store: store,
	        displayInfo: true,
	        displayMsg: '{0} - {1} of {2} '+entities,
	        emptyMsg: 'No '+entities+' to display'
	    })
    });

	grid.on('cellclick',function(g,r,c,e){
		var record = g.getStore().getAt(r);
		var fieldName = g.getColumnModel().getDataIndex(c);
		if(fieldName == 'name' || fieldName == 'avatar') {
			window.location = '/user/?id='+record.data.userid;
		}
	});
    // trigger the data store load
    store.load({params:{start:0, limit:7}});

    // render it
	grid.render('copy');
	
	function addRecord() {
		Ext.Ajax.request({
		   url: './php/v1/add.php',
		   success: function(response, opts) {
				var data = Ext.decode(response.responseText).data;
				var newRec = new Ext.data.Record({
					id: data.id
				}, data.id);
				grid.stopEditing();
				store.insert(0, newRec);
				grid.getSelectionModel().selectFirstRow();
				grid.startEditing(0, 2);
		   },
		   failure: function(response, opts) {
		   	   alert('failure');
		   }
		});
	}
	
	function deletSelected() {
		var selectedIds = grid.getSelectionModel().selections.keys;
		if(selectedIds.length > 0) {
			if(selectedIds.length == 1) {
				Ext.Msg.confirm('Confirm','Are you sure you want to delete this '+selectedIds.length+' '+entity+'?',deleteRecords);
			} else {
				Ext.Msg.confirm('Confirm','Are you sure you want to delete these '+selectedIds.length+' '+entities+'?',deleteRecords);
			}
		} else {
			return Ext.Msg.alert('Error','Please select one or more '+entities+' to delete first.');
		}
	}
	
	function deleteRecords(btn) {
		if(btn!='yes') {
			return;
		}
		Ext.Ajax.request({
		   url: './php/v1/delete.php',
		   params: {ids: Ext.encode(grid.getSelectionModel().selections.keys)},
		   success: function(response, opts) {
				var selectedRow = grid.getSelectionModel().getSelected();
				var selectedIndex = store.indexOf(selectedRow);
				store.reload();
				if(selectedRow) {
					grid.getSelectionModel().selectRow(selectedIndex,false);
				}
		   },
		   failure: function(response, opts) {
		   	   alert('failure');
		   }
		});
	}
	
	function saveGrid() {
		var dirtyData = new Array();
		for(var i=0;i<store.getCount();i++) {
			var rec = store.getAt(i);
			if(rec.dirty){
				dirtyData[dirtyData.length]=rec.data;
			}
		}
		if (dirtyData.length > 0) {
			var waitMsg = Ext.Msg.wait('Saving changes, please wait...');
			Ext.Ajax.request({
			   url: './php/v1/save.php',
			   params: {dirty_data: Ext.util.JSON.encode(dirtyData)},
			   success: function(response, opts) {
					waitMsg.hide();
					var result = Ext.util.JSON.decode(response.responseText);
					if (result.success) {
						store.commitChanges();
					} else {
						Ext.Msg.alert('Warning','Some changes were not saved - please refresh grid.');
					}
			   },
			   failure: function(response, opts) {
					waitMsg.hide();
					Ext.Msg.alert('Error','Could not connect to server, there may be a problem with the server or the Internet connection. Please wait a few seconds and try saving again.');
			   }
			});	
		} else {
			Ext.Msg.alert('Error','There are no unsaved changes to save at this time.');
		}
	}
	
	function refreshGrid() {
		store.reload();
	}
	
});

function confirmExit() {
	//if there is dirty data prompt to save it
	if (formIsDirty()) {
		return 'There are unsaved changes. If you continue the changes will be lost.';
	}
}
  
function formIsDirty() {
	//return true if the grid has unsaved changes
	for (var i = 0 ;i < store.getCount(); i++) {
		var rec = store.getAt(i);
		if (rec.dirty){
			return true;
		}
	}
	return false;
}


