(function ($) {
	// PLUGIN INTERFACE
	$.interface = function (url, options) {
		
		// some private vars
		var _items;
	
		// default settings
		var _settings = $.extend({
			columns: '.column',
			widgetSelector: '.widget',
			handleSelector: '.widget-head',
			contentSelector: '.widget-content',
			
			// If you don't want preferences to be saved change this value to
			// false, otherwise change it to the name of the cookie:
			saveToCookie: 'inettuts-widget-preferences',
			
			widgetDefault: {
				movable: true,
				removable: true,
				collapsible: true,
				editable: false,
				colorClasses: ['color-blu', 'color-giallo']
			},
			widgetIndividual: {}
		}, options);
		
		var loadWidgets = function () {
			var settings = _settings;
			var items = _items;
			var loading = '<img src="/icone/loading.gif" />';
			var cookie = $.cookie(settings.saveToCookie);
		  
			if (settings.saveToCookie && cookie) {
				$(settings.columns).each(function (i, dom) {
					var widgetData = cookie.split('|')[i].split(';');
					$(widgetData).each(function (index, elem) {
						if (!this.length) {
							return;
						}
						var thisWidgetData = this.split(',');
						addWidget(thisWidgetData[0], i + 1);
					});
				});			 
			} else {
				$.each(items, function (i, dom) {
					if (dom.id && dom.column) {
						addWidget(dom.id, dom.column);
					}
				});	 			
			}
		};
	
		var addWidget = function (idWidget, idColumn) {
			var settings = _settings;
			var items = _items;
			var loading = '<img src="/icone/loading.gif" />';
			
			if (items[idWidget]) {
				//item.id = idColumn + item.id;
				var item = items[idWidget];
				var html = '<li class="widget color-' + item.color + '" id="' + item.id + '">';
				if (item.type == 'content-fixed') {
					html += '<div class="widget-fixed-head">';
					html += '<div style="float: left;"><div class="icon"></div>';
					html += '<h3>' + item.title + '</h3><div class="subtitle">' + item.subtitle + '</div></div></div>';
				} else {
					html += '<div class="widget-head">';
					if (item.icon) {
						html += '<div style="float: left;"><div class="icon"></div>';
						html += '<h3>' + item.title + '</h3></div></div>';
					} else {
						html += '<h3>' + item.title + '</h3></div>';
					}
				}
				html += '<div class="widget-content" id="' + item.id + '-content">' + loading + '</div>';
				html += '<div class="chiusura"></div>';
				html += '</li>';
				$("#column" + idColumn).append(html);
				
				$.ajax({
					url: item.dataurl,
					success: function (data, textStatus, XMLHttpRequest) {
						$('#' + item.id + '-content').html(data);
					},
					timeout: 30 * 1000,
					error: function (XMLHttpRequest, textStatus, errorThrown) {
						$('#' + item.id + '-content').html('Impossibile caricare la richiesta! Error Type: ' + textStatus);
					}
				});
			}
		};
	
		var attachStylesheet = function (href) {
			return $('<link href="' + href + '" rel="stylesheet" type="text/css" />').appendTo('head');
		};
		
		var collapseWidgets = function () {
			var settings = _settings;
			var items = _items;
			var cookie = $.cookie(settings.saveToCookie);
		  
			if (settings.saveToCookie && cookie) {
				$(settings.columns).each(function (i, dom) {
					var thisColumn = $(this);
					var widgetData = cookie.split('|')[i].split(';');
					$(widgetData).each(function (index, elem) {
						if (!this.length) {
							return;
						}
						var thisWidgetData = this.split(',');
						
						if ($.trim(thisWidgetData[0]) != '') {
							var clonedWidget = $('#' + $.trim(thisWidgetData[0]));
						
							if ($.trim(thisWidgetData[1]) == 'collapsed') {
								$(clonedWidget).addClass('collapsed');
							}	
						}
					});
				});
			}
		};
			
		var addWidgetControls = function () {
			var settings = _settings;
			var items = _items;
				
			$(settings.widgetSelector, $(settings.columns)).each(function (i, dom) {
				var thisWidgetSettings = getWidgetSettings(this.id);
	
				// REMOVABLE
				if (thisWidgetSettings.removable && items[this.id].removable != false) {
						
					$('<a href="#" class="remove">CLOSE</a>').bind('mousedown', function (e) {
						/* STOP event bubbling */
						e.stopPropagation();	
					}).bind('click', function (e) {
						$(this).parents(settings.widgetSelector).animate({
							opacity: 0
						}, function () {
							$(this).wrap('<div/>').parent().slideUp(function () {
								$(this).remove();
								// Save prefs to cookie
								savePreferences();
							});
						});
					}).appendTo($(settings.handleSelector, this));
					
					$('<div class="clear"></div>').appendTo($(settings.handleSelector, this));
				}
				
				// EDITABLE
				if (thisWidgetSettings.editable) {
					$('<a href="#" class="edit">EDIT</a>').bind('mousedown', function (e) {
						/* STOP event bubbling */
						e.stopPropagation();	
					}).toggle(function () {
						$(this).css({backgroundPosition: '-66px 0', width: '55px'}).parents(settings.widgetSelector).find('.edit-box').show().find('input').focus();
						return false;
					}, function () {
						$(this).css({backgroundPosition: '', width: '24px'}).parents(settings.widgetSelector).find('.edit-box').hide();
						return false;
					}).appendTo($(settings.handleSelector, this));
					
					$('<div class="edit-box" style="display: none;"/>')
						.append('<ul><li class="item"><label>Change the title?</label><input value="' + $('h3', this).text() + '"/></li>')
						.append((function () {
							var colorList = '<li class="item"><label>Available colors:</label><ul class="colors">';
							$(thisWidgetSettings.colorClasses).each(function () {
								colorList += '<li class="' + this + '"/>';
							});
							return colorList + '</ul>';
						})())
						.append('</ul>')
						.insertAfter($(settings.handleSelector,this));
				}
				
				// COLLAPSIBLE
				if (thisWidgetSettings.collapsible && items[this.id].collapsible != false ) {
					$('<a href="#" class="collapse">COLLAPSE</a>').bind('mousedown', function (e) {
						/* STOP event bubbling */
						e.stopPropagation();	
					}).bind('click', function (e) {
						$(this).parents(settings.widgetSelector).toggleClass('collapsed');
						// Save prefs to cookie
						savePreferences();
						return false;	
					}).prependTo($(settings.handleSelector, this));
				}
			});
			
			$('.edit-box').each(function (i, dom) {
				$('input', this).bind('keyup', function (e) {
					$(this).parents(settings.widgetSelector).find('h3').text( ($(this).val().length > 20) ? $(this).val().substr(0,20) + '...' : $(this).val() );
					// Save prefs to cookie
					savePreferences();
				});
				$('ul.colors li', this).bind('click', function (e) {
					var colorStylePattern = /\bcolor-[\w]{1,}\b/;
					var thisWidgetColorClass = $(this).parents(settings.widgetSelector).attr('class').match(colorStylePattern);
					if (thisWidgetColorClass) {
						$(this).parents(settings.widgetSelector).removeClass(thisWidgetColorClass[0]).addClass($(this).attr('class').match(colorStylePattern)[0]);
						// Save prefs to cookie
						savePreferences();
					}
					return false;
				});
			});
		};
		
		var getWidgetSettings = function (id) {
			var settings = _settings;
			return (id && settings.widgetIndividual[id]) ? $.extend({}, settings.widgetDefault, settings.widgetIndividual[id]) : settings.widgetDefault;
		};
	
		var savePreferences = function () {
			var settings = _settings;
			var cookieString = '';
				
			if (!settings.saveToCookie) {
				return;
			}
			
			/* Assemble the cookie string */
			$(settings.columns).each(function (i, dom) {
				cookieString += (i === 0) ? '' : '|';
				$(settings.widgetSelector, this).each(function (i, dom) {
					cookieString += (i === 0) ? '' : ';';
					cookieString += $(this).attr('id') + ',';
					cookieString += ($(settings.contentSelector, this).css('display') === 'none') ? 'collapsed' : 'not-collapsed';
				});
			});
			$.post("preferences-save.php", {myLayout: cookieString});
		};
	
		var makeSortable = function () {
			var settings = _settings;
			var items = _items;
			
			$sortableItems = (function () {
				var notSortable = '';
				$(settings.widgetSelector, $(settings.columns)).each(function (i, dom) {
					 if (items[this.id].movable == false) {
						if (!this.id) {
							this.id = 'widget-no-id-' + i;							   
						}
						notSortable += '#' + this.id + ',';
					}
				});
				if (notSortable != '') {
					return $('> li:not(' + notSortable + ')', settings.columns);
				} else {
					return $('> li', settings.columns);
				}
			})();

			$sortableItems.find(settings.handleSelector).css({
				cursor: 'move'
			}).bind('mousedown', function (e) {
				$sortableItems.css({width: ''});
				$(this).parent().css({
					width: $(this).parent().width() + 'px'
				});
			}).bind('mouseup', function (e) {
				if (!$(this).parent().hasClass('dragging')) {
					$(this).parent().css({width: ''});
				} else {
					$(settings.columns).sortable('disable');
				}
			}); 
	
			$(settings.columns).sortable({
				items: $sortableItems,
				connectWith: $(settings.columns),
				handle: settings.handleSelector,
				placeholder: 'widget-placeholder',
				forcePlaceholderSize: true,
				revert: 300,
				delay: 100,
				//opacity: 0.8,
				opacity: 0,
				containment: 'document',
				start: function (e, ui) {
					$(ui.helper).addClass('dragging');
				},
				stop: function (e, ui) {
					$(ui.item).css({width: ''}).removeClass('dragging');
					$(settings.columns).sortable('enable');
					// Save prefs to cookie
					savePreferences();
				}
			});
		};
		
		var delPreferences = function () {
			var settings = _settings;
			var cookieString = '';
			$.cookie(settings.saveToCookie, '', {expires: -1}); 
			$.post("preferences-del.php", {myLayout: cookieString}, function (data) {
				location.reload(); 
			});
		};
	
		var viewWidgets = function () {
			var settings = _settings;
	
			$("#widgetlist").hide();
			$(".columns").show();
		};
	   
		var insertWidget = function (idWidget, idColumn) {
			var settings = _settings;
			var items = _items;
	
			addWidget(idWidget, idColumn);
			// Save prefs to cookie
			savePreferences();					
			$('#widgetlistitems #' + idWidget + ' a').replaceWith('<img src="/icone/accept.png" /> <span style="color: green; font-weight: bold;">Aggiunto</span>');
		};
	
		var loadWidgetList = function () {
			var settings = _settings;
			var items = _items;
			var itemsSelected = [];
			var listContent = '';
			var listRss = '';
			var listGadget = '';
	
			$(".columns").hide();
			$("#widgetlist").show();
		  
			var cookie = $.cookie(settings.saveToCookie);
			if (settings.saveToCookie && cookie) {
				$(settings.columns).each(function(i){
					widgetData = cookie.split('|')[i].split(';');
					$(widgetData).each(function () {
						if(!this.length) {
							return;
						}
						var thisWidgetData = this.split(',');
						itemsSelected.push(thisWidgetData[0]);
					});
				});
			} 
	
			$.each(items, function (i, item) {
				if ($.inArray(item.id, itemsSelected) != -1) {
		
				} else {
					if (item.type == 'content-fixed') {
						listContent +=  '<li id="' + item.id + '">' + item.title ;
						listContent += '<a href="#" class="addlink">';
						listContent += '<img src="/icone/add.png" />' + '</a></li>';
					} else if (item.type == 'content') {
						listContent +=  '<li id="' + item.id + '">' + item.title ;
						listContent += '<a href="#" class="addlink">';
						listContent += '<img src="/icone/add.png" />' + '</a></li>';
					} else if (item.type == 'rss') {
						listRss +=  '<li id="' + item.id + '">' + item.title ;
						listRss += '<a href="#" class="addlink">';
						listRss += '<img src="/icone/add.png" />' + '</a></li>';
					} else if (item.type == 'gadget') {
						listGadget +=  '<li id="' + item.id + '">' + item.title ;
						listGadget += '<a href="#" class="addlink">';
						listGadget += '<img src="/icone/add.png" />' + '</a></li>';
					}
				}
			});
			$('#widgetlistIntro').load('/content/presentation.php');
			$("#widgetlistitems").html('<h3>Lista Widget</h3><ul id="list-content"></ul>');
			$("#widgetlistitems ul#list-content").append(listContent);
			$("#widgetlistitems").append('<h3>Lista RSS</h3><ul id="list-rss"></ul>');
			$("#widgetlistitems ul#list-rss").append(listRss);
			$("#widgetlistitems").append('<h3>Lista Gadget</h3><ul id="list-gadget"></ul>');
			$("#widgetlistitems ul#list-gadget").append(listGadget);
			
			$('.addlink').bind('click', function (e) {
				var id = $(this).parent().attr('id');
				if (id.length > 0) {
					insertWidget(id, 1);
				}
				return false;
			});
		};

		$("#widgetlist").hide();
		
		$.getJSON(url, function (data, textStatus) {
			_items = data;

			loadWidgets();
			//attachStylesheet('/css/interface.js.css');
			collapseWidgets();
			addWidgetControls();
			makeSortable();
			// Save prefs to cookie
			savePreferences();
		});
		
		return {
			'delPreferences': delPreferences,
			'viewWidgets': viewWidgets,
			'insertWidget': insertWidget,
			'loadWidgetList': loadWidgetList
		}
	};
})(jQuery);

var iNettuts = $.interface('/content/widget.php');
