var nextMessageId = 0;

function clearMessageBanner()
{    
    if($defined($('message_banner')))
    {
        $('message_banner').empty();
    }
    else
    {
        // TODO: Display / Log this Error
        console.error('clearMessageBanner :: Message Banner Element was not Defined!\r\nMessage Banner: ' + $('message_banner'));
    }
}

// Adds a Message Item to the Message Banner
function addMessageToBanner(type, title, message)
{    
    if($defined($('message_banner')))
    {
        nextMessageId += 1;
        var messageId = nextMessageId;
        
        var messageItem = new Element('div', {
            'id': 'message_banner-message' + messageId,
            'class': 'message_item',
            'styles': {'opacity': 0}
        });
        
        var messageItemContainer = new Element('div', {'class': 'message_container'});
        
        messageItemContainer.inject(messageItem);
        
        var messageItemTitle = new Element('div', {'class': 'message_title'});
        
        messageItemTitle.inject(messageItemContainer, 'top');
        
        var messageTitleHeading = new Element('h2', {'html': title});
        
        messageTitleHeading.inject(messageItemTitle, 'top');
        
        var messageTitleIcon = new Element('img');
        
        var messageTitleButtonContainer = new Element('span', {'class': 'custombutton custombutton_silver'});
        
        messageTitleButtonContainer.grab(new Element('button', {
                'class': 'custombutton_text',
                'onclick': 'javascript:removeMessageFromBanner(\'message_banner-message' + messageId + '\');',
                'text': 'Delete'
            })
        );
        
        messageTitleButtonContainer.inject(messageItemTitle, 'bottom');
        
        var messageContent = new Element('div', {'class': 'message_content'});
        
        messageContent.grab(new Element('p', {'html': message}));
        
        messageContent.inject(messageItemContainer, 'bottom');
        
        switch(type)
        {
            case 'general':
                messageItem.addClass('general_message');
                break;
            
            case 'information':
                messageItem.addClass('information_message');
                messageItemTitle.grab(new Element('img', {'src': 'images/icons/information.png'}), 'top');
                break;
            
            case 'success':
                messageItem.addClass('success_message');
                messageItemTitle.grab(new Element('img', {'src': 'images/icons/tick.png'}), 'top');
                break;
            
            case 'warning':
                messageItem.addClass('warning_message');
                messageItemTitle.grab(new Element('img', {'src': 'images/icons/error.png'}), 'top');
                break;
            
            case 'error':
                messageItem.addClass('error_message');
                messageItemTitle.grab(new Element('img', {'src': 'images/icons/exclamation.png'}), 'top');
                break;
            
            default:
                messageItem.addClass('general_message');
        }
        
        messageItem.inject($('message_banner'), 'bottom');
        
        $('message_banner-message' + messageId).reveal({duration: 500, mode: 'vertical'});
    }
    else
    {
        // TODO: Display / Log this Error
        console.error('addMessageToBanner :: Message Banner Element was not Defined!\r\nMessage Banner: ' + $('message_banner'));
    }
}

// Functions to add Message Items of a specific type to the Message Banner
function addGeneralMessageToBanner(title, message)
{
    addMessageToBanner('general', title, message);
}

function addInformationMessageToBanner(title, message)
{
    addMessageToBanner('information', title, message);
}

function addSuccessMessageToBanner(title, message)
{
    addMessageToBanner('success', title, message);
}

function addWarningMessageToBanner(title, message)
{
    addMessageToBanner('warning', title, message);
}

function addErrorMessageToBanner(title, message)
{
    addMessageToBanner('error', title, message);
}

// Removes a Message Item from the Message Banner based on its Element ID
function removeMessageFromBanner(messageId)
{
    if($defined($(messageId)))
    {
        $(messageId).nix({duration: 500, mode: 'vertical'}, true);
    }
    else
    {
        // TODO: Display / Log this Error
        console.error('removeMessageFromBanner :: Banner Message Item Element was not Defined!\r\nMessage ID: ' + $(messageId));
    }
}