// depends on common.js: QQ
QQ.UIComponent = function(){
	function initCheckboxes(){
	
	  function changeImage(object,state){
	
			var tmp1 = object.src.split("/");
			var tmp2 = tmp1[tmp1.length-1].split(".");
			var currentState = tmp2[0];
	
			var path = "/";
			for (var i = 3; i < tmp1.length-1; ++i){
				path += tmp1[i] + "/";
			}
		
			if (state == "on" || state == "off"){
				object.src = path + state + ".png";
			}else if (state == "over"){
				object.src = path + currentState + "_" + state + ".png";
			}else if (state == "out"){
				if (currentState == "off_over")
				  object.src = path + "off.png";
				else if (currentState == "on_over")
				  object.src = path + "on.png";
				else
				  object.src = path + currentState + ".png";
			}else if (state == "switch"){
				if (currentState == "off")
				  object.src = path + "on.png";
				else if (currentState == "off_over")
				  object.src = path + "on_over.png";
				else if (currentState == "on")
				  object.src = path + "off.png";
				else if (currentState == "on_over")
				  object.src = path + "off_over.png";
			}
			
			var inputValue = obj(object.id+"_input").value;
			if (inputValue == "on") obj(object.id+"_input").value = "off";
			else obj(object.id+"_input").value = "on";
		}
	
		addEvents("class", "qqCheckbox", "mouseover", function(){changeImage(this,"over");});
		addEvents("class", "qqCheckbox", "mouseout", function(){changeImage(this,"out");});
		addEvents("class", "qqCheckbox", "click", function(){changeImage(this,"switch");});
	}
	
	function initButtons(){
	
	  function changeImage(object,state){	
			object.style.backgroundImage = object.style.backgroundImage.replace(/enabled_over.png/,state+".png");
			object.style.backgroundImage = object.style.backgroundImage.replace(/enabled.png/,state+".png");			
		}
	
		addEvents("class", "qqButton", "mouseover", function(){changeImage(this,"enabled_over");});
		addEvents("class", "qqButton", "mouseout", function(){changeImage(this,"enabled");});
	}
	
	
	
	
  return {
  	init: function (componentType){
			switch (componentType){
				case "all":
				  initButtons();
					initCheckboxes();
					break;
				case "buttons":
					initButtons();
					break;
				case "checkboxes":
					initCheckboxes();
					break;
			}
		}
  };
}();