/** 
 * Creates the slideshow / gallery for the collection pages
 * 
 * @module      CollectionGallery
 * @author      Preet Jassi
 * @file collection.js 
 * @copyright   (c) 2011 Indochino Apparel Inc. 
 */
    
indo.Util.register('indo-collectiongallery', function(Y){

    /**
    * Gallery for the collection pages
    * @module CollectionGallery
    */
    var CollectionGallery = (function(){
                   
            //constnats
        var IMAGE_COLLAPSED_HEIGHT = 400,
            IMAGE_HEIGHT = 800,
            IMAGE_WIDTH = 1600,
            ANIMATION_TIME = 0.6;

        
        return {
            
            /**
            * @type {Y.Node}
            * @property splash
            */
            
            /**
            * @type {Y.Node}
            * @property gallery
            */
            
            /**
            * @type {Y.NodeList}
            * @property items
            */
            
            /**
            * @type {object}
            * @property eventMap
            */
            
            /**
            * @type {Boolean}
            * @property expanded
            */
            expanded: false,
                    
            
            /* -------------------------------------------------------  */
            /*                                                          */
            /*                  Core Methods                            */
            /*                                                          */
            /* -------------------------------------------------------- */
    
            /**
            * Initializes DOM references
            * @return {void}
            * @method init
            */
            init: function() {

                //get dom references
                this.splash = Y.one('#collection-splash');
                this.gallery = Y.one('#collection-splash .collection-gallery');
                this.items = Y.all('#collection-splash .collection-gallery-item');

                //set the event map
                this.initEvents();
                    
            },
            
            /**
            * Sets the className to callback event mapping.
            * @return {void}
            * @method initEvents
            */
            initEvents: function() {

                this.eventMap = {
                    'gallery-trigger': this.expandGallery,
                    'free-shipping-trigger': this.showShippingDialog,
                    'custom-tailored-trigger': this.showTailoredDialog
                };

            },
            
            /**
            * Didn't yo momma teach you to clean up after yoself?
            * @return {void}
            * @method destruct
            */
            destruct: function() {                    
                
                this.splash =
                this.gallery =
                this.items = null;
                
            },
            
            /**
            * Single click handler
            * @param {Y.Event} e
            * @return {void}
            * @method onviewevent
            */
            onviewevent: function(e) {
              
                var targ = e.target,
                    classes = targ.get('className').split(' '),
                    length = classes.length;

                //determine callback function dependant upon the classname of the target
                while (length--) {
                    if (this.eventMap[classes[length]]) {
                        this.eventMap[classes[length]].call(this, e);
                        e.preventDefault();
                        return false;
                    }
                }
                                  
            },
            
            /**
            * Ensures that the image is centered on resize
            * @return {void}
            * @method onResize
            */
            onresizeevent: function() {
            
                if (this.expanded) {
                    Y.fire('collection-gallery:onresize');
                }

            },
            
            
            /* -------------------------------------------------------  */
            /*                                                          */
            /*                  Event Handlers                          */
            /*                                                          */
            /* -------------------------------------------------------- */
            
            
            /**
            * Opens up the gallery when you click on the tigger
            * @return {void}
            * @method expandGallery
            */
            expandGallery: function() {

                if (!this.expanded) {
                    
                    var myAnim = new Y.Anim({
                            node: Y.UA.webkit ? 'body' : 'html',
                            to: {
                                scrollTop: this.splash.get('offsetTop')
                            },
                            duration: ANIMATION_TIME
                        });
                    
                    //have to do the rest of the transitions at the end because doing both
                    //at the same time is jannnky
                    myAnim.on('end', function(){
                        
                        this.gallery.transition({
                            height: IMAGE_HEIGHT + 'px',
                            duration: ANIMATION_TIME
                        }, Y.bind(this.expandComplete, this));

                        this.gallery.one('.collection-splash-cta').hide('fadeOut', {
                            duration: ANIMATION_TIME
                        });
                        
                    }, this);
                    
                    myAnim.run();
                    this.expanded = true;
                    
                    Y.fire('collection-gallery:onexpand');

                }

            },
            
            /**
            * Callback after the animation has completed, reveal the buttons,
            * and load the images for the gallery
            * @return {void}
            * @method expandComplete
            */
            expandComplete: function() {

                Y.fire('collection-gallery:onexpandcomplete');
                
                //have to unbind the click handler so that when you click on the 
                //buttons it doesn't try and expand the gallery everytime
                this.splash.addClass('expanded');

            },
            
            
            /**
             * Collapses the gallery to the initial height
             * @return {void}
             * @method collapseGallery
             */
             collapseGallery: function() {

                 if (this.expanded) {

                     this.gallery.transition({
                         height: IMAGE_COLLAPSED_HEIGHT + 'px',
                         duration: ANIMATION_TIME 
                     }, Y.bind(this.collapseComplete, this));

                     this.gallery.one('.collection-splash-description').hide('fadeOut', {
                         duration: ANIMATION_TIME
                     });

                     this.expanded = false;

                     Y.fire('collection-gallery:oncollapse');

                 }

             },

             /**
             * Hides the buttons and resets the styles
             * @return {void}
             * @method collapseComplete
             */
             collapseComplete: function() {

                 //we removed the click handler so add it back again
                 this.splash.removeClass('expanded');

                 this.gallery.one('.collection-splash-cta').show('fadeIn', {
                     duration: ANIMATION_TIME
                 });

                 this.gallery.setStyle('width', 'auto');
                 this.gallery.setStyle('margin', '0');

                 Y.fire('collection-gallery:oncollapsecomplete')

             },

            
            /**
            * Show the Shipping Dialog
            * @return {void}
            * @method showShippingDialog
            */
            showShippingDialog: function() {
                
                indo.Util.showDialog( indo.Util.getContextString('shipping') );
                indo.Util.resizeDialog('660px');
                
            },
            
            /**
            * Show the Custom Tailored Dialog
            * @return {void}
            * @method showTailoredDialog
            */
            showTailoredDialog: function() {
                
                indo.Util.showDialog( indo.Util.getContextString('custom_tailored') );
                indo.Util.addDialogClass('dialog-custom-tailored');
                indo.Util.resizeDialog('660px');
                
            }
            
        };
        
        
    }());
    
    //constructor - subscribe to events
    Y.on('util:init', CollectionGallery.init, CollectionGallery);
    Y.on('util:destruct', CollectionGallery.destruct, CollectionGallery);
    Y.on('util:onviewevent', CollectionGallery.onviewevent, CollectionGallery);
    Y.on('util:onresizeevent', CollectionGallery.onresizeevent, CollectionGallery);
    
    //listen for the collapse event
    Y.on('collection-gallery:collapsegallery', CollectionGallery.collapseGallery, CollectionGallery);
        
}, '0.0.1', {requires:['transition', 'anim']});