/// <reference name="prototype.js" />
                 
/* ------------------------------------------------------------------------
 * EditArea represents an input element and its action div containing Confirm and Cancel links
 * ------------------------------------------------------------------------ */        
var EditArea = Class.create();

Object.extend(EditArea.prototype, {
    initialize: function(elementName, containerName) {
        //if (Element.Methods['downwards'] == null)
        //    AddPrototypeExtensions();

        this.mTargetClassName = "hover_target";
        this.mContainerClassName = "hover_container";
        this.mEditElementAttribute = "editableElement";
        this.mContainsImageAttribute = "containsImage";
        this.mEmptyCopyClassName = "emptyCopy";
        this.mEmptyImageClassName = "emptyImage";

        this.mElementName = elementName;
        this.mContainerName = containerName;
        this.mTag = $(elementName);
        this.mContainer = $(containerName);
        this.mEditActions = this.mContainer.down('div.hover_target');
        this.mActions = this.GetActionsAndInputContainer();
        this.mActionsInput = this.GetEditElementWithinActions();
        /* this.mActions.down('input.currentInput');*/

        this.Start();
        this.BindClickHandlers();
        this.ConfigureTag();
    },

    ActionButtons: function() {
        return "<a class='commitLnk' title='Confirm'>&nbsp;&nbsp;&nbsp;&nbsp;</a>&nbsp;&nbsp;<a class='cancelLnk' title='Cancel'>&nbsp;&nbsp;&nbsp;&nbsp;</a>";
    },

    AddInputDiv: function() {
        var html = "<div id='mTitleActionsDiv' class='actionsDiv'><input id='mTitleTxt' editableelement='true' class='currentInput' />";
        html = html + this.ActionButtons();
        html = html + "</div>";
        this.mTag.insert({ before: html });

        this.mActions = this.GetActionsAndInputContainer();
        this.mActionsInput = this.GetEditElementWithinActions();

        var handler = this["HandlerForActionsTarget"].bind(this);
        this.mActions.observe('click', handler);
    },

    RemoveInputDiv: function() {
        if (this.mActions != null)
            this.mActions.remove();
    },

    AssignEditClass: function(display) {
        if (display)
            this.mContainer.addClassName('editText');
        else
            this.mContainer.removeClassName('editText');
    },

    BindClickHandlers: function() {
        var handler = this["HandlerForActionsTarget"].bind(this);
        this.mEditActions.observe('click', handler);

        /*if (this.mActions != null)
        this.mActions.observe('click', handler);
        */
    },

    BeginEditing: function() {
        if (this.mContainer == null)
            return;

        if (this.mEditSection.IsDirty()) {
            this.mTag.hide();
            this.mEditActions.hide();
            this.AssignEditClass(true);
            this.ConfigureInputElement();
        }
        else if (!window.VDS$CSPage.IsDirtyWithMessage()) {
            this.mTag.hide();
            this.mEditActions.hide();
            this.AssignEditClass(true);
            this.ConfigureInputElement();
        }
    },

    BeginEditingInput: function() {
        this.AddInputDiv();
        //this.mActions.show();
        this.mActionsInput.value = this.mTag.innerHTML;
        this.mActionsInput.activate();

        //eval(new Effect.Highlight(this.mActionsInput, { startcolor: '#ffffff', endcolor: '#ced7e7' }));
    },

    CacheContainerFromElementToTarget: function(container, element, target) {
        if (container && target) {
            upwards(element, function(e) {
                e.writeAttribute(this.mContainerClassName, container.identify());
                if (e == target)
                    return true;
            } .bind(this));
        }
    },

    CancelEditing: function(event) {
        if (this.mContainer == null)
            return;

        this.AssignEditClass(false);
        //this.mActions.hide();  
        this.RemoveInputDiv();
        this.EditingComplete();
        this.mTag.show();

        return false;
    },

    ConfigureInputElement: function() {
        this.BeginEditingInput();
    },

    ConfirmEditing: function(event) {
        if (this.mContainer == null)
            return;

        this.ConfirmEditingInput();
        //this.mActions.hide();
        this.RemoveInputDiv();
        this.mEditSection.SetIsDirty(true);

        return false;
    },

    ConfirmEditingInput: function() {
        this.mTag.innerHTML = this.mActionsInput.value;
        this.EditingComplete();
        this.mTag.show();
    },

    ConfigureTag: function() {
    },

    EditingComplete: function() {
        this.AssignEditClass(false);
        if (this.mTag.firstChild == "span")
            this.mTag.innerHTML = "";

        if (this.mTag.innerHTML.length > 0)
            this.mTag.removeClassName(this.GetEmptyElementClassName());
        else
            this.mTag.addClassName(this.GetEmptyElementClassName());

        var saveCtn = this.mEditSection.mSaveBtn.up('div.save');

        if (saveCtn != null)
            saveCtn.scrollTo();
        else
            this.mContainer.scrollTo();
    },

    EditSection: function(editSection) {
        return this.mEditSection;
    },

    SetEditSection: function(editSection) {
        this.mEditSection = editSection;
    },

    GetActionsAndInputContainer: function() {
        return this.mContainer.down('div.actionsDiv');
    },

    GetContainerForElement: function(element) {
        if (!element)
            return;

        if (element.hasAttribute && !element.hasAttribute(this.mContainerClassName)) {
            var target = this.GetTargetForElement(element);
            var container = this.GetContainerForTarget(target);
            this.CacheContainerFromElementToTarget(container, element, target);
        }

        return $(element.readAttribute(this.mContainerClassName));
    },

    GetContainerForTarget: function(element) {
        if (!element)
            return;

        var containerClassName = this.options.containerClassName;
        return upwards(element, function(e) {
            if (e.hasClassName)
                return e.hasClassName(containerClassName);
        });
    },

    GetEditElementWithinActions: function() {
        if (!this.mActions)
            return;

        var handler = this["GetEditElementForAttribute"].bind(this);
        var editElement = downwards(this.mActions, handler);

        if (editElement)
            return editElement;

        return nextwards(this.mActions.down(), handler);
    },

    GetEditElementForAttribute: function(element) {
        var attribute = this.mEditElementAttribute;
        var elementAttribute = element.readAttribute(attribute);

        if (elementAttribute != null && elementAttribute.capitalize() == "True")
            return element;
    },

    GetEmptyElementClassName: function() {
        return this.mEmptyCopyClassName;
    },

    GetTargetForElement: function(element) {
        if (!element)
            return;

        var targetClassName = this.mTargetClassName;

        return upwards(element, function(e) {
            if (e.hasClassName)
                return e.hasClassName(targetClassName);
        });
    },

    HandlerForMouseover: function(event) {
        var element = this.GetTargetForElement(event.element());

        if (element == null)
            return;

        element.addClassName('editable');
    },

    HandlerForMouseout: function(event) {
        var element = this.GetTargetForElement(event.element());

        if (element == null)
            return;

        element.removeClassName('editable');
        /*style="opacity: 0;display: none;"*/
    },

    HandlerForActionsTarget: function(event) {
        if (event.target.hasClassName('cancelLnk'))
            this.CancelEditing();
        else if (event.target.hasClassName('commitLnk'))
            this.ConfirmEditing(event);
        else if (event.target.hasClassName('actionsTarget'))
            this.BeginEditing();
        else if (event.target.nodeName == "A" && event.target.className == "deleteSection") {
            if (this.mEditSection != null)
                this.mEditSection.HandlerForDeleteClicked(null);
        }
    },

    Remove: function() {
        this.mContainer.up('table.editTable').update();
    },

    SetEmptyTags: function() {
    },

    Start: function() {
        if (!this.observers) {
            var events = $w("mouseover mouseout");
            this.observers = events.map(function(name) {
                var handler = this["HandlerFor" + name.capitalize()].bind(this);
                this.mContainer.observe(name, handler);
                return { name: name, handler: handler };
            } .bind(this));
        }

        this.SetEmptyTags();
    }

}); 



