var dashboard = null;
var controls = null;
var editingDashboard = false;

var registerDashboard = function(dash, dashcontrols)
{
    dashboard = $(dash);
    controls = $(dashcontrols);
    
    if(controls)
    {
        controls.show();
    }
}

var addWidgetWizard = function(toolbar)
{
    var tb = $(toolbar);  
    
    tb.update(new Element('img', { 'src': '/cognoti/img/spinner.gif', 'alt': 'Loading...' }));
    
    
    new Ajax.Request('/dashboard/widgetlist.nn', { 
            parameters: { view: 'listall' },
            onComplete: 
            function(t) 
            { 
                var xml = t.responseXML.documentElement;
                
                var widgets = {};
                
                var ul = new Element('ul', { 'class': 'toolbar'});
                
                $A(xml.childNodes).each(function (child)
                {
                    var w = xmlElementToJs(child);
                    
                    var li = new Element('li', {'class':'button'}).update(w.name);
                    li.info = w;
                    new Draggable(li, { revert: true, ghosting: true, scroll: window });
                    ul.insert(li);
                });
                
                tb.update(ul);
            }
    });
}

var reloadWidget = function(widgetBlock)
{
    widgetBlock = $(widgetBlock);

    var params = widgetBlock.down('input[name=parameters]').getValue();
    var preferences = widgetBlock.down('input[name=preferences]').getValue();
    var widget = widgetBlock.down('input[name=widgetid]').getValue();
    var content = widgetBlock.down('div.dashboard_widget_content');
    
    Cognoti.log(widgetBlock);
    Cognoti.log(content);
    
    /* content.setStyle({height: content.getHeight()+'px'}); */
    content.update(new Element('img', { 'src': '/cognoti/img/spinner.gif', 'alt': 'Loading...' }));
    
    new Ajax.Updater(content, '/dashboard/widgetrender.nn', { 
            parameters: { parameters: params, preferences: preferences, widget: widget },
            onComplete: function(t) { content.setStyle({height: 'auto'}); }
    });
        
}

var toggleDashboard = function()
{
    if(editingDashboard)
    {
        if(dashboard)
        {
            dashboard.addClassName('helpersoff');
        }
        
        if(controls)
        {
            //Effect.SlideUp(controls.down('.dashboardtoolbar'));
            controls.down('.dashboardtoolbar').hide();
        }
        
        editingDashboard = false;
    }
    else
    {
        if(dashboard)
        {
            dashboard.removeClassName('helpersoff');
        }
        
        if(controls)
        {
            //Effect.SlideDown(controls.down('.dashboardtoolbar'));
            controls.down('.dashboardtoolbar').show();
            addWidgetWizard('dashboardWidgetToolbar');
        }
        editingDashboard = true;
    }
}

var contentMakerPopup = function(section, title, url, params)
{
    params = params ? params : {};
    
    params.view = section;
    params.respurl = url;
    
    Modalbox.show('/structuredcontent/popuphelper.nn', 
        {   
            title: title,
            width: 600,
            overlayClose: false,
            params: params
        });
    
    return false;
}

var setupScrollingBox = function(box)
{
    Event.observe(document, 'dom:loaded', function()
        {
        var fw = $(box);        
        fw.originalTop = fw.cumulativeOffset()[1];
        fw.absolutize();
        fw.relativize();        
        
        var scrollFunc = function()
            {
                clearTimeout(fw.scrollWatch);
                fw.scrollWatch = setTimeout(function()
                    {
                        var top = document.viewport.getScrollOffsets()[1];
                        var setTop = top - fw.originalTop;
                        
                        var maxTop = fw.up().getHeight() - fw.getHeight(); 
                        
                        if(setTop < 0)
                        {
                            setTop = 0;                    
                        }
                        else if(setTop > maxTop)
                        {
                            setTop = maxTop;    
                        }
                        
                        new Effect.Move(fw, { x: fw.style.left, y: setTop, mode: 'absolute', duration: .5, transition: Effect.Transitions.sinoidal });
                    }, 50);
                
            }
        
            document.observe('scroll', scrollFunc);
            scrollFunc();
        });    
}


