 
brand.globalnav.Detail = Class.create(Widget, 
{
    // summary:
    //      Most detailed level in heirarchy: includes description, thumbnail & url      
    //templatePath: "/js/brand/globalnav/templates/Detail.html",
    templatePath: "jsTemplates.globalnav.Detail",
    //templateType: "detail",    

    //simpleDetailPath: "/js/brand/globalnav/templates/SimpleDetail.html",
    simpleDetailPath: "jsTemplates.globalnav.SimpleDetail",
    
    // parentId: String
    // PanelSubnav/ProductCategorySubnav widget parent
    parentId: null,
    
    // displayName: String
    displayName: "",
    
    // hdPath: String
    // header img src
    hdPath: "",
     
    // thumbPath: String
    // thumbnail img src
    thumbPath: "",

    // thumbRolloverPath: String (optional)
    // thumbnail rollover img src
    thumbRolloverPath: null,
    
    // description: String
    description: "",
    
    // url: String
    // template href value
    url: "",
    
    // isdefault: Boolean
    // flagged true if item is default item (i.e. product item corresponding w/ current spp)
    isdefault: false,
    
    // isInDefaultCategory: Boolean
    // flagged true if item is within default category
    isInDefaultCategory: false,

    // baseClass: String (optional)
    // supplemental css class, ex: panelnav_link_category   
    baseClass: "", 

    initialize: function($super, properties) { 
        this.setProperties(properties);
        //console.log("Detail.init "+this.id); 
        
        if (this.template) {
            var t = this.template;
            if (t.detail) {
                var type = t.detail.type;
                if (type) { this.templatePath = type; }
                var baseClass = t.detail.baseClass;
                if (baseClass) { this.baseClass = baseClass; }
                var hstates = t.detail.headerStates;
                if (hstates) { this.hdStates = hstates; }
            }
        }
          
        $super();
    },
    
    postCreate: function() { 
       //console.log("Detail.postCreate "+ this.id + " / " + $(this.id)); 
           
       // header image 
       this.hdNode = $(this.id + "_hd");
       //console.log("Detail.postCreate this.isInDefaultCategory "+this.isInDefaultCategory+" "+this.isdefault);
        if (this.isInDefaultCategory) {         
            if (this.isdefault) { 
                this.setDefaultState();
            } else {
               //this.offImg = "sel"; // exception for "dimmed" style: "sel" state used for off state of hdImg
                this.setDefaultCategoryState();
            }
        }
     
        // thumbnail rollover
        var thumbImg = $(this.id + "_thumb");
        if (this.thumbRolloverPath && thumbImg) {
            this.thumbImg = thumbImg;
            var preload = new Image();
            preload.src = this.thumbRolloverPath; 
        }
        
    },
        
    _onMouseOver: function(e) { 
        if (this.thumbImg) {
            this.thumbImg.src = this.thumbRolloverPath;
        }
         
        this.domNode.addClassName("panelnav_link_on"); 
        this.domNode.select("H3")[0].addClassName("sprite-on"); 
    },
    
    _onMouseOut: function(e) { 
        if (this.thumbImg) {
            this.thumbImg.src = this.thumbPath;
        }
        
        this.domNode.removeClassName("panelnav_link_on"); 
        this.domNode.select("H3")[0].removeClassName("sprite-on");
    },
    
    _onClick: function(e) {
    	//console.log("Detail._onClick "+this.domParent );  
        // workaround for ie: use location prop as back-up for href
        if (this.url && generic.env.isIE) {
            location.href = this.url;
        }
    },
    
    setDefaultState: function() {
        //console.log("Detail.setDefaultState "+this.id+"/"+$(this.id));  
        this.domNode.addClassName("panelnav_default");
        
        // if url matches current page, remove link
        var loc = window.location.pathname;
        if (loc.indexOf(this.url) > -1) { 
            $(this.id).removeAttribute("href");
            this._onClick = function() { };
            $(this.id).addClassName("unclickable");
        } 
    },
    
    setDefaultCategoryState: function() {
        // displays "dimmed" state for detail items in same category as default item
        if (this.hdImg) {
            //this.hdImg.changeSrc(this.offImg);
        }
    }
});
 
brand.globalnav.ProductCategoryDetail = Class.create( brand.globalnav.Detail,
{
    // summary:
    //      Category detail-level of heirarchy:
    //      Includes details of category item, but is not the final level in nav heirarchy.
    //      onClick event triggers display of category list (Accordion).
    //
    //      Receives id args for widget parent ProductSubNav (parentId) & DOM parent (containerId)
    //      Refers to parent class method(s) for talking back up the heirarchy chain
    //      Uses container for placement in DOM only
    //
    //      Receives id arg for cousin Accordion to pass to parent.openAccorion
    
    //templatePath: "/js/brand/globalnav/templates/ProductCategoryDetail.html",
    templatePath: "jsTemplates.globalnav.ProductCategoryDetail",
    
    // containerNode: DOM node
    // container for CategoryDetail item
    containerNode: null,
    
    // accordionId: String
    // Accordion widget id
    accordionId: null,
    
    initialize: function($super, properties) { 
    	//console.log("Detail.ProductCategoryDetail.init");
    	if (this.containerNode) { //JSTEST ??
              this.domParent = this.containerNode; 
          }  
          $super(properties);  
    },

    startup: function() {  
        //console.log("Detail.ProductCategoryDetail.startup");
        //$super();
    },
    
    _onClick: function(e) {
       //console.log("ProductCategoryDetail._onClick: "+this.domParent ); 
        // hide category detail
        this.containerNode.style.display = "none";
        // show accordion
        $(this.parentId).widget.getAccordion(this.accordionId);
    }
    
});

