window.addEvent("domready", function () {
    $each($$(".product_list"), function (containerDiv) {
        containerDiv.addEvents({
            'mouseenter': function() {                
                var divDetail = this.getElement(".product_list_container").getElement("div");
                divDetail.set("class", "product_list_detail_div_show");
                this.set("class", "product_list_over");
                if (!this.getElement(".hfimgpin")){
                    return;
                }
                var url = this.getElement(".hfimgpin").value;
                var html = "<div><img src='" + url + "' ></div>";
                
                var itemIndex = this.get("ItemIndex");                
                if((itemIndex%4) < 1) {                 
                    $("hoverImageRight").set("html", html);
                    
                } else {
                    $("hoverImageLeft").set("html", html);                    
                }
            }.bind(containerDiv),
        'mouseleave': function() {
                var divDetail = this.getElement(".product_list_container").getElement("div");
                divDetail.set("class", "product_list_detail_div_hide");
                this.set("class", "product_list");

                var itemIndex = this.get("ItemIndex");
                if((itemIndex%4) < 1) {
                    $("hoverImageRight").set("html", "");
                } else {
                    $("hoverImageLeft").set("html", "");
                }                                
            }.bind(containerDiv)
        });        
    });

    window.scrollTo(0,0);
    $("hoverImageLeft").pin();    
    $("hoverImageRight").pin(); 
});