/// <reference path="../jquery.js" />

jQuery.noConflict();

var variation_register = {
    raw_json: null,
    color_array: null,
    size_array: null,
    cartEnable: false,
    selected_color: null,
    selected_size: null,
    isUseColor: false, // variation_name2
    isUseSize: false    // variation_name1
};

jQuery(document).ready(function() {
    if (jQuery("#variation_design_type").val() != "0") {
        return false;
    }

    if (!jQuery("#hidden_variation_group").val() | jQuery("#hidden_variation_group").val() == "") {
    	jQuery("#colorSelectTitle").remove();
    	jQuery("#sizeSelectTitle").remove();
    	jQuery("#sizeSelectDetail").remove();
        return false;
    }

    init();

    var url = "";
    if ("https:" == document.location.protocol) {
        url = "/shop/goods/goodsapissl.aspx";
    }
    else {
        url = "/shop/goods/goodsapi.aspx";
    }

    jQuery.ajax({
        url: url,
        data: { "variation_group": jQuery("#hidden_variation_group").val(), "type": "json" },
        dataType: "json",
        type: "post",
        cache: false,
        success: function(data, status) {
            searchIsUseVariation(data);
            variation_register.raw_json = data;
            if (variation_register.isUseSize) {
                variation_register.size_array = getSizeSelectors(data, null);
                createSizeSelectorHtml(variation_register.size_array);
            }
            if (variation_register.isUseColor) {
                variation_register.color_array = getColorSelectors(data, null);
                createColorSelectorHtml(variation_register.color_array);
            }
        }
    }
    );
});

/*omlから作成されるバリエーションリストを削除します*/
function init() {
    jQuery("p.valiationlist_").remove();
    cartButtonJudge();
}

function switchCartButton(isDisp) {

    var cartbutton = jQuery("p.btnCart > input[type=image]");
    var img_obj = $("p.btnCart > img:last");

cartbutton.css({"behavior": "url(/common/js/iepngfix.htc)"}); 

    if (isDisp) {
        var color = "";
        var size = "";
        if (variation_register.isUseColor) {
            color = variation_register.selected_color;
        }
        if (variation_register.isUseSize) {
            size = variation_register.selected_size;
        }

        jQuery.each(variation_register.raw_json, function(i, item) {
            if (item.variation_name1 == size && item.variation_name2 == color) {
                var hiddenGoods = jQuery("<input type='hidden' name='goods' value='" + item.goods + "'>");
                jQuery("p.btnCart input[type=hidden]").remove();
                jQuery("p.btnCart" ).append(hiddenGoods);

                rewriteGoodsSpec(item.goods);

                cartbutton.show();
                img_obj.hide();
                return;
            }
        });
    }
    else {
        cartbutton.hide();
        img_obj.show();
    }
}

function canDispCartButton() {
    var b = false;
    if (variation_register.isUseColor && variation_register.isUseSize) {
        jQuery.each(variation_register.raw_json, function(i, item) {
            if (item.variation_name1 == variation_register.selected_size &&
                item.variation_name2 == variation_register.selected_color) {
                b = item.sold;
                return false;
            }
        });
    }
    if (variation_register.isUseColor && !variation_register.isUseSize) {
        jQuery.each(variation_register.raw_json, function(i, item) {
            if (item.variation_name2 == variation_register.selected_color) {
                b = item.sold;
                return false;
            }
        });
    }
    if (!variation_register.isUseColor && variation_register.isUseSize) {
        jQuery.each(variation_register.raw_json, function(i, item) {
            if (item.variation_name1 == variation_register.selected_size) {
                b = item.sold;
                return false;
            }
        });
    }
    return b;
}

