function generalStore() {
	this.createStore = function(url, data) {
		this.store = new Ext.data.JsonStore({
			url : url,
			root : 'data',
			fields : data
		});
	};
	this.getMyStore = function() {
		return this.store;
	};
	this.reloadMyStore = function() {
		this.store.load();
	};
	this.countRecords = function() {
		return this.store.getTotalCount();
	};
	return this.store;
};

var test = function() {

	return {
		test : function() {
			alert("and");
		}
	};
}();

var users = function() {

	return {
		showUsersOnlineOffline : function() {
			// Define Tree.
			var treeCategoryLoader = new Ext.tree.TreeLoader({
				dataUrl : "./user.php"
			});

			var onlineUserTree = new Ext.tree.TreePanel({
				// title : 'Online',
				collapsible : false,
				animCollapse : false,
				border : false,
				// id : "test",
				el : "testing",
				id : 'usersOnlineTree',
				autoScroll : true,
				animate : true,
				// enableDD : true,
				containerScroll : true,
				height : 200
					// loader : Tree_Category_Loader
			});

			var offlineUserTree = new Ext.tree.TreePanel({
				// title : 'Gebruikers',
				collapsible : false,
				animCollapse : false,
				border : false,
				// id : "test",
				el : "testing",
				id : 'usersOfflineTree',
				autoScroll : true,
				animate : true,
				// enableDD : true,
				containerScroll : true,
				height : 149
			});

			// SET the root node.
			var onlineTreeCategoryRoot = new Ext.tree.AsyncTreeNode({
				text : 'Racing',
				qtip : 'Drivers racing',
				draggable : false,
				loader : treeCategoryLoader,
				id : 'getOnlineUsers' // this IS the id of the startnode...php
										// uses
					// this as the node argument....do not remove
			});

			var offlineTreeCategoryRoot = new Ext.tree.AsyncTreeNode({
				text : 'Last 10 min',
				qtip : 'Drivers racing the last 10 minuts',
				draggable : false,
				loader : treeCategoryLoader,
				id : 'getOfflineUsers' // this IS the id of the startnode...php
										// uses
					// this as the node argument....do not remove
			});

			// Render the tree.
			onlineUserTree.setRootNode(onlineTreeCategoryRoot);
			offlineUserTree.setRootNode(offlineTreeCategoryRoot);
			// Tree_Category.render();
			// Tree_Category2.render();
			onlineTreeCategoryRoot.expand();

			var accordion = new Ext.Panel({
				title : 'Racers Online / Offline',
				hideCollapseTool : true,
					items : [onlineUserTree, offlineUserTree],
				//layout : 'accordion',
				id : 'usersOnlineAndOffline',
				//width : "180px",
				renderTo : 'usersOnlineAndOffline',
				defaults : {
				// applied to each contained panel
				// bodyStyle: 'padding:15px'
				},
				layoutConfig : {
					// layout-specific configs go here
					fill : false,
					titleCollapse : false,
					animate : true,
					activeOnTop : false
				}/*,
				items : [{
					title : 'Website Gebruikers',
					frame : false,
				}]*/
			});

			// when clicking do something
			onlineUserTree.on('click', function(node) {
				var userID = node.attributes.userID; // get the userId from
														// PHP
				// reload tree
				offlineTreeCategoryRoot.reload();
				onlineTreeCategoryRoot.reload();

				if (userID > 0) {
					getUserProfileValues(userID);
				}
			});

			// when clicking do something
			offlineUserTree.on('click', function(node) {
				var userID = node.attributes.userID; // get the userId from
														// PHP
				// reload tree
				offlineTreeCategoryRoot.reload();
				onlineTreeCategoryRoot.reload();

				if (userID > 0) {
					getUserProfileValues(userID);
				}
			});
		},
		
		showDriverRankingLog : function(driverID, itemID, window){
			var colModel = new Ext.grid.ColumnModel([{
				header : 'Pos',
				width : 40,
				sortable : true,
				dataIndex : 'position'
			}/*, {
				header : 'Driver Name',
				width : 160,
				sortable : true,
				renderer : function(name) {
					a = "<b>" + name + "</b>";
					return a;
				},
				dataIndex : 'driverName'
			}*/, {
				header : 'Mod',
				width : 210,
				sortable : true,
				dataIndex : 'modName'
			}, {
				header : 'Circuit',
				width : 200,
				sortable : true,
				dataIndex : 'circuitName'
			},{
				header : 'Points',
				width : 75,
				sortable : true,
				dataIndex : 'points'
			}		/*
					 * , { header : 'Level', width : 65, sortable : true,
					 * dataIndex : 'level' }
					 */]);

			var url = './user.php?page=driverLog&driverID=' + driverID;
			var data = [{
				name : 'position'
			}, {
				name : 'driverName'
			}, {
				name : 'modName'
			}, {
				name : 'circuitName'
			}, {
				name : 'points'
			}];

			var store = new generalStore();
			store.createStore(url, data);
			store.reloadMyStore();

			var newStore = store.getMyStore();

			// create grid
			var grid = siteFunctions.createGrid("Personal lap log", '549px',
					200, newStore, false, colModel);
					
			var randomnumber = Math.floor(Math.random()*11);

			var panel = siteFunctions.createPanel('', '', false, '549px', 200,
					'test' + randomnumber, '');
			panel.render(itemID);

			panel.add({
				items : [grid]
			});

			if (!window) {
				panel.render(itemID);
				return;
			}

			siteFunctions.showWindow(grid, 500, 500, 100, true);
			
		},
		
		showDriverLog : function(driverID, itemID, window){
			var colModel = new Ext.grid.ColumnModel([{
				header : 'Pos',
				width : 35,
				sortable : true,
				dataIndex : 'position'
			}/*, {
				header : 'Driver Name',
				width : 160,
				sortable : true,
				renderer : function(name) {
					a = "<b>" + name + "</b>";
					return a;
				},
				dataIndex : 'driverName'
			}*/, {
				header : 'Mod',
				width : 150,
				sortable : true,
				dataIndex : 'modName'
			}, {
				header : 'Circuit',
				width : 140,
				sortable : true,
				dataIndex : 'circuitName'
			},{
				header : 'Points',
				width : 65,
				sortable : true,
				dataIndex : 'points'
			}		/*
					 * , { header : 'Level', width : 65, sortable : true,
					 * dataIndex : 'level' }
					 */]);

			var url = './user.php?page=driverLog&driverID=' + driverID;
			var data = [{
				name : 'position'
			}, {
				name : 'driverName'
			}, {
				name : 'modName'
			}, {
				name : 'circuitName'
			}, {
				name : 'points'
			}];

			var store = new generalStore();
			store.createStore(url, data);
			store.reloadMyStore();

			var newStore = store.getMyStore();

			// create grid
			var grid = siteFunctions.createGrid("Personal lap log", '549px',
					200, newStore, false, colModel);

			var panel = siteFunctions.createPanel('', '', false, '549px', 200,
					'test' + randomnumber, '');
					
			var randomnumber = Math.floor(Math.random()*11);
			
			panel.render(itemID);

			panel.add({
				items : [grid]
			});

			if (!window) {
				panel.render(itemID);
				return;
			}

			siteFunctions.showWindow(grid, 500, 500, 100, true);
			
		}		
	};
}();

