/*
Copyright (c) 2011, STRAIGHTLINE All rights reserved.
*/

/* 
---------------------------------------------------------------------------------------------------
    Extra Init
---------------------------------------------------------------------------------------------------
*/
var ExtraInit = new Class({
	Implements: [Options,Events],
    scrollTimer: null,
    currentLis: new Array(),
    defaultHeaderInnerSize: null,
    options: {
        baseURL: null,
        onComplete: function(){}
    },
    initialize: function(options) {
        this.setOptions(options);
    },
    
    run: function() {
        if ($('home-description')) {
            var listItems = $('home-description').getElements('li');
            var visibleIndex = Number.random(0, listItems.length - 1);
            listItems.each(function(li, index) {
                if (visibleIndex != index) {
                    li.setStyle('display', 'none');
                }
            }.bind(this));
        }
        var fadeElements = $$('.fade-item');
        fadeElements.each(function(fadeElement) {
            fadeElement.store('defaultMarginTop', fadeElement.getStyle('margin-top').toInt());
            fadeElement.setStyles({
                opacity: 0,
                'margin-top': fadeElement.retrieve('defaultMarginTop') - 50
            });
        });
        
        var canvas = $('canvas');
        if (canvas) {
            canvas.setStyle('opacity', 0);
        }
        
        $('wrapper').setStyle('opacity', 1);
        
        if (canvas == null) {
            this.fireEvent('complete');        
        }
        fadeElements.each(function(fadeElement, index) {
            (function() {
                new Fx.Morph(fadeElement, {
                    duration: 1000,
                    transition: 'back:out',
                    onComplete: function() {
                        if (canvas) {
                            if (index + 1 == fadeElements.length) {
                                this.fireEvent('complete');
                            }
                        }
                    }.bind(this)
                }).start({
                    opacity: 1,
                    'margin-top': fadeElement.retrieve('defaultMarginTop')
                });
            }.bind(this)).delay(150 * index);
        }.bind(this));
    },
    
    addBubble: function() {
        var canvas = $('canvas');
        if (canvas == null) {
            return;
        }
        var gallery = canvas.getElement('.post-gallery');
        
        var bubble1 = new Element('div', {
            id: 'bubble-1'
        });
        var bubble2 = new Element('div', {
            id: 'bubble-2'
        });
        var bubble3 = new Element('div', {
            id: 'bubble-3'
        });
        canvas.adopt(bubble1, bubble2, bubble3);
        
        new Asset.images(
            [
                getURLByBackgroundImage(bubble1.getStyle('background-image')),
                getURLByBackgroundImage(bubble2.getStyle('background-image')),
                getURLByBackgroundImage(bubble3.getStyle('background-image'))
            ], {
                onComplete: function() {
                    var centerX = 0;
                    var centerY = 0;
                    if (gallery) {
                        centerX = gallery.getCoordinates($('wrapper')).left + gallery.getSize().x / 2;
                        centerY = gallery.getCoordinates($('wrapper')).top + gallery.getSize().y / 2;
                    } else {
                        var windowSize = getWindowSize();
                        centerX = windowSize.x / 2;
                        centerY = windowSize.y / 2;
                    }                
                    new Array(gallery, bubble1, bubble2, bubble3).each(function(element) {
                        if (element) {
                            var marginTop = - 50;
                            element.store('defaultTop', element.getStyle('top').toInt());
                            if (element.getStyle('top').toInt() > 400) {
                                marginTop *= -1;
                            }
                            element.setStyles({
                                opacity: 0,
                                top: element.retrieve('defaultTop') + marginTop
                            });
                        }
                    }.bind(this));
                    
                    canvas.setStyles({
                        opacity: 1,
                        'margin-top': - window.getScrollTop()                        
                    });
                    
                    new Array(gallery, bubble1, bubble2, bubble3).each(function(element, index) {
                        if (element) {
                            (function() {
                                new Fx.Morph(element, {
                                    duration: 1000,
                                    transition: 'back:out'
                                }).start({
                                    opacity: 1,
                                    top: element.retrieve('defaultTop')
                                });
                            }.bind(this)).delay(150 * index);
                        }
                    }.bind(this));
                    
                    var curX = 0;
                    var curY = 0;
                    window.addEvent('mousemove', function(event) {
                        var mouseX = event.client.x;
                        var mouseY = event.client.y;
                        if (Math.abs(curX - mouseX) > 50 || Math.abs(curX - mouseX) > 50) {
                            var x = mouseX - centerX;
                            var y = centerY - mouseY;
                            new Array(gallery, bubble1, bubble2, bubble3).each(function(element) {
                                if (element) {
                                    var zIndex = element.getStyle('z-index').toInt() + 1;
                                    element.set('morph', {
                                        duration: 2000,
                                        transition: 'expo:out',
                                        link: 'cancel'
                                    }).get('morph').start({
                                        'margin-top': y * zIndex * 0.03,
                                        'margin-left': - x * zIndex * 0.03
                                    });
                                }
                            });
                            curX = mouseX;
                            curY = mouseY;
                        }
                    });
                    window.addEvent('scroll', function() {
                        canvas.setStyles({
                            'margin-top': - window.getScrollTop()
                        });
                    });
                }.bind(this)
            }
        );
        
    }
});