function playVideo(name) {
    $(name).VideoJS({
        controlsBelow: false,
        controlsHiding: true,
        useBuiltInControls: true
    });
    $(name).get(0).play();

/*    var myPlayer = VideoJS.setup("man-video", {
        controlsBelow: false,
        controlsHiding: true
    });
    myPlayer.play();*/
}

function stopVideo(name) {
    $(name).get(0).pause();
}

function Woman() {
    this.button = $('.w-button');
    this.buttonPanel = $('.w-button-panel');
    this.mainBlock = $('.woman');
    this.rightTopBlock = $('.woman-rt');
    this.rightBottomBlock = $('.woman-rb');

    this.tops = $('.woman-tops');
    this.bottoms = $('.woman-bottoms');
    this.accessories = $('.woman-accessories');
}

function Man() {
    this.button = $('.m-button');
    this.buttonPanel = $('.m-button-panel');
    this.mainBlock = $('.man');
    this.rightTopBlock = $('.man-rt');
    this.rightBottomBlock = $('.man-rb');

    this.tops = $('.man-tops');
    this.bottoms = $('.man-bottoms');
    this.accessories = $('.man-accessories');
}

function Kid() {
    this.button = $('.k-button');
    this.buttonPanel = $('.k-button-panel');
    this.mainBlock = $('.kid');

    this.baby = $('.kid-baby');
    this.toddoler = $('.kid-toddler');
    this.kid = $('.kid-kid');
    this.maternity = $('.kid-maternity');
}