/* ------------------------------------------------------------------------
 * HtmlEditArea inherits from EditArea
 * ------------------------------------------------------------------------ */
 
var HtmlEditArea = Class.create(EditArea, 
    {    
    
        BeginEditingEditor: function()
        {             
           this.mActions.setStyle({
                                backgroundColor: '#FFFFC9',
                                border: '1px dashed #000000',
                                position: 'absolute',
                                right: '10px',
                                top: '-1px',
                                width: '500px',                                
                                height: '700px',
                                zIndex: '99001'
            });
            this.mActions.show();         
            this.mActionsInput.control.set_html(this.mTag.innerHTML);
	        this.mActionsInput.control.setFocus();  	    
        },
            
        ConfigureInputElement: function()
        {
    	    this.BeginEditingEditor();
        },
    
        ConfirmEditing: function(event)
        {		
		    if (this.mContainer == null)
		        return;
    			    
		    this.mActions.hide();    				    
            this.ConfirmEditingEditor();
                	
		    return false;
        },
        
        ConfirmEditingEditor: function()
        {
            this.mTag.innerHTML = this.mActionsInput.control.get_html(true);
            this.EditingComplete();           
		    this.mTag.show();		
        },  
        
        IsRadEditor: function()
        {               
            if (this.mActionsInput.type == "text")
                return false;
            else 
                return true;
        },

    	SetEmptyTags: function()
    	{
    	    if (this.mTag.innerHTML == '')
    	    {
		        if (this.mTag.id.include('Full'))
			        this.mTag.addClassName('emptyFullCopy');	
			    else
			        this.mTag.addClassName('emptyCopy');	
            }
    	}
});