/*選べるサイズ一覧を作成します*/
function createSizeSelectorHtml(size_array) {
    var sizes = jQuery("<ul></ul>");
    sizes.addClass("selectSize");
    jQuery.each(size_array, function(key, value) {
        var size = jQuery("<li title='" + htmlspecialchars(value.variation_name1) + "' ></li>");
        size.addClass("size_");
        if (variation_register.selected_size) {
            if (value.variation_name1 == variation_register.selected_size) {
                size.remove("size_Selected_");
                size.addClass("size_Selected_");
            }
        }
        if (value.sold) {
            size.addClass("size_EnableStock_");
            size.bind("click", function(event) {
                jQuery("#sizeSelectArea .selectSize .size_Selected_")
                .addClass("size_EnableStock_")
                .removeClass("size_Selected_");
                size.removeClass("size_EnableStock_");
                size.addClass("size_Selected_");

                jQuery("#sizeSelectArea .selectSize .size_DisableSelected_")
                .removeClass("size_DisableSelected_")
                .addClass("size_DisableStock_");

                variation_register.selected_size = value.variation_name1;

                if (variation_register.isUseColor) {
                    replaceColorSelectorHtml(value.variation_name1);
                }
                cartButtonJudge();
            });
        }
        else {
            size.addClass("size_DisableStock_");
            size.bind("click", function(event) {
                jQuery("#sizeSelectArea .selectSize .size_DisableSelected_")
                .addClass("size_DisableStock_")
                .removeClass("size_DisableSelected_");
                size.removeClass("size_DisableStock_");
                size.addClass("size_DisableSelected_");

                jQuery("#sizeSelectArea .selectSize .size_Selected_")
                .removeClass("size_Selected_")
                .addClass("size_EnableStock_");

                variation_register.selected_size = value.variation_name1;

                if (variation_register.isUseColor) {
                    replaceColorSelectorHtml(value.variation_name1);
                }
                cartButtonJudge();
            	maskThumbnail(value.sold);
            });
        }

        size.bind("mouseover", function(event) {
            //maskThumbnail(value.sold);
        });

        size.bind("mouseleave", function(event) {
            if (variation_register.selected_size) {
                jQuery.each(size_array, function(key, arrayitem) {
                    if (arrayitem.variation_name1 == variation_register.selected_size) {
                        //maskThumbnail(arrayitem.sold);
                        return false;
                    }
                });
            }
            //else {
                //maskThumbnail(value.sold);
            //}
        });
        sizes.append(size);
    });

    sizes.append(jQuery("<br />").addClass("break_"));

    if (jQuery("form ul.selectSize").length > 0) {
        jQuery("form ul.selectSize").replaceWith(sizes);
    }
    else {
        jQuery("form #sizeSelectArea").prepend(sizes);
    }

    setSizeThumbnail();
}

/*選べるカラー一覧を作成します*/
function createColorSelectorHtml(color_array) {
    var colors = jQuery("<ul></ul>");
    colors.addClass("colorList");
    jQuery.each(color_array, function(key, value) {
        var color = jQuery("<li title='" + htmlspecialchars(value.variation_name2) + "'></li>");
        color.addClass("color_");
        if (variation_register.selected_color) {
            if (value.variation_name2 == variation_register.selected_color) {
                color.remove("color_Selected_");
                color.addClass("color_Selected_");
            }
        }


        if (value.sold) {
            color.addClass("color_EnableStock_");
            color.bind("click", function(event) {

                jQuery("#colorSelectArea .colorList .color_Selected_")
                .addClass("color_EnableStock_")
                .removeClass("color_Selected_");
                color.removeClass("color_EnableStock_");
                color.addClass("color_Selected_");

                jQuery("#colorSelectArea .colorList .color_DisableSelected_")
                .removeClass("color_DisableSelected_")
                .addClass("color_DisableStock_");

                variation_register.selected_color = value.variation_name2;

                if (variation_register.isUseSize) {
                    replaceSizeSelectorHtml(value.variation_name2);
                }
                cartButtonJudge();

            });

        }
        else {
            color.addClass("color_DisableStock_");
            color.bind("click", function(event) {
                jQuery("#colorSelectArea .colorList .color_DisableSelected_")
                .addClass("color_DisableStock_")
                .removeClass("color_DisableSelected_");
                color.removeClass("color_DisableStock_");
                color.addClass("color_DisableSelected_");

                jQuery("#colorSelectArea .colorList .color_Selected_")
                .removeClass("color_Selected_")
                .addClass("color_EnableStock_");

                variation_register.selected_color = value.variation_name2;

                if (variation_register.isUseSize) {
                    replaceSizeSelectorHtml(value.variation_name2);
                }
                cartButtonJudge();
            });
        }


        color.bind("click", function(event) {
            //rewriteThumbnail(value.variation_name2, value.sold);
            if (color) {
              jQuery.each(variation_register.raw_json, function(i, item) {
                if (item.variation_name2 == value.variation_name2) {
                  $("#mainItem").iviewer({urlList: [item.src_l, item.src_1, item.src_2, item.src_3, item.src_4]});
                  return false;
                }
              });
            }
            else {
              jQuery.each(variation_register.raw_json, function(i, item) {
                if (item.variation_name2 == variation_register.selected_color) {
                  $("#mainItem").iviewer({urlList: [item.src_l, item.src_1, item.src_2, item.src_3, item.src_4]});
                  return false;
                }
              });
            }
                        
            maskThumbnail(value.sold);
        });

/*
        color.bind("mouseleave", function(event) {
            rewriteThumbnail(variation_register.selected_color, value.sold);
            if (variation_register.selected_color) {
                jQuery.each(color_array, function(key, arrayitem) {
                    if (arrayitem.variation_name2 == variation_register.selected_color) {
                        maskThumbnail(arrayitem.sold);
                        return false;
                    }
                });
            }
            else {
                maskThumbnail(value.sold);
            }
        });
*/
        colors.append(color);
    });

    colors.append(jQuery("<br />").addClass("break_"));

    if (jQuery("form ul.colorList").length > 0) {
        jQuery("form ul.colorList").replaceWith(colors);
    }
    else {
        jQuery("form #colorSelectArea").prepend(colors);
    }

    setThumbnail();
}
function replaceSizeSelectorHtml(selected_color) {
    createSizeSelectorHtml(getSizeSelectors(variation_register.raw_json, selected_color));
}

