/*
 * 	Created on Apr 17, 2008
 *
 * 	Meastas Taekwondo
 *	Avarada, Colorado
 *	Author: Paul Voris
 *	Description:
 *
 *	Revisions:
 *		20080417:Created
 *
 *
 */
var cm;
var s1;
Ext.BLANK_IMAGE_URL = './images/s.gif';
function myInit() {
	var aboutData = [
			[ 'maestas', 'about', 'North Jefferson TKD',
					'images/tinyturtle.png' ],
			[ 'instructors', 'about', 'Instructors',
					'images/icons/user_gray.png' ],
			[ 'schedule', 'about', 'Class Schedule',
					'images/icons/calendar_view_day.png' ],
			[ 'join', 'about', 'How to Join', 'images/icons/group.png' ],
			[ 'challenge', 'about', 'Team Challenge',
					'images/icons/medal_gold_3.png' ] ];
	aboutStore = new Ext.data.SimpleStore( {
		storeId : 'aboutStore',
		fields : [ {
			name : 'pid'
		}, {
			name : 'target'
		}, {
			name : 'title'
		}, {
			name : 'icon'
		} ]
	});
	aboutStore.loadData(aboutData);

	cm = new Ext.grid.ColumnModel( [ {
		header : 'Date',
		width : 160,
		css : 'font-weight:bold;',
		menuDisabled : true,
		sortable : false,
		fixed : true,
		dataIndex : 'EVENTDATE',
		renderer : renderEventDate
	}, {
		header : 'Event',
		width : 320,
		css : 'font-weight:bold;',
		menuDisabled : true,
		sortable : false,
		fixed : true,
		dataIndex : 'TITLE'
	}, {
		header : 'Location',
		width : 300,
		css : 'font-weight:bold;',
		menuDisabled : true,
		sortable : false,
		fixed : true,
		dataIndex : 'LOCATION'
	} ]);

	var navbar = new Ext.Toolbar( {
		id : 'navbar',
		renderTo : 'toolbar'
	});
	var btnHome = new Ext.Button( {
		id : 'home',
		scripted : false,
		text : '<b>Home</b>',
		icon : 'images/icons/house.png',
		cls : "x-btn-text-icon",
		handler : loadHome
	});

	navbar.addItem(btnHome);
	navbar.addSeparator();
	var btnAbout = new Ext.Button( {
		id : 'about',
		scripted : true,
		text : '<b>About Us</b>',
		icon : 'images/icons/information.png',
		cls : "x-btn-text-icon",
		handler : loadPage
	});
	navbar.addItem(btnAbout);
	navbar.addSeparator();
	var btnCalendar = new Ext.Button( {
		id : 'cal',
		scripted : false,
		text : '<b>Calendar</b>',
		icon : 'images/icons/calendar.png',
		cls : "x-btn-text-icon",
		handler : loadCal
	});
	navbar.addItem(btnCalendar);
	navbar.addSeparator();
	var menuMedia = new Ext.menu.Menu( {
		id : 'menuMedia',
		items : [ {
			text : 'Video',
			id : 'video',
			scripted : false,
			icon : 'images/icons/film.png',
			cls : "x-btn-text-icon",
			handler : loadPage,
			hidden : true
		}, {
			text : 'Audio',
			id : 'audio',
			scripted : false,
			icon : 'images/icons/sound.png',
			cls : "x-btn-text-icon",
			handler : loadPage,
			hidden : true
		}, {
			text : 'Images',
			id : 'images',
			scripted : false,
			icon : 'images/icons/picture.png',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : 'Documents',
			id : 'docs',
			scripted : false,
			icon : 'images/icons/page_white_swoosh.png',
			cls : "x-btn-text-icon",
			handler : loadPage
		} ]
	});
	navbar.add( {
		text : '<b>Media</b>',
		menu : menuMedia,
		hidden : false
	});
	var menuBelts = new Ext.menu.Menu( {
		id : 'menuBelts',
		items : [ {
			text : 'Introduction',
			id : 'intro',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '10th gup White',
			id : 'white',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '9th gup White/Yellow Stripe',
			id : 'highwhite',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '8th gup Yellow ',
			id : 'yellow',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '7th gup Yellow/Green Stripe',
			id : 'highyellow',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '6th gup Green',
			id : 'green',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '5th gup Green/Blue Stripe',
			id : 'highgreen',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '4th gup Blue',
			id : 'blue',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '3rd gup Blue/Red Stripe',
			id : 'highblue',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '2nd gup Red',
			id : 'red',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '1st gup Red/Black Stripe',
			id : 'highred',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : '1st Degree Black',
			id : 'black',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		}, {
			text : 'Sparring',
			id : 'sparring',
			scripted : false,
			icon : 'images/s.gif',
			cls : "x-btn-text-icon",
			handler : loadPage
		} ]
	});
	navbar.add( {
		text : '<b>Guide</b>',
		menu : menuBelts
	});
	var btnLinks = new Ext.Button( {
		id : 'links',
		text : '<b>Links</b>',
		scripted : false,
		icon : 'images/icons/world.png',
		cls : "x-btn-text-icon",
		handler : loadPage
	});
	navbar.addItem(btnLinks);
	navbar.addSeparator();
	var btnRss = new Ext.Button(
			{
				id : 'rss',
				// text:'<b>RSS</b>',
				scripted : false,
				icon : 'images/icons/rss_a.png',
				cls : "x-btn-icon",
				listeners : {
					click : function() {
						window.location = "http://www.maestastkd.com/MaestasTkd_feed.rss"
					}
				}
			});
	navbar.addItem(btnRss);

	navbar.addFill();
	var btnSignIn = new Ext.Button( {
		id : 'signin',
		text : '<b>Sign In</b>',
		handler : function() {
			// window.open('sign_in/');
		window.open('sign_in/', '_Blank')

	}
	});
	navbar.addItem(btnSignIn);
	if (jumpTo) {
		Ext.get('my-loader').hide();
		Ext.get('content').load( {
			url : "ajax.php",
			scripts : true,
			params : {
				action : 'GetPage',
				pid : jumpTo,
				// scripted :isScripted,
				value : '_REQUEST'
			}
		});
	} else {
		loadHome();
	}
}
function loadPage(btn) {
	Ext.get('content').load( {
		url : "ajax.php",
		scripts : true,
		params : {
			action : 'GetPage',
			pid : btn.id,
			scripted : btn.scripted,
			value : '_REQUEST'
		}
	});
}
function page(btn) {
	Ext.get('content').load( {
		url : "ajax.php",
		scripts : true,
		params : {
			action : 'GetPage',
			pid : btn,
			value : '_REQUEST'
		}
	});
}

