// 
// Overlay Image Gallery Delegate
// 
// this is to make HTML developer's lives a bit easier, we don't want to have
// to create the rigorous HTML structure for each gallery, so we are doing
// it once for all galleries.
// 
// 
// Note:
// 
// optional title attributes to the image nav links will create captions
// 
// gallery ids should contain the string "gallery" (case inistensitve)
// if you need the custom galleryOverlayShadowImageSrc image
// 


var OverlayImageGallery = Class.create({
    galleryOverlayShadowImageSrc: false,

    initialize: function(galleryClassName, options) {
        var galleries = $$('.'+galleryClassName);
        galleries.each(this.createGallery.bind(this));

        this.options = options || {};
        if (this.options.overlayShadowImageSrc) {
            this.galleryOverlayShadowImageSrc = this.options.overlayShadowImageSrc;
        }
    },

    setOverlayDelegate: function(view, outgoing, incoming) {
        if (this.galleryOverlayShadowImageSrc) {
            var src = this.galleryOverlayShadowImageSrc;

            AC.OverlayPanel.overlay.setDelegate({
                willShow: function(overlayPanel, outgoing, incoming) {
                    if (incoming && incoming.id.match(/gallery/i)) {
                        overlayPanel.setOverlayShadowImageSrc(src);
                    }
                }
            });
        }
    },

    createGallery: function(gallery, index) {
        var gallerySwapViewId = 'GalleryOverlaySwapView'+index;
        var galleryTriggerClassName = 'GalleryOverlayThumb'+index;

        var id = gallery.id;
        gallery.id = null;

        var triggers = $$('.OverlayPanel');
        triggers.each(function(trigger) {
            if (trigger.href.match(/gallery/i)) {
                trigger.observe('click', this.setOverlayDelegate.bind(this));
            }
        }.bind(this));

        var links = gallery.select('a');
        links.each(function(link, i) {
            if (!link.href.match('#')) link.href += '#GalleryOverlayImage'+index+''+i;
            link.addClassName(galleryTriggerClassName);
        });

        var content = new Element('div', { id:id, className:'overlaygallery', style:'display:none;' });
        gallery.replace(content);

        var swap = new Element('div', { id:gallerySwapViewId });
        content.appendChild(swap);
        content.appendChild(gallery);

        var gallery = new AC.ViewMaster.Viewer(this.createGalleryContent(links), swap.id, galleryTriggerClassName, {
            initialSection:links[0].href.replace(/.*#/, ''),
            silentTriggers:true
        });
        gallery.setDelegate(this);
    },

    createGalleryContent: function(triggers) {
        var contents = [];
        triggers.each(function(trigger, i) {
            var content = new Element('div', { id:trigger.href.replace(/.*#/, '') });

            if (trigger.title) {
                var caption = new Element('p');
                caption.innerHTML = trigger.title;
                content.appendChild(caption);
            }

            content.image = trigger.href.replace(/#.*/, '');

            var image = new Element('img');
            if (i==0) image.src = content.image;
            content.appendChild(image);

            contents.push(content);
        });

        return contents;
    },

    willShow: function(view, outgoing, incoming) {
        if (incoming && incoming.id.match('GalleryOverlayImage')) {
            var image = incoming.content.down('img');
            if (image && !image.src && incoming.content.image) {
                image.src = incoming.content.image;
            }
        }
    }

});