/**
 * Виджет genser
 */

(function($, undefined) { $.widget("ui.genser", {

	options: {
		settings: "settings.txt",
		images: "images",
		materials: null
	},
	
	/**
	 * Инициализация виджета
	 */
	_init: function() {
		var self = this;
		
		self.element.addClass("Genser");

		var genser = $("<div/>").css("position", "relative").appendTo(self.element);
		var image = $("<div/>").css("position", "relative").appendTo(genser);

		var img1 = $("<img/>").attr("src", self.option().images + "/" + "gray.jpg").appendTo(image);
		var img2 = $("<img/>").addClass("Genser_ImageLayer").attr("src", self.option().images + "/" + "back.jpg").appendTo(image);
		
		var layers = {
			bottom: $("<img/>").addClass("Genser_ImageLayer").attr("src", self.option().images + "/" + "bottom/color07.png").appendTo(image),
			top: $("<img/>").addClass("Genser_ImageLayer").attr("src", self.option().images + "/" + "top/color07.png").appendTo(image),
			table: $("<img/>").addClass("Genser_ImageLayer").attr("src", self.option().images + "/" + "table/fw145.png").appendTo(image),
			wall: $("<img/>").addClass("Genser_ImageLayer").attr("src", self.option().images + "/" + "wall/sc010.png").appendTo(image)
		};
		
		var img7 = $("<img/>").addClass("Genser_ImageLayer").attr("src", self.option().images + "/" + "fore.png").appendTo(image);
		
		self._loadSettings(function(materials) {
			self._createControlPanel(materials)
				.appendTo(genser)
				.find(".Genser_ControlPanel_Block_ImageIcon").click(function() {
					var type = $(this).parents(".Genser_ControlPanel_Block").attr("id");
					layers[type].attr("src", self.option().images + "/" + this.id);
					return false;
				});
		});
	},
	
	/**
	 * Создание панели управления виджетом
	 */
	_createControlPanel: function(materials) {
		var self = this;
		
		var panel = $("<div/>")
			.attr("class", "Genser_ControlPanel");
		
		var title = $("<div/>")
			.attr("class", "Genser_ControlPanel_Title")
			.text(materials.controlPanelTitle + ":")
			.appendTo(panel);

		self._createControlPanel_OneBlock("top", materials.top).appendTo(panel);
		self._createControlPanel_OneBlock("bottom", materials.bottom).appendTo(panel);
		self._createControlPanel_OneBlock("table", materials.table).appendTo(panel);
		self._createControlPanel_OneBlock("wall", materials.wall).appendTo(panel);
		
		return panel;
	},
	
	/**
	 * Создание одного блока панели управления
	 */
	_createControlPanel_OneBlock: function(id, material) {
		var self = this;
		
		var block = $("<div/>")
			.attr("id", id)
			.attr("class", "Genser_ControlPanel_Block");
		
		var title = $("<div/>")
			.attr("class", "Genser_ControlPanel_Block_Title")
			.text(material.title + ":")
			.appendTo(block);
		
		self._createControlPanel_OneBlock_Images(material.images).appendTo(block);
		
		$("<div><a/></div>")
			.appendTo(block)
			.find("a")
				.attr("href", material.link)
				.text("Посмотреть другие цвета");
		
		return block;
	},
	
	/**
	 * Создание иконок для одного блока панели управления
	 */
	_createControlPanel_OneBlock_Images: function(images) {
		var self = this;
		
		var result = $("<div/>")
			.attr("class", "Genser_ControlPanel_Block_Images");
		
		$.each(images, function(i, image) {
			var css = {};
			if (image.icon[0] == "#") {
				css = { "background-color": image.icon }
			} else {
				var url = self.option().images + "/" + image.icon;
				css = { "background-image": "url(" + url + ")" }
			}
			$("<div/>")
				.attr("id", image.src)
				.css(css)
				.attr("class", "Genser_ControlPanel_Block_ImageIcon")
				.attr("title", image.label)
				.appendTo(result);
		});
		
		$("<div style='clear: both;'/>").appendTo(result);

		return result;
	},
	
	/**
	 * Загрузка настроек виджета 
	 * и выполнение действий после загрузки.
	 */
	_loadSettings: function(callback) {
		var self = this;
		$.ajax({
			url: self.option().settings,
			type: "GET",
			dataType: "text",
			mimeType: "text/plain; charset=utf-8", // Принудительно применяет к загружаему файлу новый тип и, главное, кодировку.
			success: function(data) {
				data = eval("(" + data + ")");
				self.option("materials", data);
				if ($.isFunction(callback)) callback(data);
			}
		});
	}
	
	
}); }(jQuery));