var Glossary = new Class({
    
    initialize: function(terms) {
        terms = terms || '.term';
        
        this.glossary = new Hash();
        var glossaryElem = $('glossary');
        if (glossaryElem) {
            var children = glossaryElem.getChildren();
            for (var i = 0, len = children.length; i < len; i += 2) {
                this.glossary[children[i].get('text').toLowerCase().trim()] = children[i + 1].get('text');
            }
        }
        
        this.bottomLayer = new Element('iframe', { 'class': 'hidden', 'style': 'position: absolute;', 'frameborder': 0 }).inject(document.body);
        this.descrPlate = new Element('div', { 'class': 'termDescrPlate hidden' }).inject(document.body);
        this.closeButton = new Element('span', { 'class': 'closeButton', 'text': 'закрыть' });
        this.closeButton.addEvent('click', function(event) { this.descrPlate.addClass('hidden'); this.bottomLayer.addClass('hidden'); }.bind(this));
        
        $$(terms).addEvent('click', this.showDescrPlate.bind(this));
    },
    
    showDescrPlate: function(event) {
        event.stop();
        var termElem = event.target;
        var term = termElem.get('term') || termElem.get('text');
        term = term.substr(0, 1).toUpperCase() + term.substr(1);
        
        if (this.currentTerm != term && this.request) {
            this.request.cancel();
            this.request = null;
        }
        this.currentTerm = term;
        
        var termCoords = termElem.getCoordinates();
        this.closeButton.dispose();
        this.descrPlate.empty().position({ x: termCoords.left, y: termCoords.bottom });
        
        if (this.descrPlate.hasClass('hidden')) {
            document.addEvent('click', function(event) {
                if (event.target == this.descrPlate || $(event.target).getParents().contains(this.descrPlate)) return;
                document.removeEvent('click', arguments.callee);
                this.descrPlate.addClass('hidden');
                this.bottomLayer.addClass('hidden');
                if (this.request) {
                    this.request.cancel();
                    this.request = null;
                }
            }.bind(this));
        }

        if (this.glossary[term.toLowerCase()]) {
            this.showTermDescription(term);
        } else {
            this.descrPlate.addClass('loading').removeClass('hidden');
            this.request = new Request.JSON({
                url: '/glossary/getDescription',
                data: { term: term },
                onComplete: function(response) {
                    this.request = null;
                    if (response) {
                        var term = response.term;
                        this.glossary[term.toLowerCase()] = response.description;
                    }
                    this.showTermDescription(term);
                }.bind(this)
            }).send();
        }
    },
    
    showTermDescription: function(term) {
        var content = '<strong>Упс, термин не найден :-(</strong>';
        if (term && this.glossary[term.toLowerCase()]) {
            content = '<h1>' + term + '</h1><p>' + this.glossary[term.toLowerCase()] + '</p>';
        }
        this.descrPlate.removeClass('loading').set('html', content).removeClass('hidden').adopt(this.closeButton);
        
        var winCoords = window.getCoordinates();
        var plateCoords = this.descrPlate.getCoordinates();
        if (plateCoords.right > winCoords.right) {
            this.descrPlate.position({ x: plateCoords.left - (plateCoords.right - winCoords.right) - 1, y: plateCoords.top });
        }
        
        if (Browser.Engine.trident) {
            var plateCoords = this.descrPlate.getCoordinates();
            this.bottomLayer.position({ x: plateCoords.left, y: plateCoords.top }).setStyles({
                'width': plateCoords.width,
                'height': plateCoords.height
            }).removeClass('hidden');
        }
    }
});

window.addEvent('domready', function() {
    App.glossary = new Glossary();
});