function popPage(btn) {
	var win = new Ext.Window( {
		layout : 'fit',
		width : 700,
		height : 500,
		closeAction : 'close',
		plain : true,
		autoScroll:true,
		items: [{
		   xtype:'panel',
		   id:'pop-content',
		   style: 'padding:5px;background-color:#FFF',
		   autoHight:true,
		   autoWidth:true
		}]
	});
	win.show(this);
	Ext.get('pop-content').load( {
		url : "ajax.php",
		scripts : true,
		params : {
			action : 'GetPage',
			pid : btn,
			value : '_REQUEST'
		}
	});	
}

function loadHome() {
	Ext
			.get('content')
			.update(
					'<div id="newnews"></div><div id="flashimg"></div><div id="mini-event"></div>');
	mkFlashImg();
	Ext.get('newnews').load( {
		url : "ajax.php",
		scripts : false,
		params : {
			action : 'GetPage',
			pid : 'newnews',
			value : '_REQUEST'
		}
	});
	var tkdEvents = new Ext.data.Store( {
		url : 'request_query.php',
		baseParams : {
			query : 'events'
		},
		reader : new Ext.data.JsonReader( {
			root : 'data',
			totalProperty : 'totalCount',
			fields : [ {
				name : 'ID'
			}, {
				name : 'EVENTDATE'
			}, {
				name : 'STARTTIME'
			}, {
				name : 'STOPTIME'
			}, {
				name : 'SETDATE'
			}, {
				name : 'FEATURE'
			}, {
				name : 'REPEATS'
			}, {
				name : 'REPEATDAYS'
			}, {
				name : 'REPEATSUNTIL'
			}, {
				name : 'ALLDAY'
			}, {
				name : 'TITLE'
			}, {
				name : 'DESCRIPTION'
			}, {
				name : 'LOCATION'
			}, {
				name : 'INSTRUCTOR'
			}, {
				name : 'ICON'
			}, {
				name : 'URL'
			}, {
				name : 'TYPE'
			} ]
		}),
		remoteSort : true
	});
	tkdEvents.setDefaultSort('DATE', 'ASC');
	tkdEvents.load( {
		params : {
			start : 0,
			limit : 4
		}
	});
	var eventGrid = new Ext.grid.GridPanel(
			{
				title : 'Upcoming Events',
				store : tkdEvents,
				renderTo : 'mini-event',
				colModel : cm,
				border : true,
				stripeRows : true,
				width : 780,
				height : 400,
				frame : true,
				loadMask : true,
				viewConfig : {
					forceFit : true,
					scrollOffset : 1,
					enableRowBody : true,
					showPreview : true,
					getRowClass : function(record, rowIndex, p, store) {
						if (this.showPreview) {
							var dIcon = '';
							if (record.data.ICON) {
								dIcon = '<img width="48" height="48" class="event-icon" src="' + record.data.ICON + '" align="left">';
							} else {
								dIcon = '<img width="48" height="48" class="event-icon" src="images/s.gif" align="left">';
							}
							var addInstructor = ' ';
							if (record.data.INSTRUCTOR && record.data.TYPE != 2) {
								// if (!record.data.INSTRUCTOR) {
								// var I = 'Not Assigned';
								// } else {
								var I = record.data.INSTRUCTOR;
								// }
								addInstructor = '<p class="note-body"><span class="bold">Instructor:&nbsp;</span><span class="italic"> ' + I + '</span></p>';
							}
							if (!record.data.DESCRIPTION) {
								var D = '&nbsp;';
							} else {
								var D = record.data.DESCRIPTION;
							}
							p.body = [ dIcon + '<p class="note-body">' + D
									+ '</p>' + addInstructor ];
							return 'x-grid3-row-expanded';
						}
						return 'x-grid3-row-collapsed';
					}
				},
				selModel : new Ext.grid.RowSelectionModel( {
					singleSelect : true
				}),
				iconCls : 'event-grid',
				bbar : new Ext.PagingToolbar( {
					pageSize : 4,
					store : tkdEvents,
					displayInfo : true,
					displayMsg : 'Displaying Events {0} - {1} of {2}',
					emptyMsg : 'No events to display'
				})
			});
	Ext.get('my-loader').hide();
}
function mkAbout() {
	var cm = new Ext.grid.ColumnModel( [ {
		header : 'Topic',
		width : 150,
		dataIndex : 'title',
		fixed : true,
		menuDisabled : true,
		sortable : false,
		renderer : renderTopic
	} ]);
	var tp = new Ext.Panel( {
		renderTo : Ext.get('content'),
		autoWidth : true,
		resizable : false,
		border : false,
		layout : 'column',
		items : [ {
			xtype : 'grid',
			store : Ext.StoreMgr.get('aboutStore'),
			id : 'aboutGrid',
			colModel : cm,
			hideHeaders : true,
			border : false,
			stripeRows : false,
			width : 165,
			autoHeight : true,
			frame : false,
			loadMask : true,
			viewConfig : {
				forceFit : true,
				scrollOffset : 1
			},
			selModel : new Ext.grid.RowSelectionModel( {
				singleSelect : true,
				listeners : {
					rowselect : function(sm, rowidx, record) {
						Ext.get('about-body').load( {
							url : "ajax.php",
							scripts : true,
							params : {
								action : 'GetPage',
								pid : record.data.pid,
								scripted : false,
								subPage : true,
								value : '_REQUEST'
							}
						});
					}
				}
			})
		}, {
			width : 605,
			xtype : 'panel',
			border : false,
			autoHeight : true,
			html : '<div id="about-body">BODY</div>'
		} ]
	});
	Ext.getCmp('aboutGrid').getSelectionModel().selectFirstRow();
}
function loadCal() {
	Ext.get('content').update('');

	var tkdEvents = new Ext.data.Store( {
		id : 'event-cal',
		url : 'request_query.php',
		baseParams : {
			query : 'events',
			all : true
		},
		reader : new Ext.data.JsonReader( {
			root : 'data',
			totalProperty : 'totalCount',
			fields : [ {
				name : 'ID'
			}, {
				name : 'EVENTDATE'
			}, {
				name : 'STARTTIME'
			}, {
				name : 'STOPTIME'
			}, {
				name : 'SETDATE'
			}, {
				name : 'FEATURE'
			}, {
				name : 'REPEATS'
			}, {
				name : 'REPEATDAYS'
			}, {
				name : 'REPEATSUNTIL'
			}, {
				name : 'ALLDAY'
			}, {
				name : 'TITLE'
			}, {
				name : 'DESCRIPTION'
			}, {
				name : 'LOCATION'
			}, {
				name : 'INSTRUCTOR'
			}, {
				name : 'ICON'
			}, {
				name : 'URL'
			}, {
				name : 'TYPE'
			} ]
		}),
		remoteSort : true
	});
	tkdEvents.setDefaultSort('DATE', 'ASC');
	tkdEvents.load( {
		params : {
			start : 0,
			limit : 10,
			filter : 'RESET'
		}
	});
	var eventGrid = new Ext.grid.GridPanel(
			{
				title : 'Event Calendar [All Events]',
				id : 'big-grid',
				renderTo : 'content',
				store : tkdEvents,
				colModel : cm,
				border : true,
				stripeRows : true,
				width : 780,
				height : 880,
				frame : true,
				loadMask : true,
				viewConfig : {
					forceFit : true,
					scrollOffset : 1,
					enableRowBody : true,
					showPreview : true,
					getRowClass : function(record, rowIndex, p, store) {
						if (this.showPreview) {
							var dIcon = '';
							if (record.data.ICON) {
								dIcon = '<img width="48" height="48" class="event-icon" src="' + record.data.ICON + '" align="left" />';
							} else {
								dIcon = '<img width="48" height="48" class="event-icon" src="images/s.gif" align="left" />';
							}
							var addInstructor = ' ';
							if (record.data.INSTRUCTOR && record.data.TYPE != 2) {
								var I = record.data.INSTRUCTOR;
								addInstructor = '<p class="note-body"><span class="bold">Instructor:&nbsp;</span><span class="italic"> ' + I + '</span></p>';
							}
							if (!record.data.DESCRIPTION) {
								var D = '&nbsp;';
							} else {
								var D = record.data.DESCRIPTION;
							}
							p.body = [ dIcon + '<p class="note-body">' + D
									+ '</p>' + addInstructor ];
							return 'x-grid3-row-expanded';
						}
						return 'x-grid3-row-collapsed';
					}
				},
				selModel : new Ext.grid.RowSelectionModel( {
					singleSelect : true
				}),
				// iconCls :'event-grid',
				tbar : [ {
					text : 'View',
					icon : 'images/icons/magnifier.png',
					cls : "x-btn-text-icon",
					menu : new Ext.menu.Menu( {
						items : [ {
							text : 'All Events',
							id : 'filter_RESET',
							group : 'view',
							checked : true,
							checkHandler : onItemCheck
						}, {
							text : 'National Events',
							id : 'filter_1',
							group : 'view',
							checked : false,
							checkHandler : onItemCheck
						}, {
							text : 'Scheduled Classes',
							id : 'filter_2',
							group : 'view',
							checked : false,
							checkHandler : onItemCheck
						}, {
							text : 'Seminars',
							id : 'filter_3',
							group : 'view',
							checked : false,
							checkHandler : onItemCheck
						}, {
							text : 'Testings',
							id : 'filter_8',
							group : 'view',
							checked : false,
							checkHandler : onItemCheck
						}, {
							text : 'Training Events',
							id : 'filter_5',
							group : 'view',
							checked : false,
							checkHandler : onItemCheck
						}, {
							text : 'Tournaments',
							id : 'filter_4',
							group : 'view',
							checked : false,
							checkHandler : onItemCheck
						}, {
							text : 'International Events',
							id : 'filter_6',
							group : 'view',
							checked : false,
							checkHandler : onItemCheck
						}, {
							text : 'Uncategorized (Other)',
							id : 'filter_7',
							group : 'view',
							checked : false,
							checkHandler : onItemCheck
						} ]
					})
				} ],
				bbar : new Ext.PagingToolbar( {
					pageSize : 10,
					store : tkdEvents,
					displayInfo : true,
					displayMsg : 'Displaying Events {0} - {1} of {2}',
					emptyMsg : 'No events to display'
				})
			});
}
function renderEventDate(value, p, record) {
	if (record.data.ALLDAY) {
		return [ '&nbsp;' + record.data.EVENTDATE + '&nbsp;All day' ];
	} else {
		return [ '&nbsp;' + record.data.EVENTDATE + '&nbsp;'
				+ record.data.STARTTIME ];
	}
}
function mkFlashImg() {
	if (!s1) {
		s1 = new SWFObject('include/imagerotator/imagerotator.swf', 'rotator',
				'770', '250', '9', '#dfe8f6');
		s1.addParam('allowfullscreen', 'true');
		s1.addParam("wmode", "opaque");
		s1.addVariable("rotatetime", "10");
		s1.addVariable("width", "770");
		s1.addVariable("height", "250");
		s1.addVariable('file', 'images/rotator/tkd.xml');
	}
	s1.write('flashimg');
}
function renderTopic(value, p, record) {
	return '<img src="' + record.data.icon + '" align="left" />&nbsp;'
			+ record.data.title;
}
function onItemCheck(item, checked) {
	if (checked) {
		var s = item.id.split('_');
		Ext.StoreMgr.get('event-cal').reload( {
			params : {
				start : 0,
				limit : 10,
				filter : s[1]
			}
		});
		Ext.getCmp('big-grid').setTitle(
				[ 'Event Calendar [' + item.text + ']' ]);
	}
}
function showMe(type) {

}

Ext.onReady(function() {
	myInit();
});