/* ------------------------------------------------------------------------
 * SharedHtmlEditArea inherits from EditArea, used when only one RadEditor is contained within the page
 * ------------------------------------------------------------------------ */
var SharedHtmlEditArea = Class.create(HtmlEditArea,
    {
        AssignHiddenControl: function(hiddenTxt) {
            this.mHiddenTxt = $(hiddenTxt);
        },

        AddActionButtons: function() {
            this.mActions.down().insert({ before: this.ActionButtons() });

            var handler = this["HandlerForActionsTarget"].bind(this);
            this.mActions.observe('click', handler);

            var div = $('div.rade_CustomLinks');

            if (div != null) {
                var handler = this["HandlerForCustomLinks"].bind(this);
                div.observe('focus', handler);
            }
        },

        RemoveActionButtons: function() {
            //this.mActions.down('div.actionBtns').remove();
            this.mActions.down('a.commitLnk').remove();
            this.mActions.down('a.cancelLnk').remove();
        },

        BeginEditingEditor: function() {
            this.mActions.setStyle({
                width: this.mEditSection.Section().getWidth()
            });

            this.mActions.clonePosition(this.mEditSection.Section());
            this.mInvokedFromTag = this.mTag;
            window.VDS$CSPage.SetCurrentSection(this.mEditSection);
            this.AddActionButtons();
            this.mActions.show();
            this.mActions.scrollTo();
            this.mActionsInput.control.set_html(this.mTag.innerHTML);
            this.mActionsInput.control.setFocus();
        },

        CancelEditing: function(event) {
            if (this.mContainer == null)
                return;

            if (this.mInvokedFromTag == this.mTag) {
                this.RemoveActionButtons();
                this.mActions.hide();
                this.EditingComplete();
                this.mTag.show();
            }

            this.ClearInvokedFromTag();
            return false;
        },

        ClearInvokedFromTag: function() {
            this.mInvokedFromTag = null;
        },

        ConfigureActionBar: function(editActionText) {
            var actionBar = new ActionBar(this.mEditActions, editActionText, false);
        },

        ConfirmEditing: function(event) {
            if (this.mContainer == null)
                return;

            if (this.mInvokedFromTag == this.mTag) {
                this.RemoveActionButtons();
                this.mActions.hide();
                this.ConfirmEditingEditor();
                this.mEditSection.SetIsDirty(true);
                this.SetEmptyTags();
                this.SetClassForWrapping();
            }

            this.ClearInvokedFromTag();
            return false;
        },

        ConfirmEditingEditor: function() {
            this.mTag.innerHTML = this.mActionsInput.control.get_html(true);

            if (this.mHiddenTxt != null)
                this.mHiddenTxt.value = this.mTag.innerHTML;

            this.EditingComplete();
            this.mTag.show();
        },

        ConfigureTag: function(removeHasImageClass) {
            if (this.mTag.innerHTML.length == 0) {
                if (!this.mTag.hasClassName('emptyCopy'))
                    this.mTag.addClassName('emptyCopy');
            }

            if (removeHasImageClass)
                this.mTag.removeClassName('hasImage');
            //else if (!this.mTag.hasClassName('emptyFullCopy'))
            //  this.mTag.addClassName('hasImage');
        },

        GetActionsAndInputContainer: function() {
            return RadEditorManager();
        },

        GetEditElementWithinActions: function() {
            if (!this.mActions)
                return;

            return RadEditor();
        },

        HandlerForCustomLinks: function(event) {
            event.target
        },

        HandlerForActionsTarget: function(event) {
            if (Element.hasClassName(event.target, 'cancelLnk'))
                this.CancelEditing();
            else if (Element.hasClassName(event.target, 'commitLnk'))
                this.ConfirmEditing(event);
            else if (Element.hasClassName(event.target, 'actionsTarget'))
                this.BeginEditing();
        },

        SetClassForWrapping: function() {
            if (VDS$CSPage.DomainObject() == 100)
                return;

            if (this.mTag.innerHTML.length > 0)
                this.mTag.addClassName('hasImage');
            else
                this.mTag.removeClassName('hasImage');
        }
    });
     

                
