var PRODUCT_JSON_URL = "/rpc/jsonrpc.tmpl";

document.observe("dom:loaded", function() {

    var prodkey = (CATEGORY_ID ? CATEGORY_ID + '~' + PRODUCT_ID : PRODUCT_ID);
	var params = [{
	    products : [prodkey],
	    product_fields : ["PRODUCT_ID", "DEFAULT_CAT_ID", "PARENT_CAT_ID", "PROD_RGN_NAME", "PROD_RGN_SUBHEADING", "SUB_LINE", "DESCRIPTION", "SHORT_DESC", "PROD_SKIN_TYPE", "PROD_SKIN_TYPE_TEXT", "PROD_CAT_IMAGE_NAME", "PROD_CAT_DISPLAY_ORDER", "SMALL_IMAGE", "LARGE_IMAGE", "THUMBNAIL_IMAGE", "PRODUCT_USAGE", "FORMULA", "ATTRIBUTE_COVERAGE", "ATTRIBUTE_BENEFIT", "SKIN_CONCERN_LABEL", "SKIN_CONCERN_1", "SKIN_CONCERN_2", "SKIN_CONCERN_3", "skus", "shaded", "sized", "worksWith"],
		sku_fields : ["SKU_ID", "SKU_BASE_ID", "PRODUCT_ID", "SHADENAME", "SHADE_DESCRIPTION", "SKIN_TYPE", "SKIN_TYPE_TEXT", "PRODUCT_SIZE", "DISPLAY_ORDER", "STRENGTH", "PRICE", "formattedPrice", "formattedTaxedPrice", "SMOOSH_DESIGN", "SMOOSH_PATH_STRING", "INVENTORY_STATUS", "REFILLABLE", "HEX_VALUE", "HEX_VALUE_STRING", "FINISH", "ATTRIBUTE_COLOR_FAMILY", "UNDERTONE", "SKIN_TONE", "SKIN_TONE_TEXT" ]
	}];

    productPage.data = new CatProdPageData(params, false, function() {
        //
        // global CatProdData object is used by the cart object
        // so we better cram some data in there
        mergeIntoGlobalCatProdData(productPage.data);
        productPage.spp.init();
        productPage.spp.recommendWidget.init(productPage.data.product);
    });
});

productPage.spp = function() {
    var recommendContainerID = 'recommend_accordion';
    return {
        init: function() {
            var args = {
                containerID     : "fc-col-1",
                productData     : productPage.data.product
            };
            args.viewContainerID = 'spp-productview';

            if (foundationResults && Object.isArray(foundationResults) && foundationResults.length >0) {
                args.shadeRangeSkuIDs = foundationResults;
                productPage.inlineProductView = new productPage.ProductView.ShadeRange(args);
            } else {
                productPage.inlineProductView = new productPage.ProductView.Inline(args);
            }
            productPage.inlineProductView.setDetailContainerID('detail-container').build();
        },
        recommendWidget : {
            accordionWidget : null,
            accordions : [],
            init : function(productData) {
                var self = this;
                
                this.accordions.push({
                    containerNode : $('works_well_container'),
                    wrapperID     : "works_well_wrapper",
                    headerNode    : $('works_well_header'),
                    hasProducts   : false,
                    productArray  : $A(
                        [productData.worksWith[0],
                         productData.worksWith[1],
                         productData.worksWith[2]]).select(function(item){
                            return !!item;
                    })
                });
                
                this.accordions.push({
                    containerNode : $('similar_container'),
                    wrapperID     : "similar_wrapper",
                    headerNode    : $('similar_header'),
                    hasProducts   : false,                    
                    productArray  : $A(
                        [productData.worksWith[3],
                         productData.worksWith[4],
                         productData.worksWith[5]]).select(function(item){
                            return !!item;
                    })
                });

                this.accordionHeaders = $$('#recommend_accordion .accordion_toggle');
                var callbackFnIndex = 0
                var callbackFn = function(acc) {
                    callbackFnIndex++;
                    if (!acc.hasProducts) { // if this accordion does not have any product thumbs
                        // hide the containerNode & headerNode
                        acc.headerNode.style.display = "none";
                        acc.containerNode.style.display = "none";
                    }
                    // If this is the last time the callback is called
                    if (callbackFnIndex === self.accordions.length) {
                        // If the "Works Well" accordion contains products
                        if (self.accordions[0].hasProducts) {
                            // activate the Works Well accordion
                            self.accordionWidget.activate(self.accordions[0].headerNode);
                            
                        // else if the "Similar Products" accordion contains products
                        } else if (self.accordions[1].hasProducts) {
                            // activate the "Similar Products" accordion
                            self.accordionWidget.activate(self.accordions[1].headerNode);
                        // else if neither contains products
                        } else {
                            // hide the whole she-bang
                            $(recommendContainerID).style.display = "none";
                        }
                    }
                };
                this.accordions.each(function(acc) {
                    self.buildPane(acc, callbackFn);
                });
                this.accordionWidget = new Accordion(recommendContainerID);
            },
            
            buildPane: function (args, callbackFn) {
                var self = this;
                if (args.productArray.length < 1) {
                    callbackFn(args); // callback if no products in accordion
                } else {
                	// Load up the data.
                	// When it comes back, create the minithumbs
                	productPage.loadProductData({
                		productIDs: args.productArray,
                		callback: function(productData) {
                			// Pull out the products we want to work with.
                			var prods = productData.data.get('products').findAll(function(product){
               					// Do we have any skus in this product?
                                var match = ( product.skus && product.skus.length > 0 &&
                                				product.skus.find(function(s){ return Object.isNumber(s.INVENTORY_STATUS) && s.INVENTORY_STATUS < 3;})
                                				? true : false );
                            	
                            	return match;
                			});
                			
                			args.containerNode.update('');
                			
                			// If we have some products, build the table
                			if ( prods.length > 0 ) {
                				args.hasProducts = true;
                				args.prodTable = new productPage.miniThumbTable({
                					containerID: args.containerNode,
	        						maxItems: prods.length,
	        						startIndex: 0,
	        						cellsPerRow: 1,
	        						mode: 0,
	        						tableData: prods
                				});
                			}
                			
                			// Do the final callback
                			callbackFn(args); 
                		}
                	});
                	
                }
            }
        }
    };
}();