function initAnimation() {
    var speed = 300;
    var currSlide = null;
    var nextSlide = null;
    var animating = false;

    var woman = new Woman();
    var man = new Man();
    var kid = new Kid();

    var mainBoard = $('#aniban');
    var closeInterval = 500;
    var timer = null;

    var easing = 'quadEaseOut';

    woman.delay = null;
    man.delay = null;
    kid.delay = null;

    woman.open = function(endFunc) {
        animating = true;

        woman.button.animate({right: 630}, speed, easing);
        woman.buttonPanel.animate({right: 630}, speed, easing);
        woman.mainBlock.animate({width: 450}, speed, easing, function() {
            woman.buttonPanel.css('z-index', 202);
            woman.mainBlock.css('z-index', 201);
            woman.rightTopBlock.show().animate({left: 620}, speed, easing, function() {
                woman.rightBottomBlock.show().animate({top: 240}, speed, easing);
            });

            woman.tops.show().animate({left: 0}, speed, easing, function() {
                woman.bottoms.css('left', 0).show();
                woman.accessories.css('left', 0).show();

                woman.bottoms.animate({top: 204}, speed, easing);
                woman.accessories.animate({top: 337}, speed, easing, function() {
                    //playVideo("#aniban .woman-rb .video-js");
                    swfobject.embedSWF("/flash/benetton-woman.swf", "woman-video", "310", "175", "9.0.0", false, { xmlFilePath: "/flash/woman-video.xml", xmlFileType: "Default"} );
                    
                    animating = false;
                    if(endFunc) endFunc();
                });
            });
        });
    }

    woman.close = function(endFunc) {
        //stopVideo("#aniban .woman-rb .video-js");
        swfobject.removeSWF("woman-video");
        $(".woman-rb .video-container").append('<div id="woman-video"></div>');

        animating = true;

        var speed = 200;
        woman.bottoms.animate({top: 70}, speed, easing);
        woman.accessories.animate({top: 70}, speed, easing, function() {
            woman.bottoms.hide();
            woman.accessories.hide();
            woman.tops.animate({left: 160}, speed, easing, function() {
                woman.mainBlock.css('z-index', '');
                woman.buttonPanel.css('z-index', 50);
                woman.tops.hide();
            });
        });

        woman.rightBottomBlock.animate({top: 0}, speed, easing, function() {
            woman.rightBottomBlock.hide();
            woman.rightTopBlock.animate({left: 300}, speed, easing, function() {
                woman.rightTopBlock.hide();

                woman.button.animate({right: 320}, speed, easing);
                woman.buttonPanel.animate({right: 320}, speed, easing);
                woman.mainBlock.animate({width: 140}, speed, easing, function() {
                    animating = false;
                    if(endFunc) endFunc();
                });
            })
        });
    }

    man.open = function(endFunc) {
        animating = true;

        man.mainBlock.animate({width: 300}, speed, easing);
        man.buttonPanel.animate({width: 320}, speed, easing, function() {
            woman.button.animate({right: 630}, speed, easing);
            woman.buttonPanel.animate({right: 630}, speed, easing);
            man.button.animate({right: 470}, speed, easing);
            man.buttonPanel.animate({right: 470}, speed, easing);

            man.mainBlock.animate({width: 610}, speed, easing, function() {
                man.mainBlock.css('right', '').css('left', '160px');
                man.mainBlock.animate({width: 470}, speed, easing);

                man.mainBlock.css('z-index', 21);
                man.rightTopBlock.show();
                man.rightTopBlock.animate({left: 640}, speed, easing);
                man.rightBottomBlock.show();
                man.rightBottomBlock.animate({left: 640}, speed * 1.5, easing, function () {

                });

                man.tops.show();
                man.tops.animate({left: 0}, speed, easing);
                man.bottoms.show();
                man.bottoms.animate({left: 0}, speed * 1.5, easing);
                man.accessories.show();
                man.accessories.animate({left: 0}, speed * 2.0, easing, function() {
                    //playVideo("#aniban .man-rb .video-js");
                    swfobject.embedSWF("/flash/benetton-man.swf", "man-video", "290", "164", "9.0.0", false, { xmlFilePath: "/flash/man-video.xml", xmlFileType: "Default"} );

                    animating = false;
                    if(endFunc) endFunc();
                });
            });
        });
    }

    man.close = function(endFunc) {
        swfobject.removeSWF("man-video");
        $(".man-rb .video-container").append('<div id="man-video"></div>');
//        stopVideo("#aniban .man-rb .video-js");
        animating = true;

        var speed = 200;
        man.mainBlock.animate({width: 610}, speed, easing, function() {
            man.tops.animate({left: 160}, speed, easing);
            man.bottoms.animate({left: 160}, speed * 1.5, easing);
            man.accessories.animate({left: 160}, speed * 2.0, easing, function() {
                man.tops.hide();
                man.bottoms.hide();
                man.accessories.hide();
                man.mainBlock.css('z-index', '');
            });

            man.rightTopBlock.animate({left: 340}, speed, easing);
            man.rightBottomBlock.animate({left: 340}, speed * 1.5, easing, function() {
                man.rightTopBlock.hide();
                man.rightBottomBlock.hide();
                man.mainBlock.css('left', '').css('right', '160px');

                man.mainBlock.animate({width: 610}, speed, easing, function() {
                    woman.button.animate({right: 320}, speed, easing);
                    woman.buttonPanel.animate({right: 320}, speed, easing);
                    man.button.animate({right: 160}, speed, easing);
                    man.buttonPanel.animate({right: 160}, speed, easing);
                    man.mainBlock.animate({width: 300}, speed, easing, function(){
                        man.mainBlock.animate({width: 140}, speed, easing);
                        man.buttonPanel.animate({width: 160}, speed, easing, function() {
                            animating = false;
                            if(endFunc) endFunc();
                        });
                    });
                });
            });
        });
    }

    kid.open = function(endFunc) {
        animating = true;

        kid.mainBlock.animate({width: 460}, speed, easing);
        kid.buttonPanel.animate({width: 480}, speed, easing, function() {
            woman.button.animate({right: 630}, speed, easing);
            woman.buttonPanel.animate({right: 630}, speed, easing);

            man.button.animate({right: 470}, speed, easing);
            man.buttonPanel.animate({right: 470}, speed, easing);

            kid.button.animate({right: 310}, speed, easing);
            kid.buttonPanel.animate({right: 310}, speed, easing);

            kid.mainBlock.animate({width: 770}, speed, easing, function() {
                kid.mainBlock.css('z-index', 20);

                kid.toddoler.show().animate({left: 0}, speed, easing, function() {
                    kid.baby.css('left', 0).show();
                    kid.kid.css('left', 0).show();


                    kid.baby.animate({top: 70}, speed * 0.8, easing);
                    kid.kid.animate({top: 270}, speed * 0.4, easing, function() {
                        kid.maternity.css('left', 0).show();
                        kid.maternity.animate({top: 370}, speed * 0.8, easing, function() {
                            animating = false;
                            if(endFunc) endFunc();
                        });
                    });
                });
            });
        });
    }

    kid.close = function(endFunc) {
        animating = true;

        var speed = 200;

        kid.maternity.animate({top: 270}, speed * 0.4, easing, function() {
            kid.maternity.hide();

            kid.baby.animate({top: 170}, speed, easing);
            kid.kid.animate({top: 170}, speed, easing, function() {

                kid.baby.hide();
                kid.kid.hide();


                kid.toddoler.animate({left: 160}, speed, easing, function() {
                    kid.mainBlock.css('z-index', '');
                    kid.toddoler.hide();

                    kid.mainBlock.animate({width: 460}, speed, easing);

                    woman.button.animate({right: 320}, speed, easing);
                    woman.buttonPanel.animate({right: 320}, speed, easing);

                    man.button.animate({right: 160}, speed, easing);
                    man.buttonPanel.animate({right: 160}, speed, easing);

                    kid.button.animate({right: 0}, speed, easing);
                    kid.buttonPanel.animate({right: 0}, speed, easing, function() {
                        kid.buttonPanel.animate({width: 160}, speed, easing);
                        kid.mainBlock.animate({width: 140}, speed, easing, function() {
                            animating = false;
                            if(endFunc) endFunc();
                        });
                    });
                });
            });
        });
    }

    var switchSlide = function(slide) {
        if(slide === null) return;

        if(animating) {
            nextSlide = slide;
            return;
        }

        nextSlide = null;

        if(currSlide != null && currSlide != slide) {
            currSlide.close(function() {
                if(slide !== false) {
                    currSlide = slide;
                    slide.open(function() { switchSlide(nextSlide); });
                }
                else {
                    currSlide = null;
                }
            })
            return;
        }

        if(currSlide != slide) {
            currSlide = slide;
            slide.open(function() { switchSlide(nextSlide); });
        }
    }

    var switchDelaySlide = function(slide) {
        if(slide.delay != null) return;

        slide.delay = setInterval(function() {
            if(slide.active == true) {
                switchSlide(slide);
            }
            clearInterval(slide.delay);
            slide.delay = null;

        }, 300);
    }

    woman.button.mouseenter(function(event) {
        woman.active = true;
        switchSlide(woman);
    });

    woman.mainBlock.mouseenter(function(event) {
        woman.active = true;
        switchDelaySlide(woman);
    });

    woman.button.mouseleave(function(event) {
        nextSlide = null;
        woman.active = false;
    });

    woman.mainBlock.mouseleave(function(event) {
        nextSlide = null;
        woman.active = false;
    });

    man.button.mouseenter(function(event) {
        man.active = true;
        switchDelaySlide(man);
    });

    man.mainBlock.mouseenter(function(event) {
        man.active = true;
        switchDelaySlide(man);
    });

    man.button.mouseleave(function(event) {
        nextSlide = null;
        man.active = false;
    });

    man.mainBlock.mouseleave(function(event) {
        nextSlide = null;
        man.active = false;
    });

    kid.button.mouseenter(function(event) {
        kid.active = true;
        switchSlide(kid);
    });

    kid.mainBlock.mouseenter(function(event) {
        kid.active = true;
        switchDelaySlide(kid);
    });

    kid.button.mouseleave(function(event) {
        nextSlide = null;
        kid.active = false;
    });

    kid.mainBlock.mouseleave(function(event) {
        nextSlide = null;
        kid.active = false;
    });

    mainBoard.mouseenter(function(event) {
        if(timer) {
            clearInterval(timer);
            timer = null;
        }
    });

    mainBoard.mouseleave(function(event) {
        timer = setInterval(function(){
            if(currSlide) { switchSlide(false); }
            clearInterval(timer);
            timer = null;
        }, closeInterval);
    });
}

function initVideo() {
//    VideoJS.setupAllWhenReady();
//    $(".video-js").VideoJS();
//    $(".video-js-box").width(290).height(240);
//    $(".video-js-box .video-js").width(290).height(240);
//    $(".video-js").player.play();
}

$(document).ready(function() {
//    initVideo();
    initAnimation();
});