brand.view.home = {
	leftoffset: 194,
    init: function() {
        var flashPlaceholder = $("main_bkg_div");
        if(generic.env.isIE6)
           var containerNode = $("homepage_flash_container");
        else
           this.containerNode = $("homepage_flash_container");
        
        // ipad version of home
        if (global.isipad) {
            this.initJSSlideshow();
            return;
        } // end: ipad version of home

        if (!flashPlaceholder) return;
        brand.view.heightHandler.pagetype = "flash_landing"; // assumes 'position: fixed' scrolling for regular home page
        var leftoffset = (generic.env.isIE6 ? 196 : 194); // IE6 Hack: leave room to add invisible borders
        // alternate type for content that needs to scroll normally
        //brand.view.heightHandler.pagetype = "flash_browser";
        
        if (generic.env.isFF) { 
            // hack: force main flash to wait for color strip to load
            brand.view.home.embedSplash.delay(0.5);
        } else {
            brand.view.home.embedSplash();

            // mimic position:fixed for ie6
            var setBottom = function() {
                var fixedFlashTest = new site.bottomFixed({
                    node: brand.view.home.containerNode,
                    bottom: 18, // height of footer
                    startingTopPosition: 0,
                    observeResize: false
                }); 
            };
            if (generic.env.isIE6 && brand.view.heightHandler.pagetype === "flash_landing") {
                setBottom.delay(1);
            }
        }
    },
    embedSplash: function() {  
        var containerNode = brand.view.home.containerNode;
        var movieId = "main_bkg";

        var params = { 
            wmode: "transparent", 
            flashvars: {
               "assetDomain" : "/flash/home_page/assets/",
               "assetsDomain" : "/flash/home_page/assets/",
               "conf_uri" : "/flash/home_page/xml/config.xml",
               "movieName" : movieId
            }
        };
        
        var attr = {
            id : movieId,
            name: movieId,
            data: "/flash/HomepageSlideshow.swf",
            bgcolor: "#000" 
        };  
      
        //generic.flash.embed(attr, params, "main_bkg_div");
        
        // check for flash embed status
        var timerCount = 0; 
        var checkFlashLoading = function() {
            timerCount++;
            // if flash embed worked, set resizing
            if ($("main_bkg")) {
                clearInterval(timer);
                // scrollable home page content        
                //site.view.sizeContainer({ container: containerNode, setHeight: true, //minimumHeight: minh, setWidth: false }); // Venomous Villains
                //Event.observe(window, "resize", function() {
                //    site.view.sizeContainer({ container: containerNode, setHeight: true, minimumHeight: minh, setWidth: false });
                //});
                
                // regular full-window slideshow
                site.view.sizeContainer({ container: containerNode, leftoffset: site.view.home.leftoffset, setWidth: true, setHeight: false });
                Event.observe(window, "resize", function() {
                    site.view.sizeContainer({ container: containerNode, leftoffset: site.view.home.leftoffset, setWidth: true, setHeight: false });
                });
            } else if (timerCount > 2) {
                // if flash embed failed, use js slideshow
                clearInterval(timer);
                brand.view.home.initJSSlideshow();
                console.log("loading hp slideshow instead of flash, timerCount");
            }  
        }
        // give flash embed JS time to modify the DOM before checking for the re-rendered html
        var timer = setInterval(checkFlashLoading, 100);
        checkFlashLoading();
        
    },
    // non-flash version of slideshow
    initJSSlideshow: function() {
        brand.view.heightHandler.pagetype = (global.isipad ? "full_window" : "image_landing");
        var overlayMessage = $("fss-overlay-container");
        var noFlashPlaceholder = $("homepage-noflash-content");
        var previousScaleState;

        var scaleSlideshow = function(slidesNode, noFlashContainer, event) {
            if (generic.env.isIE6) { // workaround for IE6 loading contents at 0
                if (generic.env.isIE6 && event === "load") {
                    var mainContentHeight = $("main_content").style.height;
                    if (mainContentHeight) mainContentHeight = parseInt(mainContentHeight, 10);
                    noFlashContainer.style.height = (mainContentHeight && (!isNaN(mainContentHeight)) ? mainContentHeight+"px" : "100%");
                } else {
                    noFlashContainer.style.height = "100%";
                }
            }
            var viewportSize = document.viewport.getDimensions();
            var viewportWidth = (viewportSize.width - site.view.home.leftoffset);
            var viewportHeight = viewportSize.height;
            var scaleState = "full-width";
            var classToRemove = "slide-images-full-height";
            if (viewportWidth < (viewportHeight * 1.5)) { // 1.5 = image w:h ratio
                classToRemove = "slide-images-full-width";
                scaleState = "full-height";
            }
            //alert("viewportWidth = "+viewportWidth+" viewportHeight = "+viewportHeight+" scaleState = "+scaleState + " previousScaleState = "+previousScaleState+" event = "+event);
            if (scaleState !== previousScaleState) {
                slidesNode.addClassName("slide-images-" + scaleState);
                slidesNode.removeClassName(classToRemove);
                //console.log("adding class "+scaleState);
            }
            previousScaleState = scaleState;
        }

        var displayContent = function() {
            var noFlashContainer = $("front-slideshow-noflash"); // html container for pc (non-ipad) version
            var slidesNode = $("front-slides");
            if (!slidesNode) return;

            if (noFlashContainer) {
                noFlashContainer.style.display = "block"; 
                var containerNode = brand.view.home.containerNode;
                if (containerNode) containerNode.style.width = "100%"; // for non-flash slideshow, set width 100% on parent container
            }        
            // init slideshow
            if (typeof Slideshow !== "undefined" && slidesNode) {

                if (slidesNode) {
                  var progress = new brand.progress({
                      containerNode: slidesNode,
                      progressNode: $('slideshow-loading')
                  });
                  progress.start();
                }

                new Slideshow('front-slides', {
                    fadeDuration: 1,
                    delay: 7,
                    pauseBeforeNext: 1, // pause before next frame loads. gives time for last frame to fade completely or partially out
                    childrenToAnimate: {
                        className: "slide-image-logo",
                        delayShow: 2.2, // amount of time (in seconds) to delay fade in after main slide fades in
                        delayHide: 2, // amount of time (in seconds) to delay fade out before main slide fades out
                        fadeDuration: 1
                    },
                    onEnd: function() {
                      if(progress) {
                        progress.clear();
                      }

                      // display fss overlay
                      if(overlayMessage) {
                        brand.overlay.launch({ foregroundNode: overlayMessage, displayInline: true, removeOnHide: false });
                      }
                    }
                    
                });
            } else {
                // display fss overlay
                if(overlayMessage) {
                  brand.overlay.launch({ foregroundNode: overlayMessage, displayInline: true, removeOnHide: false });
                }
            }
            
            // scale images for variable pc window size
            if (!global.isipad) {
                Event.observe(window, "resize", function() {
                    scaleSlideshow(slidesNode, noFlashContainer, "resize");
                });
                scaleSlideshow(slidesNode, noFlashContainer, "load");
            }
        }
        
        // check if slideshow html needs to be loaded
        if (global.isipad || $("front-slideshow-noflash")) {
            // pc/non-flash: tmpl wouldn't already be loaded if the page's default/1st choice is to use the flash
            // ipad: tmpl include already loaded via perl
            displayContent(); // go ahead and display slideshow if html is ready    
        } else if (noFlashPlaceholder) {
            // grab slideshow html (Note: deferring here avoids loading slideshow content in background if flash is in effect)
            var linkNode = $("homepage-noflash-content-path");
            var tmplPath = (linkNode ? linkNode.href : null);
            if (!tmplPath) return;
            var req = new Ajax.Request(tmplPath, {
                method:'get',
                onSuccess: function(transport) {
                    var response = transport.responseText || "no response text";
                    noFlashPlaceholder.style.display = "block";
                    noFlashPlaceholder.update(response);
                    displayContent();
                },
                onFailure: function() {
                    console.log("initJSSlideshow: Error loading " + tmplPath);
                }
            });
        }
    }
};  