function replaceColorSelectorHtml(selected_size) {
    createColorSelectorHtml(getColorSelectors(variation_register.raw_json, selected_size));
}

/*サイズ(variation_name1)を配列に格納します*/
function getSizeSelectors(items, selected_color) {
    var size_array = new Object();
    var createArray = function(item) {
        if (item.variation_name1 != "") {
            if (!size_array[item.variation_name1]) {
                var obj = null;
                if (item.sold) {
                    obj = {
                        sold: true,
                        variation_name1: item.variation_name1
                    };
                }
                else {
                    obj = {
                        sold: false,
                        variation_name1: item.variation_name1
                    };
                }
                size_array[item.variation_name1] = obj;
            }
            else {
                if (item.sold) {
                    size_array[item.variation_name1].sold = true;
                }
            }
        }
    };

    jQuery.each(items, function(i, item) {
        if (selected_color) {
            if (item.variation_name2 == selected_color) {
                createArray(item);
            }
        }
        else {
            createArray(item);
        }

    });
    return size_array;
}

/*カラー(variation_name2)を配列に格納します*/
function getColorSelectors(items, selected_size) {
    var color_array = new Object();
    var createArray = function(item) {
        if (item.variation_name2 != "") {
            if (!color_array[item.variation_name2]) {
                var obj = null;
                if (item.sold) {
                    obj = {
                        sold: true,
                        variation_name2: item.variation_name2
                    };
                }
                else {
                    obj = {
                        sold: false,
                        variation_name2: item.variation_name2
                    };
                }
                color_array[item.variation_name2] = obj;
            }
            else {
                if (item.sold) {
                    color_array[item.variation_name2].sold = true;
                }
            }
        }
    };

    jQuery.each(items, function(i, item) {
        if (selected_size) {
            if (item.variation_name1 == selected_size) {
                createArray(item);
            }
        }
        else {
            createArray(item);
        }
    });
    return color_array;
}

/*設定されているバリエーションの種類に応じてガイドメッセージを切り替え*/
function searchIsUseVariation(items) {
    jQuery.each(items, function(i, item) {
        if (item.variation_name1) {
            if (item.variation_name1 != "") { variation_register.isUseSize = true; }
        }
        if (item.variation_name2) {
            if (item.variation_name2 != "") { variation_register.isUseColor = true; }
        }
    });
    var message = "";
    if (variation_register.isUseColor && variation_register.isUseSize) {
        message = "カラーとサイズを選択してください。";
    }
    else if (variation_register.isUseColor && !variation_register.isUseSize) {
        message = "カラーを選択してください。";
    }
    else if (!variation_register.isUseColor && variation_register.isUseSize) {
        message = "サイズを選択してください。";
    }
    else {
    }
	//ガイドメッセージ表示位置を設定
    if (message != "") {
        jQuery("td.goodsspec_ > form").prepend("<span>" + message + "</span>");
    }
}

