$( function()
{
	// SWITCHER BEGIN
	
	var home = ($('div.home-switcher-presentation').length  > 0);
	
	function hex(x)
	{
		return ("0" + parseInt(x).toString(16)).slice(-2);
	}
	
	function rgb2hex(rgb)
	{
		rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);

		return hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
	}

	var colors =
	{
		'color':
		[
			'a',
			'a:hover',
			'.gallery * a',
			'.gallery-extended .details > *:first-child a',
			'.gallery-extended.grid .details a:focus',
			'span.dropcap.style-2',
			'.news.featured h2 a:focus',
			'.comments .author',
			'.error404 h3',
			'.featured-1 .items li h3 a',
			'#nav > ul > li.current > a',
			'.menu-1 li.current > a',
			'#breadcrumb a',
			'.slider-nav-2',
			'.slider-nav-3'
		],
		'background-color':
		[
			'.tabs.clean .nav li:hover',
			'.tabs.clean .content li',
			'.slider.background .slider-nav a:focus',
			'.slider.pure .slider-nav a:focus',
			'.zoombox .slider-nav li a:hover',
			'.slider-nav li a:hover',
			'.lightbox .nav li a:hover'
		],
		'border-color':
		[
			'.tabs.clean .nav li:hover',
			'.tabs.clean .content li'
		]
	};
	
	var skins =
	{
		'default': { 'name': 'Default', 'style': 'light.css', 'background': 'url(images/gr/1.gif) 0 0 repeat-x' },
		'light1': { 'name': 'Light 1 Orange', 'style': 'light.css', 'background': 'url(images/skins/light/bg/1.jpg) 50% 0 no-repeat' },
		'light2': { 'name': 'Light 2 Mix', 'style': 'light.css', 'background': 'url(images/skins/light/bg/2.jpg) 50% 0 no-repeat' },
		'light3': { 'name': 'Light 3 Sea', 'style': 'light.css', 'background': 'url(images/skins/light/bg/3.jpg) 50% 0 no-repeat' },
		'dark1': { 'name': 'Dark 1 Leather', 'style': 'dark.css', 'background': '#111 url(images/skins/dark/bg/1.jpg) 50% 0 repeat' },
		'dark2': { 'name': 'Dark 2 Leather', 'style': 'dark.css', 'background': '#111 url(images/skins/dark/bg/2.jpg) 50% 0 repeat' },
		'dark3': { 'name': 'Dark 3 Leather', 'style': 'dark.css', 'background': '#111 url(images/skins/dark/bg/3.jpg) 50% 0 repeat' },
		'dark4': { 'name': 'Dark 4 Leather', 'style': 'dark.css', 'background': '#111 url(images/skins/dark/bg/4.jpg) 50% 0 repeat' },
		'dark5': { 'name': 'Dark 5 Vintage', 'style': 'dark.css', 'background': '#000 url(images/skins/dark/bg/5.jpg) 50% 0 no-repeat' },
		'dark6': { 'name': 'Dark 6 Wood', 'style': 'dark.css', 'background': '#111 url(images/skins/dark/bg/6.jpg) 50% 0 repeat' },
		'wood': { 'name': 'Wood', 'style': 'wood.css', 'background': '#fff url(images/skins/wood/bg/1.jpg) 50% 0 repeat' }
	};
	
	var sliders =
	{
		'default': { 'name': 'Default' },
		'background': { 'name': 'Background' },
		'displays': { 'name': 'Displays' },
		'piecemaker': { 'name': 'Piecemaker' },
		'pure': { 'name': 'Pure' },
		'video': { 'name': 'Video' },
		'wide': { 'name': 'Wide' },
	};
	
	var font_familes =
	[
		'h1',
		'h2',
		'h3',
		'h4',
		'h1 a',
		'h2 a',
		'h3 a',
		'h4 a',
		'table.pricing-1 .price',
		'table.pricing-1 .price strong',
		'table.pricing-1 table.column tr > th',
		'table.pricing-1 table.column.current th',
		'.pricing-table-button',
		'.slider-nav-2 li',
		'.slider-nav-3 li',
		'#main-heading h2.alt',
		'.news.compact .header h2',
		'.news.featured h2',
		'.comments .author',
		'.comments .staff .author',
		'.comments .staff .author span',
		'.slider .desc h2',
		'#footer h3'
	];
	
	var fonts =
	[
		'Diavlo',
		'Allerta',
		'Allerta Stencil',
		'Arimo',
		'Arvo',
		'Bentham',
		'Cantarell',
		'Cardo',
		'Coda',
		'Cousine',
		'Covered By Your Grace',
		'Crisomo Text',
		'Cuprum',
		'Droid Sans Mono',
		'Droid Sans',
		'Droid Serif',
		'Geo',
		'IM Fell',
		'Inconsolata',
		'Jangerine',
		'Josefin Sans',
		'Josefin Slab',
		'Just Me Again Down Here',
		'Lobster',
		'Molengo',
		'Neucha',
		'Neuton',
		'Nobile',
		'OFL Sorts Mill',
		'Old Standard TT',
		'Philosopher',
		'PT Sans',
		'Puritan',
		'Raleway',
		'Reenie Beanie',
		'Tinos',
		'Unifraktur Cook',
		'Unifraktur Magunita',
		'Vollkorn',
		'Yanone Kaffeesatz'
	];
	
	$switcher = $('<div />').attr('id', 'switcher-holder').addClass('closed js').load('switcher/switcher.html #switcher-holder > *', function()
	{
		$('body').append($switcher);
		
		$('div#switcher').show();
		$('#switcher-holder').removeClass('closed');
		
		$('#switcher-holder input.color-value').blur( function()
		{
			$('#switcher-holder input.color-picker').css('background-color', $('#switcher-holder input.color-value').val());
		}).change( function()
		{
			var style = '';
			color = $(this).val();
			
			$.each(colors, function(key, elements)
			{
				$.each(elements, function(index, selector)
				{
					style += selector + ' {' + key + ':' + color + ';}';
				});
			});
				
			$('style.colors').remove();
			$('<style />').attr('type', 'text/css').text(style).addClass('colors').addClass('custom-rules').appendTo('head');
		});
			
		$('#switcher-holder input.color-picker').css('background-color', $('#switcher-holder input.color-value').val()).
		ColorPicker
		({
			onSubmit: function(hsb, hex, rgb, el)
			{
				$(el).css('background', '#' + hex);
				$(el).val('#' + hex);
				$('#switcher-holder input.color-value').val('#' + hex).change();
				$(el).ColorPickerHide();
			},
			onBeforeShow: function()
			{
				$(this).ColorPickerSetColor($('#switcher-holder input.color-value').val());
			},
			onHide: function(picker, el)
			{
				$picker = $(picker);
				color = $picker.data('colorpicker');
			}
		}).bind('keyup', function(e)
		{
			if (e.keyCode == 27)
			{
				$('#switcher-holder input.color-picker').ColorPickerHide();
			}
		});
		
		$('#switcher-holder a#reset').click( function()
		{
			location.reload(true);
			
			return false;
		});
				
		$('#switcher-holder a.toggle-switcher').click( function()
		{
			$(this).next('div#switcher').toggle().parent('#switcher-holder').toggleClass('closed');
		});

		$.each(skins, function(key, skin)
		{
			$skin = $('<option />');
			$skin.val(key).text(skin['name']);
			
			$('select[name=skin]').append($skin);
		});
		
		$.each(sliders, function(key, slider)
		{
			$slider = $('<option />');
			$slider.val(key).text(slider['name']);
			
			$('select[name=slider]').append($slider);
		});
		
		$.each(fonts, function(i, font)
		{
			$font = $('<li />');
			$font.append($('<a />').append($('<img />').attr('src', 'switcher/fonts/' + font.toLowerCase().replace(/ /g, '-') + '.png').attr('alt', font)));
			$option = $('<option />').text(font).val(font.toLowerCase().replace(/ /g, '-'));
			
			if (i == 0)
			{
				$font.addClass('selected');
				$option.attr('selected', 'selected');
			}
			
			$('select[name=font]').append($option);
			$('ul.fonts').append($font);
		});
		
		$('select[name=skin]').change( function()
		{
			skin = skins[$(this).children('option:selected').val()];

			$('link[href!=switcher/css/colorpicker.css]').last().remove();
			$('head').append($('<link />').attr('rel', 'stylesheet').attr('type', 'text/css').attr('href', skin['style']));
			$('body').css('background', skin['background']);
		});
		
		$('select[name=slider]').change( function()
		{
			slider = $(this).children('option:selected').val();
			
			if (slider == 'default')
			{
				slider = 'wide';
			}
			
			if (home)
			{
				$slider = $('<div />').load('switcher/sliders/' + slider + '.html', function()
				{
					$('div.slider').first().remove();
					$slider = $slider.children().clone();
					var images = $slider.find('img').length;
					var images_loaded = 0;
					
					$slider.addClass('js');

					if (slider == 'piecemaker')
					{
						$('div#content').prepend($slider);
						
						$('div.slider').first().css
						({
							'width': '120%',
							'height': '500px'
						});
					} else
					{
						$slider.find('img').load( function()
						{
							images_loaded++;
							
							if (images_loaded == images)
							{
								if (slider == 'background')
								{
									$('div#container').prepend($slider);
								} else
								{
									$('div#content').prepend($slider);
								}
								
								if (slider == 'background')
								{
									setup_background($('div.background').first());
								} else if (slider == 'displays')
								{
									setup_displays($('div.displays').first());
								} else if (slider == 'pure')
								{
									setup_pure($('div.pure').first());
								} else if (slider == 'video')
								{
									setup_video($('div.video').first());
								} else if (slider == 'wide')
								{
									setup_wide($('div.wide'));
								}
							}
						});
					}
				});
			}
		});
		
		$(document).click( function()
		{
			if ($('ul.fonts').hasClass('opened'))
			{
				$('ul.fonts').removeClass('opened').addClass('selected');
				
				return false;
			}
		});
		
		$('select[name=font] + ul.selected').click( function()
		{
			$(this).addClass('opened').removeClass('selected');
			$(this).prev('select').focus();
			
			return false;
		});
		
		$('select[name=font] + ul li').click( function()
		{
			if ($(this).parent().hasClass('opened'))
			{
				$(this).parent('ul.fonts').scrollTop(0).removeClass('opened').addClass('selected').children('li').removeClass('selected');
				$(this).addClass('selected');
				
				var style = '';
				font = $(this).find('img').attr('alt');
				$('select[name=font]').val(font.toLowerCase().replace(/ /g, '-'));
				variants = 'regular';
				
				$('style.fonts').remove();
				$('link[href^=http://fonts.googleapis.com]').remove();
				
				if (font.toLowerCase() == 'diavlo')
				{
					
				} else
				{
					WebFont.load
					({
						google:
						{
							families: [ font.replace(/ /g,"+") + ':' + 'regular,bold' ]
						}
					});	
					
					$.each(font_familes, function(index, selector)
					{
						style += selector + ' { font-family: \'' + font + '\' !important;}';
					});
						
					
					$('<style />').attr('type', 'text/css').text(style).addClass('fonts').addClass('custom-rules').appendTo('head');
				}
				
				return false;
			}
		});
		
		$('select[name=font]').mousedown( function()
		{
			$(this).next('ul.fonts').addClass('opened').removeClass('selected');
			$(this).focus();
			
			return false;
		});
	});
	
	// SWITCHER END
});