brand.view.collectionBrowser = {
    init: function() {  
        //Looks Collection
        brand.view.collectionBrowser.embedLooksSwf(); 

        //Picks Collection
        brand.view.collectionBrowser.embedPicksSwf();
        
        //What's New Collections
        brand.view.collectionBrowser.embedWhatsNewSwf();
        
        brand.view.collectionBrowser.embedLooksSlideshow();
    }, 
    embedLooksSwf: function() { 
        if (!$("looks_flash")) return;
        
        var placeholderNode = $("flash_placeholder");
        if (!placeholderNode) return;
        var movieId = "looksBrowser"; 
        var params = { 
			bgcolor: "#000000",
			flashvars: {
				conf_uri: "/flash/looks/xml/" + placeholderNode.getAttribute("conf_uri") + ".xml",
				json_cat_id: placeholderNode.getAttribute("json_cat_id"),
                movieName : movieId
            } 
        };
    
        var attr = {
            id: movieId,
            name: movieId,
            data: "/flash/_looks_browser/looksBrowser.swf",
            width: 460,
            height: 370 
        };
    
        generic.flash.embed(attr, params, "flash_placeholder");
    }, 
    embedPicksSwf: function() { 
        if (!$("picks_flash")) return;

        var placeholderNode = $("flash_placeholder");
        if (!placeholderNode) return;
        var movieId = "picksBrowser";
        
		var params = {  
			bgcolor: "#000000",
			flashvars: {
				conf_uri: "/flash/picks/xml/" + placeholderNode.getAttribute("conf_uri") + ".xml",
				json_cat_id: placeholderNode.getAttribute("json_cat_id"),
				movieName: movieId
			}
        };

        var attr = {
            id: movieId,
            name: movieId,
            data: "/flash/_picks_browser/picksBrowser.swf",
            width: 460,
            height: 370
        };

		generic.flash.embed(attr, params, "flash_placeholder");
    },
    embedLooksSlideshow: function() {  
        //console.log("brand.view.collectionBrowser.embedLooksSlideShow: "+page_data.catalog.mpp.media.looks);  
        var looksContainer = $("collection_looks");
        if (!looksContainer || !page_data.catalog.mpp.media.looks) return;   
         
        var slideshow = new brand.slideshow({ 
            loop: true,
            looks: page_data.catalog.mpp.media.looks,
            slide: $("slideshow_slide"), 
            header: $("slideshow_header"),
            link: $("slideshow_link"),
            nav: { left: $("slideshow_prev"), right: $("slideshow_next")} 
        });
            
        looksContainer.removeClassName("hidden"); 
    },
    
    embedWhatsNewSwf: function() {
        //check for flash_p for cases when img instead of swf, e.g. mineralize
        var placeholderNode = $("flash_placeholder");
        if (!placeholderNode) return; 
        if (!page_data.catalog.flash_display_order) return;
        var movieId = "collectionBrowser";
              
        var params = {  
            bgcolor: "#000000",
            flashvars: {
                conf_uri: "/flash/collection_browser_example/xml/config.xml",
                json_cat_id: placeholderNode.getAttribute("json_cat_id"),
                display_order: page_data.catalog.flash_display_order.join(","),
                movieName: movieId
            }
        };

        var videoHeightAttribute = placeholderNode.getAttribute("videoHeight");
        var videoAttribute = placeholderNode.getAttribute("video");
        if (videoHeightAttribute && videoAttribute) {
            params.flashvars.videoHeight = videoHeightAttribute;
            params.flashvars.video = videoAttribute;
        }
    
        var attr = {
            id: movieId,
            name: movieId,
            data: "/flash/_collection_browser/collectionBrowser.swf",
            width: 475,
            height: 375
        };  
        
        generic.flash.embed(attr, params, "flash_placeholder"); 
    }
};
    