var supportedBlocks = { portlet: 'portlet' };

var setSupportedBlocks = function(blocks)
{
    supportedBlocks = blocks;    
}

var doEdit = function(layoutblock, deleteOnCancel)
{
    layoutblock = $(layoutblock);
    var lbid = layoutblock.identify();
    var widgetid = layoutblock.down('input[name="widgetid"]').getValue();
    var params = layoutblock.down('input[name="parameters"]').getValue();
    var prefs = layoutblock.down('input[name="preferences"]').getValue();
    
    var params = {
        widgetid: widgetid,
        parameters: params,
        preferences: prefs,
        layoutblock: lbid,
        deleteoncancel: deleteOnCancel
    };
    
    Modalbox.show('/dashboard/widgetproperties.nn', 
        {   
            title: 'Modify Widget Properties',
            width: 600,
            overlayClose: false,
            closeString: ' ',
            params: params,
            afterHide: function()
            {
                completeEdit(layoutblock, null, deleteOnCancel);    
            }
        });
    
}

var completeEdit = function(layoutblock, propdiv, deleteOnCancel)
{
    var lb = $(layoutblock);
    propdiv = $(propdiv);

    if(!propdiv) //cancelled
    {
        if(deleteOnCancel.toString() == 'true')
        {
            lb.remove();                
        }
    }
    else
    {
        var parameters = new Hash();
        var preferences = new Hash();
        propdiv.select('input[type="text"]','select','textarea').each(function(item)
            {
                var name = item.name;
                var value = item.getValue();
                var isParameter = item.hasClassName('parameter');
                var isPreference = item.hasClassName('preference');
                
                if(isParameter)
                {
                    parameters.set(name, value);
                }
                
                if(isPreference)
                {
                    preferences.set(name, value);
                }
                
            });
        
        propdiv.select('input[type="checkbox"]', 'input[type="radio"]').each(function(item)
            {
                if(!item.checked) { return; }
                var name = item.name;
                var value = item.getValue();
                var isParameter = item.hasClassName('parameter');
                var isPreference = item.hasClassName('preference');
                
                if(isParameter)
                {
                    var array = parameters.get(name);
                    array = (array != null && array.constructor == Array) ? array : []; 
                    array.push(value);
                    parameters.set(name, array);
                }
                
                if(isPreference)
                {
                    var array = preferences.get(name);
                    array = (array != null && array.constructor == Array) ? array : []; 
                    array.push(value);
                    preferences.set(name, array);
                }
                
            });
        
        var paramInput = lb.down('input[name="parameters"]');
        var prefInput = lb.down('input[name="preferences"]');
        
        paramInput.value = parameters.toQueryString();
        prefInput.value = preferences.toQueryString();
        
        reloadWidget(lb);
    }
    
    Modalbox.hide({afterHide: Prototype.emptyFunction });
}

var setupDragAndDrop = function(toolbar, layout)
{
    var lo = $(layout);
    
    /* var tb = $(toolbar);
    var buttons = tb.select('.button');
    buttons.each(
        function(e)
        {
            new Draggable(e, { revert: true, ghosting: true, scroll: window });
        }); */
    
    var cols = lo.select('.dropzone');
    
    cols.each(function(col)
        {
            col.select('.layoutblock').each(setupEditOnLayoutBox);
        });
    
    buildSortable(lo);
    
    
    /* Event.observe(window, 'load', function()
        {
            tb.originalTop = tb.cumulativeOffset()[1];
            tb.originalWidth = tb.getWidth();
            tb.currentlyStatic = true;
            
            tb.up('.holder').setStyle({height: tb.getHeight()+'px'});
            
            tb.setStyle({top: '5px'});
            
            scrollFunc = function()
                {
                    var top = document.viewport.getScrollOffsets()[1];
                    
                    if(top < tb.originalTop && !tb.currentlyStatic)
                    {
                        tb.setStyle({position: 'static'});
                        tb.currentlyStatic = true;
                    }
                    else if(top > tb.originalTop && tb.currentlyStatic)
                    {
                        tb.setStyle({
                            position: 'fixed',                              
                            zIndex: '5',
                            width: tb.getWidth()+'px'});
                        tb.currentlyStatic = false;
                    }
                }
            
                document.observe('scroll', scrollFunc);
                scrollFunc();
        });  */
}