brand.globalnav.CollectionCategoryDetail = Class.create( brand.globalnav.ProductCategoryDetail,  
{
    
    //templatePath: "/js/brand/globalnav/templates/CollectionCategoryDetail.html", 
    templatePath: "jsTemplates.globalnav.CollectionCategoryDetail",
        
    isContainer: true,

    startup: function($super, arguments) {
        this.containerNode = $(this.parentId);
        this.accordionId = this.id+"_accordion";
        $super(arguments);
        this.parent = $(this.parentId).widget;
    },
    
    _onClick: function(e) {
        //console.log("CollectionCategoryDetail._onClick: "+this.categoryDetailNode.id); 
        // hide category detail
        this.categoryDetailNode.style.display = "none";
        // show accordion
        this.parent.getAccordion(this.accordionId);
    },
    
    onChildClick: function(/* String */sectionId) {
        //this.parent.onChildClick();
    }
    
});

brand.globalnav.SearchProductDetail = Class.create(brand.globalnav.Detail, 
{ 
    //templatePath: "/js/brand/globalnav/templates/SearchProductDetail.html", 
    templatePath: "jsTemplates.globalnav.SearchProductDetail",
        
    hex: "",
    actionImg: null,
    
    initialize: function($super, arguments) {
       //console.log("brand.globalnav.SearchProductDetail init"); 
       $super(arguments); 
    },
    startup: function($super, arguments) {
         //console.log("brand.globalnav.SearchProductDetail.startup");  
          
        //$super(arguments); 
        //this.actionImg = new generic.img(this.actionImgNode, ["off","on"]);
    },
    
    _onMouseOver: function($super, e) {
        $super(e);
        /**if (this.actionImg) {
            this.actionImg.changeSrc("on");
        }**/
    },
    
    _onMouseOut: function($super, e) {
        $super(e);
         /**if (this.actionImg) {
            this.actionImg.changeSrc("off");
        }**/
    },
    
    reset: function() {
       this.destroy();
    }
 
});


brand.globalnav.SearchQuickBuyDetail = Class.create(brand.globalnav.Detail, 
{
    
    //templatePath: "/js/brand/globalnav/templates/SearchQuickBuyDetail.html", 
    templatePath: "jsTemplates.globalnav.SearchQuickBuyDetail",
        
    isContainer: true,
    product: null,
    hex: "",
    skupath: "",
    cartConfirmMsg: null,
    shadedResult: false,
    shaded: false,

    initialize: function($super, arguments) {
        $super(arguments);
    },
    postCreate: function() {
        this.shadedResult = (this.product.shade_result ? true : false),
        this.skupath = this.product.sku.path;
        this.shaded = (this.product.shaded ? true : false);  
    },
    
    startup: function($super, arguments) {
        console.log("brand.globalnav.SearchQuickBuyDetail.startup "+this.shadenameNode + "/" + this.descriptionNode);
        //$super(arguments);
 
        if ( this.shadedResult ) {
            this.shadenameNode.removeClassName("hidden");
        } else {
            this.descriptionNode.removeClassName("hidden");
        }
        
        this._initCartAction();
    },
    
    _initCartAction: function() {
        var shoppable = (this.product.sku.shoppable === "1" ? true : false);
        var self = this;
                
        if ( shoppable ) {
            console.log("brand.globalnav.SearchQuickBuyDetail._initCartAction shoppable");
            this.cartConfirmMsg = new brand.product.CartConfirm({
                id: "search_cart_confirm-" + this.skupath,
                is_shaded: this.shaded,
                prodName: this.displayName,
                sku: this.product.sku,
                nodeToReplace: this.cartConfirmNode
            });
            
            console.log("brand.globalnav.SearchQuickBuyDetail._initCartAction shoppable");
            // add to cart button 
            var btnNode = $(this.id + "_btn_add");
            btnNode.value = this.skupath;
            var button = new brand.product.productButton({
                node: btnNode,
                callback: function(resp) {
                    // TODO: get these from page_data
                    /*
                    cartConfirmMsg.setDisplayProperties({
                        type: "order",
                        addedMessage: "was added to your shopping bag.",
                        itemCountCopy: "items in bag",
                        itemCountCopySingular: "item in bag"
                    });
                    */
                    self.cartConfirmMsg.show(resp);
                }
            });
        
        } else {
            console.log("brand.globalnav.SearchQuickBuyDetail._initCartAction !shoppable");
            var btn = $(this.id + "_btn_add");
            if (btn) {
                btn.style.display = "none";
            }
            this.inventoryStatusNode.innerHTML = this.product.sku.inventory_status_message;
            this.inventoryStatusNode.style.display = "block";
        }
    },
    
    reset: function() {
        if (this.cartConfirmMsg) {
            this.cartConfirmMsg.destroy();
        }
        this.destroy();
    }
     
});

/**
JSTEST: not tested 
brand.globalnav.DiscontinuedProductDetail = Class.create( 
    brand.globalnav.Detail,
{
    
    //templatePath: "/js/brand/globalnav/templates/DiscontinuedProductDetail.html", 
    templatePath: "jsTemplatss.globalnav.DiscontinuedProductDetail",
        
    sku: null,
    hex: "",
    shadename: "",
    shadedResult: false,

    initialize: function($super, properties) { 
        $super(properties); //calls Detail.postMixInProperties  
        
        if ( this.shadedResult ) {
            this.hex = this.sku.color[0];
            this.shadename = this.sku.shade_name;
            this.url += "&SKU_ID=" + this.sku.sku_id;           
        }    
    },   
    
    startup: function($super, arguments) {
        $super(arguments);
        
        if ( this.shadedResult ) {
            this.shadenameNode.removeClassName("hidden");
        }       
    },
    
    reset: function() {
        this.destroy();
    } 
});
**/