﻿var Lieu = new Class({
    Implements: [Options, ToElement],
    options: {
        links: [],
        langue: 'fr',
        topDistance: 4
    },
    opened: false,
    current_id: 0,
    hidden: true,
    initialize: function(options){
        this.setOptions(options);
        this.bindLinks();
        this.createElements();
    },
    load: function(lieu_id){
        if(this.current_id != lieu_id){
            this.create = (!this.req);
            var self = this;
            if(this.create){
                this.req = new Request.JSON({
                    data: {
                        lieu_id: lieu_id,
                        langue: self.options.langue
                    },
                    noCache: true,
                    link: 'cancel',
                    method: 'get',
                    url: baseURL + 'ajax/load_lieu.aspx',
                    onSuccess: function(j,t){
                        //console.log([ j, t ]);
                        self.display( j );
                        self.show();
                    }
                });
            } else {
                //console.log( this.req );
                this.req.options.data.lieu_id = lieu_id;
            }
            this.req.send();
        } else { 
            this.show();
        }
    },
    bindLinks: function(){
        var self = this;
        (this.options.links || []).each(function(a){
            a.addEvent('click', function(ev){
                var lieu_id = '';
                if(a.hash){
                    lieu_id = ('' + a.hash).substr(1);
                } else {
                    var href = a.get('href');
                    lieu_id = href.substr( href.indexOf("#")+1 );
                }
                self.load( lieu_id );
                ev.stop();
            });
        });
    },
    createElements: function(){
        var self = this;
        this.element = new Element('div', {
            'class': 'lieu_wrap',
            'styles': {
                'display': 'none'
            }
        });
        
        var close = new Element('a', {
            'class': 'close',
            'href': '#',
            'name': 'lieu',
            'text': this.options.labels.close,
            'events': {
                'click': function(ev){
                    self.hide();
                    ev.stop();
                }
            }
        });
        close.inject( this.element );
        
        this.innerContainer = new Element('div', {
            'class': 'lieu_inner'
        });
        this.innerContainer.inject( this );
        
        this.element.inject(document.body);
        
        var top = this.getTop();
        
        var ww = (window.getWidth() == 0) ? window.getScrollWidth() : window.getWidth();
        this.element.setStyles({top: top, display: ''});
        var size = this.element.getComputedSize()
        var left = (ww / 2) - (size.totalWidth / 2);
        this.element.setStyles({'left': left, 'display': 'none'});
    },
    getTop: function(){
        var wh = (window.getHeight() == 0) ? window.getScrollHeight() : window.getHeight();
        var st = 0;
        var top = st + (wh / this.options.topDistance);
        return top + window.getScroll().y;
    },
    display: function(data){
        var oldContainer = this.innerContainer;
        this.innerContainer = new Element('div', {
            'class': 'lieu_inner'
        });
        
        var h1 = new Element('h1', {
            'html': data["nom"] || ''
        });
        h1.inject( this.innerContainer );
        
        var dl = new Element('dl');
        dl.inject( this.innerContainer );
        
        var order = ['adresse', 'ville', 'region', 'province', 'phone', 'contact', 'url'];
        
        for(var i = 0, l = order.length; i < l; i++){
            var k = order[i];
            var value = data[k];
            if(value){
                switch(k){
                    default:
                            new Element('dt', {
                                'html': this.options.labels[k]
                            }).inject( dl );
                            new Element('dd', {
                                'html': value
                            }).inject( dl );
                        break;
                    case "region":
                        var ville = data["ville"];
                        if(!ville || (ville && ville != value)){
                            new Element('dt', {
                                'html': this.options.labels[k]
                            }).inject( dl );
                            new Element('dd', {
                                'html': value
                            }).inject( dl );
                        }
                        break;
                    case "province":
                        var region = data["region"];
                        var abbr = value["abbreviation"];
                        var prov = value["nom"];
                        
                        if(prov && prov != region){
                            new Element('dt', {
                                'html': this.options.labels[k]
                            }).inject( dl );
                            new Element('dd', {
                                'html': prov
                            }).inject( dl );
                        }
                        break;
                    case "url":
                        if(value[0] == '/'){
                            // ??
                        } else {
                            new Element('a', {
                                'href': value,
                                'html': this.options.labels[k],
                                'target': '_blank'
                            }).inject( this.innerContainer );
                        }
                        break;
                }
            }
        }
        
        var self = this;
        var fxOut = new Fx.Tween(oldContainer, {
            property: 'opacity'
        });
        fxOut.addEvent('complete', function(){
            oldContainer.dispose();
            self.innerContainer.setStyle('opacity', 0);
            self.innerContainer.inject( self )
            self.innerContainer.fade('in');
        });
        fxOut.start('1', '0');
        
        var fxMove = new Fx.Tween(this.element, {
            property: 'top'
        });
        
        if(this.hidden){
            this.element.setStyle('top', this.getTop());
        } else {
            var t1 = parseInt( this.element.getStyle('top') );
            var t2 = this.getTop();
            fxMove.start( t1, t2 );
        }
    },
    show: function(){
        if(this.hidden){
            var el = this.element;
            el.setStyles({'opacity':0, 'display':''});
            el.fade('in');
            this.hidden = false;
        }
    },
    hide: function(){
        if(!this.hidden){
            this.hidden = true;
            var el = this.element;
            
            var fxOut = new Fx.Tween(el, {
                property: 'opacity'
            });
            fxOut.addEvent('complete', function(){
                el.setStyle('display', 'none');
            });
            fxOut.start('1', '0');
        }
    }
});