// show online users
function showUsersOnlineOffline() {

}

var clan = function() {

	return {

		showClanRanking : function(window, itemID) {
			var colModel = new Ext.grid.ColumnModel([{
				header : 'pos',
				width : 40,
				sortable : true,
				dataIndex : 'position'
			}		/*
					 * ,{ header : 'Up / Down', width : 65, sortable : true,
					 * dataIndex : 'upOrDOwn' }
					 */, {
				header : 'Name',
				width : 280,
				sortable : true,
				renderer : function(name) {
					a = "<b>" + name + "</b>";
					return a;
				},
				dataIndex : 'name'
			}, {
				header : 'Clan Tag',
				width : 100,
				sortable : true,
				dataIndex : 'tag'
			}, {
				header : 'Rank Points',
				width : 150,
				sortable : true,
				dataIndex : 'rankPoints'
			}		/*
					 * , { header : 'Level', width : 65, sortable : true,
					 * dataIndex : 'level' }
					 */]);

			var url = './ranking.php?page=showClanRanking';
			var data = [{
				name : 'position'
			}, {
				name : 'name'
			}, {
				name : 'tag'
			}, {
				name : 'rankPoints'
			}, {
				name : 'rankPoints'
			}];

			var store = new generalStore();
			store.createStore(url, data);
			store.reloadMyStore();

			var newStore = store.getMyStore();

			// create grid
			var grid = siteFunctions.createGrid("Clan Member Ranking", 577,
					400, newStore, false, colModel);

			var panel = siteFunctions.createPanel('', '', false, 577, 400,
					'test', '');
			panel.render(itemID);

			panel.add({
				items : [grid]
			});

			if (!window) {
				panel.render(itemID);
				return;
			}

			siteFunctions.showWindow(grid, 500, 500, 100, true);
		},

		showClanDrivers : function(window, itemID, clanID) {
			var colModel = new Ext.grid.ColumnModel([{
				header : 'pos',
				width : 40,
				sortable : true,
				dataIndex : 'position'
			}, {
				header : 'Up / Down',
				width : 65,
				sortable : true,
				dataIndex : 'upOrDOwn'
			}, {
				header : 'Racer',
				width : 170,
				sortable : true,
				renderer : function(name) {
					a = "<b>" + name + "</b>";
					return a;
				},
				dataIndex : 'racerName'
			}, {
				header : 'Clan Tag',
				width : 75,
				sortable : true,
				dataIndex : 'clanName'
			}, {
				header : 'Rank Points',
				width : 100,
				sortable : true,
				dataIndex : 'rankPoints'
			}, {
				header : 'Overall Pos',
				width : 100,
				sortable : true,
				dataIndex : 'overallRankPosition'
			}		/*
					 * , { header : 'Level', width : 65, sortable : true,
					 * dataIndex : 'level' }
					 */]);

			var url = './ranking.php?page=showClanRankingUsers&clanID='
					+ clanID;
			var data = [{
				name : 'position'
			}, {
				name : 'racerName'
			}, {
				name : 'upOrDOwn'
			}, {
				name : 'rankPoints'
			}, {
				name : 'overallRankPosition'
			}, {
				name : 'level'
			}, {
				name : 'clanName'
			}];

			var store = new generalStore();
			store.createStore(url, data);
			store.reloadMyStore();

			var newStore = store.getMyStore();

			// create grid
			var grid = siteFunctions.createGrid("Clan Members Ranking", 577,
					400, newStore, false, colModel);

			/*
			 * var panel = new Ext.Panel({ title : 'test', width : 265, height :
			 * 250, items : grid });
			 */

			var panel = siteFunctions.createPanel('', '', false, 577, 400,
					'test', '');
			panel.render(itemID);

			panel.add({
				items : [grid]
			});

			if (!window) {
				panel.render(itemID);
				return;
			}

		}
	};
}();

