///
// ShareIt (requires)
//  - jId: ID of sharing container element
//  - items: a JSON collection of service items (email, facebook, etc.)
///
// TODO: If you never hover over the popup box then it will never hide.
function ShareIt(jId, items) {

	var self = this;
	this.id = jId;
	this.share;
	this.shareItems;
	this.serviceItems;
	this.title;
	this.button;
	this.icon;
	this.popupBox;

	this.Init = function() {
		this.share = $(jId);
		this.serviceItems = items;
		this.title = this.share.find('.Title');
		this.button = this.share.find('.Button');
		this.icon = this.button.find('.Icon');

		this.BuildPopup();

		this.icon.hover(function() {
			self.ShowPopup();
		}, function() {
			
		});
	}

	this.BuildPopup = function() {

		if (this.serviceItems == undefined || this.serviceItems == null) return;

		var items = this.serviceItems;
		var div = $("<div class='Popup'></div>");

		for (var i = 0; i < items.length; i++) {

			var item = $("<a />").attr('target', '_blank').attr('href', items[i].Url)
				.append($("<div class='Item'></div>")
					.append($("<img />").attr('src', items[i].IconUrl).css('float', 'left'))
					.append($("<div />").text(items[i].Title).css('float', 'left')));

			div.append(item);

			if (i % 2 == 1) {
				div.append($('<div class="Clear"></div>'));
			}
		}

		this.popupBox = div;

		var height = this.share.height() > 0 ? this.share.height() : 22;

		this.popupBox.css('display', 'none').css('top', height + 'px').css('left', '0px')
			.hover(function() {
				self.ShowPopup();
			}, function() {
				self.HidePopup();
			});

		this.share.append(this.popupBox);

		this.shareItems = $('.SharingService .Popup .Item').hover(
			function() {
				$(this).addClass('ItemHover');
			}, function() {
				$(this).removeClass('ItemHover');
			});
	}

	this.ShowPopup = function() {
		this.popupBox.css('display', '');
	}
	
	this.HidePopup = function() {

		setTimeout(function() { self.popupBox.css('display', 'none') }, 1000);
	}

	this.Init();
}