/**
 * @author simon.elvery
 */
var Behaviours = function() 
{
	// Make sure we can use $ locally. Not using prototype/scriptaculous anywhere here.
	var $ = jQuery;
	var speed = 500;
	
	// Some private variables
	var expand_button = $('<img style="position:absolute; bottom:0; right:0;" src="/cms_files/87/red_buttons-expand.gif" class="expand button" alt="Expand">');
	var collapse_button = $('<img style="position:absolute; bottom:0; right:0;" src="/cms_files/87/red_buttons-collapse.gif" class="collapse button" alt="Collapse">');
	
	/**
	 * Collapse the section(s) passed.
	 * @param DOMObject obj The DOMObject(s) representing the sections(s) to collapse.
	 */
	var collapse = function(obj){
		$('.section-content', obj).hide(speed, function(){
			$('.expand', obj).fadeIn(speed);
			$(obj).removeClass('active');
			$('.section-image.active').fadeOut('speed', function(){
				var section = $('.section-content', obj);
				$(this).removeClass('active').insertAfter(section);
			});
		});
		$('.section-header', obj).stop().animate({backgroundPosition:"(0 -240px)"}, {duration:speed}).unbind('click');
		$('.section-header, .expand', obj).click(expand_section);
	}
	
	var collapse_active = function(){
		collapse($('div.section.active'));
	}
	
	var collapse_all = function(){
		var obj = $('div.section');
		$('.section-content', obj).hide(0, function(){
			$('.expand', obj).show(0);
			$(obj).removeClass('active');
		});
		$('.section-header', obj).stop().animate({backgroundPosition:"(0 -240px)"}, {duration:speed});
		$('.section-header, .expand', obj).click(expand_section);
	}
	
	var collapse_section = function(){
		collapse(get_section(this));
	}
	
	/**
	 * Expand the section(s) passed.
	 * @param DOMObject obj The DOMObject(s) representing the sections(s) to expand.
	 */
	var expand = function(obj) {
		$('.expand', obj).hide();
		$('.section-content', obj).show(speed, function(){
			$(obj).addClass('active');
			$('.section-image', obj).css({
				'position': 'absolute',
				'top' : '0',
				'left' : '0'
			}).addClass('active').insertAfter('#page-image').fadeIn(speed);
		});
		$('.section-header', obj).stop().animate({backgroundPosition:"(0 0)"}, {duration:speed});
		$('.section-header, .expand', obj).unbind('click');
		$('.section-header', obj).click(collapse_section);
		
	}
	
	var expand_section = function(){
		collapse_active();
		expand(get_section(this));
	}
	
	var get_section = function(child_node) {
		return $(child_node).parents('div.section').get(0);
	}
	
	return {
		
		/**
		 * Initialise the site's behaviours.
		 */
		init: function() { 
			
			$('div.section .section-header').css('background-position', '0 -240px');
			
			// Setup initial state
			collapse_all();
			
			$('div.section .section-image').hide();
			
			// Add collapse and expand buttons
			$('div.section').append(expand_button);
			$('div.section .section-content').append(collapse_button);
			
			// Add behaviours to buttons
			$('div.section .expand, div.section .section-header').click(expand_section);
			$('div.section .collapse').click(collapse_section);
			
			// Load the active section
			var tmp_speed = speed;
			speed = 1;
			var fragment = location.href.replace(/.*#/,''); // the fragment
			var $section = $('#' + fragment);
			if (fragment.length > 0 && fragment != location.href && $section.length > 0) {
				expand($section);
			} else {
				var active = $('div.section.active').get(0);
				if (active) {
					expand(active);
				}
			}
			speed = tmp_speed;
			
			// Portfolio menu re-arrangement
			var $slider = $('#sidebar.portfolio');
			if ($slider.length > 0) {
				$slider
					.append('<img src="/cms_files/72/sidepanel_buttons-previous.png" class="sidebar button prev">')
					.append('<img src="/cms_files/72/sidepanel_buttons-next.png" class="sidebar button next">');
				var $container = $('#portfolio_sub_menu');
				var $panels = $('#portfolio_sub_menu ul');
				var $scroll = $('<div id="portfolio_sub_menu_container">')
					.append($container)
					.prependTo($slider)
					.css({
						overflow: 'hidden',
						position: 'relative',
						width: '260px'
					});
				
				var panes = 0;
				var current_pane = null;
				$panels.children().each(function(i){
					if (i%8 == 0){
						panes++;
						current_pane = $('<ul id="portfolio_pane_' + panes + '" class="clearfix">').appendTo($container);
					}
					
					current_pane.append(this);
					var $link = $('a', this);
					$link.attr('href', $link.attr('href') + '#portfolio_pane_' + panes);
				});
				
				// Remove the old ul and get the new panels
				$panels.remove();
				$panels = $('#portfolio_sub_menu ul');
				
				// Coda slider functionality
				$container.css('width', $panels[0].offsetWidth * $panels.length);
				$scroll.css('overflow', 'hidden');
				var offset = -1;
				
				var scroll_options = {
					target : $scroll,
					items : $panels,
					prev : '.sidebar.button.prev',
					next : '.sidebar.button.next',
					axis : 'xy',
					offset : offset,
					duration : 300,
					easing : 'swing',
					cycle : false,
					onBefore : function(p,q) {
//						console.log(p);
					},
					onAfter : function(p,q) {
						
						//console.log(q);
						//console.log(p);
					}
				}
				$slider.serialScroll(scroll_options);
				$.localScroll(scroll_options);
				scroll_options.duration = 0.1;
				$.localScroll.hash(scroll_options)	
			}
		}
	}
}();

jQuery(document).ready(Behaviours.init);


/**
 * @author Alexander Farkas
 * v. 1.02
 */
(function($) {
	$.extend($.fx.step,{
	    backgroundPosition: function(fx) {
            if (fx.state === 0 && typeof fx.end == 'string') {
                var start = $.curCSS(fx.elem,'backgroundPosition');
				start = toArray(start);
                fx.start = [start[0],start[2]];
                var end = toArray(fx.end);
                fx.end = [end[0],end[2]];
                fx.unit = [end[1],end[3]];
			}
            var nowPosX = [];
            nowPosX[0] = ((fx.end[0] - fx.start[0]) * fx.pos) + fx.start[0] + fx.unit[0];
            nowPosX[1] = ((fx.end[1] - fx.start[1]) * fx.pos) + fx.start[1] + fx.unit[1];           
            fx.elem.style.backgroundPosition = nowPosX[0]+' '+nowPosX[1];
            
           function toArray(strg){
               strg = strg.replace(/left|top/g,'0px');
               strg = strg.replace(/right|bottom/g,'100%');
               strg = strg.replace(/([0-9\.]+)(\s|\)|$)/g,"$1px$2");
               var res = strg.match(/(-?[0-9\.]+)(px|\%|em|pt)\s(-?[0-9\.]+)(px|\%|em|pt)/);
               return [parseFloat(res[1],10),res[2],parseFloat(res[3],10),res[4]];
           }
        }
	});
})(jQuery);