https://theshopyohjiyamamoto.jp/js/guest_bookmark.js

1var ecblib = ecblib || {};
2ecblib.guest_bookmark = ecblib.guest_bookmark || {};
3
4(function () {
5  "use strict";
6  var _guest_bookmark = ecblib.guest_bookmark;
7
8  /* 初期化 */
9  document.addEventListener("DOMContentLoaded", function () {
10    // 商品削除時のアクション
11    jQuery(".bookmark_item_delete").on("click", function () {
12      DeleteGuestBookmarkGoods(jQuery(this).attr("data-value"), "1");
13      return false;
14    });
15
16    let goods = getParam("del_goods");
17    if (goods) {
18      DeleteGuestBookmarkGoods(goods, "0");
19    }
20
21    // 商品カート追加のアクション
22    jQuery("[name='cart']").on("click", function () {
23      var goodsname = "";
24      if (jQuery(this)[0].parentElement.previousElementSibling.children[0].children[2].selectedOptions[0].value == "") {
25        goodsname = jQuery(this).attr("data-value");
26      } else if (jQuery(this)[0].parentElement.previousElementSibling.children[0].children[2].selectedOptions[0].value == "list") {
27        alert("サイズ・カラーが選択されていません");
28        return false;
29      } else {
30        goodsname = jQuery(this)[0].parentElement.previousElementSibling.children[0].children[2].selectedOptions[0].value;
31      }
32      AddGuestCartAjax(goodsname, this);
33      return false;
34    });
35
36    // select要素の選択肢変更時にカスタムテキストを更新する関数
37    function updateCustomTextOnSelectChange() {
38      const selectElements = document.querySelectorAll('.js_bookmark_select');
39      const customTextElements = document.querySelectorAll('.custom-select-txt');
40
41      selectElements.forEach((selectElement, index) => {
42        const customTextElement = customTextElements[index];
43
44        // optionが存在しない場合は「選択できません」を表示
45        if (selectElement.options.length === 0) {
46          customTextElement.textContent = '選択できません';
47        } else {
48        // 初期選択のテキストを設定
49        customTextElement.textContent = selectElement.options[selectElement.selectedIndex].text;
50
51        // 選択肢が変更されたときにテキストを更新
52        selectElement.addEventListener('change', function () {
53          customTextElement.textContent = selectElement.options[selectElement.selectedIndex].text;
54        });
55        }
56      });
57    }
58    updateCustomTextOnSelectChange();
59
60
61    // セレクトボックス変更時のアクション
62    function updateItemDetails(selectElement) {
63      const container = selectElement.closest('.favorite_item');
64      const remove_goods = container.querySelector('input[name="bookmark_item_delete"]')?.value;
65      const selectedOption = selectElement.options[selectElement.selectedIndex];
66
67      // 'list'の場合は何もしない
68      if (selectedOption.value === 'list') {
69        jQuery(selectElement).find(".checkcart").prop("disabled", true);
70        return;
71      }
72
73      // data-*属性から必要な情報を取得
74      const imgSrc = selectedOption.getAttribute('data-item-img');
75      const itemName = selectedOption.getAttribute('data-item-name');
76      const itemPrice = selectedOption.getAttribute('data-item-price');
77      const itemNet = selectedOption.getAttribute('data-item-net');
78      const itemLink = selectedOption.getAttribute('data-item-link');
79      const itemSize = selectedOption.getAttribute('data-item-size');
80      const itemColor = selectedOption.getAttribute('data-item-color');
81      const itemCode = selectedOption.value;
82
83      //切り替え後のSKU, 切り替え前のSKU, 対象アイテムを渡す
84      updatebookmark(itemCode, remove_goods, selectElement);
85
86      // コンテナ内の画像、商品名、価格、サイズ、カラーを更新
87      const imgElement = container.querySelector('.favorite_item_img img');
88      if (imgElement) {
89        imgElement.setAttribute('src', imgSrc);
90        imgElement.setAttribute('alt', itemName);
91      }
92
93      const nameLink = container.querySelector('.favorite_item_name a.favorite_item_name_link');
94      if (nameLink) {
95        nameLink.setAttribute('title', itemName);
96        nameLink.setAttribute('href', `/shop/g/g${itemCode}`);
97        nameLink.textContent = itemName;
98      }
99
100      const priceElement = container.querySelector('.favorite_item_price .price_ .main');
101      if (priceElement) {
102        priceElement.textContent = itemPrice;
103      }
104
105      const netElement = container.querySelector('.favorite_item_price .price_ .sub');
106      if (netElement) {
107        netElement.textContent = itemNet;
108      }
109
110      const sizeElement = container.querySelector('.favorite_item_misc .size');
111      if (sizeElement) {
112        sizeElement.textContent = `SIZE: ${itemSize}`;
113      }
114
115      const colorElement = container.querySelector('.favorite_item_misc .color');
116      if (colorElement) {
117        colorElement.textContent = `COLOR: ${itemColor}`;
118      }
119
120      const codeElement = container.querySelector('.favorite_item_misc .code');
121      if (codeElement) {
122        codeElement.textContent = itemCode;
123      }
124
125      const itemLinkElement = container.querySelector('.favorite_item_img a.favorite_item_img_link');
126      if (itemLinkElement) {
127        itemLinkElement.setAttribute('href', itemLink);
128      }
129
130      const itemNameLinkElement = container.querySelector('.favorite_item_name a.favorite_item_name_link');
131      if (itemNameLinkElement) {
132        itemNameLinkElement.setAttribute('href', itemLink);
133      }
134
135      const itemAddWishElement = container.querySelector('a.item_addwish_btn');
136      if (itemAddWishElement) {

137        itemAddWishElement.setAttribute('data-goods', itemCode);
138        itemAddWishElement.setAttribute('data-href', `/shop/guest/favorite_item_guest.aspx?goods=${itemCode}&crsirefo_hidden=`);
139      }
140
141      const itemAddCartElm = container.querySelector('.favorite_item_addcart input.checkcart');
142      if (itemAddCartElm) {
143        itemAddCartElm.setAttribute('data-value', itemCode);
144      }
145
146      const deleteInput = container.querySelector('input[name="bookmark_item_delete"]');
147      if (deleteInput) {
148        deleteInput.value = itemCode;
149      }
150
151    }
152    // 各セレクトボックスに対してイベントリスナーを追加
153    const selectElements = document.querySelectorAll('.js_bookmark_select');
154    selectElements.forEach(selectElement => {
155      selectElement.addEventListener('change', function() {
156        updateItemDetails(selectElement);  // 各セレクトボックスが属するコンテナを更新
157      });
158    });
159
160  });
161
162  function DeleteGuestBookmarkGoods(goods, nokarte_flg) {
163    jQuery.ajax({
164      type: "POST",
165      url: "deletebookmark_guest.aspx",
166      cache: false,
167      dataType: "text",
168      data: {
169        goods: goods,
170        remove_flg: true,
171        crsirefo_hidden: jQuery("[name='crsirefo_hidden_guest_bookmark']").val(),
172        nokarte_flg: nokarte_flg,
173      },
174      cache: false,
175      ifModified: false,
176      dataType: "json",
177      success: function (contents) {
178        if (nokarte_flg == "1") {
179          var url = location.href.replace(location.search, "");
180          var product = {
181            "sku": goods,
182            "product": null,
183            "quantity": 1
184          };
185          zdRemoveFromFavorite(product);
186          location.href = url + "?del_goods=" + goods;
187        } else {
188          karteFavoriteItemReturn(
189            contents.favorite_quantity,
190            contents.Karte_favorite_items,
191            contents.favorite_added_item_id,
192            contents.favorite_deleted_item_id
193          );
194        }
195      },
196      error: function (xhr, status, thrown) {
197        console.log(xhr, status, thrown);
198        if (status !== "") {
199          location.reload();
200        }
201        return false;
202      },
203    });
204  }
205
206  function AddGuestCartAjax(goods, item) {
207    jQuery.ajax({
208      type: "POST",
209      url: ecblib.sys.wwwroot + "/shop/js/addcart.aspx",
210      cache: false,
211      dataType: "json",
212      data: {
213        goods: goods,
214        crsirefo_hidden: jQuery("[name='crsirefo_hidden_guest_bookmark']").val(),
215      },
216      success: function (contents) {
217        // レスポンスのjsonにmessageキーが含まれている場合は失敗、それ以外は成功
218        if (contents && contents.message) {
219          var position = 0;
220          var speed = 600;
221          if (jQuery(".error_ li").length) {
222            jQuery(".error_ li").html(contents.message);
223            jQuery("html,body").animate({ scrollTop: position }, speed);
224          } else {
225            jQuery(".top_").append(
226              "<div class='info_'><ul class='error_' style='text-align:left;'><li></li></ul></div>"
227            );
228            jQuery(".error_ li").html(contents.message);
229            jQuery("html,body").animate({ scrollTop: position }, speed);
230          }
231        } else {
232          addtocart_img_change(item, "1", goods);
233          jQuery(".info_").remove();
234          // Zeta TRAKING対応
235          var product = {
236            "sku": goods,
237            "product": null,
238            "quantity": 1
239          };
240          zdAddToCart(product);
241        }
242      },
243      error: function (xhr, status, thrown) {
244        console.log(xhr, status, thrown);
245        if (status !== "") {
246          location.reload();
247        }
248        return false;
249      },
250      complete: function (xhr, status) {
251        updateCartCount();
252      },
253    });
254    return true;
255  }
256
257  // ヘッダーのカートの数を更新する関数
258  function updateCartCount() {
259    if (jQuery("#jscart_count_").length > 0) {
260      jQuery("#jscart_count_").load("/shop/js/cartcount.aspx");
261    }
262  }
263  updateCartCount();
264
265  // 切り替え後のSKU, 切り替え前のSKU, 対象アイテムを渡す
266  function updatebookmark(goods, remove_goods, item) {
267    jQuery.ajax({
268      url: "deletebookmark_guest.aspx",
269      data: {
270        upd_bookmark: true,
271        goods: goods,
272        remove_goods: remove_goods,
273        list_trans_fg: "0",
274        crsirefo_hidden: jQuery("[name='crsirefo_hidden_guest_bookmark']").val(),
275      },
276      cache: false,
277      ifModified: false,
278      dataType: "json",
279      success: function (contents) {
280
281        // お気に入りアイコン同期
282        const addedItemId = contents.favorite_added_item_id;
283        updateFavIcon(goods, addedItemId, item);
284
285        addtocart_img_change(item, contents.hover_fg, goods);
286        karteFavoriteItemReturn(
287          contents.favorite_quantity,
288          contents.Karte_favorite_items,
289          contents.favorite_added_item_id,
290          contents.favorite_deleted_item_id
291        );
292        if (contents.change_fg == "1") {
293          jQuery(item).closest(".favorite_item").find(".bookmark_item_delete").attr("data-value", goods);
294          jQuery(".info_").remove();
295        }
296        if (contents.favorite_deleted_item_id) {
297          var product = {
298          "sku": contents.favorite_deleted_item_id,
299          "product": null,
300          "quantity": 1
301          };
302          zdRemoveFromFavorite(product);
303        }
304        var product2 = {
305          "sku": contents.favorite_added_item_id,
306          "product": null,
307          "quantity": 1
308        };
309        zdAddToFavorite(product2);
310      },
311      error: function (xhr, status, thrown) {
312        console.log(xhr, status, thrown);
313        if (status !== "") {
314          location.reload();
315        }
316        return false;
317      },
318    });

319    return true;
320  }
321
322  // お気に入りアイコン同期
323  function updateFavIcon(goods, addedItemId, item) {
324    if (goods === addedItemId) {
325      jQuery(item)
326        .closest('.favorite_item_control')
327        .find('.item_addwish_btn')
328        .addClass('is_active');
329    }
330  }
331
332  function addtocart_img_change(item, hover_fg, goods) {
333    var selectedItem = jQuery(item).closest(".favorite_item");
334    var src = jQuery(selectedItem).find(".checkcart").attr("src");
335    if (hover_fg == "1") {
336      if (src.match("addtocart_pc.svg")) {
337        jQuery("input[data-value='" + goods + "']").attr(
338          "src",
339          src.replace("addtocart_pc.svg", "addtocart_pc_disabled.svg")
340        );
341      }
342      if (src.match("addtocart_sp.svg")) {
343        jQuery("input[data-value='" + goods + "']").attr(
344          "src",
345          src.replace("addtocart_sp.svg", "addtocart_sp_disabled.svg")
346        );
347      }
348      jQuery("input[data-value='" + goods + "']").prop("disabled", true);
349    } else {
350      if (src.match("addtocart_pc_disabled.svg")) {
351        jQuery("input[data-value='" + goods + "']").attr(
352          "src",
353          src.replace("addtocart_pc_disabled.svg", "addtocart_pc.svg")
354        );
355      }
356      if (src.match("addtocart_sp_disabled.svg")) {
357        jQuery("input[data-value='" + goods + "']").attr(
358          "src",
359          src.replace("addtocart_sp_disabled.svg", "addtocart_sp.svg")
360        );
361      }
362      jQuery("input[data-value='" + goods + "']").prop("disabled", false);
363    }
364  }
365
366  function getParam(name, url) {
367    if (!url) url = window.location.href;
368    name = name.replace(/[\[\]]/g, "\\$&");
369    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
370      results = regex.exec(url);
371    if (!results) return null;
372    if (!results[2]) return "";
373    return decodeURIComponent(results[2].replace(/\+/g, " "));
374  }
375})();
376
377function karteFavoriteItemReturn(quantity, item, added, deleted) {
378  dataLayer.push({
379    favorite_quantity: quantity,
380    favorite_items: item,
381    favorite_added_item_id: added,
382    favorite_deleted_item_id: deleted,
383  });
384}