$(function() {		

//{{{ animation

	$f("player_animation", v.core, {
		canvas: {
			backgroundColor:'#333333'
		},
		
		clip: {
			url: 'http://blip.tv/file/get/KimAronson-TwentySeconds59483.flv',
			autoPlay: false, 
			autoBuffering: true
		},
		
		plugins: {
			controls: {
				url: v.controls,
				time: false,
				volume: false,
				autoHide: false 
			},
			content:  {
				url: v.content,	
				style: {
					p: {fontSize:16}	
				},
				html:'<p>This is our content plugin that can be animated</p>' 
			}
		}, 
		
		onLoad: function() {
			$("#animation_controls :disabled").removeAttr("disabled");	
		},
		
		onUnload: function() {
			$("#animation_controls :enabled").attr("disabled", true);	
		}
		
	});

	
	$("#animate").click(function() {
			
		var props = {};
		
		// construct style properties from dropdown boxes
		$("#animation_controls select").each(function() {
			 var el = $(this);
			 var key = this.name;
			 var val = el.val();
		
			 // if key starts with "_" it is intepreted as bottom, not top  
			 if (key == 'vertical') {
				  key = 'top';
				  if (val.indexOf("_") != -1) {
						key = 'bottom';
						val = val.substring(1);
				  }
			 }   
		
			 // if key starts with "_" it is intepreted as right, not left
			 if (key == 'horizontal') {
				  key = 'left';
				  if (val.indexOf("_") != -1) {
						key = 'right';
						val = val.substring(1);
				  }
			 }
			 
			 if (val && key) {
				props[key] = val;  
			 }
		});
		
		var el = $(":radio[name=element]:checked").val();
		$f().getPlugin(el).animate(props, $("#time").val());
		
	});
	
	$("#reset").click(function() {		
		$f().reset();
		$f().getPlugin("content").animate({top:10,width:'95%',height:60,left:'50%',opacity:1}, 2000);
	});
	
//}}}

});