//Ie6
var ie6 = false;
//JS name space
if(!TAG) { var TAG = {}; }

(function() {
   // AEL
    window.TAG= TAG;
    
    //Error Form
    var errorCls = 'error';
    
    TAG.initPopin = function(){
        // create a mask for popins
        box.ui('mask').create({
            id: 'example',
            
            html: '<div id="popinMask"></div>',
            insertStyles: {
                opacity: 0,
                width: 'viewport:content-box',
                height: 'document:content-box'
            },
            insertAnimStyles: {
                opacity: 0.5
            },
            insertAnimDuration: 200,
            removeAnimStyles: {
                opacity: 0
            },
            removeAnimDuration: 150,
            resizeStyles: {
                width: 'viewport:content-box',
                height: 'document:content-box'
            }
        });
        
        // create a loader for popins
        box.ui('loader').create({
            id: 'example',
            
            html: '<div id="popinLoader">' + l10n.loading + '</div>',
            insertStyles: {
                opacity: 0,
                top: 'viewport:middle',
                left: 'viewport:middle'
            },
            insertAnimStyles: {
                opacity: 1
            },
            insertAnimDuration: 200,
            removeAnimStyles: {
                opacity: 0
            },
            removeAnimDuration: 150
        });
        
        // create a new popin object
        box.ui('popin').create({
            id: 'example',            
            loader: 'example',
            mask: 'example',
            
            insertStyles: {
                top: 'viewport:before',
                left: 'viewport:middle',
                'min-left': 0
            },
            insertAnimStyles: {
                top: 'viewport:start',
                'min-top': 0
            },
            insertAnimDuration: 600,
            removeAnimStyles: {
                top: 'viewport:before'
            },
            removeAnimDuration: 500,
            
            openClassName: 'popinOpen',
            closeClassName: 'popinClose'
        });
        
        box.bind({
            'addtodom.popin.example': function(e){
                box.ui('scroll').create({
                    element: '.popinContent .scrollPopin',
                    buttons: true,
                    bar: true
                });
            },
            'close.popin.example': function(e){
                box.ui('scroll').destroy('example');
            }
        });
        
    }


    TAG.getErrorTarget = function(field) {
        if(field.dom.hasClass('group')){
            return field.dom.parent().parent().find('.legend');
        } else
        if(field.dom.hasClass('monoCheck')){
            return field.dom;
        } else
        if('radio' != field.type) {
            return field.getLabel();
        } else {
            return field.getElements().parent().parent().parent();
        }
    };    

    TAG.addErrorIcon = function(field, target) {
        var id = field.name + 'Error';
        var img = box.dom('#' + id);
        if(img.length) {
            img.text(field.getError());
        } else if(field.type == 'radio'){ 
            target.find('ul').before('<p class="' + errorCls + '" id="' + id + '">' + field.getError() + '</p>');
        } else {
            if(target.parent().find('p').length == 0){
            target.before('<p class="' + errorCls + '" id="' + id + '">' + field.getError() + '</p>');
            }
        }
    };

    TAG.addFieldError = function(e) {
        TAG.addErrorIcon(e.source, TAG.getErrorTarget(e.source).addClass(errorCls));
    };

    TAG.removeFieldError = function(e) {
        box.dom('#' + e.source.name + 'Error').remove();
        TAG.getErrorTarget(e.source).removeClass(errorCls);
    };    

    TAG.addFormError = function(e) {
        var id = e.source.id + 'Error';
        var msg = '<p>' + e.source.msg + '</p>';
        var error = box.dom('#' + id);
        if(error.length) {
            error.html(msg);
        } else {
            e.source.getElement().append('<div id="' + id + '" class="' + errorCls + '">' + msg + '</div>');
        }
    };

    TAG.removeFormError = function(e) {
        box.dom('#' + e.source.id + 'Error').remove();
    };


    

   
    //FakeSelect Object
    FakeSelect = function(el){this.init(el)}
    
    FakeSelect.prototype = {
        init: function(el){
            var that = this;
            this.fakeListId = el.getBoxDatas('id')+'Fake';
            that.fakeSelect = el;
            
            if(that.fakeSelect.find('p').length ==  0){
                if(this.fakeListId == 'yearListFake'){
                    that.fakeSelect.append('<p class="selectedCountry"><span>></span>' + that.fakeSelect.find('li.selected a').html() + '</p>')
                } else {
                    that.fakeSelect.append('<p class="selectedCountry"><span>></span>' + that.fakeSelect.find('li:eq(0) a').html() + '</p>')
                }
            }
            that.foption = that.fakeSelect.find('p');
            
            that.foption.click(function(){
               that.foption.addClass('on');
               that.openList(that.fakeSelect,this);
            });
            
            box.bind({
               'show.mask.maskSelect':function(){
                   $('#maskFakeSelect').click(function(){
                        that.closeList();
                        that.foption.removeClass('on'); 
                    });
               }
            });
        },
        openList:function(el,target){
            box.ui('mask.maskSelect').show();
            var offset = $(target).offset();
            var fakeList = el.id;
            var html = el.find('.list').html();
            var hList = el.find('.list').height();
            var hSelect = $(target).height();
            var wSelect = el.width() - 2;
            var totalH = document.documentElement.scrollHeight || window.body.scrollHeight;

            if (offset.top + hList + hSelect > totalH) {
                var top = offset.top - hList -1;
            } else {
                var top = offset.top + hSelect + 1;
            }
            
            $(document.body).append('<div class="box[id=' + this.fakeListId + '] ' + this.fakeListId + '" id="scrollable" style="top:' + top + 'px; left:' + offset.left + 'px; position:absolute; height:' + hList + 'px; width:' + wSelect + 'px">' + html + '</div>');
            box.ui('scroll').create({
                element: '#scrollable',
                buttons: false
            });
            box.ui('scroll.'+this.fakeListId).compute();
        },
        closeList:function(){
            box.ui('mask.maskSelect').hide();
            $('.fakeSelect').each(function() {
                var eltId = $(this).getBoxDatas('id') + 'Fake';
                box.ui('scroll').destroy(eltId);
            });
            $('#scrollable').remove();
        }
    };
    
    TAG.setFakeSelect = function(){
        box.ui('mask').create({
           id:'maskSelect',
           html:'<div id="maskFakeSelect"></div>',
           insertStyles: {opacity: 0, width: 'viewport:content-box', height: 'document:content-box'} 
        });
        $('.fakeSelect').each(function(){
            var that = $(this);
            that.find('li:last').addClass('last');
            new FakeSelect(that);
         });
    }
    
    TAG.heightList = function(where){
        $(where).each(function(){
            var that = $(this);
            var list = that.find('> li');
            
            var maxHeight = 0;
            var count = 0;
            
            var list2 = new Array();
            
            list.each(function(i){
                count++;
                var that = $(this);
                var h = that.height();
                
                if(maxHeight<h){
                    maxHeight = h;
                }
                list2.push(list[i]);
                
                if(count == 3||list.length - i < 2){ 
                    count = 0;
                    $(list2).css('height',maxHeight+'px');
                    maxHeight = 0;
                    list2 = new Array();               
                }
            });
        });
    }
    
    TAG.heightTitle = function(where){
        $(where).each(function(){
            var that = $(this);
            var title = that.find('h3');
            
            var maxTitleHeight = 0;
            var nb = 0;
            
            var title2 = new Array();

            title.each(function(i){
                nb++;
                var that = $(this);
                var hTitle = that.height();
                
                if(maxTitleHeight<hTitle){
                    maxTitleHeight = hTitle;
                }
                title2.push(title[i]);
                
                if(nb == 3||title.length-i<2){ 
                    nb = 0;
                    $(title2).css('height',maxTitleHeight+'px');
                    maxTitleHeight = 0;
                    title2 = new Array();               
                }
            });
        });
    }
    
    TAG.hoverList = function(el){
        $(el).find('> li').hover(
            function(){
                var that = $(this);
                that.find('.symbol').css('height',that.find('img').height()); 
                that.addClass('selected');       
            },
            function(){
                var that = $(this);
                that.removeClass('selected');
        })
    }
    
    TAG.searchField = function(){
        $('#search').focus(function() {
            var searchVal = $(this).val();
            if(searchVal == $(this)[0].defaultValue) {
                $(this).val('');
            }
        }).blur(function() {
            var searchVal = $(this).val();
            if(searchVal == '') {
                $(this).val($(this)[0].defaultValue);
            }
        });
    }

})();
box.dom(document).ready(function() {
     TAG.setFakeSelect();
     TAG.heightTitle('.equipmentList');
     TAG.hoverList('.equipmentList');
     TAG.initPopin();
     TAG.searchField();
});

$(window).load(function () {
	TAG.heightList('.equipmentList');
	TAG.heightList('.listing');
});