/* ------------------------------------------------------------------------
 * ImageEditArea inherits from EditArea
 * ------------------------------------------------------------------------ */ 
var ImageEditArea = Class.create(EditArea, 
    {
       
        BeginEditingEditor: function()
        {                    
            var handler = this["ImageSelectedCallback"].bind(this);
            this.mActionsInput.control.showDialog("ImageManager", {}, handler);            
            
            this.mTag.show();
        },     
        
        ConfigureInputElement: function()
        {
    	    this.BeginEditingEditor();
        },
                
        ConfirmEditingEditor: function()
        {
            this.mTag.innerHTML = this.mActionsInput.control.get_html(true);
            this.EditingComplete();           
		    this.mTag.show();			
        },   
              
        GetEmptyElementClassName: function()
        {
            return this.mEmptyImageClassName;
        },
                        
        ImageSelectedCallback: function(sender, args)
        {
            this.mTag.innerHTML = String.format("<img src=\"{0}\" alt=\"{1}\" />",
                                        args.Result.src, args.Result.alt);          
            this.mActionsInput.control.set_html(this.mTag.innerHTML);        
		    this.mTag.show();	
		    this.EditingComplete();
        },
        
        IsImageEditor: function()
        {
            var attribute = this.mActionsInput.readAttribute(this.mContainsImageAttribute);
                    
            if (attribute != null  && attribute.capitalize() == "True") 
                return true;
            else 
                return false;
        }
        
});

/* ------------------------------------------------------------------------
 * * SharedImageEditArea inherits from ImageEditArea, used when only one RadEditor is contained within the page
 * ------------------------------------------------------------------------ */

var SharedImageEditArea = Class.create(ImageEditArea,
    {
        AssignEditClass: function(display) {
            this.mContainer.removeClassName('editText');
        },

        AssignHiddenControl: function(hiddenImg) {
            this.mHiddenImg = $(hiddenImg);
        },

        BeginEditingEditor: function() {
            if (this.mRemoveImg)
                this.RemoveImage();
            else {
                this.mActions.setStyle({
                    width: this.mTag.getWidth()
                });

                var handler = this["ImageSelectedCallback"].bind(this);
                this.GetActionsAndInputContainer().control.open('ImageManager', {}, handler);
                //this.mActionsInput.control.showDialog("ImageManager", {}, handler);            
                this.mTag.show();
            }
        },

        ConfigureActionBar: function(editActionText) {
            var actionBar = new ImageActionBar(this.mEditActions, editActionText, true);
        },

        ConfirmEditingEditor: function() {
            this.mTag.innerHTML = this.mActionsInput.control.get_html(true);

            if (this.mHiddenImg != null)
                this.mHiddenImg.value = this.mTag.innerHTML;

            this.EditingComplete();
            this.mEditSection.SetIsDirty(true);
            this.mTag.show();
        },

        ConfigureTag: function() {
            if (this.mTag.innerHTML.length == 0)
                this.mTag.addClassName('emptyImage');
        },

        GetActionsAndInputContainer: function() {
            return RadImageEditorManager();
        },

        HandlerForActionsTarget: function(event) {
            if (event.target.hasClassName('cancelLnk'))
                this.CancelEditing();
            else if (event.target.hasClassName('commitLnk'))
                this.ConfirmEditing(event);
            else if (event.target.hasClassName('actionsTarget')) {
                if (event.target.hasClassName('deleteImg')) {
                    if (this.PromptForDeletion())
                        this.mRemoveImg = event.target.hasClassName('deleteImg');
                    else
                        return;
                }
                this.BeginEditing();
            }
        },

        PromptForDeletion: function() {
            if (confirm('Are you sure you want to delete this image?'))
                return true;
            else
                return false;
        },

        RemoveImage: function() {
            this.mTag.innerHTML = ''
            this.mTag.show();
            this.mEditSection.SetIsDirty(true);
            this.EditingComplete();
        },

        ImageSelectedCallback: function(sender, args) {
            //this.mTag.innerHTML = String.format("<img src=\"{0}\" alt=\"{1}\" />",
            //                            args.Result.src, args.Result.alt);

            if (args == null)
                return;

            this.mTag.innerHTML = args.value.outerHTML;

            if (this.mHiddenImg != null)
                this.mHiddenImg.value = this.mTag.innerHTML;

            this.mTag.show();
            this.mEditSection.SetIsDirty(true);
            this.EditingComplete();
        }
    });

