$(document).ready(function() {
	$(frames['preview'].document).ready(function() {
		var registration = new Registration();
	});
});

/**
 * Registration class
 */
function Registration() {
	this.initialize();
}
	
	Registration.prototype.initialize = function() {
		// Avoid JS scope problems	
		var thisObj = this;
		
		$('#colorpicker').farbtastic(thisObj.changeChatColor);
		
		$('#cb_title').keyup(function() {
			var titleText = $('#cb_title').val();
			//TODO does not work in IE
			var titleEl = frames['preview'].document.getElementById('chat_title');
			$(titleEl).empty();
			titleEl.appendChild(frames['preview'].document.createTextNode(titleText));
		});
	
		$("#cb_color").blur(function() { 
			thisObj.changeChatColor($("#cb_color").val());
		});
		
		$('#cb_chat_font').bind('change', function() {
			thisObj.chageChatFont($('#cb_chat_font').val());
		});
		
		$('#cb_controls_font').bind('change', function() {
			thisObj.chageControlsFont($('#cb_controls_font').val());
		});
		
		// Show/hide color code input
		var htmlBefore = '';
		var insertEl = $('#insert_color');
		
		insertEl.toggle(function() {
			htmlBefore = insertEl.html();
			$('#cb_color').show();
			insertEl.html('OK');
			return false;
		}, function() {
			$('#cb_color').hide();
			insertEl.html(htmlBefore);
			return false;
		});
		
		// Set initial preview chatbox color
		this.changeChatColor('#def4a4');
	}
	
	Registration.prototype.changeChatColor = function(color) {
		$(frames['preview'].document.getElementById('chatbox')).css({ background: color });
		$('#cb_color').attr({ value: color });
		
		// Change color box color
		$('#color_box').css({ background: color });
	}
	
	Registration.prototype.chageChatFont = function(font) {
		font = "'" + font + "'";
		$(frames['preview'].document.getElementById('chatarea_content')).css({ fontFamily: font });
	}
	
	Registration.prototype.chageControlsFont = function(font) {
		font = "'" + font + "'";
		$(frames['preview'].document.getElementById('chatbox')).not('#chatarea_content').css({ fontFamily: font });
	}
