var Growl = new Class({
    options: {
        width: 200,
        top: 0,
        right: 0,
        opacity: 1
    },
    
    initialize: function(options) {
        this.setOptions(options)
        this.top = this.options.top
        this.right = this.options.right
        this.width = this.options.width
        this.opacity = this.options.opacity
        
        if ($('growl-notifications') == undefined) {
            var notifications = new Element('div')
            notifications.setAttribute('id', 'growl-notifications')
            notifications.setStyles({
                'position': 'absolute',
                'display': 'none',
                'top': this.top + 'px',
                'right': this.right + 'px',
                'z-index': '999',
                'opacity': this.opacity
            })
            notifications.injectInside(document.body)
        }
    },

    display: function(text, duration) {    
        var nodes = $('growl-notifications').getElements('div')
        
        for (var i=0; i < nodes.length; i++) {
            var node = nodes[i]
            
            if (node.getStyle('opacity') != 0) {
                break
            }
            
            $('growl-notifications').removeChild(node)
        }
        
        if (duration == undefined) {
            duration = 5000
        }
        
        var notifications = $('growl-notifications')
        notifications.setStyle('display', 'block')
        var notification = new Element('div')
        notification.setAttribute('class', 'growl-notification')
        notification.setStyles({
            'width': this.width + 'px',
            'margin-top': '6px',
            'min-height': '40px',
            'opacity': '0'
        })
        var message = new Element('p')
        message.setStyles({
            'padding': '0px',
            'margin': '0px',
            'float': 'left',
            'text-align': 'left',
            'width': '85%'
        })
        //message.appendText(text)
        message.innerHTML = text
        
        var closeBtn = new Element('img');
        closeBtn.setAttribute('src', '/images/status_close_btn.png');
        closeBtn.setStyles({
            'position': 'relative',
            'float': 'right',
            'cursor': 'pointer'
        })
        closeBtn.addEvent('click', function() {
            var fx = this.parentNode.effects({
                duration: 300
            })
            var node = this.parentNode

            fx.start({
            }).chain(function() {
                fx.start.delay (duration, fx, {
                    opacity: 0
                })
            }).chain(function() {
                node.parentNode.removeChild(node)
            })
        })

        if (duration != -1) {
            var fx = notification.effects({
                duration: 300
            })
        
            fx.start({
            }).chain(function() {
                fx.start.delay (duration, fx, {
                    opacity: 0
                })
            }).chain(function() {
                notification.parentNode.removeChild(notification)
            })
        }
               
        notification.appendChild(message)
        notification.appendChild(closeBtn)
        notifications.appendChild(notification)
        
        notification.fade('in')
    }
})

Growl.implement(new Options)