var color = {
			
			colorcard_id: false,
			colorcard_name: null,
			data: '',
			colorsPerCol: 14,
			cols: 0,
			colorsWidth: null,
			
			setColor: function(intern, hex){
				$('Farbe').getElementsByTagName('input')[0].value = intern;
				color.setColorProof(hex);

				
			},
			
			setColorProof: function(hex){
				$('color_proof').setStyle({backgroundColor: hex});
				$('color_proof').removeClassName("no_color");
				$('color_proof').addClassName("color");
				color.close();
				if(color.colorize){
				$('image').src = "/colorize/index.php?id="+color.image_id+"&hex="+hex.replace(/#/g, "");
				}
			},

			resetColorProof: function(){
				$('color_proof').setStyle({backgroundColor: 'transparent'});
				$('color_proof').addClassName("no_color");
				$('color_proof').removeClassName("color");
			},

			getColors: function(){
				
				if(color.colorcard_id == '') return false;

				color.init();
				var color_input = $('Farbe').getElementsByTagName('input')[0]
				$(color_input).observe('keyup', color.checkColor);
				

				new Ajax.Request('http://www.alterfil-shop.de/color_admin/colors.php',
				  {
					method:'get',
					parameters: {card_id: this.colorcard_id},
					onSuccess: function(transport){
						
						response = transport.responseText;
						color.data = response.evalJSON();						

						for(i=0; i<color.data.length; i++){
							var intern = color.data[i].intern;
							var hex = "#"+color.data[i].hex;
							color_id = "color_"+i;
							
							if(i % color.colorsPerCol == 0){
								color.cols++;
								ul = document.createElement('ul');
								ul.setAttribute("id","col_"+color.cols);
								$(ul).addClassName("color_col");
								$('colors').insert(ul);
							}
						
							$("col_"+color.cols).insert('<li class="colorfield"><a href="javascript:color.setColor(\''+intern+'\', \''+hex+'\')" id="'+color_id+'" style="background-color:'+hex+'" class="colorlink"></a><label for="'+color_id+'"><a href="javascript:color.setColor(\''+intern+'\', \''+hex+'\')" id="'+color_id+'">'+intern+'</a></label></li>');
							if(color.data.length == (i+1) && color.cols > 5){
								
								$("colors").insert('<div class="clear"></div>');
								$("color_selector").insert('<div id="color_controls"><button onclick="color.previousColors(); return false;">« Farbkarte zurückblättern</button> <button onclick="color.nextColors(); return false;">Farbkarte vorblättern »</button></div>');
								
							}
							
							color.colorsWidth = (color.cols*150);
							$('colors').style.width = color.colorsWidth+"px";
						}
						
						
					},
					onFailure: function(){ alert('Something went wrong...') }
				  });

			},

			nextColors: function(){
				if((color.colorsWidth*-1) < parseInt($('colors').getStyle('left'))-750)
				new Effect.Move('colors', { x: -750, y: 0, mode: 'relative', queue: {position: 'end', limit: 1, scope: 'menuxscope'}});
			},

			previousColors: function(){
				if(0 >= parseInt($('colors').getStyle('left'))+750)
				new Effect.Move('colors', { x: 750, y:  0, mode: 'relative', queue: {position: 'end', limit: 1, scope: 'menuxscope'}});
			},
			
			init: function(){
				if($('Farbe')){
				if(!$("inactive") && !$("colors")){
					
					if(window.innerWidth){
						window_width = window.innerWidth-19;
						window_height = window.outerHeight;
					}else{
						window_width = document.body.clientWidth;
						window_height = document.body.clientHeight;
					}


					
					var inactive = document.createElement("div");

					inactive.setAttribute("id", "inactive");
					inactive.style.width = window_width+"px";
					inactive.style.height = window_height+"px";
					inactive.style.display = "none";
					
					$(document.body).insert({bottom: inactive});

				
					color_selector = document.createElement("div");
					color_selector.setAttribute("id","color_selector");
					color_selector.style.display = "none";

					close_button = document.createElement("div");
					close_button.setAttribute("id", "color_selector_close");

					popup_label = document.createElement("div");
					$(popup_label).addClassName("popup_label");
					popup_label.innerHTML = "Bitte wählen Sie eine Farbe";
					
					color_selector.appendChild(popup_label);
					color_selector.appendChild(close_button);

					var clear = new Element('div', {'class': 'clear'});
					$(color_selector).insert(clear);

					colors_container = document.createElement("div");
					colors_container.setAttribute("id", "colors_container");

					colors = document.createElement("div");
					colors.setAttribute("id", "colors");

					colors_container.appendChild(colors);

					color_selector.appendChild(colors_container);

					document.body.appendChild(color_selector);

					$('color_selector_close').observe('click', function(){color.close()});

					object_width = $('color_selector').getWidth();

					$('color_selector').style.left = (window_width/2)-(object_width/2)+"px";
					
				}
				}
			},

			show: function(){
				$("color_selector").show();
				$("inactive").show();
			},

			close: function(){
				$("color_selector").hide();
				$("inactive").hide();
			},

			checkColor: function(){
				var match = false;
				var value = $('Farbe').getElementsByTagName('input')[0].value;
				for(i=0; i<color.data.length; i++){
					if(color.data[i].intern == value){
						match = "#"+color.data[i].hex;
					}
				}

				if(match){
					color.setColorProof(match);
					match = false;
					return false;
				}else{
					color.resetColorProof();
					return true;
				}
			},

			checkSubmit: function(){
				if($('Farbe')){
				if(color.checkColor()){
					alert("Falsche Farbnummer");
					return false;
				}else{
					return true;
				}
				}else{
					return true;
				}

			}

		}