var myIwindow;



var Iwindow = new Class({
    Implements: [Events, Options],

    options: {
        overlayId: "iOverlay",
        wrapperId: "iWrap",
        frameId: "winFrame",
        closeId: "iClose",
        openId: "iProceed",

        selector: "a[rel^=iwindow]",

        iwinTarget: "document.body",

        opacity: 0.75,

        yOffset: 85,
        yPad: 100,
        rightOffset: 0,
        leftOffset: 0,

        loaderId: "iLoader",
        loaderHTML: "<p>Loading</p>"
    },

    frameHeight: 0,

    initialize: function(opts) {
        if (opts && $type(opts) == "object") this.setOptions(opts)

        this.build()
        this.findElements()
    },

    build: function() {
        var itarget = $(this.options.iwinTarget) || $(document.body)

        this.overlay = new Element('div', { id: this.options.overlayId }).hide()/*.addEvent("click", function() { this.hide()}.bind(this))*/.set("opacity", this.options.opacity).inject(itarget, "bottom")
        this.wrap = new Element('div', { id: this.options.wrapperId }).hide().inject(itarget, "bottom")
        this.iframe = new Element('iframe', { id: this.options.frameId, scrolling: "no", src: 'javascript:void(0);', frameborder: 0 }).hide().inject(this.wrap).addEvent("load", function() { this.frameLoaded() } .bind(this))

        this.proceedBtn = new Element('div', { id: this.options.openId })
		.adopt(new Element('iframe', { frameborder: 0, scrolling: "no" }).set('opacity', 0))
		.adopt(new Element('a', { "class": "openTxt", html: "Yes" }))
		.addEvent("click", function() { window.open("http://www.niaspanpro.com") } .bind(this))
		.addEvent("click", function() { this.hide() } .bind(this))
		.inject(this.wrap, "bottom")

        this.closeBtn = new Element('div', { id: this.options.closeId })
		.adopt(new Element('iframe', { frameborder: 0, scrolling: "no" }).set('opacity', 0))
		.adopt(new Element('div', { "class": "closeTxt", html: "No" }))
		.addEvent("click", function() { this.hide() } .bind(this))
		.inject(this.wrap, "bottom")
		

        this.loader = new Element('div', { id: this.options.loaderId, html: this.options.loaderHTML }).hide().inject(itarget, "bottom")

        this.scrollFx = new Fx.Scroll($(document.body))
        this.frameFx = new Fx.Tween(this.iframe, { property: "height" })
    },
    


    show: function(el) {
        this.bodyScroll = window.getScrollSize()
        this.scrollFx.toTop()

        this.toggleLoading(true)
        this.iframe.set('src', el.retrieve('iLink'))

        this.toggleOverlay(true)
    },

    hide: function() {
        var reqConfirm = false;
        try {
            reqConfirm = this.iframe.contentWindow.requiresConfirm()
        } catch (e) { }

        if (reqConfirm) {
            var confirmClose = confirm("Are you sure? All of your information will be lost.")
            if (!confirmClose) return
        }

        this.toggleOverlay()
        this.wrap.hide()
        this.iframe.hide()
        this.toggleLoading()

        this.iframe.set('src', 'javascript:void(0);').setStyle("height", "")
    },

    findElements: function() {
        var items = $$(this.options.selector)

        items.each(function(el, i) {
            el.store('iLink', el.get('href'))
            el.store('iIndex', i)

            el.set({
                href: "javascript:void(0);",
                target: ""
            })

            el.addEvent("click", function() { this.show(el) } .bind(this))
        }, this)
    },

    toggleLoading: function(bool) {
        var display = (bool) ? "show" : "hide"
        var fn = (bool) ? "addEvent" : "removeEvent"

        var centerLoading = function() {
            var win = window.getSize()
            var loader = this.loader.getSize()

            var styles = {}
            styles.top = ((win.y / 2) - (loader.y / 2)).toInt() + 'px'
            styles.left = ((win.x / 2) - (loader.x / 2)).toInt() + 'px'

            this.loader.setStyles(styles)

        } .bind(this)

        this.loader[display]()
        window[fn]("resize", centerLoading)
        window[fn]("scroll", centerLoading)

        centerLoading()
    },

    toggleOverlay: function(bool) {
        var fn = (bool) ? "addEvent" : "removeEvent"
        var display = (bool) ? "show" : "hide"

        window[fn]("resize", this.resizeOverlay.bind(this))
        window[fn]("scroll", this.resizeOverlay.bind(this))

        this.overlay[display]()

        this.resizeOverlay()
    },

    resizeOverlay: function() {
        var win = window.getSize()
        var scroll = window.getScrollSize()
        var wrap = this.wrap.getStyle("width").toInt()

        this.wrap.setStyles({
            top: this.options.yOffset,
            left: ((win.x / 2) - (wrap / 2)).toInt() + this.options.rightOffset - this.options.leftOffset + 'px'
        })

        var opt1 = this.bodyScroll.y + this.options.yPad
        var opt2 = this.options.yOffset + this.options.yPad + this.frameHeight

        var overHeight = (opt1 >= opt2) ? opt1 + 'px' : opt2 + 'px'

        this.overlay.setStyle('height', overHeight)
    },

    frameLoaded: function() {
        var src = this.iframe.get("src")
        //iframe will fire load event when instantiated, make sure it has a URL
        if (!src || src.length == 0 || src == "javascript:void(0);") return

        this.scrollFx.toTop()

        this.wrap.show()
        this.iframe.show()
        this.toggleLoading()

        //try and call frame method that returns height
        try {
            this.frameHeight = this.iframe.contentWindow.returnFrameHeight()//.getScrollSize().y
            this.frameFx.start(this.frameHeight).chain(function() { this.resizeOverlay() } .bind(this))

        }
        catch (e) { }

    }


});



window.addEvent('domready', function() {
	myIwindow = new Iwindow({leftOffset: 7})
})