// profile.js custom object for profile manipulation
// requires: prototype.js


// ******************* profile panel extensions ***************************
function extendProfilePanel()  {

	var xo={	
	
		user:global.user,
	
		setTitle:function() {
			Element.update(this.titleElement,(this.user.username.length ? 'User Profile: ' + this.user.username : 'The requested user does not exist'));
		},
	
		showControls:function() {
			if(this.user.username.length) {
				Element.show(this.controlSetElement);
				this.user.username !== global.user.username ?  Element.hide(this.tabs['prefs'].buttonElement) :  Element.show(this.tabs['prefs'].buttonElement);	
			}
		},
	
		setUser:function(o) {
			this.user = o;
		},
	
		populate:function()  {
			if(!this.user.username.length) { return;}
			this.populateUserTab();
			this.populateToonsTab();
		},
	
	
	// ******************* user tab ***************************
	
		populateUserTab:function()  {
			var tab = this.tabs['user'].bodyElement;

			// populate tab with data containers
			Element.update(tab,this.createUserShells());
		
			// fill containers
			this.populateUserMainAsDisplay();
			this.populateUserContactAsDisplay();
		},
	
		createUserShells:function() {
			// build containers
			var s = '';		
			s += '<div id="userProfileMainContainer">';
			s += '<div id="userProfileMain"></div>';
			s += '<div id="userProfileMainEdit" class="profileEdit"></div></div></div>';
			
			s += '<div id="userProfileContactContainer">';
			s += '<div id="userProfileContact"></div>';
			s += '<div id="userProfileContactEdit" class="profileEdit"></div></div></div>';
			
			return s;
		},	
	
		//change user main box to display
		populateUserMainAsDisplay:function() {	
			Element.update('userProfileMain',renderProfileMain(this.user,"tabDisplay")); 
			$('userProfileMainEdit').className = 'userProfileEdit';
			if(global.user.isadmin || global.user.username == this.user.username) {	
				Element.update('userProfileMainEdit', '<a href="javascript:void(0);" onClick="pnlProfile.populateUserMainAsForm();">edit profile data</a>');	
			}
			$('userProfileMainEdit').className = 'profileEdit';		
			return false;	
		},
	
		// change user contact box to display
		populateUserContactAsDisplay:function() {	
			Element.update('userProfileContact', renderProfileContact(this.user,"tabDisplay")); 
			if(global.user.isadmin || global.user.username == this.user.username) {	
				Element.update('userProfileContactEdit', '<a href="javascript:void(0);" onClick="pnlProfile.populateUserContactAsForm();">edit contact data</a>');
			}
			$('userProfileContactEdit').className = 'userProfileEdit';		
			$('userProfileContactEdit').className = 'profileEdit';	
			return false;		
		},
	
		// change user main box to form
		populateUserMainAsForm:function() {	
			Element.update('userProfileMain',renderProfileMain(this.user,"tabForm")); 
			Element.update('userProfileMainEdit', 'edit mode activated');	
			$('userProfileMainEdit').className = 'profileEditStatus';		
			setTimeout('$("fieldprofileMainfirstname").focus()',50);
			return false;
		},
	
		// change user contact box to form
		populateUserContactAsForm:function() {	
			Element.update('userProfileContact',renderProfileContact(this.user,"tabForm")); 
			Element.update('userProfileContactEdit', 'edit mode activated');	
			$('userProfileContactEdit').className = 'profileEditStatus';					
			setTimeout('$("fieldprofileContactemail").focus()',50);		
			return false;
		},
	
	
	
	
		// ******************* toons tab ***************************
		
		populateToonsTab:function(e)  {
			var tab = this.tabs['toons'].bodyElement;
	
			// populate tab with data containers
			var s='';
	
			var a = ['serverid','name','levelid','sexid','speciesid','professionid','factionid','pilotfactionid'];
			var l = ['Server','Name','Level','Sex','Species','Profession','Ground Faction','Pilot Faction'];
			
			var c;
			var cl = new Object();
			cl.Level='toonHeaderCellShort';
			cl.Sex = 'toonHeaderCellVeryShort';		
			
			// table declaration
			s += '<form onSubmit="return pnlProfile.editToon(\'' + e + '\');">';
			s += '<table cellpadding="2" cellspacing="5" id="toonTable">';
			
			// header		
			s += '<thead>';
			s += '<tr><td colspan="9">';
			
			if(!this.user.toons.length) { 
				s += 'No toons registered for this user<br><br>'; 
			}
			
			if(global.user.isadmin || (global.user.username == this.user.username)) {
				s += '<a href="javascript:void(0);" onClick="pnlProfile.populateToonsTab(\'new\');">Register a new toon</a>';
			}
			
			if(!this.user.toons.length && (e==undefined || e==null)) { 
				s += '</td></tr></thead></table></form>';
				Element.update(tab,s);
				return false;
			}
			
			s += '</td></tr>';
			s += '<tr id="toonStatusRow"><td colspan="9" id="toonStatus" class="toonStatus"></td></tr>';
			s += '<tr>';
			
			for(var i=0;i<l.length;i++) {
				c=(cl[l[i]] ? cl[l[i]] : 'toonHeaderCell');		
				s += '<td class="' + c + '">' + l[i] + '</td>';
			}		
			if((global.user.username == this.user.username) || global.user.isadmin) {		
				s += '<td class="toonHeaderCell">options</td>';
			}		
			s += '</tr></thead>';
			
			// body
			s += '<tbody id="toonsContainer">';
			if(e=='new') {
				s += this.renderToon({name:'',professionid:0,speciesid:0,sexid:0,serverid:0,levelid:0,factionid:0,pilotfactionid:0,sortorder:'new'},'edit');
			}
			
			for(var i=0;i<this.user.toons.length;i++) {
				var uo=this.user.toons[i];
				s += this.renderToon(uo,(e==uo.toonid?'edit':'display'));
			}		
			s += '</tbody></table>';
			s += '</form>';
			
			Element.update(tab,s);
			if(e==undefined || e==null) {
				this.setToonStatus('clear');
			} else  {
				this.setToonStatus('status','edit mode activated');
			}
			
			return false;
		},
	
		renderToon:function(o,mode)  {
			var v,x,c;
			var s='';
			var a = ['serverid','name','levelid','sexid','speciesid','professionid','factionid','pilotfactionid'];		
			var cl = {levelid:'toonDataCellShort',sexid:'toonDataCellVeryShort'};
			
		
			s += '<tr>';
			
			for(var i=0;i<a.length;i++) {
				c=(cl[a[i]] ? cl[a[i]] : 'toonDataCell');
				
				if(a[i].match(/id$/)) {			
					x=a[i].replace(/id$/,'');	
					if(mode=='edit') {				
						v=makeLookupSelect({lookup:x,id:'toon'+a[i],selected:o[a[i]]});
					} else { 					
						v=global.lookup[x][o[a[i]]];
						v=(v?v:'not specified');
					}
				} else {
					if(mode=='edit') {
						v='<input id="toon'  + a[i] + '" value="' + o[a[i]] + '">';					
					} else {
						v=o[a[i]];
					}
				}					
				s += '<td class="' + c + '">' + v + '</td>';
			}				
				
			// options cell	
			if(mode=='display') {
				if(global.user.username == this.user.username || global.user.isadmin ) {
					s += '<td class="toonDataCell">';
					s += '<a href="javascript:void(0);" onClick="pnlProfile.populateToonsTab(\'' + o.toonid + '\');">edit</a> | ';			
					s += '<a href="javascript:void(0);" onClick="deleteToon(\'' + o.toonid + '\');">delete</a>';
					s += '</td></tr>';
				} else {
					s += '<td></td></tr>';
				}
			} else {
				s += '<td class="toonDataCell"><input type="submit" value="submit" class="button">&nbsp;<button onClick="return pnlProfile.populateToonsTab(null);">cancel</button></td></tr>';
			}
			return s;
		},
	
		setToonStatus:function(m,s) {
			if(m=='clear')  {
				$('toonStatus').className='toonStatusClear';
				Element.update('toonStatus',' &nbsp;');
				return;
			}
			
			Element.update('toonStatus',s);
			$('toonStatus').className=(m=='error' ? 'toonError' : 'toonStatus');
			Element.show('toonStatusRow');
		},
		
		
		// AJAX methods
		editToon:function(toonid) {
			this.setToonStatus('status','Saving...');
			args = new Object();
			args.object="global";
			args.method="saveToon";
			args.userid = this.user.username;
		
			var a = ['serverid','name','levelid','sexid','speciesid','professionid','factionid','pilotfactionid'];		
			for(var i=0;i<a.length;i++)  {
				args[a[i]] = $F('toon' + a[i]);
			}
			args.toonid=toonid;				
			http('POST','index.cfm',this.editToon_Response.bind(this),args);			
			return false;
		},
		
		editToon_Response:function(obj) {
			if(obj.error) {
				this.setToonStatus('error',obj.errortext);
			}				
			this.user.toon[obj.data.toonid]=obj.data;
			this.user=assembleUser(this.user);
			if(this.user.username == global.user.username)  {
				global.user.toon[obj.data.toonid] = obj.data;
				global.user = assembleUser(global.user);
			}			
			this.populateToonsTab();	
			this.setToonStatus('status',global.lookup['server'][obj.data.serverid] + '.' + obj.data.name.split(/ /)[0] + ' saved');
		}				
	}
	
	// extend the panel object with custom profile methods
	Object.extend(pnlProfile,xo);	
}