brand.view.productBrowser = {
	attr: {
		id : "productBrowser",
		name: "productBrowser",
		bgcolor: "#000000" 
	},
	init : function() {   
		// specify this to keep global height handler from changing height 
		brand.view.heightHandler.pagetype = "flash_browser";
        var leftoffset = 210;
        var useSizeContainer = true;
        
		var container = $("productBrowser_resize");
        if (container.hasClassName("colorPlay")) this.embedColorPlay();
        if (container.hasClassName("brushPlay")) this.embedBrushFinder();
        if (container.hasClassName("mascaraFinder")) this.embedMascaraFinder();
        
        if (container.hasClassName("foundationFinder")) {
            this.embedFoundationFinder({ container: container });
            useSizeContainer = false;
        }
        
        if (useSizeContainer) {
            brand.view.sizeContainer({ container: container, leftoffset: leftoffset });
            
            Event.observe(window, "resize", function() {
                site.view.sizeContainer({ container: container, leftoffset: leftoffset });
            }); 
        } 
	}, 
    embedColorPlay: function() {    
		var params = { 
			flashvars: {
				conf_uri : "/flash/color_play/xml/config.xml",
				colorplaysample: generic.env.query("colorplaysample") || "",
				filters: generic.env.query("filters")  || "",
				v: "20090402",
                movieName: this.attr.id
			} 
		};
		var attr = this.attr;
		attr.data = "/flash/_product_browser/productBrowser.swf"; 
        generic.flash.embed(attr, params, "flash_placeholder");  
	}, 
    embedBrushFinder: function() {   
		var params = { 
			flashvars: {
				"conf_uri" : "xml/config.xml",
                "movieName": this.attr.id
        	}
        };
		var attr = this.attr;
        attr.data = "/flash/_guide_browser/guideBrowser.swf";
        generic.flash.embed(attr, params, "flash_placeholder"); 
	}, 
	embedMascaraFinder: function() { 
		var params = { 
			wmode: "opaque", 
			flashvars: {
				"conf_uri" : "/flash/mascara_finder/xml/config_mascara.xml",
                "movieName": this.attr.id
			}
		};
		var attr = this.attr;
        attr.data = "/flash/_guide_browser/guideBrowser.swf";
        generic.flash.embed(attr, params, "flash_placeholder"); 
	}, 
    embedFoundationFinder: function(args) {
        var params = {
            allowScriptAccess: "always",
            flashvars: {
                "conf_uri" : "/flash/foundation_finder/xml/config.xml",
                "style" : 1,
                "movieName": this.attr.id
            }
        };
        var attr = this.attr;
        attr.data = "/flash/foundation_finder/foundation_finder.swf";
        generic.flash.embed(attr, params, "flash_placeholder");
        
        this.setHeight({ h: 600, container: args.container });
        Event.observe(window, "resize", function() {
            site.view.productBrowser.setHeight({ h: 600, container: args.container });
        });
    },
    setHeight: function(args) {   
        //console.log("productBrowser.setHeight args = ",args);
        //console.log("brand.view.heightHandler offset = "+brand.view.heightHandler.offset);
        try { 
            var contentHeight = args.h;
            var container = args.container;
            var containerMinHeight = args.containerMinHeight;
            var viewportHeight = document.viewport.getHeight();  
            var newHeight = (contentHeight > viewportHeight) ? contentHeight : viewportHeight;
            if (containerMinHeight) {
                newHeight = (containerMinHeight > newHeight) ? containerMinHeight : newHeight;
            }
            newHeight = (newHeight - site.view.heightHandler.offset) + "px"; 
            //console.log("productBrowser.setHeight: "+args.h + "/" + containerMinHeight +"/"+ viewportHeight + "/ " + newHeight);
            
            container.style.height = newHeight;    
        } catch(e) {
            console.log("productBrowser.setHeight e: "+e.description);
        }
    }
};

