var FBF = window.FBF || {};

FBF.AdvPopup = function() {
    var container,
      contentTemplate,
      clicked,
      defaultItem = false,
      imageGroups = $H(),
      groupIndex,
      itemDataContainer,
      overlayPanelInnerFg,
      items,
      options,
      overlay,
      overlayPanel,
      overlayPanelInner,
      overlayPanelInnerFg,
      overlayPanelAccept,
      overlayPanelCheckboxDiv,
      overlayPanelCheckbox,
      overlayPanelHeader,
      nextButton,
      nextImageDims = { height: 0, width: 0 },
      numInGroup,
      ph,
      prevButton,
      pv,
      viewportDims,
      videoGroups = $H(),
      visible;

    function build() {
        overlay = new Element('div', { 'id': 'overlay' }).setStyle({
            opacity: options.overlayOpacity
        }).hide();

        Element.insert(document.body, overlay);
        overlayPanel = new Element('div', { 'id': 'overlay-panel' }).addClassName('adv-popup').hide();

        overlayPanelAccept = new Element('a').addClassName('button').update('Continue').addClassName('disabled');
        overlayPanelAccept.writeAttribute('title', 'I am a financial adviser.');

        overlayPanelHeader = new Element('div').addClassName('header').update('<span>Financial Adviser Verification</span>');



        overlayPanelCheckbox = new Element('input');
        overlayPanelCheckbox.writeAttribute('type', 'checkbox');
        overlayPanelCheckboxDiv = new Element('div').addClassName('adv-checkbox');
        overlayPanelCheckboxDiv.insert(overlayPanelCheckbox);
        overlayPanelCheckboxDiv.insert('I am a financial adviser.');




        overlayPanelInner = new Element('div', { 'id': 'overlay-panel-inner' }).update(options.lightboxHtml);
        overlayPanel.insert(overlayPanelInner);

        Element.insert(document.body, overlayPanel);

        overlayPanelInnerFg = overlayPanelInner.down('div.fg');
        ph = parseInt(overlayPanelInnerFg.getStyle('paddingLeft'), 10) + parseInt(overlayPanelInnerFg.getStyle('paddingRight'), 10);
        pv = parseInt(overlayPanelInnerFg.getStyle('paddingTop'), 10) + parseInt(overlayPanelInnerFg.getStyle('paddingBottom'), 10);

        contentTemplate = new Template(options.lightboxHtml);

        items = container.select('a.lightbox');

        itemDataContainer = new Element('div').addClassName('item-data');
        itemDataContainer.insert(overlayPanelCheckboxDiv);
        itemDataContainer.insert(overlayPanelAccept);

        overlayPanel.insert(itemDataContainer);

        Event.observe(document.body, 'click', onClick);

        if (defaultItem) {
            viewportDims = document.viewport.getDimensions();
            var attrs = {
                href: defaultItem.href,
                title: defaultItem.title,
                id: defaultItem.id,
                rel: 'image'
            };

            clicked = new Element('a', attrs).addClassName('lightbox').update('<span class="credit">' + defaultItem.credit + '</span>').hide();
            Element.insert(document.body, clicked);

            showLightbox();
        }
    }

    function getDocHeight() {
        var D = document;
        return Math.max(
      Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
      Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
      Math.max(D.body.clientHeight, D.documentElement.clientHeight)
    );
    }

    function hideLightbox() {
        visible = false;
        overlay.hide()
        overlayPanelInnerFg.update(""); // clear out lightbox contents
        overlayPanel.hide();
    }

    function loadInlineContent(contentId) {
        var theContent = $(contentId);
        var contentLayout = theContent.getLayout();

        var panelWidth = contentLayout.get('padding-box-width');
        var panelHeight = contentLayout.get('padding-box-height');

        inlineContentWrapper = new Element('div').addClassName('inline-content-wrapper')
        inlineContentWrapper.update();
        inlineContentWrapper.insert(overlayPanelHeader);
        inlineContentWrapper.insert(theContent.innerHTML);
        overlayPanelInnerFg.update(inlineContentWrapper);
        inlineContentWrapper.insert(overlayPanelCheckboxDiv);
        inlineContentWrapper.insert(overlayPanelAccept);


        var _ph = parseInt(inlineContentWrapper.getStyle('paddingRight'), 10) + parseInt(inlineContentWrapper.getStyle('paddingLeft'), 10);
        var _pv = parseInt(inlineContentWrapper.getStyle('paddingTop'), 10) + parseInt(inlineContentWrapper.getStyle('paddingBottom'), 10);

        var panelTop = document.viewport.getScrollOffsets().top + (viewportDims.height / 2) - (panelHeight / 2);

        overlayPanel.setStyle({
            height: (panelHeight + _pv) + 'px',
            marginLeft: -((panelWidth + _ph) / 2) + 'px',
            top: Math.round(Math.max((document.viewport.getScrollOffsets().top + 10), panelTop)) + 'px',
            width: (panelWidth + _ph) + 'px'
        });
    }

    function startLightbox(contentId) {
        viewportDims = document.viewport.getDimensions();
        loadInlineContent(contentId);
        showLightbox();
    }
    function onClick(e) {
        if (e.target == overlayPanelCheckbox) {
            if (overlayPanelCheckbox.checked) {
                overlayPanelAccept.removeClassName('disabled');
            }
            else {
                overlayPanelAccept.addClassName('disabled');
            }
        }
        else if (e.target == overlayPanelAccept) {
            if (overlayPanelCheckbox.checked) {
                e.stop();
                clicked = e.target;
                hideLightbox();
                createCookie('advisor_verification', 'yes', 9999);
            }
        }
    }

    function showLightbox() {
        visible = true;

        overlay.setStyle({
            height: getDocHeight() + 'px',
            width: viewportDims.width + 'px'
        });

        overlay.show()
        overlayPanel.show();
    }

    function updateItemData(width) {
        itemDataContainer.setStyle({
            width: width + 'px'
        });
    }

    return {
        initialize: function(element, _options) {
            options = Object.extend({
                lightboxHtml: '<div class="fg"></div><div class="bg"></div>',
                overlayOpacity: 0.5
            }, _options || {});

            container = $(element);

            if (typeof window.defaultItem != 'undefined') {
                defaultItem = window.defaultItem;
            }

            build();

            var isCookie = readCookie('advisor_verification');
            if (isCookie != 'yes') {
                startLightbox(element);
            }
        }
    }
} ();