var canvasColor = 'transparent';

$(function() {		

	var isTube = location.search.indexOf("tube") != -1;
	var isAir = location.search.indexOf("air") != -1;
	var isDefault= ! isTube && ! isAir;
	
	var pluginsConf = {
			controls: {
				url: v.controls,
				backgroundColor: '#222222', 
				progressColor: '#112233',
				bufferColor: '#445566',
				autoHide: 'never'
			}
	};
	
	if ( isTube )
		pluginsConf.controls.url = v.tube;

	if ( isAir )
		pluginsConf.controls.url = v.air;
		
	if ( isDefault )
	{
		pluginsConf.controls.url = v.controls;
		
		pluginsConf.slowmotion = {
			url: v.slowmotion
		};
		
		pluginsConf.rtmp = {
		    url: v.rtmp,
		    netConnectionUrl: 'rtmp://flowplayer.org/fastplay'
		}
	}	
	
	$f("player", "http://releases.flowplayer.org/swf/flowplayer-" + v.ver + ".swf", {
			
		clip: {
			url: 'http://blip.tv/file/get/N8inpasadena-Flowers457.flv',
			autoPlay: false,
			autoBuffering: true
		},
		
		screen: { top: 10, left: '50%', width: 450, height: 255},
		
		onLoad: function() {
			$("#skinning_controls :input").removeAttr("disabled");		
		},
		
		onUnload: function() {
			$("#skinning_controls :input").attr("disabled", true);		
		}, 

		plugins:  pluginsConf
	});
	
	// color picker. thanks to Steven Wittens from Acko.net
	$('#picker').farbtastic(function(color)  {
			
		var player = $f("player");
				
		if (player.isLoaded()) {			

			var target = $(":input[name=target]:checked").val();			

			// adjust canvas bgcolor. uses undocumented API call. not stabilized yer
			if (target == 'canvas') {					
				player._api().fp_css("canvas", {backgroundColor:color});
				
			// adjust controlbar coloring
			} else {
	
				window.canvasColor = color;
				player.getControls().css(target, color);	
			}			
			
		} else {
			player.load();	
		}
	});
	
	// skin chooser
	$(":radio[name=skin]").change(function(i) {
		location.href = "controlbar.html?skin=" + $(this).attr("value"); 
	});
	
	// gradient
	$("#gradient").change(function() {
		var val = $(this).val();
		if (val == 'custom') val = [0.1, 0.2, 0.5];
		$f().getControls().css("backgroundGradient", val);					
	});
	
	// border radius
	$("#radius").change(function() {
		$f().getControls().css("borderRadius", $(this).val());	
	});

	// height
	$("#height").change(function() {
		$f().getControls().css("height", $(this).val());	
	});	
	
	// control toggle
	var els = $(":checkbox[name=controls]");
	els.change(function() {
		var params = {};
		els.each(function() {
			params[this.value] = this.checked;
		});
		$f().getControls().widgets(params);	 
	});
	
	
		
	$("a[rel]").overlay({
			
		effect: 'apple',
		
		onLoad: function() {
			$f().hide();	
		}, 
		onClose: function() {
			$f().show();	
		}  
	});
	
	window.getEmbedCode = function() {
		if (!$f().isLoaded()) return;
		
		var code = 'canvas: {backgroundColor: "' + top.canvasColor + '"},\n\nplugins: {\n   controls: {\n';
		
		if (isTube) { code += "      url: " + v.tube + ",\n"; }
		
		$.each($f().getControls().css(), function(key, val) {
			if (typeof val != 'function' && typeof val != 'number' && key.length > 7) {
				if (typeof val == 'object' && val.length) {
					code += "      " + key + ": [" + val + "],\n";	
				} else {
					code += "      " + key + ": '" + val + "',\n";		
				}				
			}
		});			
		
		code += "      height: " + $("#height").val() + ",\n";
		code += "      opacity: 1.0\n   }\n}";

		$("#embedCode pre").text(code).css("fontSize", 16);
		return code;
	}

});