// function

var circuitRanking = function() {

	return {

		showOverAllRanking : function(window, itemID, theTopPlayers) {

			var showLimit = 0;
			var title = "Over All Ranking | Recalculated every 24 hours";

			if (theTopPlayers) {
				showLimit = 100;
				title = "Over All Ranking Top 100 | Recalculated every 24 hours";
			}

			var colModel = new Ext.grid.ColumnModel([{
				header : 'pos',
				width : 40,
				sortable : true,
				dataIndex : 'position'
			}, {
				header : 'Up / Down',
				width : 60,
				sortable : true,
				dataIndex : 'upOrDOwn'
			}, {
				header : 'Racer',
				width : 180,
				sortable : true,
				renderer : function(name) {
					a = "<b>" + name + "</b>";
					return a;
				},
				dataIndex : 'racerName'
			}, {
				header : 'Clan Tag',
				width : 60,
				sortable : true,
				dataIndex : 'clanName'
			}, {
				header : 'Total Points',
				width : 70,
				sortable : true,
				dataIndex : 'rankPoints'
			}, {
				header : 'Average',
				width : 60,
				sortable : true,
				dataIndex : 'overallAveragePoints'
			}, {
				header : 'Rank',
				width : 35,
				sortable : true,
				dataIndex : 'level'
			}, {
				header : 'Country',
				width : 50,
				sortable : true,
				dataIndex : 'countryFlag'
			}		/*
					 * , { header : 'Level', width : 65, sortable : true,
					 * dataIndex : 'level' }
					 */]);

			var url = './ranking.php?page=showRanking&limit=' + showLimit;
			var data = [{
				name : 'position'
			}, {
				name : 'racerName'
			}, {
				name : 'upOrDOwn'
			}, {
				name : 'rankPoints'
			},{
				name : 'overallAveragePoints'
			}, {
				name : 'level'
			}, {
				name : 'clanName'
			}, {
				name : 'countryFlag'
			}];

			var store = new generalStore();
			store.createStore(url, data);
			store.reloadMyStore();

			var newStore = store.getMyStore();

			// create grid
			var grid = siteFunctions.createGrid('', 577, 600, newStore, false,
					colModel);

			/*
			 * var panel = new Ext.Panel({ title : 'test', width : 265, height :
			 * 250, items : grid });
			 */

			var AllMembers = new Ext.Button({
				text : 'All Members',
				iconCls : 'allMembers'
			});

			var clanRanking = new Ext.Button({
				text : 'Clan Ranking',
				iconCls : 'clanRanking',
				handler : function() {
					clan.showClanRanking(true, 'testt');
				}
			});

			var tbar = new Ext.Toolbar({
				buttons : [AllMembers, ' | ', clanRanking, ' | ']
			});

			var panel = siteFunctions.createPanel(title, '', false, 577, 605,
					itemID + 'test', '');
			panel.render(itemID);

			panel.add({
				// tbar : tbar,
				items : [grid]
			});

			if (!window) {
				panel.render(itemID);
				return;
			}

		},

		getLastInsertedLap : function(window, itemID) {
			var colModel = new Ext.grid.ColumnModel([/*
														 * { header : 'pos',
														 * width : 30, sortable :
														 * true, dataIndex :
														 * 'racePosition' },
														 */{
				header : 'Racer',
				width : 150,
				sortable : true,
				renderer : function(name) {
					a = "<b>" + name + "</b>";
					return a;
				},
				dataIndex : 'racerName'
			},		/*
					 * { header : 'Car', width : 120, sortable : true, dataIndex :
					 * 'racerCar' },
					 */{
				header : 'Series',
				width : 130,
				sortable : true,
				dataIndex : 'series'
			}, {
				header : 'Circuit',
				width : 140,
				sortable : true,
				dataIndex : 'circuit'
			}, {
				header : 'Date',
				width : 65,
				sortable : true,
				dataIndex : 'date'
			}, {
				header : 'Lap time',
				width : 65,
				sortable : true,
				dataIndex : 'lapTime'
			}]);

			var url = './circuit.php?page=getLastInsertedLaps';
			var data = [{
				name : 'racePosition'
			}, {
				name : 'racerName'
			}, {
				name : 'racerCar'
			}, {
				name : 'series'
			}, {
				name : 'date'
			}, {
				name : 'lapTime'
			}, {
				name : 'circuit'
			}];

			var store = new generalStore();
			store.createStore(url, data);
			store.reloadMyStore();

			var newStore = store.getMyStore();

			// create grid
			var grid = siteFunctions.createGrid("Last fastest laps", 577, 250,
					newStore, false, colModel);

			/*
			 * var panel = new Ext.Panel({ title : 'test', width : 265, height :
			 * 250, items : grid });
			 */

			var panel = siteFunctions.createPanel('', '', false, 577, 250,
					'test', '');
			panel.render(itemID);

			panel.add({
				items : [grid]
			});

			if (!window) {
				panel.render(itemID);
				return;
			}

			// siteFunctions.showWindow(panel, 600, 580, itemID, false);

		},

		showCircuitInfo : function(modID, circuitID) {
			var colModel = new Ext.grid.ColumnModel([{
				header : 'pos',
				width : 30,
				sortable : true,
				dataIndex : 'racePosition'
			}, {
				header : 'Racer',
				width : 120,
				sortable : true,
				renderer : function(name) {
					a = "<b>" + name + "</b>";
					return name;
				},
				dataIndex : 'racerName'
			}, {
				header : 'Car',
				width : 120,
				sortable : true,
				dataIndex : 'racerCar'
			}, {
				header : 'Series',
				width : 120,
				sortable : true,
				dataIndex : 'series'
			}, {
				header : 'Date',
				width : 80,
				sortable : true,
				dataIndex : 'date'
			}, {
				header : 'Lap time',
				width : 80,
				sortable : true,
				dataIndex : 'lapTime'
			}]);

			var url = './circuit.php?page=getCircuitRanking&circuitID='
					+ circuitID + '&modID=' + modID;
			var data = [{
				name : 'racePosition'
			}, {
				name : 'racerName'
			}, {
				name : 'racerCar'
			}, {
				name : 'series'
			}, {
				name : 'date'
			}, {
				name : 'lapTime'
			}];

			var store = new generalStore();
			store.createStore(url, data);
			store.reloadMyStore();

			var newStore = store.getMyStore();

			// create grid
			var grid = siteFunctions.createGrid("", 280, 250, newStore, false,
					colModel);
					
			var randomnumber = Math.floor(Math.random()*11);

			siteFunctions.showWindow(grid, 600, 590, 'modRanking' + randomnumber, false);
			//alert('hello test');
		},

		showCircuitRanking : function(modID, itemID, window) {
			
			var post = 0;
			var colModel = new Ext.grid.ColumnModel([{
				header : 'pos',
				width : 30,
				sortable : true,
				dataIndex : 'position',
				renderer : function(pos) {
					post++;
					return post;
				}
			}, {
				header : 'Racer',
				width : 150,
				sortable : true,
				renderer : function(name) {
					a = "<b>" + name + "</b>";
					return name;
				},
				dataIndex : 'driverName'
			}, {
				header : 'Clan',
				width : 80,
				sortable : true,
				dataIndex : 'clanTag'
			}, {
				header : 'Series',
				width : 140,
				sortable : true,
				dataIndex : 'modName'
			}, {
				header : 'Pts',
				width : 80,
				sortable : true,
				dataIndex : 'modPoints'
			}, {
				header : 'Average Pts',
				width : 80,
				sortable : true,
				dataIndex : 'modAveragePoints'
			}]);

			var url = './ranking.php?page=getModRanking&modID=' + modID;
			var data = [{
				name : 'position'
			}, {
				name : 'driverName'
			}, {
				name : 'clanTag'
			}, {
				name : 'modName'
			}, {
				name : 'modPoints'
			}, {
				name : 'modAveragePoints'
			}];

			var store = new generalStore();
			store.createStore(url, data);
			store.reloadMyStore();
			
			
			var newStore = store.getMyStore();
			newStore.setDefaultSort('modAveragePoints', 'DESC');

			// create grid
			var grid = siteFunctions.createGrid("", 570, 260, newStore, false,
					colModel);

			var panel = siteFunctions.createPanel('Mod ranking', '', false, 577, 260,
					'test', '');
			panel.render(itemID);

			panel.add({
				items : [grid]
			});

			if (!window) {
				panel.render(itemID);
				return;
			}

		}		
	};
}();

