(function() {
    
    var W = this, D = this.document;
    
    box.ui('generic').create({
        id: 'pagemask'
    }).set({
        html: '<div id="pageMask"></div>'
    });
    
    box.ui('generic').create({
        id: 'popinloader'
    }).set({
        html: '<div id="popinLoader">' + l10n.loading + '</div>'
    });
    
    box.ui('generic').create({
        id: 'popin'
    });
    
    box.ui('form').configure({
        fauxOptionsScrollbarOffset: 3,
        webbox: true
    });
    
    var openPopin = function() {
        box.ui('generic.popinloader').removeFromDOM();
        box.ui('generic.popin')
            .visible(false)
            .addToDOM({target: 'form'})
            .applyStyles({visibility: 'visible', top: 'before', left: 'middle', 'min-left': 0}, 'viewport')
            .animate({top: 'viewport:middle', 'min-top': 0}, 500, 'open');
    };
    
    var closePopin = function() {
        box.ui('generic.popin').animate({top: 'viewport:before'}, 500, 'close');
    };
    ker.closePopin = closePopin;
    
    var openMask = function() {
        box.ui('generic.pagemask')
            .addToDOM({target: 'form'})
            .applyStyles({opacity:0, top: 0, left: 0, width: 'viewport', height: 'document'})
            .animate({opacity: 0.75}, 180, 'open');
    };
    ker.openMask = openMask;
    
    var closeMask = function() {
        box.ui('generic.pagemask').animate({opacity: 0}, 180, 'close');
    };
    
    var openLoader = function() {
        box.ui('generic.popinloader')
            .visible(false)
            .addToDOM({target: 'form'})
            .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({
        'change.field.select.mail_subject_list': function(e) {
            var val = e.source.getValue();
            var email = ker.contactEmails[val];
            if(email) {
                box.ui('form.contactForm').field('mail_to').setValue(email);
            } else {
                box.ui('form.contactForm').field('mail_to').clearValue();
            }
        },'change.field.select.choose_subject': function(e) {
            var val = e.source.getValue();
            box.ui('form.contactForm').field('mail_subject').setValue(val == '0' ? '' : val);
        },'addtodom.generic.popin.contact': function(e) {
            box.ui('form').create({
                element: '#contactForm',
                submit: 'div.actions a'
            }).addReplacement().mustValidate(function(form) {
                form.field('title_list').mustValidate(function(field) {
                    if(!field.isChecked()) {
                        return l10n.errors.required.civility;
                    }
                });
                
                form.field('fname').mustValidate(function(field) {
                    if(field.isEmpty()) {
                        return l10n.errors.required.fname;
                    }
                });
                
                form.field('lname').mustValidate(function(field) {
                    if(field.isEmpty()) {
                        return l10n.errors.required.lname;
                    }
                });
                
                form.field('email').mustValidate(function(field) {
                    if(field.isEmpty()) {
                        return l10n.errors.required.email;
                    } else if(!field.isMatching('email')) {
                        return l10n.errors.invalid.email;
                    }
                });
                
                form.field('choose_subject').mustValidate(function(field) {
                    if(!field.getIndex()) {
                        return l10n.errors.required.subject;
                    }
                });
                
                form.field('mail_subject_list').mustValidate(function(field) {
                    if(!field.getIndex()) {
                        return l10n.errors.required.subject;
                    }
                });
                
                form.field('mail_body').mustValidate(function(field) {
                    if(field.isEmpty()) {
                        return l10n.errors.required.lname;
                    }
                });
                
                return l10n.errors.form;
            });
        },'close.generic.popin.contact': function(e) {
            box.ui('form').destroy('contactForm');
        },
        
        'addtodom.generic.popin.sendToFriend': function(e) {
            box.ui('form').create({
                element: '#sendToFriendForm',
                submit: 'div.actions a'
            }).addReplacement().mustValidate(function(form) {
                form.field('fname').mustValidate(function(field) {
                    if(field.isEmpty()) {
                        return l10n.errors.required.fname;
                    }
                });
                
                form.field('email').mustValidate(function(field) {
                    if(field.isEmpty()) {
                        return l10n.errors.required.email;
                    } else if(!field.isMatching('email')) {
                        return l10n.errors.invalid.email;
                    }
                });
                
                form.field('FriendLastName').mustValidate(function(field) {
                    if(field.isEmpty()) {
                        return l10n.errors.required.fname;
                    }
                });
                
                form.field('FriendEmail').mustValidate(function(field) {
                    if(field.isEmpty()) {
                        return l10n.errors.required.email;
                    } else if(!field.isMatching('email')) {
                        return l10n.errors.invalid.email;
                    }
                });
                
                form.field('Body').mustValidate(function(field) {
                    if(field.isEmpty()) {
                        return l10n.errors.required.lname;
                    }
                });
                
                return l10n.errors.form;
            });
            
            var stfdatas, pageType = D.body.id;
            if(pageType == 'productsSheet') {
                stfdatas = '<a href="' + location.href + '" target="_blank" style="color:#666;">' +
                           '    <font color="#666666">' + box.dom('h1').text() + '</font>' +
                           '</a>';
            }
            if(pageType == 'salonExperienceDiagnostic' || pageType == 'salonExperienceRituals') {
                stfdatas = '<a href="' + location.href + '" target="_blank" style="color:#666;">' +
                           '    <font color="#666666">' + box.dom('#slide h2').text() + '</font>' +
                           '</a>';
            }
            if(stfdatas) {
                box.ui('form.sendToFriendForm').field('stfdatas').getElement().val(stfdatas);
            }
        },'close.generic.popin.sendToFriend': function(e) {
            box.ui('form').destroy('sendToFriendForm');
        },
        
        'addtodom.generic.popin.ingredientsListing': function(e) {
            box.ui('form').create({
                element: '#ingredientsListingForm',
                submit: 'div.actions a'
            }).mustValidate(function(form) {
                form.field('prdCode').mustValidate(function(field) {
                    if(field.isEmpty()) {
                        return 'error';
                    }
                });
                
                return 'error';
            });
        },'close.generic.popin.ingredientsListing': function(e) {
            box.ui('form').destroy('ingredientsListingForm');
        },
        
        'addtodom.generic.popin.productFinder': function(e) {
            box.ui('scroll').create({
                element: '#productFinder div.scroll'
            });
        },'close.generic.popin.productFinder': function(e) {
            box.ui('scroll').destroy('productFinder');
        },
        
        'addtodom.generic.popin.interviewHairdresser': function(e) {
            box.ui('scroll').create({
                element: '#interviewHairdresser div.scroll'
            });
        },'close.generic.popin.interviewHairdresser': function(e) {
            box.ui('scroll').destroy('interviewHairdresser');
        },
        
        'addtodom.generic.popin.institutesListing': function(e) {
            box.ui('scroll').create({
                element: '#institutesListing div.scroll'
            });
        },'close.generic.popin.institutesListing': function(e) {
            box.ui('scroll').destroy('institutesListing');
        },
        
        'addtodom.generic.popin.ritualsListing': function(e) {
            box.ui('scroll').create({
                element: '#ritualsListing div.scroll'
            });
        },'close.generic.popin.ritualsListing': function(e) {
            box.ui('scroll').destroy('ritualsListing');
        },
        
        'contentloaded.generic.popin': function() {
            if(!box.ui('generic.pagemask').isBusy() && !box.ui('generic.popinloader').isBusy()) {
                closeLoader();
            }
        },'open.generic.pagemask': function(e) {
            if(box.ui('generic.popin').isContentLoaded()) {
                openPopin();
            } else {
                openLoader();
            }
        },'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();
            closeMask();
        },'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();
            var id = $(element).getBoxDatas('id'), url = l10n.url.async[id] || element.href;
            if(id == 'productFinder') {
                url += '?async=true';
            }
            if(url.indexOf('#') > -1) {
                url = url.replace(/[^#]*/, '');
            }
            box.ui('generic.popin').setNamespace(id).set({url: url, cache: id != 'pressScan'});
        }
    });
    
    box.addClick({
        id: 'closePopin',
        deepness: 1,
        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();
            }
        }
    });
    
    box.dom(document).ready(function() {
        var html;
        if(D.getElementById('sendToFriend')) {
            box.ui('generic.popin').setNamespace('sendToFriend').set({element: box.dom('#sendToFriend').remove()});
        }
        
        if(D.getElementById('contact')) {
            box.ui('generic.popin').setNamespace('contact').set({element: box.dom('#contact').remove()});
        }
        
        if(D.getElementById('password')) {
            if(box.dom('#passwordFormError').html()) {
                location.hash = 'popin=password';
            }
            box.ui('generic.popin').setNamespace('password').set({element: box.dom('#password').remove()});
        }
        
        // direct access must be managed after the creation of forms popins (or generic is busy)
        var directAccess = box.getURLHash('popin');
        if(directAccess && l10n.url.async.popins && l10n.url.async.popins[directAccess]) {
            openMask();
            box.ui('generic.popin')
                .setNamespace(directAccess)
                .set({url: l10n.url.async.popins[directAccess]});
        }
    });
    
    // turn off sound when opening discover kerastase / turn on when closing
    box.bind({
        'addtodom.generic.popin.discoverKerastase': function() {
            var sound = D.getElementById('idFlash');
            if(sound && sound.callSoundControl) {
                 sound.callSoundControl();
            }
            if(box.ui('carousel.focus')) {
                box.ui('carousel.focus').endAutoplay();
            }
        },'removefromdom.generic.popin.discoverKerastase': function() {
            var sound = D.getElementById('idFlash');
            if(sound && sound.callSoundControl) {
                 sound.callSoundControl();
            }
            if(box.ui('carousel.focus')) {
                box.ui('carousel.focus').startAutoplay();
            }
        }
    });
    
})();
