var iNettuts = {    
    jQuery : $,
    settings : {
        columns : '.column',
        widgetSelector: '.widget',
        handleSelector: '.widget-head',
        contentSelector: '.widget-content',
        saveToCookie: 'inettuts-widget-preferences',
        widgetDefault : {
            movable: false,
            removable: true,
            collapsible: true,
            editable: false,
            colorClasses : ['color-yellow', 'color-red', 'color-blue', 'color-white', 'color-orange', 'color-green']
        },
        widgetIndividual : {}
    },

    url : "res.php?get=default",
    init : function () {
           this.checkUser();
           this.attachStylesheet('css/inettuts.js.css');
           this.sortWidgets();
    },
    
    checkUser : function () {
           var $ = this.jQuery;
           if ($.cookie("us_uniqid")) {
               return this.url = "res.php?get=" + $.cookie("us_uniqid");
           } else {
               return this.url = "res.php?get=default";
           }
           return;
    },
	
    createWidget : function (id, column) {
           var $ = this.jQuery,
                   wid = 'widget' + id,
                   widtmpl = '<li class="widget color-orange" id="' + wid + '"><div class="widget-head"><h3></h3></div><div class="widget-content"></div></li>';
           return $(widtmpl).appendTo(column);
    },
	
    loadWidget : function (id) {
           var $ = this.jQuery;
           $.ajax({
                      url:'res.php?getwidget=' + encodeURIComponent(id),
                      dataType: 'json',
                      success:function(data) {
                                 if (typeof data != undefined && data !== null) {
                                            $('#widget' + id + ' h3').html(data['title']);
                                            $('#widget' + id + ' .widget-content').html(data['info']);
                                 }
                      }
		});
		return;
    },
	
    getWidgetSettings : function (id) {
           var $ = this.jQuery,
           settings = this.settings;
           return (id&&settings.widgetIndividual[id]) ? $.extend({},settings.widgetDefault,settings.widgetIndividual[id]) : settings.widgetDefault;
    },
    
    addWidgetControls : function (id) {
        var iNettuts = this,
        $ = this.jQuery,
        settings = this.settings,
                   colum = settings.widgetSelector;
		   if (typeof id == 'string') colum = id;
        $(colum, $(settings.columns)).each(function () {
            var thisWidgetSettings = iNettuts.getWidgetSettings(this.id);
            if (thisWidgetSettings.removable) {
                $('<a href="#" class="remove">CLOSE</a>').mousedown(function (e) {
                    /* STOP event bubbling */
                    e.stopPropagation();    
                }).click(function () {
                    if(confirm('This widget will be removed, ok?')) {
                        $(this).parents(settings.widgetSelector).animate({
                            opacity: 0    
                        },function () {
                            $(this).wrap('<div/>').parent().slideUp(function () {
                                $(this).remove();
                            });
                        });
                    }
                    return false;
                }).appendTo($(settings.handleSelector, this));
            }
            
            if (thisWidgetSettings.editable) {
                $('<a href="#" class="edit">EDIT</a>').mousedown(function (e) {
                    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));
            }
            
            if (thisWidgetSettings.collapsible) {
                $('<a href="#" class="collapse">COLLAPSE</a>').mousedown(function (e) {
                    e.stopPropagation();    
                }).click(function(){
                    $(this).parents(settings.widgetSelector).toggleClass('collapsed');
                    return false;    
                }).prependTo($(settings.handleSelector,this));
            }
        });
        
        $('.edit-box').each(function () {
            $('input',this).keyup(function () {
                $(this).parents(settings.widgetSelector).find('h3').text( $(this).val().length>20 ? $(this).val().substr(0,20)+'...' : $(this).val() );
            });
            $('ul.colors li',this).click(function () {
                var colorStylePattern = /\bcolor-[\w]{1,}\b/,
                    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]);
                }
                return false;
                
            });
        });
    },
    
    attachStylesheet : function (href) {
        var $ = this.jQuery;
        return $('<link href="' + href + '" rel="stylesheet" type="text/css" />').appendTo('head');
    },
    
    makeSortable : function (id) {
        var iNettuts = this,
            $ = this.jQuery,
            settings = this.settings,
			items = $sortableItems,
            $sortableItems = (function () {
                var notSortable = '';
                $(settings.widgetSelector,$(settings.columns)).each(function (i) {
                    if (!iNettuts.getWidgetSettings(this.id).movable) {
                        if(!this.id) {
                            this.id = 'widget-no-id-' + i;
                        }
                        notSortable += '#' + this.id + ',';
                    }
                });
                return $('> li:not(' + notSortable + ')', settings.columns);
            })();
        
        $sortableItems.find(settings.handleSelector).css({
            cursor: 'move'
        }).mousedown(function (e) {
            $sortableItems.css({width:''});
            $(this).parent().css({
                width: $(this).parent().width() + 'px'
            });
        }).mouseup(function () {
            if(!$(this).parent().hasClass('dragging')) {
                $(this).parent().css({width:''});
            } else {
                $(settings.columns).sortable('disable');
            }
        });
		
		if (typeof id == 'string')
			items = id;
        $(settings.columns).sortable({
            items: items,
            connectWith: $(settings.columns),
            handle: settings.handleSelector,
            placeholder: 'widget-placeholder',
            forcePlaceholderSize: true,
            revert: 300,
            delay: 100,
            opacity: 0.8,
            containment: 'document',
            start: function (e,ui) {
                $(ui.helper).addClass('dragging');
            },
            stop: function (e,ui) {
                $(ui.item).css({width:''}).removeClass('dragging');
                $(settings.columns).sortable('enable');
                
            }
        });
    },
    
    savePreferences : function () {
        var iNettuts = this,
            $ = this.jQuery,
            settings = this.settings,
            cookieString = '';
            
        if(!settings.saveToCookie) {return;}
        
        
        $(settings.columns).each(function(i){
            cookieString += (i===0) ? '' : '|';
            $(settings.widgetSelector,this).each(function(i){
                cookieString += (i===0) ? '' : ';';
                cookieString += $(this).attr('id').replace('widget','') + ',';
                cookieString += $(this).attr('class').match(/\bcolor-[\w]{1,}\b/) + ',';
                cookieString += $(settings.contentSelector,this).css('display') === 'none' ? 'collapsed' : 'not-collapsed';
				if (settings['widgetIndividual'][$(this).attr('id')]) {
                                    cookieString += ',';
				    cookieString += settings['widgetIndividual'][$(this).attr('id')]['movable'] == false ? 'false,' : 'true,';
				    cookieString += settings['widgetIndividual'][$(this).attr('id')]['editable'] == false ? 'false,' : 'true,';
				    cookieString += settings['widgetIndividual'][$(this).attr('id')]['removable'] == false ? 'false,' : 'true,';
				    cookieString += settings['widgetIndividual'][$(this).attr('id')]['collapsible'] == false ? 'false' : 'true';
				}
            });
        });
        
		var uniqid = $.cookie("us_uniqid");
        $.post("res.php","settings="+cookieString + "&uniqid=" + encodeURIComponent(uniqid),
			function(data) {
				if (typeof data != undefined && data !== 'ok') {
					$.cookie("us_uniqid", data, {expires: 365 * 10});
				}
				window.location.reload(true);
			});
    },
    
    sortWidgets : function () {
        var iNettuts = this,
            $ = this.jQuery,
            settings = this.settings,
			url = this.url;
        
        if(!settings.saveToCookie) {
            $('body').css({background:'#000'});
            $(settings.columns).css({visibility:'visible'});
            return;
        }
        
        $.post(url, "",
            function(data){        
              var cookie=data; 
              if (cookie=="") {
                  $('body').css({background:'#000'});
                  $(settings.columns).css({visibility:'visible'});
                  iNettuts.addWidgetControls();
                  iNettuts.makeSortable();
                  return;
              }
               
              
              $(settings.columns).each(function(i){                  
                  var thisColumn = $(this),
                      widgetData = cookie.split('|')[i].split(';');

                  $(widgetData).each(function(){
                      if(!this.length) {return;}
                      var thisWidgetData = this.split(',');

                      iNettuts.createWidget(thisWidgetData[0], thisColumn);
                      iNettuts.loadWidget(thisWidgetData[0]);
                      thisWidgetData[0] = 'widget' + thisWidgetData[0];
                      settings['widgetIndividual'][thisWidgetData[0]] = {};
                      var clonedWidget = $('#' + thisWidgetData[0]),
                           colorStylePattern = /\bcolor-[\w]{1,}\b/,
                      thisWidgetColorClass = $(clonedWidget).attr('class').match(colorStylePattern);
                      
                      if (thisWidgetColorClass) {
                          $(clonedWidget).removeClass(thisWidgetColorClass[0]).addClass(thisWidgetData[1]);
                      }
                      
                      if(thisWidgetData[2]==='collapsed') {
                          
                          $(clonedWidget).addClass('collapsed');
                      }
                      //var tWS = $(clonedWidget).getWidgetSettings(this.id);
                      //tWS.movable='false';
			
//alert(settings['widgetIndividual'][thisWidgetData[0]]['movable']);
                      $(clonedWidget).removeClass(thisWidgetColorClass[0]).addClass('.color-green');

                      if(thisWidgetData[3]==='false') {
                         settings['widgetIndividual'][thisWidgetData[0]]['movable'] = false;
                      }
					  
                      if(thisWidgetData[4]==='false') {
                          settings['widgetIndividual'][thisWidgetData[0]]['editable'] = false;
                      }
					  
                      if(thisWidgetData[5]==='false') {
                          settings['widgetIndividual'][thisWidgetData[0]]['removable'] = false;
                      }
					  
                      if(thisWidgetData[6]==='false') {
                          settings['widgetIndividual'][thisWidgetData[0]]['collapsible'] = false;
                      }
//alert(thisWidgetData[2] + ' ' + thisWidgetData[3] + ' '+ thisWidgetData[4] + ' '+ thisWidgetData[5] + ' '+ thisWidgetData[6]);
//alert('A ' + settings['widgetIndividual'][thisWidgetData[0]]['movable']);
                      $('#' + thisWidgetData[0]).remove();
                      $(thisColumn).append(clonedWidget);
                  });
              });
              
              
              
              $('body').css({background:'#000'});
              $(settings.columns).css({visibility:'visible'});
              iNettuts.addWidgetControls();
              iNettuts.makeSortable();
              
            });

    }
  
};

iNettuts.init();