var setupEditOnLayoutBox = function(lb)
{
    var edit = new Element('span', { 'class': 'edit'});
    var reloadlink = new Element('a').update('Refresh');
    var editlink = new Element('a').update('Edit');
    var dellink = new Element('a').update('X');
    
    edit.insert({bottom: reloadlink});
    edit.insert({bottom: editlink});
    edit.insert({bottom: dellink});
    
    var blockdrag = lb.down('.blockdrag');
    blockdrag.insert({top: edit});
    blockdrag.setAttribute('title', "Click to drag");
    
    lb.observe('mouseover', function() { blockdrag.show(); });
    lb.observe('mouseout', function() { blockdrag.hide(); });
    
    reloadlink.observe('click', function() { reloadWidget(lb); });
    editlink.observe('click', function(e) { doEdit(lb, false); Event.stop(e); return false; });
    dellink.observe('click', function(e) { 
        /* if(confirm('Are you sure you would like to remove this block?')) 
        {
            lb.remove(); 
        } */
        
        confirmBubble(dellink, 'Are you sure you would like to remove this block?', ['Yes', 'No'], 
            function(result)
            {
               if(result == 'Yes')
               {
                   new Effect.Puff(lb, {afterFinish: function() { lb.remove(); }});
               }
            });
        
        Event.stop(e); 
        return false; 
    });
}

var buildSortable = function(layout)
{
    var list = layout.select('.dropzone');
    
    list.each(function(e)
    {
        Sortable.create(e, {
            dropOnEmpty: true,
            containment: list,
            constraint: false,
            only: ['button', 'layoutblock'],
            hoverclass: 'hover',
            handle: 'blockdrag',
            scroll: window,
            onUpdate: function(a)
            {
                a.highlight();
                
                a.select('input[name="region"]').each(function(input)
                {
                    input.value = a.id;                        
                });
                
            }
        });
        
        Droppables.add(e, {
            accept: 'button',
            hoverclass: 'hover',
            onDrop: function(item) {
                
                var info = item.info;
                
                var title = new Element('div').addClassName('blockdrag').update(info.name).hide();
                var content = new Element('div').addClassName('dashboard_widget_content');
                var newitem = new Element('li').addClassName('layoutblock');
                
                var regioninput = new Element('input', { type: 'hidden', name: 'region', value: e.id });
                var paraminput = new Element('input', { type: 'hidden', name: 'parameters', value: info.parameters });
                var prefinput = new Element('input', { type: 'hidden', name: 'preferences', value: info.preferences });
                var widgetidinput = new Element('input', { type: 'hidden', name: 'widgetid', value: info.id });
                var udwidinput = new Element('input', { type: 'hidden', name: 'udwid', value: '0' });

                var clear = new Element('div', { style: 'clear: both' });
                title.insert({bottom: clear});
                
                newitem.insert({bottom: title})
                       .insert({bottom: content}) 
                       .insert({bottom: clear})
                       .insert({bottom: regioninput})
                       .insert({bottom: paraminput})
                       .insert({bottom: prefinput})
                       .insert({bottom: widgetidinput})
                       .insert({bottom: udwidinput});
                
                e.insert({bottom: newitem});
                
                setupEditOnLayoutBox(newitem);
                
                buildSortable(layout);
                
                doEdit(newitem, true);
            }
        });
    });
}

var xmlElementToJs = function(node)
{
    var o = new Object();
    
    var len = node.childNodes.length;
    
    if(len == 0)
    {
         o = null;  
    }
    else if(len == 1)
    {
         o = node.childNodes[0].nodeValue; 
    }
    else
    {
        for(var i = 0; i < len; ++i)
        {
            o[node.childNodes[i].nodeName] = xmlElementToJs(node.childNodes[i]);    
        }
        
    }
    return o;
}