var Theme = {
	
	// The currently selected property.
	current_selection:'body_bg',
	
	////////////////////////
	//   BASIC COMMANDS   //
	////////////////////////

	// Change
	change_theme:function(theme_id) {
		
		// Gets the user IDs for various pages.
		if(document.Blog!=undefined && Blog!=undefined && Blog!=uBlog.blogger_id!=undefined) var user_id = Blog.blogger_id;
		else if(Container.media_user!=undefined) var user_id = Container.media_user;
		else if(Container.current_page!=undefined) var user_id = Container.current_page;
		else var user_id = 0;
		
		// If the user ID matches the ID of the current user, change the theme immediately.
		if(user_id==Theme.my_id) Container.change_theme(theme_id);
	},
	
	// Copy
	copy_theme:function(theme_id) {
		
		// The Ajax.
		new Ajax.Request(engineURL, { method:'post',
			parameters:{ control:'theme', action:'copy', theme_id:theme_id, content_id:Theme.content_id, current_theme:Theme.theme_id },
		onComplete:function(transport) {
			
			// Updates the list of saved themes.
			$(Theme.content_id+'_saved').update(transport.responseText);
		}});
	},

	// Delete
	delete_theme:function(theme_id) {
		
		// Asks the user to confirm.
		if(confirm('Are you sure you want to delete this theme?')) {
			
			// If the theme that is being deleted is currently set.
			if($(Theme.content_id+'_saved_'+theme_id).hasClassName('on')) {
				
				// Highlights the default theme.
				$(Theme.content_id+'_saved_1').addClassName('on');
			}
			
			// Removes the theme from the list.
			$(Theme.content_id+'_saved_'+theme_id).remove();
			
			// If deleting the same theme that's being edited, edit the default theme.
			if(theme_id==Theme.theme_id) Theme.edit_theme(1);
					
			// The Ajax.
			new Ajax.Request(engineURL, { method:'post',
				parameters:{ control:'theme', action:'delete', theme_id:theme_id },
			onComplete:function(transport) {
				// Doesn't do anything.
			}});
		}
	},
	
	// Edit
	edit_theme:function(theme_id,resetting) {
		
		// Variable used to skip confirmation.
		if(resetting==undefined) resetting = false;
		
		// Confirmation, if necessary.
		if(resetting || !Theme.changes_made() || confirm('You have made changes to the current theme.\nAre you sure you want to discard these changes and edit a different theme?')) {
		
			// Unmarks the changes, since they're being discarded.
			Container.mark_changes(Theme.get_tab_id(),false);
		
			// The Ajax.
			new Ajax.Request(engineURL, { method:'post',
				parameters:{ control:'theme', action:'edit', theme_id:theme_id },
			onComplete:function(transport) {
				
				// Updates the theme ID.
				Theme.update_theme_id(theme_id);
				
				// Converts the JSON string into an object.
				var json_object = eval('('+transport.responseText+')');
				
				// Updates the various variables.
				eval(json_object.js_string);
				
				// Basic theme editor.
				if(Theme.is_basic()) {
					var bg_colors = new Array('header1','header2','body','container','footer','button');
					for(counter=0; counter<bg_colors.length; counter++) {
						eval('$(Theme.content_id+"_"+bg_colors[counter]+"_bg").color.fromString(Theme.'+bg_colors[counter]+'_bg.substring(1));');
					}
				}
				
				// The fields being updated here are only present for managers.
				if(Theme.is_manager) {
					
					// Makes sure the arrow is pointing to the current theme.
					Theme.update_arrow();
					
					// Updates the title.
					Theme.update_title(json_object.title);
					
					// Updates the checkboxes.
					$(Theme.content_id+'_mystage').checked = (json_object.mystage==Theme.theme_id);
					$(Theme.content_id+'_media').checked = (json_object.media==Theme.theme_id);
					$(Theme.content_id+'_blog').checked = (json_object.blog==Theme.theme_id);
					
					// Updates the radio buttons
					$(Theme.content_id+'_share_share').checked = (json_object.share==1);
					$(Theme.content_id+'_share_dont_share').checked = (json_object.share==0);
					if($(Theme.content_id+'_share_predefined')) {
						$(Theme.content_id+'_share_predefined').checked = (json_object.share==2);
					}
				}
				
				// Updates the preview image.
				$(Theme.content_id+'_preview').update(json_object.preview);
				
				// Updates the value of the paintbrush textbox.
				Theme.set_paintbrush_with('body_bg');
				
				// Resets the current selection to the body background.
				Theme.current_selection = 'body_bg';
				
				// If the theme is resetting.
				if(resetting) {
					
					// Saves the theme.
					Theme.save_theme();
					
					// Changes the theme on the page.
					Container.change_theme(1);
				}
			}});
		}
	},
	
	// Rename
	rename_theme:function(theme_id) {
		
		// Gets some variables.
		if(theme_id==undefined || theme_id==Theme.theme_id) {
			theme_id = Theme.theme_id;
			var old_title = Theme.title;
			var update_current = true;
		}
		else {
			var old_title = $(Theme.content_id+'_title_'+theme_id).innerHTML;
			var update_current = false;
		}
		
		// Asks the user what the new title of the theme should be.
		var new_title = prompt('What would you like to call this theme?',old_title);
		
		// Renaming will only occur if the user didn't cancel the prompt.
		if(new_title!=null) {
		
			// If the user doesn't provide anything, use "Untitled".
			if(new_title=='') new_title = 'Untitled';
			
			// The Ajax.
			new Ajax.Request(engineURL, { method:'post',
				parameters:{ control:'theme', action:'rename', theme_id:theme_id, title:new_title },
			onComplete:function(transport) {
				
				// If successful.
				if(transport.responseText=='success') {
					
					// Updates the title.
					if(update_current) Theme.update_title(new_title);
					else $(Theme.content_id+'_title_'+theme_id).update(new_title);
					
					// Updates the saved list to show everything alphabetically.
					Theme.update_saved_list();
				}
			}});
		}
	},
	
	// Reset
	reset_theme:function() {
		
		// Requires confirmation from the user.
		if(confirm('Are you sure you want to start over?\nYour current theme will be deleted.')) {
			
			// Edits the default theme.
			Theme.edit_theme(1,true);
		}
	},
	
	// Save
	save_theme:function() {
		
		// Will return false by default.
		var return_value = false;
		
		// Determines whether or not the theme will be saved.
		if(Theme.confirm_save()) {
			
			// Sets a JSON string of color variables to a hidden field.
			Theme.set_json();
			
			// Validates the form for submission.
			return_value = Container.validate_form('popup_settings','themes');
		}
		
		// Returns the return value.
		return return_value;
	},
	
	//////////////////////////
	//   UPDATE FUNCTIONS   //
	//////////////////////////
	
	// Updates the arrow that shows the current theme being edited.
	update_arrow:function() {
		
		// Makes sure the saved list exists (for managers only).
		if($(Theme.content_id+'_saved')) {
		
			// Gets all the elements in the saved themes list.
			var elements = $(Theme.content_id+'_saved').firstDescendant().descendants();
			
			// Loops through the elements to turn off the arrow for each.
			for(var counter=elements.length-1; counter>=0; --counter) {
				
				// Gets the ID of the element.
				var id = elements[counter].identify();
				
				// Hides the arrow.
				if(id.indexOf('_arrow_')>0) elements[counter].style.visibility = 'hidden';
				
				// Turns off the bold text.
				else if(id.indexOf('_saved_')>0) elements[counter].removeClassName('attn')
			}
			
			// Displays the arrow for the current theme.
			$(Theme.content_id+'_arrow_'+Theme.theme_id).style.visibility = 'visible';
			
			// Turns on the bold text for the current theme.
			$(Theme.content_id+'_saved_'+Theme.theme_id).addClassName('attn');
		}
	},
	
	// Updates the CSS within a preview.
	update_css:function(id,property,value) {
		
		// Makes sure the element exists.
		if($('theme_preview_'+id)) {
			
			// Updates the variable that keeps track of the colors.
			eval('Theme.'+property+"='"+value+"';");
		
			// Determines which CSS property to adjust.
			if(property.substring(property.length-3)=='_bg') var css_property = 'backgroundColor';
			else if(property.substring(property.length-7)=='_border') var css_property = 'borderColor';
			else var css_property = 'color';
			
			// Adjust the appropriate CSS property.
			eval('$("theme_preview_'+id+'").style.'+css_property+' = "'+value+'";');
			
			// Body and container borders, because they're hard to click on, are also represented with text. So the color needs to be changed also.
			if(css_property=='borderColor') eval('$("theme_preview_'+id+'").style.color = "'+value+'";');
		}
	},
	
	// Updates the color variables and the color for the theme preview.
	update_color:function(id) {
		
		// Gets some variables.
		var property = Theme.current_selection;
		var value = '#'+$(Theme.content_id+'_paintbrush').value;
		
		// Updates the CSS.
		Theme.update_css(id,property,value);
		
		// For the Basic tab, this section takes care of the colors that need to be automatically adjusted.
		if(Theme.is_basic() && property.substring(property.length-3)=='_bg') {
			
			// Gets the colors of the text and links.
			var hex_text = '#'+Theme.get_hex_text(value);
			var hex_link = '#'+Theme.get_hex_link(value);
			
			// Depending on what's being edited, we'll be changing different properties.
			if(id=='body_bg') {
				Theme.update_css('body_border','body_border',hex_text);
				Theme.update_css('body_link','body_link',hex_link);
				Theme.update_css('body_text','body_text',hex_text);
				Theme.update_css('container1','body_border',hex_text);
				Theme.update_css('container2','body_border',hex_text);
				Theme.update_css('header1_bg','body_border',hex_text);
				Theme.update_css('header2_bg','body_border',hex_text);
			}
			else if(id=='button_bg') {
				Theme.update_css('button_text','button_text',hex_link);
			}
			else if(id=='content1') {
				Theme.update_css('container_border','container_border',hex_text);
				Theme.update_css('container_link','container_link',hex_link);
				Theme.update_css('container_text','container_text',hex_text);
				Theme.update_css('footer_bg','container_border',hex_text);
			}
			else if(id=='footer_bg') {
				Theme.update_css('footer_link','footer_link',hex_link);
				Theme.update_css('footer_text','footer_text',hex_text);
			}
			else if(id=='header1_bg') {
				Theme.update_css('header1_link','header1_link',hex_link);
				Theme.update_css('header1_text','header1_text',hex_text);
				Theme.update_css('title1','header1_link',hex_link);
			}
			else if(id=='header2_bg') {
				Theme.update_css('header2_link','header2_link',hex_link);
				Theme.update_css('header2_text','header2_text',hex_text);
				Theme.update_css('title2','header2_text',hex_text);
			}
		}
		
		// Updates the textbox for the property, if it exists.
		else if($(Theme.content_id+'_'+property)) {
			eval('$(Theme.content_id+"_"+property).color.fromString(value.substr(1,6));');
		}
	},
	
	// Updates the theme preview.
	update_preview:function() {
		
		// Determines which property is being updated.
		var property = Theme.current_selection;

		// Updates the default element in the preview.
		Theme.update_color(property);
		
		// Sometimes there are multiple elements in the preview that need updating.
		if(property=='body_border') {
			Theme.update_color('container1');
			Theme.update_color('container2');
			Theme.update_color('header1_bg');
			Theme.update_color('header2_bg');
		}
		else if(property=='container_bg') {
			Theme.update_color('content1');
			Theme.update_color('content2');
		}
		else if(property=='container_border') Theme.update_color('footer_bg');
		else if(property=='header1_link') Theme.update_color('title1');
		else if(property=='header2_text') Theme.update_color('title2');
	},
	
	// Updates the list of saved themes.
	update_saved_list:function() {
		
		// The Ajax.
		new Ajax.Request(engineURL, { method:'post',
			parameters:{ control:'theme', action:'list', theme_id:Theme.theme_id, content_id:Theme.content_id },
		onComplete:function(transport) {
			
			// If something was returned.
			if(transport.responseText!='') {
				
				// Updates the list.
				$(Theme.content_id+'_saved').update(transport.responseText);
			}
		}});
	},
	
	// Updates the theme ID variable and field.
	update_theme_id:function(theme_id) {
		
		// Updates the variable.
		Theme.theme_id = theme_id;
		
		// Updates the hidden field.
		$(Theme.content_id+'_theme_id').value = theme_id;
	},
	
	// Updates the title variable, field, and displays.
	update_title:function(new_title) {
		
		// Updates the variable.
		Theme.title = new_title;
		
		// Updates the hidden field.
		$(Theme.content_id+'_title').value = new_title;
		
		// Updates the display in the editor.
		$(Theme.content_id+'_title_display').update(new_title);
		
		// Updates the display in the saved themes list.
		$(Theme.content_id+'_title_'+Theme.theme_id).update(new_title);
		
	},
	
	/////////////////////////
	//   COLOR FUNCTIONS   //
	/////////////////////////
	
	// Converts decimal to hexidecimal.
	dec2hex:function(dec) {
		
		// The conversion.
		var hex = dec.toString(16);
		
		// Should be at least two characters long.
		return (dec<16 ? '0' : '')+hex;
	},
	
	// Gets the link color on a background of a specified color.
	get_hex_link:function(bg_color) {
		
		// Converts to RGB.
		var rgb = Theme.hex2rgb(bg_color);
		
		// Background is dark, so text will be light.
		if(Theme.is_rgb_dark(rgb)) var return_value = 'FFFFFF';
		
		// Background is light, so text will be dark
		else var return_value = Theme.rgb2hex(Theme.rgb_down(rgb));
		
		// Returns the hexidecimal value (without #).
		return return_value;
	},
	
	// Gets the link color on a background of a specified color.
	get_hex_text:function(bg_color) {
		
		// Converts to RGB.
		var rgb = Theme.hex2rgb(bg_color);
		
		// Background is dark, so text will be light.
		if(Theme.is_rgb_dark(rgb)) var return_value = Theme.rgb2hex(Theme.rgb_up(rgb));
		
		// Background is light, so text will be dark
		else var return_value = '000000';
		
		// Returns the hexidecimal value (without #).
		return return_value;
	},
	
	// Converts hexidecimal to decimal.
	hex2dec:function(hex) {
		return parseInt(hex,16);
	},
	
	// Converts a string into an array representing an RGB value.
	hex2rgb:function(hex) {
		
		// Assume black by default.
		if(hex==undefined) hex = '#000000';
		
		// Just to make sure it's no less than 7 characters.
		hex += '0000000';
		
		// The second and third characters.
		var red = Theme.hex2dec(hex.substr(1,2));
		
		// The fourth and fifth characters.
		var green = Theme.hex2dec(hex.substr(3,2));
		
		// The sixth and seventh characters.
		var blue = Theme.hex2dec(hex.substr(5,2));
		
		// Puts the characters into an array and returns it.
		return new Array(red,green,blue);
	},
	
	// Is the RGB so dark that its text should be light?
	is_rgb_dark:function(rgb) {
		return (rgb[0]*0.213 + rgb[1]*0.715 + rgb[2]*0.072 < 128);
	},
	
	// Converts an RGB array to a hexidecimal string.
	rgb2hex:function(rgb) {
		
		// The string to return.
		hex = '';
		
		// Loops three times.
		for(var counter=0; counter<3; counter++) {
			
			// Grabs the value from the array, converts it, and adds it to the string.
			hex += Theme.dec2hex(rgb[counter]);
		}
		
		// Returns the string.
		return hex;
	},
	
	// Darkens an RGB color (for a light background).
	rgb_down:function(rgb) {
		
		// Loops three times
		for(var counter=0; counter<3; counter++) {
			
			// Cuts the value in half.
			rgb[counter] = Math.ceil(rgb[counter]/2);
		}
		
		// Returns the new RGB.
		return rgb;
	},
	
	// Lightens an RGB color (for a dark background.).
	rgb_up:function(rgb) {
		
		// Loops three times
		for(var counter=0; counter<3; counter++) {
			
			// Increases the value.
			rgb[counter] = Math.floor((rgb[counter]+255*2)/3);
		}
		
		// Returns the new RGB.
		return rgb;
	},
	
	////////////////////////
	//   JSON FUNCTIONS   //
	////////////////////////
	
	// Gets a JSON string of color variables.
	get_json:function() {
		
		// An array to hold portions of the JSON string.
		var variables = new Array();
		
		// Arrays used for looping.
		var array1 = new Array('body','container','header1','header2','footer','button');
		var array2 = new Array('bg','border','link','text');
		
		// Loops through all the possible colors.
		for(counter1=0; counter1<array1.length; counter1++) {
			for(counter2=0; counter2<array2.length; counter2++) {
				
				// The property.
				var property = array1[counter1]+'_'+array2[counter2];				
				
				// If the property exists, add to the variables array.
				eval('if(Theme.'+property+'!=undefined) variables[variables.length] = \'"'+property+'":"\'+Theme.'+property+'+\'"\';');
			}
		}
		
		// Puts everything together and returns it as a single string.
		return '{'+variables.join(',')+'}';
	},
	
	// Sets a JSON string of color variables to a hidden field.
	set_json:function() {
		
		// Makes sure the hidden field exists.
		if($(Theme.content_id+'_json')) {
			
			// Updates its value.
			$(Theme.content_id+'_json').value = Theme.get_json();
		}
	},
	
	///////////////////////
	//   MISCELLANEOUS   //
	///////////////////////

	// Changes the selected color.
	change_selection:function(event,property) {
		
		// Basic
		if(Theme.is_basic()) {
			
			// Used to get the first part of the property.
			var prop_split = property.split('_');
			
			// Updates the variable that keeps track of the current selection.
			Theme.current_selection = prop_split[0]+'_bg';
			
			// Focuses on the appropriate textbox.
			$(Theme.content_id+'_'+Theme.current_selection).focus();
			
			// Updates the paintbrush label.
			Theme.set_paintbrush_label(Theme.current_selection);
		}
		
		// Advanced and Managers
		else {
			
			// Updates the variable that keeps track of the current selection.
			Theme.current_selection = property;
		
			// Updates the value of the paintbrush textbox.
			Theme.set_paintbrush_with(property);
		}
		
		// Stops this onclicks of elements layered beneath the clicked element.
		event.cancelBubble = true;
		
		// Ideally, we should be using stopPropagation() instead of event.cancelBubble, but it's not supported in IE.
		//event.stopPropagation();
	},
	
	// Returns true if there have been changes made to the theme.
	changes_made:function() {
		return ($(Theme.get_tab_id()).firstDescendant().innerHTML.substr(0,2)=='* ');
	},
	
	// Determines whether or not the theme will be saved.
	confirm_save:function() {
		
		// By default, will not save.
		var return_value = false;
		
		// Will save if the user is not a manager or if the manager is editing another's non-predefined theme.
		if(!Theme.is_manager || (Theme.author_id!=Theme.my_id && !Theme.is_predefined)) return_value = true;
		
		// Asks the user to confirm saving.
		else if(confirm('Are you sure you want to save this theme?\nThe current theme will be overwritten.')) return_value = true;
		
		// Returns true or false.
		return return_value;
	},
	
	// Gets the ID of the Themes tab.
	get_tab_id:function() {
		
		// Gets the container ID.
		var container_id = ($('settings') ? 'settings' : 'popup_settings');
		
		// Returns the container ID with the tab ID added at the end.
		return 'tab_'+container_id+'_themes';
	},
	
	// Returns true if the user is a non-manager on the "Basic" tab.
	is_basic:function() {
		return ($(Theme.content_id+'_basic') && $(Theme.content_id+'_basic').style.display!='none');
	},

	// Shows the "Advanced" tab.
	show_advanced:function() {
		$(Theme.content_id+'_basic').hide();
		$(Theme.content_id+'_advanced').show();
	},
	
	// Shows the "Basic" tab.
	show_basic:function() {
		$(Theme.content_id+'_advanced').hide();
		$(Theme.content_id+'_basic').show();
	},
	
	// Sets a color for a given property.
	set_color:function(property,value) {
		eval('Theme.'+property+"='"+value+"';");
	},
	
	// Sets the color for the paintbrush textbox.
	set_paintbrush:function(value) {
		eval('$(Theme.content_id+"_paintbrush").color.fromString("'+value+'");');
	},
	
	// Sets the label for the paintbrush.
	set_paintbrush_label:function(variable_name) {
		if($(Theme.content_id+'_paintbrush_label')) $(Theme.content_id+'_paintbrush_label').update(Theme.var2text(variable_name)+':');
	},
	
	// Sets the color of the paintbrush textbox using a variable.
	set_paintbrush_with:function(variable_name) {
		Theme.set_paintbrush_label(variable_name);
		eval('Theme.set_paintbrush(Theme.'+variable_name+');');
	},
	
	// Converts a variable name to readable text.
	var2text:function(variable_name) {
		
		// Some exceptions to the rules.
		if(variable_name=='body_border') var return_value = 'Outer Borders';
		else if(variable_name=='container_border') var return_value = 'Inner Borders';
		else if(variable_name=='header1_link') var return_value = 'Header 1 Links/Title';
		else if(variable_name=='header2_text') var return_value = 'Header 2 Text/Title';
		
		// For everything else.
		else {
			
			// Splits up the variable name.
			var var_split = variable_name.split('_');
			
			// Split the number from the word.
			if(var_split[0]=='header1' || var_split[0]=='header2') {
				var_split[0] = 'Header '+var_split[0].substr(6,1);
			}
			
			// Everything else, just capitalize.
			else var_split[0] = Shortcut.init_cap(var_split[0]);
			
			// "bg" always becomes "Background".
			if(var_split[1]=='bg') var_split[1] = 'Background';
			
			// "link" is always pluralized and capitalized.
			else if(var_split[1]=='link') var_split[1] = 'Links';
			
			// Everything else, just capitalize.
			else var_split[1] = Shortcut.init_cap(var_split[1]);
			
			// Puts everything together with a space.
			var return_value = var_split.join(' ');
		}
		
		// Returns the text.
		return return_value;
	}
};