brand.view.artists = { 
    createRollOvers: function() {
        //console.log("brand.view.artists.createRollOvers");
        var last_popup;
        $$("img.artists-rollover").each( function(elem) {
            elem.observe("mouseover", function(e) {
                var popup_image = new Element("img");
                popup_image.className = "artist_pic";
                var popup_image_name = e.target.src;
                popup_image_name = popup_image_name.replace('114x114', '140x130_on');
                popup_image_name = popup_image_name.replace('jpg', 'png');
                popup_image.src = popup_image_name;
                popup_image.style.position = "absolute";
                if ( last_popup ) {
                    last_popup.style.display = "none";
                }
                popup_image.style.display = "block";
                
                // var img_coords = dojo.coords(e.target);
                var img = e.target; 
                /* 130 = height of replacement, 140 = width of replacement */
                popup_image.style.top = (img.positionedOffset().top - ((130 - img.getHeight())/2) + 2) + "px";
                popup_image.style.left = (img.positionedOffset().left - ((140 - img.getWidth())/2)) + "px";
                
                popup_image.observe("mouseout", function(e) {
                    e.target.style.display = "none";
                    e.target.parentNode.removeChild(popup_image);
                });
                
                e.target.parentNode.appendChild(popup_image);
                last_popup = popup_image;
            });
        });
    } 
};

