var timer;
var ybTextColor = 'white';

Event.observe( window, 'load', function() {
	var stationCall = $('station-call');
	if( !stationCall ) return;	// nothing to do!

	var cb = $('chat-button');
	var yb = $('yes-bar-button');
	var cBox = $('chat');
	var yBox = $('yes-bar');
	var call = stationCall.innerHTML;

	function setPreview(f) {
		document.getElementsByClassName( 'full-preview' ).each( function(e) { e.onclick = f; } );
	}

	function setSave(f) {
		$('tos-form').onsubmit = function() {
			if( !$('tos-agree').checked ) {
				alert( 'Please read the YES Terms of Service and check the box if you agree to uphold the rules.' );
			} else {
				f();
			}
		}
	}

	function clearCode() {
		$('copypaste').value = '';
		$('tos-agree').checked = false;
	}

	function selectChat(ev) {
		if( ev ) Event.stop( ev );
		cb.src = 'images/chat-active.gif';
		yb.src = 'images/yes-inactive.gif'
		cBox.style.display = 'block';
		yBox.style.display = 'none';
		setPreview( showBigChatPreview );
		setSave( saveChat );
		updateChatPreview();
	}

	function selectYesBar(ev) {
		if( ev ) Event.stop( ev );
		cb.src = 'images/chat-inactive.gif';
		yb.src = 'images/yes-active.gif'
		yBox.style.display = 'block';
		cBox.style.display = 'none';
		setPreview( showBigYesBarPreview );
		setSave( saveYesBar );
		updateYesBarPreview();
	}

	function urlYesBar(width) {
		var url = 'type=yesbar';
		url += '&station=' + encodeURIComponent(call);
		url += '&width=' + parseInt(width);
		url += '&text=' + encodeURIComponent(ybTextColor);
		if( $('yb-color').value ) url += '&color=' + encodeURIComponent( $('yb-color').value );
		if( $('yb-slogan').value ) url += '&slogan=' + encodeURIComponent( $('yb-slogan').value );
		url += '&rnd=' + Math.random();
		return url;
	}

	function urlChat(w,h) {
		var url = 'type=chat';
		url += '&station=' + encodeURIComponent(call);
		url += '&width=' + parseInt(w);
		url += '&height=' + parseInt(h);

		var color;
		document.getElementsByClassName( 'chat-color-selected' ).each( function(i) { color=i.alt; } );
		if( color ) url += '&style=' + encodeURIComponent(color);

		if( $('chat-slogan').value ) url += '&slogan=' + encodeURIComponent( $('chat-slogan').value );
		url += '&rnd=' + Math.random();
		return url;
	}

	function updateYesBarPreview() {
		clearCode();
		var p = $('yes-bar-preview');
		p.src = previewURL( urlYesBar( Element.getDimensions(p).width ) );
	}

	function previewURL(url) {
		return 'preview.php?' + url;
	}

	function saveURL(url) {
		return 'preview.php?save=1&' + url;
	}

	function openPreview(url,w,h) {
		if( w <  50 ) w = 50;
		if( h < 50 ) h = 50;
		window.open( previewURL(url), 'yespreview', 'toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0,width=' + w + ',height=' + h );
	}

	function showBigYesBarPreview(ev) {
		if( ev ) Event.stop( ev );
		var w = parseInt($('yb-size').value) || 640;
		var h = parseInt( Math.round( w / 16 ) );
		openPreview( urlYesBar($('yb-size').value) , w, h );
	}

	function showBigChatPreview(ev) {
		if( ev ) Event.stop( ev );
		var w = parseInt($('chat-width').value) || 600;
		var h = parseInt($('chat-height').value) || 500;
		openPreview( urlChat(w,h) , w, h );
	}

	function delay(f) {
		clearCode();
		clearTimeout( timer );
		timer = setTimeout( f, 2000 );
	}

	function saveYesBar() {
		var w = parseInt($('yb-size').value) || 640;
		doSave( urlYesBar(w) );
	}

	function saveChat() {
		var w = parseInt($('chat-width').value) || 600;
		var h = parseInt($('chat-height').value) || 500;
		doSave( urlChat(w,h) );
	}

	function doSave(url) {
		new Ajax.Request( saveURL(url), {onSuccess:function(t){ $('copypaste').value = t.responseText; }} );
	}

	function updateChatPreview() {
		clearCode();
		var p = $('chat-preview');
		var d = Element.getDimensions(p);
		p.src = previewURL( urlChat( d.width, d.height ) );
	}

	// common event functions (choosing chat/yb mode and such)
	document.getElementsByClassName( 'chat-button' ).each( function(e) { Event.observe( e, 'click', selectChat ); } );
	document.getElementsByClassName( 'yes-bar-button' ).each( function(e) { Event.observe( e, 'click', selectYesBar ); } );
	Event.observe( $('tos-button'), 'click', function(ev) { Event.stop(ev); $('tos-form').onsubmit(); } );
	$A(document.body.getElementsByTagName('*')).each( function(e) { if( typeof(e.disabled) != undefined ) e.disabled = false; } );

	// yes-bar events
	Event.observe( $('yb-userPreferences'), 'submit', function(ev) { Event.stop(ev); updateYesBarPreview(); } );
	document.getElementsByClassName( 'yb-textcolor' ).each( function(e) { Event.observe(e,'click',function() { ybTextColor = e.value; updateYesBarPreview(); }); if( e.checked ) ybTextColor = e.value; } );
	Event.observe( $('yb-slogan'), 'keyup', function(ev) { delay( updateYesBarPreview ); } );
	Event.observe( $('yb-color'), 'keyup', function(ev) { delay( updateYesBarPreview ); } );
	document.getElementsByClassName( 'yb-color' ).each( function(e) { Event.observe(e,'click',function() { $('yb-color').value = e.alt; updateYesBarPreview(); }); } );
	Event.observe( $('yb-size'), 'keyup', function(ev) { clearCode(); } );

	// chat events
	Event.observe( $('chat-userPreferences'), 'submit', function(ev) { Event.stop(ev); updateChatPreview(); } );
	Event.observe( $('chat-slogan'), 'keyup', function(ev) { delay( updateChatPreview ); } );
	Event.observe( $('chat-width'), 'keyup', function(ev) { clearCode(); } );
	Event.observe( $('chat-height'), 'keyup', function(ev) { clearCode(); } );
	document.getElementsByClassName( 'chat-color' ).each( function(e) {
		Event.observe(e,'click',function() {
			document.getElementsByClassName( 'chat-color-selected' ).each( function(i) { Element.removeClassName(i,'chat-color-selected'); } );
			Element.addClassName( e, 'chat-color-selected' );
			updateChatPreview();
		});
	} );

	selectYesBar();
} );

// register/login form handling
Event.observe( window, 'load', function() {
	function set(e,b) {
		Element.removeClassName( e, b? 'block-hide': 'block-show' );
		Element.addClassName( e, b? 'block-show': 'block-hide' );
	}
	function showLogin(ev) {
		if( ev ) Event.stop(ev);
		set($('login-box'),true);
		set($('register-box'),false);
		$('login-username').focus();
	}
	function showRegister(ev) {
		if( ev ) Event.stop(ev);
		set($('login-box'),false);
		set($('register-box'),true);
		$('register-username').focus();
	}
	document.getElementsByClassName( 'show-login-form' ).each( function(e) { Event.observe( e, 'click', showLogin ); } );
	document.getElementsByClassName( 'show-register-form' ).each( function(e) { Event.observe( e, 'click', showRegister ); } );
} );