$('#card_bottom_service' ).val('live');

var cardCallback;

(function( $ ) {

// all the info for the card
var card = {
	bottom: [ '', '' ], top: [ '', '' ],
	skin: 'default',
	hue: 0, saturation: 0, lightness: 0,
	shift_grey: 0
}

// shows a preview of the current skin
var preview = function() {
	$('#card_error').html('');
	
	$('#card_image').attr( 'src', 'http://gamercards.exophase.com/preview.php?' + $.param( card ) );
}

$.each(['top', 'bottom'], function( i, section ) {
	var service_change = function( select ) {
		card[ section ][0] = select.options[ select.selectedIndex ].value;
	}
	
	var nume_up = function( input ) {
		card[ section ][1] = input.value;
	}
	
	var	service = $('#card_' + section + '_service').live( 'change', function() { service_change( this ) } ),
		name = $('#card_' + section + '_name').live( 'mouseup', function() { nume_up( this ) } );
	
	service_change( service[0] );
	nume_up( name[0] );
});

// update the stored skin
$('#card_skin_select')
	.change( function(e) {
		card.skin = this.options[ this.selectedIndex ].value;
		
		preview();
	})
	.change();

$('#card_create').click( function() {
	/* Error correcting, try to remove */
	$.each(['top', 'bottom'], function( i, section ) {
		var	service = $('#card_' + section + '_service')[0],
			name = $('#card_' + section + '_name')[0];
		
		card[ section ][0] = service.options[ service.selectedIndex ].value;
		card[ section ][1] = name.value;
	});
	
	$('#card_error').html('');
	
	// remove the preview image and show the loading dial
	$('#card_image').attr('src', 'http://exophase.com/assets/jidoor/load.gif');
	
	$.getScript( 'http://gamercards.exophase.com/generate.php?' + $.param( card ) );
});

// when the BB/HTML code links are clicked, select all the text
jQuery('#card_bb, #card_html').click( function() {
	this.select();
});

cardCallback = function( response ) {
	if ( !response.valid ) {
		$('#card_error').html( response.error );
		$('#card_image').attr( 'src', '' );
		return;
	}
	
	var card_url = 'http://gamercards.exophase.com/' + response.id + '.png?' + Math.round( Math.random() * 100000000 );
	var card_url_bb = 'http://gamercards.exophase.com/' + response.id + '.png';
	
	var card_service_top = $('#card_top_service').val();
	var card_name_top = $('#card_top_name').val();
	var card_service_bottom = $('#card_bottom_service').val();
	var card_name_bottom = $('#card_bottom_name').val();
	
	
	 $('#gamecard-description').fadeOut('fast', function () {
		$('#card_response').fadeIn('fast');
	});

	if(card_service_top == 'psn' || card_service_bottom == 'psn') {
	
		if(card_service_top == 'psn' && card_name_top.length != 0) {
			$('#card_image').attr( 'src', card_url );
			$('#card_bb').val('[URL=http://gamercards.exophase.com/psn/user/' + card_name_top + '/][IMG]' + card_url_bb + '[/IMG][/URL]');
			$('#card_html').val('<a href="http://gamercards.exophase.com/psn/user/' + card_name_top + '/"><img src="' + card_url_bb + '"></a>');
		}
		
		if(card_service_bottom == 'psn' && card_name_bottom.length != 0) {
			$('#card_image').attr( 'src', card_url );
			$('#card_bb').val('[URL=http://gamercards.exophase.com/psn/user/' + card_name_bottom + '/][IMG]' + card_url_bb + '[/IMG][/URL]');
			$('#card_html').val('<a href="http://gamercards.exophase.com/psn/user/' + card_name_bottom + '/"><img src="' + card_url_bb + '"></a>');
		}
	
	} else {
	
		$('#card_image').attr( 'src', card_url );
		$('#card_bb').val('[URL=http://exophase.com/gamercards/][IMG]' + card_url_bb + '[/IMG][/URL]');
		$('#card_html').val('<a href="http://exophase.com/gamercards/"><img src="' + card_url_bb + '"></a>');
	
	}
}


/* Color Shifting */

var timer, preview_stall = function() {
	// stop the previous update function from executing
	clearTimeout( timer );
	timer = setTimeout( preview, 500 );
}

// create the hue/saturation/lightness sliders
$.each(['hue', 'saturation', 'lightness'], function( i, type ) {
	// hue and saturation/lightness have different min/max values
	var	min = (i == 0) ? 0 : -360,
		max = (i == 0) ? 360 : 360;
	
	// create the slider
	$('#slider_' + type).slider({
		min: min, max: max,
		display: '#slider_' + type + '_value',
		reset: '#slider_reset',
		callback: function( value ) {
			card[ type ] = value;
			preview_stall();
		}
	});
	
	// reset the card preview
	$('#slider_reset').click( function() {
		preview_stall();
	});
});

$('#card_grey_value')
	// update the stored check state
	.change( function() {
		card.shift_grey = this.checked ? 1 : 0;
		preview_stall();
	})
	// check the box on page load
	.attr( 'checked', false );

setTimeout(function() {
	var el = document.getElementById( 'share-container' );
	el && (el.style.top = '900px');
}, 1000);

})( jQuery );