brand.view.customPalette = {
    init: function() {
        var flashPlaceholder = $("flash_placeholder");
        if (!flashPlaceholder) return;
        brand.view.heightHandler.pagetype = "full_window_flash";

        this.embed();
    },
    embed: function() {
        var cartId = generic.env.query("CART_ID");
        var collectionId = generic.env.query("COLLECTION_ID");

        var params = {
            wmode: "transparent",
            flashvars: {
                conf_uri : "/flash/custom_palette/xml/config.xml",
                movieName : "customPalette",
                v: "20100701"
            }
        };
        if (cartId) params.flashvars.cart_id = cartId;
        if (collectionId) params.flashvars.collection_id = collectionId;

        var attr = {
            id : "customPalette",
            name: "customPalette",
            data: "/flash/custom_palette/index.swf",
            bgcolor: "#000000",
            width: "100%",
            height: "100%",
            align: "top",
            vspace: 0,
            hspace: 0
        };

        generic.flash.embed(attr, params, "flash_placeholder");
    }
};

brand.view.fromourlips = {
    init: function() {
        brand.view.heightHandler.pagetype = "flash_landing";

        // hack: force main flash to wait for color strip to load 
        if (generic.env.isFF) {
            brand.view.fromourlips.embedSplash.delay(3);
        } else {
            brand.view.fromourlips.embedSplash();
        }

    },
    embedSplash: function() {
        var params = {
            wmode: "opaque",
            flashvars: {
				"assetsDomain" : "/flash/vivaglam_201002/assets/",
				"conf_uri" : "/flash/vivaglam_201002/xml/config.xml",
                "movieName": this.attr.id
            }
        };

        var attr = {
            id : "main_bkg",
            name: "main_bkg",
            data: "/flash/vivaglam_201002/index.swf",
            bgcolor: "#FFFFFF"
        };

        generic.flash.embed(attr, params, "main_bkg_div");
    }
};


// Handle width setting for flash containers where needed
// (Height handled from site-wide brand.view.heightHandler unless specified to set height from here)
brand.view.sizeContainer = function(args) {
    var leftoffset = args.leftoffset || 190;
    var container = args.container;
    var setWidth = args.setWidth || false;
    var setHeight = args.setHeight || false;
    try {
        var viewportSize = document.viewport.getDimensions();
        if (setWidth) {
            var viewportWidth = viewportSize.width - leftoffset;
            container.style.width = viewportWidth + "px";
        }
        if (setHeight) {
            var viewportHeight = viewportSize.height;
            var minimumHeight = args.minimumHeight || 400; // arbitrary
            if (viewportHeight < minimumHeight) {
                container.style.height = "" + minimumHeight + "px";
            } else {
                container.style.height = "100%";
                $("main_content").style.height = (viewportHeight - site.view.heightHandler.offset) + "px";
            }
            //console.log("container.style.height: "+container.style.height+" $(main_content).style.height = "+$("main_content").style.height+" site.view.heightHandler.offset = "+site.view.heightHandler.offset);
        }        
    } catch(e) {
        console.log("sizeContainer e: "+e);
    }
};