/*選択されたサイズ・カラーで登録されている商品に応じた詳細情報に切り替える*/
function rewriteGoodsSpec(goods) {
    jQuery.each(variation_register.raw_json, function(i, item) {
        if (item.goods == goods) {
            jQuery("#itemTitle").get(0).innerHTML = item.name;
            jQuery("#spec_goods").get(0).innerHTML = "商品番号 :" + item.goods;
            if (item.variation_name1 && jQuery("#spec_variation_name1").get().length > 0) {
                jQuery("#spec_variation_name1").get(0).innerHTML = item.variation_name1;
            }
            if (item.variation_name2 && jQuery("#spec_variation_name2").get().length > 0) {
                jQuery("#spec_variation_name2").get(0).innerHTML = item.variation_name2;
            }

            if (jQuery("#spec_price .price_pop_").get().length > 0) {
                jQuery("#spec_price .price_pop_").get(0).innerHTML = item.sales_comment;
            }

            if (jQuery("#itemprice").get().length > 0) {
                jQuery("#itemprice").get(0).innerHTML = item.format_price + " (税込)";
            }
            if (item.default_price != "") {
                jQuery("#default_price").get(0).innerHTML = item.default_price + "(税込)";
            } else {
                jQuery("#default_price").get(0).innerHTML = "";
            }

            if (jQuery("#spec_point").get().length > 0) {
                jQuery("#spec_point").get(0).firstChild.data = item.point;
            }
            if (jQuery("#spec_stock_msg").get().length > 0) {
                jQuery("#spec_stock_msg").get(0).innerHTML = item.stock_message;
            }

            if (!variation_register.isUseColor) {
            	jQuery("#mainImage").attr("src", item.src_l);

            }
            
            /* お気に入りリンク先を選択した商品情報に置き換え */
            jQuery("#bookmark_link").attr("href", "/shop/customer/bookmark.aspx?goods="+item.goods);
            
            return false;
        }
    });
}

/*画像9に登録されているイメージをセットします(カラー用)*/
function setThumbnail() {
    jQuery("ul.colorList li").each(function(i, item) {
        var title = item.getAttribute("title");

        jQuery.each(variation_register.raw_json, function(j, c) {
            if (c.variation_name2 == title) {
                if (c.src_9 != "") {
                    item.style.backgroundImage = "url(" + c.src_9 + ")";
                }
                return false;
            }
        });
    });
}

/*画像8に登録されているイメージをセットします(サイズ用)*/
function setSizeThumbnail() {
    jQuery("ul.selectSize li").each(function(i, item) {
        var titleSize = item.getAttribute("title");

        jQuery.each(variation_register.raw_json, function(j, c) {
            if (c.variation_name1 == titleSize) {
                if (c.src_8 != "") {
                    item.style.backgroundImage = "url(" + c.src_8 + ")";
                }
                return false;
            }
        });
    });
}
function cartButtonJudge() {
	if (variation_register.isUseColor) {
        rewriteThumbnail(null, null);
    }
    if (canDispCartButton()) {
        maskThumbnail(true);
        switchCartButton(true);
    }
    else {
        switchCartButton(false);
    }
}

function rewriteThumbnail(color, sold) {
    if (color) {
        jQuery.each(variation_register.raw_json, function(i, item) {
            var iviewercommon;
            iviewercommon = 0;
            if (item.variation_name2 == color) {
            	jQuery("#mainImage").attr("src", item.src_l);
            	//$("#mainItem img").attr("src", item.src_l);
            	//$("#mainItem").iviewer({src: item.src_l});

                return false;
            }
        });
    }
    else {
        if (!variation_register.selected_color) { return false; }
        jQuery.each(variation_register.raw_json, function(i, item) {
        if (item.variation_name2 == variation_register.selected_color) {
        	jQuery("#mainImage").attr("src", item.src_l);
            	//$("#mainItem img").attr("src", item.src_l);
            	//$("#mainItem").iviewer({src: item.src_l});

                return false;
            }
        });
    }
}

/*在庫がないサイズ・カラー組み合わせを選択している場合、その旨を伝えるメッセージを表示します*/
function maskThumbnail(sold) {
    if (jQuery(".btnCart div.mask_")) { jQuery(".nostock").get(0).innerHTML = ""; }
    if (!sold) {
    	//メッセージの表示位置を設定
        //var top = jQuery(".btnCart").position().top;
        //var left = jQuery(".btnCart").position().left;
        //var width = jQuery(".btnCart").width();
        //var height = jQuery(".btnCart").height();
        //var mask = jQuery("<div>在庫がありません</div>");
        //jQuery(".btnCart").append(mask);
        //mask.addClass("mask_");
        //mask.css("left", left).css("top", top).css("width", width).css("height", height);
    	
    	jQuery(".nostock").get(0).innerHTML = "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;在庫がございません。";
    }
    else {
        if (jQuery(".btnCart div.mask_")) {jQuery(".btnCart div.mask_").remove(); }
    }
}