--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/develop/js/layout.js	Thu Feb 05 16:07:53 2015 +0100
@@ -0,0 +1,67 @@
+(function($){
+	var initLayout = function() {
+		var hash = window.location.hash.replace('#', '');
+		var currentTab = $('ul.navigationTabs a')
+							.bind('click', showTab)
+							.filter('a[rel=' + hash + ']');
+		if (currentTab.size() == 0) {
+			currentTab = $('ul.navigationTabs a:first');
+		}
+		showTab.apply(currentTab.get(0));
+		$('#colorpickerHolder').ColorPicker({flat: true});
+		$('#colorpickerHolder2').ColorPicker({
+			flat: true,
+			color: '#00ff00',
+			onSubmit: function(hsb, hex, rgb) {
+				$('#colorSelector2 div').css('backgroundColor', '#' + hex);
+			}
+		});
+		$('#colorpickerHolder2>div').css('position', 'absolute');
+		var widt = false;
+		$('#colorSelector2').bind('click', function() {
+			$('#colorpickerHolder2').stop().animate({height: widt ? 0 : 173}, 500);
+			widt = !widt;
+		});
+		$('#colorpickerField1, #colorpickerField2, #colorpickerField3').ColorPicker({
+			onSubmit: function(hsb, hex, rgb, el) {
+				$(el).val(hex);
+				$(el).ColorPickerHide();
+			},
+			onBeforeShow: function () {
+				$(this).ColorPickerSetColor(this.value);
+			}
+		})
+		.bind('keyup', function(){
+			$(this).ColorPickerSetColor(this.value);
+		});
+		$('#colorSelector').ColorPicker({
+			color: '#0000ff',
+			onShow: function (colpkr) {
+				$(colpkr).fadeIn(500);
+				return false;
+			},
+			onHide: function (colpkr) {
+				$(colpkr).fadeOut(500);
+				return false;
+			},
+			onChange: function (hsb, hex, rgb) {
+				$('#colorSelector div').css('backgroundColor', '#' + hex);
+			}
+		});
+	};
+	
+	var showTab = function(e) {
+		var tabIndex = $('ul.navigationTabs a')
+							.removeClass('active')
+							.index(this);
+		$(this)
+			.addClass('active')
+			.blur();
+		$('div.tab')
+			.hide()
+				.eq(tabIndex)
+				.show();
+	};
+	
+	EYE.register(initLayout, 'init');
+})(jQuery)
\ No newline at end of file