/* ------------------------------------------------------------------------
 * ResourcesEditArea inherits from EditArea
  * ------------------------------------------------------------------------ */
 
var ResourcesEditArea = Class.create(EditArea, 
    {
        BeginEditing: function()
        {
            if (this.mContainer == null)
		        return;
    			    
            this.mTag.hide();
		    this.mEditActions.hide();				    				    
            this.BeginEditingResources();			
        },

        BeginEditingResources: function()
        {   
        /*
            var handler = this["LinkEnteredCallback"].bind(this);
            this.mLinkManager.control.showDialog("LinkManager", 'http:', handler);   
          */  
            var handler = this["ResourcesSelectedCallback"].bind(this);
            
            var radManager = this.mActionsInput;
            radManager._clientCallBackFunction = handler;
            
            var radWindow = this.mActionsInput.down().control;            
            radWindow._clientCallBackFunction = handler;
            
            handler = this["ResourcesSelectedClose"].bind(this);
            radWindow.add_close(handler);
            
            radWindow.show();            
        },

        LinkEnteredCallback: function(sender, args)
        {
            this.mTag.innerHTML = String.format("<img src=\"{0}\" alt=\"{1}\" />",
                                        args.Result.src, args.Result.alt);          
            this.mActionsInput.control.set_html(this.mTag.innerHTML);        
		    this.mTag.show();	
		    this.EditingComplete();
        },
        
        ResourcesSelectedClose: function(radWindow, returnValue)
        {
		    this.mTag.show();	
		    this.EditingComplete();
        }, 
                        
        ResourcesSelectedCallback: function(radWindow, returnValue)
        {
     		if (returnValue.length > 0)
		    {
		        this.mTag.innerHTML = returnValue;
                window[this.mAjaxManager].SendCallback("");
            	this.mTag.removeClassName('emptyResource');
		    }

		    this.mTag.show();	
		    this.EditingComplete();
        },
        
    	SetEmptyTags: function()
    	{
		    this.mTag.addClassName('emptyResource');	
    	},

        SetAjaxManager: function(ajaxMng)
        {
            this.mAjaxManager = ajaxMng; 
        }                       
});


        
/* ------------------------------------------------------------------------
 * LinksEditArea inherits from EditArea
  * ------------------------------------------------------------------------ */
 
var LinksEditArea = Class.create(EditArea, 
    {
        BeginEditing: function()
        {
            if (this.mContainer == null)
		        return;
    			    
            this.mTag.hide();
		    this.mEditActions.hide();				    				    
            this.BeginEditingResources();			
        },

        BeginEditingResources: function()
        {    
            var handler = this["LinksSelectedCallback"].bind(this);
            
            var radManager = this.mActionsInput;
            radManager._clientCallBackFunction = handler;            
            
            var radWindow = this.mActionsInput.down().control;            
            radWindow._clientCallBackFunction = handler;
            
            handler = this["LinksSelectedClose"].bind(this);
            radWindow.add_close(handler);
            
            var arg = new Object();                                
            arg.TextValue = this.mCSLinks.innerHTML;           
            radWindow.argument = arg;
            radWindow.show();                                     
        },               
                        
        HandlerForSaveComplete: function(result, userContext)
        {                  
            //window.VDS$KeywordSection.SetIsDirty(false);        
            window.VDS$CSPage.DisplayServerOperation(false);      
        },
        
        HandlerForSaveException: function(result, userContext)
        {   
            alert(result._message);                            
            window.VDS$CSPage.DisplayServerOperation(false);  
        },
        
        LinksSelectedClose: function(radWindow, returnValue)
        {
		    this.mTag.show();	
		    this.EditingComplete();
        }, 
                        
        LinksSelectedCallback: function(radWindow, returnValue)
        {
     		if (returnValue.length > 0)
		    {
		        this.Save(returnValue);
		        this.mCSLinks.innerHTML = returnValue;
		        this.mSSLinks.value = returnValue;
            	this.mTag.removeClassName('emptyResource');
		    }

		    this.mTag.show();	
		    this.EditingComplete();
        },
        
        Save: function(links)
        {
            window.VDS$CSPage.DisplayServerOperation(true);            
            VDS.VWeb.Services.WebContentService.SaveWebContentLinks(window.VDS$CSPage.PageDetails(),
                 links, this.HandlerForSaveComplete, 
                 this.HandlerForSaveException);  
        },
        
    	SetEmptyTags: function()
    	{
		    this.mTag.addClassName('emptyResource');	
    	},

        SetLinksArea: function(csLinks, ssLinks)
        {
            this.mCSLinks = $(csLinks); 
            this.mSSLinks = $(ssLinks); 
        }                       
});


