;(function() {
	"use strict";

	BX.namespace("BX.Landing.UI");


	/**
	 * Implements interface for works with highlights
	 * Implements singleton pattern
	 * @constructor
	 */
	BX.Landing.UI.Highlight = function()
	{
		if (BX.Landing.UI.Highlight.instance)
		{
			return BX.Landing.UI.Highlight.instance;
		}

		this.layout = BX.create("div");
		this.layout.style.position = "absolute";
		this.layout.style.border = "3px #fe541e dashed";
		this.layout.style.top = "2px";
		this.layout.style.right = "2px";
		this.layout.style.bottom = "2px";
		this.layout.style.left = "2px";
		this.layout.style.zIndex = "9999";
		this.layout.style.opacity = ".4";
		this.layout.style.pointerEvents = "none";
	};


	/**
	 * Stores active highlights
	 * @type {BX.Landing.Collection.BaseCollection.<{node: HTMLElement, highlight: HTMLElement}>}
	 */
	BX.Landing.UI.Highlight.highlights = new BX.Landing.Collection.BaseCollection();


	/**
	 * Stores current instance
	 * @type {?BX.Landing.UI.Highlight}
	 */
	BX.Landing.UI.Highlight.instance = null;


	/**
	 * Gets instance of BX.Landing.UI.Highlight
	 * @returns {BX.Landing.UI.Highlight}
	 */
	BX.Landing.UI.Highlight.getInstance = function() {
		if (!BX.Landing.UI.Highlight.instance)
		{
			BX.Landing.UI.Highlight.instance = new BX.Landing.UI.Highlight();
		}

		return BX.Landing.UI.Highlight.instance;
	};


	BX.Landing.UI.Highlight.prototype = {
		/**
		 * Shows highlight for node
		 * @param {HTMLElement|HTMLElement[]} node
		 */
		show: function(node)
		{
			this.hide();
			if (BX.type.isArray(node))
			{
				node.forEach(function(element) {
					this.highlightNode(element);
				}, this);
			}
			else if (BX.type.isDomNode(node))
			{
				this.highlightNode(node);
			}
		},


		/**
		 * Hides highlight for all nodes
		 */
		hide: function()
		{
			BX.Landing.UI.Highlight.highlights.forEach(function(item) {
				BX.remove(item.highlight);
				item.node.style.position = "";
				item.node.style.userSelect = "";
				item.node.style.cursor = "";
			});

			BX.Landing.UI.Highlight.highlights.clear();
		},


		/**
		 * @private
		 * @param node
		 */
		highlightNode: function(node)
		{
			var highlight = BX.clone(this.layout);
			BX.append(highlight, node);

			// var paddingLeft = BX.style(node, "padding-left");
			// var paddingTop = BX.style(node, "padding-top");
			// var paddingBottom = BX.style(node, "padding-bottom");
			// var paddingRight = BX.style(node, "padding-right");

			requestAnimationFrame(function() {
				node.style.position = "relative";
				node.style.userSelect = "none";
				node.style.cursor = "pointer";

				// highlight.style.borderLeft = (paddingLeft || "0px") + " rgba(139, 195, 74, .6) solid";
				// highlight.style.borderTop = (paddingTop || "0px") + " rgba(139, 195, 74, .6) solid";
				// highlight.style.borderBottom = (paddingBottom || "0px") + " rgba(139, 195, 74, .6) solid";
				// highlight.style.borderRight = (paddingRight || "0px") + " rgba(139, 195, 74, .6) solid";
			}.bind(this));

			BX.Landing.UI.Highlight.highlights.add({node: node, highlight: highlight});
		}
	};

})();