Asset.image('images/moognify.gif');

var thumb = "";
var Moognify = new Class({
        options:  {
                duration: 300,
                borderDuration: 200,
                borderOpacity: 1,
                altText: "true"
        },
        initialize: function(element,options) {
                this.text = false;
                this.element = $(element);
                this.setOptions(options);
                this.defineText();
                this.storeCoordinates();
                this.setSource();
                this.create();
                this.loader();
        },
        initializeLoaded: function() {
                this.setPosition();
                this.zoom();
//                this.createBorder.bind(this).delay(this.options.duration);
                if(thumb == "") thumb = this.element;
                this.image.addEvent('click', this.minimize.bind("",[this.image,this.element,"",this.options]));
        },
        storeCoordinates: function() {
                this.elementTop = $(this.element).getPosition().y;
                this.elementLeft = $(this.element).getPosition().x;
                this.elementWidth = $(this.element).offsetWidth;
                this.elementHeight = $(this.element).offsetHeight;
                this.browserWidth = window.getWidth();
                this.browserHeight = window.getHeight();
                this.browserScrollTop = window.getScrollTop();
        },
        setSource: function() {
                if(this.options.source) this.source = this.options.source;
                else this.source = this.element.src;
        },
        create: function() {
                if($("moognifyObject")) {
                        this.minimize($("moognifyObject"),thumb,this.element,this.options);
                }
                this.image = new Element('img', {
                        'styles': {
                                'position': 'absolute',
                                'top': '0px',
                                'cursor': 'pointer',
                                'z-index': '-99',
                                'display': 'none',
								'border': '#42453E 1px solid'
                        },
                        'src': this.source,
                        'id': 'moognifyObject'
                });
                this.indicator = new Element('div', {
                        'styles': {
                                'position': 'absolute',
                                'top': this.element.getTop(),
                                'left': this.element.getLeft(),
                                'width': this.element.getSize().size.x,
                                'height': this.element.getSize().size.y,
                                'z-index': '99',
                                'display': 'none'
                        },
                        'class': 'moognifyIndicator',
                        'id': 'moognifyIndicator'
                });
                document.body.appendChild(this.indicator);
        },
        loader: function() {
        	      // display indicator
        	      this.indicator.setStyle('display', 'block');
                if (this.checkLoad()) {
                	      // hide indicator
                	      this.indicator.setStyle('display', 'none');
                        this.initializeLoaded.delay(100, this);
                } else {
                        new Fx.Styles(this.element,'opacity').set(0.5);
                        this.loader.delay(100,this,this.image);
                }
        },
        checkLoad: function() {
                /*if(this.image.width > 0) {
                        return true;
                }*/
                return (this.image.width > 0) && (this.image.height > 0) && (this.image.complete);
        },
        setPosition: function() {
                this.imageWidth = this.image.width;
                this.imageHeight = this.image.height;
                if(this.imageHeight > this.browserHeight-60) {
                        var divider = this.imageHeight / (this.browserHeight-60);
                        this.imageWidth = this.imageWidth/divider;
                        this.imageHeight = this.browserHeight-60-(this.text?30:0);
                }
                if(this.imageWidth > this.browserWidth-20) {
                        var divider = this.imageWidth / (this.browserWidth-20);
                        this.imageHeight = this.imageHeight/divider;
                        this.imageWidth = this.browserWidth-20-(this.text?30:0);
                }
                this.imageTop = ((this.browserHeight-this.imageHeight)/2)+this.browserScrollTop;
                this.imageLeft = ((this.browserWidth/2)-(this.imageWidth/2));
                if (this.text) this.imageTop -= 20;
                
                this.image.setStyles({
                        'top': this.elementTop,
                        'left': this.elementLeft,
                        'width': this.elementWidth,
                        'height': this.elementHeight,
                        'z-index': '+99',
                        'display': 'inline'
                })
                document.body.appendChild(this.image);
        },
        zoom: function() {
                new Fx.Styles(this.element,'opacity').set(0.2);
                var zoomImage = new Fx.Styles(this.image,{duration:this.options.duration});
                zoomImage.start({
                        'top': [this.imageTop],
                        'left': [this.imageLeft],
                        'width': [this.imageWidth],
                        'height': [this.imageHeight]
                });
        },
        defineText: function() {
                if(this.options.text) this.text = this.options.text;
                else if(this.options.altText == "true" && this.element.alt != "") this.text = this.element.alt;
        },
        createBorder: function() {
                this.moognifyBorder = new Element('div', {
                        'styles': {
                                'position': 'absolute',
                                'z-index': '+98',
                                'opacity': '0',
                                'top': this.imageTop-10,
                                'left': this.imageLeft-10,
                                'width': this.imageWidth+(window.ie6?10:0),
                                'padding': this.imageHeight+(this.text?10:0)+'px 10px 10px 10px'
                        },
                        'class': 'moognifyBorder',
                        'id': 'moognifyBorder'
                });
                document.body.appendChild(this.moognifyBorder);
                if(this.text) this.moognifyBorder.setHTML(this.text);
                new Fx.Style(this.moognifyBorder,'opacity',{duration: this.options.borderDuration}).start(this.options.borderOpacity);
        },
        minimize: function(image,element,thisElement,options) {
//                var moognifyBorder = $("moognifyBorder");
                $('moognifyIndicator').remove();
//                moognifyBorder.remove();
                var zoomImage = new Fx.Styles(image,{duration:options.duration,onComplete: function() {
                        new Fx.Styles(element,'opacity').set(1);
                        if(thisElement) {
                                thumb = thisElement;
                        } else {
                                thumb = "";
                        }
                        (function() { image.remove() }).delay(10);
                }});
                zoomImage.start({
                        'top': [element.getPosition().y],
                        'left': [element.getPosition().x],
                        'width': [element.offsetWidth],
                        'height': [element.offsetHeight]
                });
        }
});
Moognify.implement(new Options);