/* ------------------------------------------------------------------------
* TextEditArea inherits from EditArea
* ------------------------------------------------------------------------ */

var TextEditArea = Class.create(EditArea,
    {
        ConfigureActionBar: function(editActionText, hasDeleteSection, deleteActionText)
        {
            var actionBar = new ActionBar(this.mEditActions, editActionText, hasDeleteSection, deleteActionText);
        }
    });

    
/* ------------------------------------------------------------------------
* ActionBar contains actions that enable editing of Edit Areas
* ------------------------------------------------------------------------ */

    var ActionBar = Class.create();

    Object.extend(ActionBar.prototype, {
        initialize: function(container, editActionText, hasDeleteSection, deleteActionText)
        {
            this.mContainer = container;
            this.mHasDeleteSection = hasDeleteSection;
            this.mEditActionText = editActionText;
            
            if (deleteActionText == null)
                deleteActionText = 'Delete Section';
                
            this.mDeleteActionText = deleteActionText;            
            this.ConfigureActionBar();
        },

        ActionBar: function()
        {
            var deleteAction = "";
            if (this.mHasDeleteSection)
                deleteAction = this.DeleteAction();

            return String.format("<div class='wrapper'><ul><li>{0}</li>{1}</ul></div>",
                    this.EditAction(), deleteAction);
        },

        ConfigureActionBar: function()
        {
            this.mContainer.insert(this.ActionBar());
        },

        EditAction: function()
        {
            return String.format("<a class='actionsTarget editMessage' title='{0}'>&nbsp;&nbsp;&nbsp;</a>",
                                this.mEditActionText);
        },
                    
        DeleteAction: function()
        {
            return String.format("<li class='delete'><a id='mDeleteLnk' class='deleteSection' title='{0}'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></li>",
                                this.mDeleteActionText);
        }
    });    
    
    /* ------------------------------------------------------------------------
    * ImageActionBar contains actions that enable editing of Image Edit Area
    * ------------------------------------------------------------------------ */

    var ImageActionBar = Class.create(ActionBar, 
    {
        DeleteAction: function()
        {
            return "<li class='delete'><a id='mDeleteImg' class='actionsTarget deleteSection deleteImg' title='Delete Image'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></li>";
        }
    });

    /* ------------------------------------------------------------------------
    * ResourceActionBar contains actions that enable editing of Resource Edit Area
    * ------------------------------------------------------------------------ */

    var ResourceActionBar = Class.create(ActionBar, 
    {
        ActionBar: function()
        {
            return "<div class='wrapper'><ul><li>Add <a class='actionsTarget addResource addDocument' title='Document'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></li><li>| <a class='actionsTarget addResource' title='Resource'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></li></ul></div>";
        }
    });           
                                   
                
    /* ------------------------------------------------------------------------
    * LinkActionBar contains actions that enable editing of Link Edit Area
    * ------------------------------------------------------------------------ */

    var LinkActionBar = Class.create(ActionBar,
    {
        ActionBar: function()
        {
            return "<div class='wrapper'><ul><li>Add <a class='actionsTarget addLink' title='Link'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></li></ul></div>";
        }
    });   
    
    /* ------------------------------------------------------------------------
    * ResourceLinkActionBar contains actions that enable editing of Resource Edit Area
    * ------------------------------------------------------------------------ */

    var ResourceLinkActionBar = Class.create(ActionBar, 
    {
        ActionBar: function()
        {
            return "<div class='wrapper'><ul><li>Add <a class='actionsTarget addLink' title='Link'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></li><li> | <a class='actionsTarget addResource addDocument' title='Resource'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></li></ul></div>";
        }
    }); 
    
    /* ------------------------------------------------------------------------
    * CategoryActionBar contains actions that enable editing of Category Edit Area
    * ------------------------------------------------------------------------ */

    var CategoryActionBar = Class.create(ActionBar, 
    {
        ActionBar: function()
        {
            return "<div class='wrapper'><ul><li><a class='actionsTarget editMessage' title='Edit Categories'>&nbsp;&nbsp;&nbsp;</a></li></ul></div>";
        }
    });