(function() {
    
    var W = this, D = this.document;
    
    box.ui('generic').create({
        id: 'pagemask'
    }).set({
        html: '<div id="pageMask" style="background-color:#000000;z-index:100" ></div>'
    });
    
    box.ui('generic').create({
        id: 'popinloader'
    }).set({
        html: '<div id="popinLoader">' + l10n.loading + '</div>'
    });
    
    box.ui('generic').create({
        id: 'popin'
    });
    	
	var openPopin = function() {
		openMask();
        box.ui('generic.popinloader').removeFromDOM();
        box.ui('generic.popin').addToDOM({target: 'body'}).applyStyles({top: 'middle'}, 'viewport');    
    };
    
    var closePopin = function() {
		closeMask();
        box.ui('generic.popin').animate({opacity:0},300, 'close');
    };
    
   var openMask = function() {

        box.ui('generic.pagemask')
            .addToDOM({target: 'body'})
            .applyStyles({position:'absolute', opacity:0.4, top: 0, left: 0, width: 'viewport', height: 'document'})
            .animate({opacity: 0.6}, 500, 'open');

    };	

    var closeMask = function() {
        box.ui('generic.pagemask')
			.animate({opacity: 0}, 500, 'close')
			.removeFromDOM();
    };
    
    var openLoader = function() {
		closePopin();
        box.ui('generic.popinloader')
            .visible(false)
            .addToDOM({target: 'body'})
            .applyStyles({visibility: 'visible', opacity: 0, top: 'middle', left: 'middle'}, 'viewport')
            .animate({opacity: 0.999}, 300, 'open');
    };
    
    var closeLoader = function() {
        box.ui('generic.popinloader').animate({opacity: 0}, 300, 'close');
    };
	

    box.bind({
        'contentloaded.generic.popin': function(e) {
            if(!box.ui('generic.pagemask').isBusy() && !box.ui('generic.popinloader').isBusy()) {
                closeLoader();
            }
        },'open.generic.popinloader': function(e) {
            if(box.ui('generic.popin').isContentLoaded()) {
                closeLoader();
            }
        },'close.generic.popinloader': function(e) {
            openPopin();
        },'close.generic.popin': function(e) {
            box.ui('generic.popin').removeFromDOM();
        },'close.generic.pagemask': function(e) {
            box.ui('generic.pagemask').removeFromDOM();
        },'open.generic.popin': function(e) {
            box.ui('escape').create('popin');
        },'closefromkey.escape.popin': function(e) {
            closePopin();
        }    
    });
    
    box.addClick({
        id: 'openPopin',
        deepness: 3,
        test: function(e, element) {
			return (element.nodeName.toLowerCase() == 'a' && element.className.indexOf('openPopin') > -1);
        },
        action: function(e, element) {
            e.preventDefault();
            /*openMask();*/
			openLoader();
			if (element.nodeName.toLowerCase() == 'a') {
				box.ui('generic.popin')
					.setNamespace($(element).getBoxDatas('id'))
					.set({url: element.href, cache:false});
			} else {
				box.ui('generic.popin')
					.setNamespace($(element).parent().parent().getBoxDatas('id'))
					.set({url: element.parentNode.parentNode.href, cache:false});					
					
			}
        }
    });
    
    box.addClick({
        id: 'closePopin',
        deepness: 2,
        test: function(e, element) {
			return (element.nodeName.toLowerCase() == 'a' && element.className.indexOf('closePopin') > -1);
        },
        action: function(e, element) {
            			
            e.preventDefault();
            var ns = box.dom(element).getBoxDatas('id');
            if(ns == box.ui('generic.popin').getNamespace()) {
                closePopin();
            }
        }
    });
    
    
    
    $(document).ready(function() {
        /**
        * @description      Open popin sendToFriend if an error was detected server side 
        */
        if ($("body").hasClass("sendFriendFormHasError")) {
            
            openLoader();
    	    var popinUrl = "";
    	    
            $('.openPopin').each(function(){
                if ($(this).getBoxDatas('id') == "sendFriend1") {
                    popinUrl = $(this).attr("href");
                }
            });
            box.ui('generic.popin').setNamespace('sendFriend1').set({url: popinUrl}); //'/popin.php?popin=sendFriend&boxid=sendFriend1'
            
        }
        if ($("#main").hasClass("messageConfirmation")) {
            
            openLoader();
            if (typeof(popinUrl) == 'undefined') {
                var popinUrl = l10n.url.popinConfirmation;
            }
            box.ui('generic.popin').setNamespace('confirmation').set({url: popinUrl});
            
        }
		
		if ($("#main").hasClass("messageConfirmationDeleted")) {
            
            openLoader();
            if (typeof(popinUrl) == 'undefined') {
                var popinUrl = l10n.url.popinConfirmationDeleted;
            }
            box.ui('generic.popin').setNamespace('confirmation').set({url: popinUrl});
            
        }
        if ($("#main").hasClass("messageConfirmationDeletedProblem")) {
            
            openLoader();
            if (typeof(popinUrl) == 'undefined') {
                var popinUrl = l10n.url.popinConfirmationDeletedProblem;
            }
            box.ui('generic.popin').setNamespace('confirmation').set({url: popinUrl});
            
        }
        
    });
    
	
})();