var siteFunctions = function() {

	return {
		showWindow : function(item, height, width, ID, hideBackground) {

			var sameID = Ext.getCmp(ID);
			if (sameID) {
				return;
			}

			var yPosition = this.randomNummbers(200) + 400;
			var xPosition = this.randomNummbers(200) + 400;
			var sameWindow = ID;

			var win = new Ext.Window({
				width : width,
				id : ID,
				name : ID,
				x : xPosition,
				y : yPosition,
				constrain : true,
				height : null,
				layout : 'Fit',
				modal : hideBackground,
				autoScroll : true,
				plain : true,
				resizable : false,
				collapsible : true,
				bodyBorder : false,
				items : [item]
			});

			win.show();
		},

		createPanel : function(title, html, frame, width, height, id, layout) {
			var panel = new Ext.Panel({
				title : title,
				frame : frame,
				id : id,
				layout : layout,
				width : width,
				height : height,
				html : html
			});

			return panel;
		},

		createGrid : function(title, width, height, newStore, frame, colModel) {
			var grid = new Ext.grid.GridPanel({
				title : title,
				width : width,
				border : false,
				height : height,
				// region : 'center',
				frame : frame,
				iconCls : 'icon-grid',
				// bbar : pagingBar,
				store : newStore,
				cm : colModel
			});

			return grid;
		},

		randomNummbers : function(number) {
			var randNumber = Math.random();
			randNumber = randNumber * number;
			return Math.round(randNumber);
		}
	};
}();

/*
 */