https://img.tsite.jp/resources/tsite/new2/assets/js/main.js

1$(function () {
2  //変数を定義
3  var apiTimeout = 20000;
4
5  var imgBasePath = "https://img.tsite.jp/resources/tsite/top/";
6
7  var apiEndpoints = {
8    userStatus: "https://tsite.jp/tm/pc/login/STKIp0001100.do",
9    infoList: "https://tsite.jp/tm/pc/login/STKIp0001200.do",
10  };
11
12  var jsonpEndpoints = {
13    maintenance: {
14      url: "https://img.tsite.jp/system/shirase/maintenance.json",
15      callback: "__maintenance_info",
16    },
17    topbanner: {
18      url: "https://img.tsite.jp/resources/tsite/top/json/topbanner.json",
19      callback: "callback_topbanner",
20    },
21    topbanner2: {
22      url: "https://img.tsite.jp/resources/tsite/top/json/topbanner2.json",
23      callback: "callback_topbanner2",
24    },
25    store: {
26      url: "https://img.tsite.jp/resources/tsite/top/json/store.json",
27      callback: "callback_search",
28    },
29    osusume: {
30      url: "https://img.tsite.jp/resources/tsite/top/json/osusume2.json",
31      callback: "callback_osusume",
32    },
33    main: {
34      url: "https://img.tsite.jp/resources/tsite/top/json/main.json",
35      callback: "callback_main",
36    },
37    footer: {
38      url: "https://img.tsite.jp/resources/tsite/top/json/footer.json",
39      callback: "callback_footer",
40    },
41  };
42
43  var areaUserStatus = "10";
44  var areaInfoList = "20";
45
46  var errorMessages = {
47    userStatus: {
48      9901: "ただいまポイント情報を表示できません。しばらく経ってから再度お試しください。",
49      9902: "ただいまポイント情報を表示できません。しばらく経ってから再度お試しください。",
50      9903: "ただいまポイント情報を表示できません。しばらく経ってから再度お試しください。",
51      401: "",
52      402: "ただいまポイント情報を表示できません。しばらく経ってから再度お試しください。",
53      900: "ただいまポイント情報を表示できません。しばらく経ってから再度お試しください。",
54      970: "ただいまポイント情報を表示できません。しばらく経ってから再度お試しください。",
55      990: "ただいまポイント情報を表示できません。しばらく経ってから再度お試しください。",
56      800: "ただいまポイント情報を表示できません。しばらく経ってから再度お試しください。",
57      9999: "ただいまポイント情報を表示できません。しばらく経ってから再度お試しください。",
58    },
59    infoList: {
60      9901: "ただいま表示できません。しばらく経ってから再度お試しください。",
61      9902: "ただいま表示できません。しばらく経ってから再度お試しください。",
62      9903: "ただいま表示できません。しばらく経ってから再度お試しください。",
63      990: "ただいま表示できません。しばらく経ってから再度お試しください。",
64      800: "ただいま表示できません。しばらく経ってから再度お試しください。",
65      9999: "ただいま表示できません。しばらく経ってから再度お試しください。",
66    },
67  };
68
69  //プロセス定義
70  loadUserStatus();
71  loadInfoList();
72  loadTopBanner();
73  loadTopBanner2();
74  loadMainSlider();
75  loadOsusume();
76  loadStore();
77  loadFooterSlider();
78  loadMaintenance();
79
80  //関数定義
81
82  // APIの通信部分
83  function fetchJson(payloadOptions) {
84    var defaultOptions = {
85      url: payloadOptions,
86      type: "GET",
87      dataType: "json",
88      timeout: apiTimeout,
89      // リクエストヘッダーの処理を後で追記
90    };
91    var options = $.extend({}, defaultOptions, payloadOptions);
92    return $.ajax(options);
93  }
94
95  // 外部json　(JSONP)を取得する関数
96  function fetchJsonp(url, callbackName) {
97    var options = {
98      url: url,
99      dataType: "jsonp",
100      jsonpCallback: callbackName,
101    };
102    return fetchJson(options);
103  }
104
105  function getResponseData(jqXHR) {
106    if (jqXHR.responseJSON) {
107      return jqXHR.responseJSON;
108    } else if (jqXHR.responseText) {

109      try {
110        return JSON.parse(jqXHR.responseText);
111      } catch (e) {
112        // パースできない場合はnullを返す
113        return null;
114      }
115    } else {
116      return null;
117    }
118  }
119
120  function checkAjaxError(jqXHR, textStatus, errorThrown) {
121    return {
122      jqXHR: jqXHR,
123      textStatus: textStatus,
124      errorThrown: errorThrown,
125      responseData: getResponseData(jqXHR),
126    };
127  }
128
129  function checkResponseStatus(response, allowCodes) {
130    allowCodes = allowCodes || ["000"];
131
132    if (response.status && response.status.code) {
133      var code = response.status.code;
134      var isCheck = allowCodes.indexOf(code) !== -1;
135
136      if (!isCheck) {
137        var error = new Error("APIがエラーを返しました: " + code);
138        error.statusCode = code;
139        error.response = response;
140        return $.Deferred().reject(error).promise();
141      }
142    }
143
144    return response;
145  }
146
147  // 外部JSONのレスポンスを検証する関数を定義
148  function validateExternalJsonpData(data) {
149    try {
150      if (Array.isArray(data)) {
151        for (var i = 0; i < data.length; i++) {
152          if (typeof data[i] !== "object") {
153            return false;
154          }
155        }
156      } else {
157        return false;
158      }
159
160      return true;
161    } catch (e) {
162      return false;
163    }
164  }
165
166  // maintenance.json 専用のバリデーション関数を新規追加
167  function validateMaintenanceData(data) {
168    try {
169      if (typeof data !== "object" || data === null || Array.isArray(data)) {
170        return false;
171      }
172      // "000" または "007" が存在するか
173      if (!data["000"] && !data["007"]) {
174        return false;
175      }
176      // infoが配列であることを確認
177      if (data["000"] && !Array.isArray(data["000"].info)) {
178        return false;
179      }
180      if (data["007"] && !Array.isArray(data["007"].info)) {
181        return false;
182      }
183
184      return true;
185    } catch (e) {
186      return false;
187    }
188  }
189
190  // エラーハンドリングの関数を定義
191  function generateErrorCode(areaCode, statusCode) {
192    return "VTP-DR-" + areaCode + "-" + statusCode;
193  }
194
195  function getStatusCodeFromAjaxError(jqXHR, textStatus) {
196    if (textStatus === "timeout") {
197      return "9901";
198    } else if (jqXHR && jqXHR.status !== 200) {
199      return "9902";
200    } else if (textStatus === "parsererror") {
201      return "9903";
202    } else {
203      return "9999";
204    }
205  }
206
207  function showErrorMessage(selector, areaCode, statusCode) {
208    var errorCode = generateErrorCode(areaCode, statusCode);
209    var message;
210
211    if (areaCode === areaUserStatus) {
212      message =
213        errorMessages.userStatus[statusCode] ||
214        errorMessages.userStatus["9999"];
215    } else if (areaCode === areaInfoList) {
216      message =
217        errorMessages.infoList[statusCode] || errorMessages.infoList["9999"];
218    } else {
219      message =
220        "想定外のエラーが発生しました。しばらく経ってから再度お試しください。";
221    }
222
223    $(selector).html(
224      '<div class="error-box" data-error-code="' +
225        errorCode +
226        '">' +
227        '<p class="error-message">' +
228        message +
229        "（" +
230        errorCode +
231        "）</p>" +
232        "</div>",
233    );
234  }
235
236  function handleUserStatusError(errorInfo) {
237    var statusCode;
238
239    if (errorInfo.statusCode) {
240      statusCode = errorInfo.statusCode;
241    } else {
242      statusCode = getStatusCodeFromAjaxError(
243        errorInfo.jqXHR,
244        errorInfo.textStatus,
245      );
246    }
247
248    // 401は未ログインなのでエラー表示しない
249    if (statusCode === "401") {
250      showNotLoggedIn();
251      $(".newt-header-register-box").hide();
252      return;
253    }
254
255    $(".newt-header-loading").hide();
256    $(".newt-header-register-box").hide();
257    showErrorMessage(".newt-header-user-info", areaUserStatus, statusCode);
258    $(".newt-header-user-info").show();
259  }
260
261  function handleInfoListError(errorInfo) {
262    var statusCode;
263
264    if (errorInfo.statusCode) {
265      statusCode = errorInfo.statusCode;
266    } else {
267      statusCode = getStatusCodeFromAjaxError(
268        errorInfo.jqXHR,
269        errorInfo.textStatus,
270      );
271    }
272
273    $("#newt-top-info .loading-spinner").hide();
274    showErrorMessage(
275      "#newt-top-info .newt-top-sec-inner",
276      areaInfoList,
277      statusCode,
278    );
279  }
280
281  // ユーザーステータス系の関数定義
282  function loadUserStatus() {
283    fetchJson(apiEndpoints.userStatus)
284      .then(function (data) {
285        // ステータスコードのチェック（'000'と'401'を正常扱い）
286        return checkResponseStatus(data, ["000", "401", "402"]);
287      })
288      .then(function (data) {
289        // 402の場合はログイン状態で会員情報反映待ち表示
290        if (data.status && data.status.code === "402") {
291          showLoggedIn();
292          $("#newt-user-name").hide();
293          hideVmoney();
294          showVpoint(".wait");
295          return null;
296        }
297        return data;
298      })
299      .then(function (data) {
300        if (data) {
301          // レスポンスデータをDOMに反映
302          renderUserStatus(data);
303        }
304      })
305      .fail(function (errorOrJqXHR, textStatus, errorThrown) {
306        var errorInfo;
307        if (textStatus !== undefined) {
308          // エラーハンドリング（既に実装済みの関数へ）
309          errorInfo = checkAjaxError(errorOrJqXHR, textStatus, errorThrown);
310        } else {
311          errorInfo = errorOrJqXHR; // 既にエラーオブジェクトが渡されている場合
312        }
313        handleUserStatusError(errorInfo);
314      });
315  }
316
317  // ユーザーステータスのデータを元に、DOMを更新する関数を定義
318  function renderUserStatus(data) {
319    var results = data.results;
320    var loginFlg = results.login_flg;
321    var userStatus = results.user_status || {};
322
323    if (loginFlg !== "1") {
324      showNotLoggedIn();
325      return;
326    }
327
328    showLoggedIn();
329
330    // ユーザー名表示
331    if (userStatus.name) {
332      $(".var_NAME").html(userStatus.name);
333    }
334
335    if (userStatus.member_flg === "1" && userStatus.vpointflg === "1") {
336      $("#newt-user-name").hide();
337      hideVmoney();
338      showVpoint(".wait");
339      return;
340    }
341
342    // Vポイント・Vマネー表示
343    var formatted = formatPointMoney(results);
344
345    if (formatted.pointFmt === "" && formatted.moneyFmt === "") {
346      hideVmoney();
347      showVpoint(".wait");
348    } else {
349      if (formatted.pointFmt === "") {
350        showVpoint(".no-confirm");
351      } else {
352        showVpoint(".normal");
353        var pointBalance = userStatus.point_info
354          ? userStatus.point_info.balance
355          : "";
356        $(".var_TPOINT_F").html(pointBalance);
357      }
358
359      var vmoneyDisplayState = getVmoneyDisplayState(userStatus);
360
361      if (vmoneyDisplayState.type === "hidden") {
362        hideVmoney();
363      } else if (vmoneyDisplayState.type === "no-confirm") {
364        showVmoney(".no-confirm");
365      } else {
366        showVmoney(".normal");
367        $(".var_TMONEY_F").html(vmoneyDisplayState.balance);
368      }
369    }
370  }
371
372  function getVmoneyDisplayState(userStatus) {
373    if (userStatus.member_type === "2") {
374      return { type: "hidden" };
375    }
376
377    if (userStatus.vmoney_card_flg === "0") {
378      return { type: "hidden" };
379    }
380
381    if (userStatus.money_return_cd !== "00") {
382      return { type: "no-confirm" };
383    }
384
385    if (userStatus.first_charge_flg === "0") {
386      return { type: "normal", balance: "0" };
387    }
388
389    return {
390      type: "normal",
391      balance: userStatus.money_info ? userStatus.money_info.balance : "",
392    };
393  }
394
395  // ポイントとマネーの表示形式を整える関数を定義
396  function formatPointMoney(data) {
397    var result = { pointFmt: "", moneyFmt: "" };
398    var userStatus = data.user_status;
399
400    if (!userStatus || Object.keys(userStatus).length === 0) {
401      return result;
402    }
403
404    var memberType = userStatus.member_type;
405    var memberFlg = userStatus.member_flg;
406    var moneyReturnCd = userStatus.money_return_cd;
407    var vmoneyCardFlg = userStatus.vmoney_card_flg;
408    var firstChargeFlg = userStatus.first_charge_flg;
409    var pointBalance = userStatus.point_info
410      ? userStatus.point_info.balance
411      : "";
412    var moneyBalance = userStatus.money_info
413      ? userStatus.money_info.balance
414      : "";
415
416    if (memberFlg === "2") {
417      return result;
418    }
419
420    if (memberType === "1") {
421      if (memberFlg === "1") {
422        if (pointBalance !== "") {
423          result.pointFmt = "<i>" + pointBalance + "</i><span>pt</span>";
424        } else {
425          result.pointFmt = '<i class="str">現在ご確認できません</i>';
426        }
427        if (moneyReturnCd === "00") {
428          if (vmoneyCardFlg === "1") {
429            if (firstChargeFlg === "1") {
430              result.moneyFmt = "<i>" + moneyBalance + "</i><span>円</span>";
431            } else {
432              result.moneyFmt = '<i class="str">ご利用がありません</i>';
433            }
434          } else {
435            result.moneyFmt = '<i class="str">ご利用がありません</i>';
436          }
437        }
438      }
439    } else if (memberType === "2") {
440      if (memberFlg === "1") {
441        if (pointBalance !== "") {
442          result.pointFmt = "<i>" + pointBalance + "</i><span>pt</span>";
443        } else {
444          result.pointFmt = '<i class="str">現在ご確認できません</i>';
445        }
446      }
447    }
448
449    return result;
450  }
451
452  // 表示非表示の関数を定義
453  function showVpoint(className) {
454    $("#newt-user-tpoint").find(className).css("display", "block");
455  }
456
457  function showVmoney(className) {
458    $("#newt-user-tmoney").find(className).css("display", "block");
459  }
460
461  function hideVmoney() {
462    $("#newt-user-tpoint").addClass("full");
463    $("#newt-user-tmoney").hide();
464  }
465
466  // ログイン済みのUIに切り替える関数を定義
467  function showLoggedIn() {
468    $(".newt-header-loading").hide();
469    $(".newt-header-login").hide();
470    $("#newt-top-beginner").hide();
471    $(".newt-header-register-box").hide();
472    $(".newt-gnav-login").hide();
473    $(".newt-header-user-info").show();
474    $(".newt-gnav-logout").show();
475    $(".newt-sub-nav-logout").show();
476    $("#newt-gfooter").css("padding-bottom", "0");
477  }
478
479  // 未ログインのUIに切り替える関数を定義
480  function showNotLoggedIn() {
481    $(".newt-header-loading").hide();
482    $(".newt-header-user-info").hide();
483    $(".newt-gnav-logout").hide();
484    $(".newt-sub-nav-logout").hide();
485    $("#newt-top-guide").hide();
486    $("#newt-top-faq").hide();
487    $(".newt-header-login").show();
488    $("#newt-top-beginner").show();
489    $(".newt-header-register-box").show();
490    $(".newt-gnav-login").show();
491    $(".newt-sub-nav-info a").attr("href", "https://info.tsite.jp/?page=info");
492    $(".newt-nav-info a").attr("href", "https://info.tsite.jp/?page=info");
493  }
494
495  // お知らせリストの関数定義
496  function loadInfoList() {
497    fetchJson(apiEndpoints.infoList)
498      .then(function (data) {
499        return checkResponseStatus(data, ["000"]);
500      })
501      .then(function (data) {
502        renderInfoList(data);
503      })
504      .fail(function (errorOrJqXHR, textStatus, errorThrown) {
505        var errorInfo;
506        if (textStatus !== undefined) {
507          errorInfo = checkAjaxError(errorOrJqXHR, textStatus, errorThrown);
508        } else {
509          errorInfo = errorOrJqXHR;
510        }
511        handleInfoListError(errorInfo);
512      });
513  }
514
515  //お知らせリストのデータを元に、DOMを更新する関数を定義
516  function renderInfoList(data) {
517    var results = data.results;
518    var infoList = results.info_list || [];
519    var shouldUseWideLabel = wideInfoLabel(infoList);
520
521    $("#newt-top-info .loading-spinner").hide();
522
523    if (infoList.length === 0) {
524      $("#newt-top-info").hide();
525      return;
526    }
527
528    var $list = $("<ul>");
529    if (shouldUseWideLabel) {
530      $list.addClass("newt-top-info-list--wide-label");
531    }
532
533    for (var i = 0; i < infoList.length; i++) {
534      var html = createInfoHtml(infoList[i]);
535      $list.append(html);
536    }
537
538    $("#infoAdd").html($list).show();
539
540    // お知らせ一覧ボタンのリンク先とイベントを設定
541    var firstItem = infoList[0];
542    var listUrl =
543      "https://info.tsite.jp/?net_id=" + firstItem.net_id + "&page=info";
544
545    $(".newt-top-info-btn.newt-top-btn-link a").attr({
546      href: listUrl,
547      onclick:
548        "dataLayer.push({category:'top',action:'content',label:'info_list',event:'clickEventTrigger'});",
549    });
550
551    $(".newt-top-info-btn.newt-top-btn-link").show();
552  }
553
554  function wideInfoLabel(infoList) {
555    for (var i = 0; i < infoList.length; i++) {
556      if ((infoList[i].service_nm || "").length >= 8) {
557        return true;
558      }
559    }
560
561    return false;

562  }
563
564  // htmlを生成する関数を定義
565  function createInfoHtml(infoList) {
566    var redirectFlg = infoList.redirect_flg;
567    var html = "";
568
569    // redirect_flgが"0"の場合、お知らせドメイン以外の情報を掲載
570    if (redirectFlg === "0") {
571      html =
572        "<li>" +
573        '<a href="' +
574        infoList.redirect_url +
575        "\" onclick=\"dataLayer.push({category:'top',action:'content',label:'info_notice_detile_link',event:'clickEventTrigger'});\">" +
576        (infoList.service_nm
577          ? '<div class="newt-label">' + infoList.service_nm + "</div>"
578          : '<div class="newt-label newt-label--empty"></div>') +
579        '<div class="newt-date">' +
580        infoList.keisaidate_from +
581        "</div>" +
582        "<p>" +
583        infoList.title +
584        "</p>" +
585        "</a>" +
586        "</li>";
587    }
588    // redirect_flgが"1"の場合、お知らせドメインの情報を掲載
589    else if (redirectFlg === "1") {
590      var detailUrl =
591        infoList.info_domain_nm +
592        "/detail/?net_id=" +
593        infoList.net_id +
594        "&info_id=" +
595        infoList.srs_no;
596      html =
597        "<li>" +
598        '<a href="' +
599        detailUrl +
600        "\" onclick=\"dataLayer.push({category:'top',action:'content',label:'info_notice_detile_link',event:'clickEventTrigger'});\">" +
601        (infoList.service_nm
602          ? '<div class="newt-label">' + infoList.service_nm + "</div>"
603          : '<div class="newt-label newt-label--empty"></div>') +
604        '<div class="newt-date">' +
605        infoList.keisaidate_from +
606        "</div>" +
607        "<p>" +
608        infoList.title +
609        "</p>" +
610        "</a>" +
611        "</li>";
612    }
613
614    return html;
615  }
616
617  // 重要なお知らせの関数定義
618  function loadMaintenance() {
619    var endpoint = jsonpEndpoints.maintenance;
620
621    fetchJsonp(endpoint.url, endpoint.callback).done(function (data) {
622      if (!validateMaintenanceData(data)) {
623        return;
624      }
625      renderMaintenance(data);
626    });
627  }
628
629  function renderMaintenance(data) {
630    var maxLength = 5;
631    var commonInfoData = [];
632    var otherInfoData = [];
633    var commonInfoReleaseData = [];
634    var otherInfoReleaseData = [];
635
636    var currentDate = new Date();
637
638    if (!data["000"] && !data["007"]) {
639      $(".newt-header-info").remove();
640      return false;
641    }
642
643    // 000 データ
644    commonInfoData = !data["000"] ? [] : data["000"].info;
645    // 007 データ
646    otherInfoData = !data["007"] ? [] : data["007"].info;
647
648    if (!commonInfoData.length && !otherInfoData.length) {
649      $(".newt-header-info").remove();
650      return false;
651    }
652
653    $(".newt-header-info")[0].style.visibility = "visible";
654    var wrap = $("#newt-header-info-list")[0];
655    if (!wrap) {
656      return false;
657    }
658
659    // 掲載日sort ====================================================
660    for (var i = 0; i < commonInfoData.length; i++) {
661      var startDate = new Date(commonInfoData[i].start.replace(/-/g, "/"));
662      var endDate = new Date(commonInfoData[i].end.replace(/-/g, "/"));
663      commonInfoData[i].start = commonInfoData[i].start.replace(/-/g, "/");
664      commonInfoData[i].end = commonInfoData[i].end.replace(/-/g, "/");
665
666      if (startDate < currentDate && endDate > currentDate) {
667        commonInfoReleaseData.push(commonInfoData[i]);
668      }
669    }
670    for (var i = 0; i < otherInfoData.length; i++) {
671      var startDate = new Date(otherInfoData[i].start.replace(/-/g, "/"));
672      var endDate = new Date(otherInfoData[i].end.replace(/-/g, "/"));
673      otherInfoData[i].start = otherInfoData[i].start.replace(/-/g, "/");
674      otherInfoData[i].end = otherInfoData[i].end.replace(/-/g, "/");
675
676      if (startDate < currentDate && endDate > currentDate) {
677        otherInfoReleaseData.push(otherInfoData[i]);
678      }
679    }
680    commonInfoReleaseData.sort((a, b) => new Date(b.start) - new Date(a.start));
681    otherInfoReleaseData.sort((a, b) => new Date(b.start) - new Date(a.start));
682    var commonInfoDataLength = Math.min(
683      commonInfoReleaseData.length,
684      maxLength,
685    );
686
687    // 共通　====================================================
688    for (var i = 0; i < commonInfoDataLength; i++) {
689      var p = document.createElement("p");
690
691      if (commonInfoReleaseData[i].link) {
692        var a = document.createElement("a");
693        a.href = commonInfoReleaseData[i].link;
694        a.innerHTML = commonInfoReleaseData[i].message;
695        a.onclick = function () {
696          dataLayer.push({
697            category: "common",
698            action: "header",
699            label: "info_important",
700            event: "clickEventTrigger",
701          });
702        };
703        p.appendChild(a);
704      } else {
705        var span = document.createElement("span");
706        span.innerHTML = commonInfoReleaseData[i].message;
707        p.appendChild(span);
708      }
709      wrap.appendChild(p);
710    }
711
712    // 共通以外　====================================================
713    if (commonInfoDataLength < 5) {
714      var otherInfoDataLength = Math.min(
715        otherInfoReleaseData.length,
716        maxLength - commonInfoDataLength,
717      );
718      for (var i = 0; i < otherInfoDataLength; i++) {
719        var p = document.createElement("p");
720
721        if (otherInfoReleaseData[i].link) {
722          var a = document.createElement("a");
723          a.href = otherInfoReleaseData[i].link;
724          a.innerHTML = otherInfoReleaseData[i].message;
725          a.onclick = function () {
726            dataLayer.push({
727              category: "common",
728              action: "header",
729              label: "info_important",
730              event: "clickEventTrigger",
731            });
732          };
733          p.appendChild(a);
734        } else {
735          var span = document.createElement("span");
736          span.innerHTML = otherInfoReleaseData[i].message;
737          p.appendChild(span);
738        }
739        wrap.appendChild(p);
740      }
741    }
742
743    // お知らせ有無 チェック　====================================================
744    if (!commonInfoReleaseData.length && !otherInfoReleaseData.length) {
745      $("#newt-ghedaer").addClass("no-info");
746      $(".newt-header-info").remove();
747      return false;

748    }
749  }
750
751  // トップバナーの関数定義
752  function loadTopBanner() {
753    var endpoint = jsonpEndpoints.topbanner;
754
755    fetchJsonp(endpoint.url, endpoint.callback).done(function (data) {
756      if (data === null) {
757        return;
758      }
759      if (!validateExternalJsonpData(data)) {
760        return;
761      }
762      renderTopBanner(data);
763    });
764  }
765
766  //TOPバナーのデータを元に、DOMを更新する関数を定義
767  function renderTopBanner(data) {
768    if (data === null) {
769      $(".newt-header-info-bnr").remove();
770    }
771    if (data === null) {
772      return false;
773    }
774
775    var wrap = $("#newt-info-bnr")[0];
776    if (!wrap) {
777      return false;
778    }
779    var ul = document.createElement("ul");
780    var len = Math.min(data.length, 5);
781
782    for (var i = 0; i < len; i++) {
783      var li = document.createElement("li");
784      var a = document.createElement("a");
785      var pcimg = new Image();
786      pcimg.src = imgBasePath + "banner/" + data[i].pcimg;
787      pcimg.className = "newt-ignore-sp";
788      var spimg = new Image();
789      spimg.src = imgBasePath + "banner/" + data[i].spimg;
790      spimg.className = "newt-ignore-pc";
791      a.href = data[i].link;
792      a.dataset.index = i;
793      a.onclick = function () {
794        var rel = this.dataset.index;
795        if (window.matchMedia("(min-width: 768px)").matches) {
796          dataLayer.push({
797            category: "common",
798            action: "header",
799            label: data[rel].pcimg,
800            event: "clickEventTrigger",
801          });
802        } else {
803          dataLayer.push({
804            category: "common",
805            action: "header",
806            label: data[rel].spimg,
807            event: "clickEventTrigger",
808          });
809        }
810      };
811      a.appendChild(pcimg);
812      a.appendChild(spimg);
813      li.appendChild(a);
814      ul.appendChild(li);
815      wrap.appendChild(ul);
816
817      // ＊ Timer設定　＝＝＝＝＝＝＝
818      li.style.display = "none";
819      setTopBannerTimer(li, data[i].release_start, data[i].release_end);
820    }
821
822    // ＊ バナー 表示チェック　＝＝＝＝＝＝＝
823    var bnrList = $(".newt-header-info-bnr li");
824    var isNonBnr = true;
825
826    checkBnrStatus(bnrList);
827    setInterval(function () {
828      checkBnrStatus(bnrList);
829    }, 1000);
830  }
831
832  // タイマー設定（掲載期間チェック）
833  function setTopBannerTimer(_elm, _start, _end) {
834    var timer;
835    var st = _start.split("-");
836    var et = _end.split("-");
837
838    var startTime = new Date(
839      st[0] + "/" + st[1] + "/" + st[2] + " " + st[3] + ":" + st[4],
840    );
841    var endTime = new Date(
842      et[0] + "/" + et[1] + "/" + et[2] + " " + et[3] + ":" + et[4],
843    );
844
845    checkTime();
846
847    timer = setInterval(function () {
848      checkTime();
849    }, 1000);
850
851    function checkTime() {
852      var now = new Date();
853      if (now >= startTime && now <= endTime) {
854        _elm.style.display = "block";
855        _elm.dataset.status = "visible";
856      } else {
857        _elm.style.display = "none";
858        _elm.dataset.status = "hidden";
859      }
860    }
861  }
862
863  // バナー表示チェック
864  function checkBnrStatus(bnrList) {
865    var bnrCount = 0;
866
867    for (var i = 0; i < bnrList.length; i++) {
868      var status = $(bnrList[i]).attr("data-status");
869      if (status == "visible") {
870        isNonBnr = false;
871      }
872
873      if (status == "hidden") {
874        bnrCount++;
875        if (bnrCount == bnrList.length) {
876          isNonBnr = true;
877        }
878      }
879
880      if (isNonBnr) {
881        $("#newt-ghedaer").addClass("no-bnr");
882      } else {
883        $("#newt-ghedaer").removeClass("no-bnr");
884      }
885    }
886  }
887
888  // 中間バナーの関数定義
889  function loadTopBanner2() {
890    var endpoint = jsonpEndpoints.topbanner2;
891
892    fetchJsonp(endpoint.url, endpoint.callback).done(function (data) {
893      if (data === null) {
894        return;
895      }
896      if (!validateExternalJsonpData(data)) {
897        return;
898      }
899      renderTopBanner2(data);
900    });
901  }
902
903  //中間バナーのデータを元に、DOMを更新する関数を定義
904  function renderTopBanner2(data) {
905    if (data === null) {
906      $(".newt-top-inner__banner").remove();
907      return false;

908    }
909
910    var wrap = $(".newt-top-inner__banner")[0];
911    if (!wrap) {
912      return false;
913    }
914
915    // 既存の静的コンテンツをクリア
916    wrap.innerHTML = "";
917
918    var ul = document.createElement("ul");
919    var len = Math.min(data.length, 5);
920
921    for (var i = 0; i < len; i++) {
922      var li = document.createElement("li");
923      var a = document.createElement("a");
924      var pcimg = new Image();
925      pcimg.src = imgBasePath + "banner/" + data[i].pcimg;
926      pcimg.className = "newt-ignore-sp";
927      var spimg = new Image();
928      spimg.src = imgBasePath + "banner/" + data[i].spimg;
929      spimg.className = "newt-ignore-pc";
930      a.href = data[i].link;
931      a.dataset.index = i;
932      a.onclick = function () {
933        var rel = this.dataset.index;
934        if (window.matchMedia("(min-width: 768px)").matches) {
935          dataLayer.push({
936            category: "excv_cal",
937            action: "img_click",
938            label: data[rel].pcimg,
939            event: "clickEventTrigger",
940          });
941        } else {
942          dataLayer.push({
943            category: "excv_cal",
944            action: "img_click",
945            label: data[rel].spimg,
946            event: "clickEventTrigger",
947          });
948        }
949      };
950      a.appendChild(pcimg);
951      a.appendChild(spimg);
952      li.appendChild(a);
953      ul.appendChild(li);
954
955      // Timer設定（掲載期間チェック）
956      li.style.display = "none";
957      setTopBanner2Timer(li, data[i].release_start, data[i].release_end);
958    }
959
960    wrap.appendChild(ul);
961
962    // バナー表示チェック
963    var bnrList = $(".newt-top-inner__banner li");
964    checkTopBanner2Status(bnrList);
965    setInterval(function () {
966      checkTopBanner2Status(bnrList);
967    }, 1000);
968  }
969
970  // 中間バナー タイマー設定（掲載期間チェック）
971  function setTopBanner2Timer(_elm, _start, _end) {
972    var timer;
973    var st = _start.split("-");
974    var et = _end.split("-");
975
976    var startTime = new Date(
977      st[0] + "/" + st[1] + "/" + st[2] + " " + st[3] + ":" + st[4],
978    );
979    var endTime = new Date(
980      et[0] + "/" + et[1] + "/" + et[2] + " " + et[3] + ":" + et[4],
981    );
982
983    checkTime();
984
985    timer = setInterval(function () {
986      checkTime();
987    }, 1000);
988
989    function checkTime() {
990      var now = new Date();
991      if (now >= startTime && now <= endTime) {
992        _elm.style.display = "block";
993        _elm.dataset.status = "visible";
994      } else {
995        _elm.style.display = "none";
996        _elm.dataset.status = "hidden";
997      }
998    }
999  }
1000
1001  // 中間バナー 表示チェック
1002  function checkTopBanner2Status(bnrList) {
1003    var bnrCount = 0;
1004    for (var i = 0; i < bnrList.length; i++) {
1005      var status = $(bnrList[i]).attr("data-status");
1006      if (status == "visible") {
1007        $(".newt-top-inner__banner").show();
1008        return;
1009      }
1010      if (status == "hidden") {
1011        bnrCount++;
1012      }
1013    }
1014    if (bnrCount == bnrList.length) {
1015      $(".newt-top-inner__banner").hide();
1016    }
1017  }
1018
1019  // TOPカルーセルバナーの関数定義
1020  function loadMainSlider() {
1021    if (!$(".newt-top-slide-contents")[0]) {
1022      return;
1023    }
1024
1025    var endpoint = jsonpEndpoints.main;
1026
1027    fetchJsonp(endpoint.url, endpoint.callback).done(function (data) {
1028      if (!validateExternalJsonpData(data)) {
1029        return;
1030      }
1031      renderMainSlider(data);
1032    });
1033  }
1034
1035  // TOPカルーセルバナーのデータを元に、DOMを更新する関数を定義
1036  function renderMainSlider(data) {
1037    var fvData = [];
1038    var ramdomData = [];
1039
1040    for (var i = 0; i < data.length; i++) {
1041      if (data[i].id) {
1042        fvData.push(data[i]);
1043      } else {
1044        ramdomData.push(data[i]);
1045      }
1046    }
1047
1048    fvData.sort(function (a, b) {
1049      if (a.id < b.id) return -1;
1050      if (a.id > b.id) return 1;
1051      return 0;
1052    });
1053
1054    for (i = ramdomData.length - 1; i > 0; i--) {
1055      var j = Math.floor(Math.random() * (i + 1));
1056      var tmp = ramdomData[i];
1057      ramdomData[i] = ramdomData[j];
1058      ramdomData[j] = tmp;
1059    }
1060
1061    var sortedData = fvData.concat(ramdomData);
1062
1063    var fixData;
1064
1065    if (sortedData.length > 2 && sortedData.length < 6) {
1066      fixData = [];
1067      for (var j = 0; j < 2; j++) {
1068        for (var k = 0; k < sortedData.length; k++) {
1069          fixData.push(sortedData[k]);
1070        }
1071      }
1072    } else if (sortedData.length == 2) {
1073      fixData = [];
1074      for (var j = 0; j < 3; j++) {
1075        for (var k = 0; k < sortedData.length; k++) {
1076          fixData.push(sortedData[k]);
1077        }
1078      }
1079    } else {
1080      fixData = sortedData;
1081    }
1082
1083    var container = $(".newt-top-slide-contents")[0];
1084    if (!container) {
1085      return;
1086    }
1087
1088    // DOM構造を動的に生成
1089    var slideWrap = document.createElement("div");
1090    slideWrap.className = "newt-top-slide-wrap";
1091    var mainSlider = document.createElement("div");
1092    mainSlider.id = "newt-top-slide";
1093    slideWrap.appendChild(mainSlider);
1094
1095    var navWrap = document.createElement("div");
1096    navWrap.className = "newt-top-slide-nav-wrap";
1097    var mainSliderNav = document.createElement("div");
1098    mainSliderNav.id = "newt-top-slide-nav";
1099    navWrap.appendChild(mainSliderNav);
1100
1101    container.appendChild(slideWrap);
1102    container.appendChild(navWrap);
1103
1104    var navW = Math.min(sortedData.length * 80, 400);
1105    $(mainSliderNav).css({
1106      width: navW,
1107      marginLeft: -navW / 2,
1108    });
1109
1110    for (var i = 0; i < fixData.length; i++) {
1111      var div = document.createElement("div");
1112      var span = document.createElement("span");
1113      var a = document.createElement("a");
1114
1115      var img = new Image();
1116      img.src = imgBasePath + "banner/" + fixData[i].img;
1117      a.href = fixData[i].link;
1118      a.dataset.label = fixData[i].img;
1119
1120      a.appendChild(img);
1121      span.appendChild(a);
1122      div.appendChild(span);
1123      mainSlider.appendChild(div);
1124    }
1125
1126    for (var i = 0; i < sortedData.length; i++) {
1127      var div = document.createElement("div");
1128      var span = document.createElement("span");
1129      var a = document.createElement("a");
1130
1131      var img = new Image();
1132      img.src = imgBasePath + "banner/" + sortedData[i].img;
1133
1134      a.href = "javascript:void(0)";
1135
1136      a.appendChild(img);
1137      span.appendChild(a);
1138      div.appendChild(span);
1139      mainSliderNav.appendChild(div);
1140    }
1141
1142    // Slickスライダーの初期化
1143    initMainSlick(sortedData);
1144
1145    $(".newt-top-slide-contents").show();
1146  }
1147
1148  function initMainSlick(data) {
1149    var showCountMain;
1150    var showCountNav;
1151    var navTarget;
1152
1153    if (data.length == 1) {
1154      showCountMain = 1;
1155      showCountNav = 1;
1156    } else {
1157      showCountMain = 5;
1158      showCountNav = Math.min(data.length, 5);
1159    }
1160
1161    if (data.length > 5) {
1162      navTarget = "#newt-top-slide-nav";
1163    }
1164    var mainSlideElm = $("#newt-top-slide");
1165    var mainSlideNav = $("#newt-top-slide-nav");
1166
1167    mainSlideElm.slick({
1168      autoplay: true,
1169      autoplaySpeed: 3000,
1170      speed: 500,
1171      slidesToShow: showCountMain,
1172      slidesToScroll: 1,

1173      arrows: false,
1174      centerMode: true,
1175      asNavFor: navTarget,
1176      centerPadding: "0",
1177      touchThreshold: 8,
1178      responsive: [
1179        {
1180          breakpoint: 768,
1181          settings: {
1182            slidesToShow: 1,
1183            slidesToScroll: 1,
1184            centerMode: true,
1185            centerPadding: "40px",
1186            dots: true,
1187            touchThreshold: 5,
1188          },
1189        },
1190      ],
1191    });
1192
1193    mainSlideNav.slick({
1194      speed: 400,
1195      slidesToShow: showCountNav,
1196      slidesToScroll: 1,
1197      asNavFor: "#newt-top-slide",
1198      focusOnSelect: true,
1199      variableWidth: true,
1200    });
1201
1202    var mainSlideNavList = $("#newt-top-slide-nav .slick-slide");
1203
1204    if (data.length <= 5) {
1205      mainSlideElm.on("afterChange", function (currentSlide, nextSlide) {
1206        var currentSlide = mainSlideElm.slick("slickCurrentSlide");
1207
1208        currentSlide = currentSlide % data.length;
1209        mainSlideNavList.removeClass("slick-current");
1210        mainSlideNavList.eq(currentSlide).addClass("slick-current");
1211      });
1212    }
1213
1214    // GA
1215    $("#newt-top-slide .slick-slide a").on("click", function () {
1216      var label = $(this).data("label");
1217      sendGaPv(label);
1218    });
1219
1220    function sendGaPv(label) {
1221      dataLayer.push({
1222        category: "top",
1223        action: "main_bnr",
1224        label: label,
1225        event: "clickEventTrigger",
1226      });
1227    }
1228  }
1229
1230  // 今週おすすめの関数定義
1231  function loadOsusume() {
1232    var endpoint = jsonpEndpoints.osusume;
1233
1234    fetchJsonp(endpoint.url, endpoint.callback).done(function (data) {
1235      if (!validateExternalJsonpData(data)) {
1236        return;
1237      }
1238      renderOsusume(data);
1239    });
1240  }
1241
1242  function renderOsusume(data) {
1243    var $wrap = $("#newt-top-recommend-list");
1244    var $ul = $("<ul>");
1245
1246    for (var i = 0; i < data.length; i++) {
1247      var $li = $("<li>");
1248      var $a = $("<a>", {
1249        href: data[i].link,
1250        rel: i,
1251        onclick:
1252          "dataLayer.push({category: 'top', action: 'campaign', label: '" +
1253          data[i].img_banner +
1254          "', event: 'clickEventTrigger'});",
1255      });
1256      var $figure = $("<figure>");
1257      var $div = $("<div>", { class: "newt-top-recommend-list-txt" });
1258      var $span = $("<span>", { class: "label", html: data[i].service });
1259      var $p = $("<p>").html(data[i].lead);
1260      var $img = $("<img>", {
1261        src: imgBasePath + "banner/" + data[i].img_banner,
1262      });
1263
1264      $figure.append($img);
1265      $div.append($span, $p);
1266      $a.append($figure, $div);
1267      $li.append($a);
1268      $ul.append($li);
1269    }
1270    $wrap.append($ul);
1271  }
1272
1273  // 貯まる・使えるお店の関数定義
1274  function loadStore() {
1275    var endpoint = jsonpEndpoints.store;
1276
1277    fetchJsonp(endpoint.url, endpoint.callback).done(function (data) {
1278      if (!validateExternalJsonpData(data)) {
1279        return;
1280      }
1281      renderStore(data);
1282    });
1283  }
1284

1285  function renderStore(data) {
1286    var releaseData = [];
1287    var currentDate = new Date();
1288
1289    // リリースsort ====================================================
1290
1291    for (var i = 0; i < data.length; i++) {
1292      var st = data[i].release.split("-");
1293      var startDate = new Date(
1294        st[0] + "/" + st[1] + "/" + st[2] + " " + st[3] + ":" + st[4],
1295      );
1296      data[i].release = startDate;
1297
1298      if (startDate < currentDate) {
1299        releaseData.push(data[i]);
1300      }
1301    }
1302
1303    releaseData.sort((a, b) => new Date(b.release) - new Date(a.release));
1304
1305    var wrap = document.getElementById("newt-top-saveuse-list");
1306    var ul = document.createElement("ul");
1307
1308    for (var i = 0; i < releaseData.length; i++) {
1309      var li = document.createElement("li");
1310      var a = document.createElement("a");
1311      a.href = releaseData[i].link;
1312      a.dataset.index = i;
1313      a.onclick = function () {
1314        var rel = this.dataset.index;
1315        dataLayer.push({
1316          category: "top",
1317          action: "shop",
1318          label: releaseData[rel].img,
1319          event: "clickEventTrigger",
1320        });
1321      };
1322
1323      li.dataset.release = releaseData[i].release;
1324      var releaseDate = new Date(releaseData[i].release);
1325      var limitDate = new Date(releaseData[i].release);
1326      limitDate = limitDate.setDate(releaseDate.getDate() + releaseData[i].new);
1327      if (currentDate < new Date(limitDate)) {
1328        a.className = "new";
1329      }
1330      var img = new Image();
1331      img.src = imgBasePath + "banner/" + releaseData[i].img;
1332
1333      a.appendChild(img);
1334      li.appendChild(a);
1335      ul.appendChild(li);
1336    }
1337    var urlGet = location.href;
1338    if (!urlGet.match(/logout|STKIp0001003/)) {
1339      wrap.appendChild(ul);
1340    }
1341  }
1342
1343  //フッターカルーセルバナーの関数定義
1344  function loadFooterSlider() {
1345    if (!$(".newt-footer-sld-bnr-slider")[0]) {
1346      return;
1347    }
1348
1349    var endpoint = jsonpEndpoints.footer;
1350
1351    fetchJsonp(endpoint.url, endpoint.callback).done(function (data) {
1352      if (!validateExternalJsonpData(data)) {
1353        return;
1354      }
1355      renderFooterSlider(data);
1356    });
1357  }
1358
1359  function renderFooterSlider(data) {
1360    var fvData = [];
1361    var randomData = [];
1362
1363    for (var i = 0; i < data.length; i++) {
1364      if (data[i].id) {
1365        fvData.push(data[i]);
1366      } else {
1367        randomData.push(data[i]);
1368      }
1369    }
1370
1371    fvData.sort(function (a, b) {
1372      if (a.id < b.id) return -1;
1373      if (a.id > b.id) return 1;
1374      return 0;
1375    });
1376
1377    for (i = randomData.length - 1; i > 0; i--) {
1378      var j = Math.floor(Math.random() * (i + 1));
1379      var tmp = randomData[i];
1380      randomData[i] = randomData[j];
1381      randomData[j] = tmp;
1382    }
1383
1384    var sortedData = fvData.concat(randomData);
1385
1386    var wrap = $(".newt-footer-sld-bnr-slider")[0];
1387
1388    for (var i = 0; i < sortedData.length; i++) {
1389      var div = document.createElement("div");
1390      var span = document.createElement("span");
1391      var a = document.createElement("a");
1392      var figure = document.createElement("figure");
1393      var img = new Image();
1394      img.src = imgBasePath + "banner/" + sortedData[i].img;
1395      a.dataset.label = sortedData[i].img;
1396      a.href = sortedData[i].link;
1397
1398      figure.appendChild(img);
1399      a.appendChild(figure);
1400      span.appendChild(a);
1401      div.appendChild(span);
1402      wrap.appendChild(div);
1403    }
1404
1405    initFooterSlick();
1406  }
1407
1408  function initFooterSlick() {
1409    var sendFlag = [];
1410    var newtFooterSldBnrSlider = $(".newt-footer-sld-bnr-slider");
1411
1412    $(window).on("scroll", function () {
1413      watchFooterSlider(newtFooterSldBnrSlider, sendFlag);
1414    });
1415
1416    newtFooterSldBnrSlider
1417      .slick({
1418        autoplay: true,
1419        autoplaySpeed: 3000,
1420        speed: 400,
1421        slidesToShow: 4,
1422        slidesToScroll: 1,
1423        responsive: [
1424          {
1425            breakpoint: 768,
1426            settings: {
1427              slidesToShow: 1,
1428              slidesToScroll: 1,
1429              centerMode: true,
1430              centerPadding: "75px",
1431            },
1432          },
1433        ],
1434      })
1435      .on("afterChange", function () {
1436        watchFooterSlider(newtFooterSldBnrSlider, sendFlag);
1437      });
1438
1439    $(".newt-footer-sld-bnr-slider .slick-slide a").on("click", function () {
1440      var label = $(this).data("label");
1441      dataLayer.push({
1442        category: "carousel",
1443        action: "click",
1444        label: label,
1445        event: "clickEventTrigger",
1446      });
1447    });
1448
1449    function sendGaPv(label) {
1450      dataLayer.push({
1451        category: "carousel",
1452        action: "view",
1453        label: label,
1454        event: "clickEventTrigger",
1455      });
1456    }
1457
1458    function watchFooterSlider() {
1459      if (!isVisible(newtFooterSldBnrSlider)) {
1460        return false;

1461      }
1462      newtFooterSldBnrSlider
1463        .find('.slick-slide[aria-hidden = "false"] a')
1464        .each(function (index, element) {
1465          var _label = $(element).data("label");
1466
1467          if (sendFlag.indexOf(_label) == -1) {
1468            sendFlag.push(_label);
1469            sendGaPv(_label);
1470          }
1471        });
1472    }
1473
1474    function isVisible(target) {
1475      var _tH = target.height();
1476      var _per = _tH * 0.6;
1477      var _sT = $(window).scrollTop() - _per;
1478      var _sB = _sT + window.innerHeight;
1479      var _tT = target.offset().top;
1480      var _tB = _tT + _tH - _per * 2;
1481
1482      if (_sB > _tT && _sT < _tB) {
1483        return true;
1484      }
1485
1486      return false;
1487    }
1488  }
1489
1490  // ポップアップ機能
1491  var popupConfig = {
1492    startDate: new Date(2026, 7, 1, 0, 0, 0), // 2026/08/01 00:00:00
1493    endDate: new Date(2026, 8, 30, 23, 59, 59), // 2026/09/30 23:59:59
1494    showRatio: 0.9, // 表示確率
1495    reShowInterval: 604800000,  // 7日（ミリ秒）
1496    lpUrl: 'https://web.tsite.jp/cpn/vpoint/coupon-matsuri2/?hensei=tsite_popup',
1497    imagePc: imgBasePath + 'img/top/_r4vp_popup_coupon_matsuri2_pc.png',
1498    imageSp: imgBasePath + 'img/top/_r4vp_popup_coupon_matsuri2_sp.png',
1499    cookieGroupKey: 'vp_popup_group',
1500    cookieClosedKey: 'vp_popup_closed_at'
1501  };
1502
1503  function getCookie(name) {
1504    var nameEQ = name + '=';
1505    var ca = document.cookie.split(';');
1506    for (var i = 0; i < ca.length; i++) {
1507      var c = ca[i].trim();
1508      if (c.indexOf(nameEQ) === 0) {
1509        return c.substring(nameEQ.length);
1510      }
1511    }
1512    return null;
1513  }
1514
1515  function setCookie(name, value, expiresDate) {
1516    var expires = expiresDate ? '; expires=' + expiresDate.toUTCString() : '';
1517    var cookieStr = name + '=' + value + expires + '; path=/; SameSite=Lax; Secure';
1518    document.cookie = cookieStr;
1519  }
1520
1521  function injectPopupStyles() {
1522    if (document.getElementById('vp-popup-styles')) {
1523      return;
1524    }
1525
1526    var styles = document.createElement('style');
1527    styles.id = 'vp-popup-styles';
1528    styles.textContent = '' +
1529      '#vp-popup { display: none; } ' +
1530      '#vp-popup.is-open { display: flex; } ' +
1531      '.vp-popup { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; } ' +
1532      '.vp-popup__overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.6); z-index: -1; opacity: 1; animation: none; } ' +
1533      '.vp-popup__body { position: relative; width: 90%; max-width: 375px; background: #fff; border-radius: 12px; padding: 44px 14px 14px; box-sizing: border-box; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); opacity: 0; animation: vpPopupBodyFadeIn 0.42s ease forwards; } ' +
1534      '@keyframes vpPopupBodyFadeIn { from { opacity: 0; } to { opacity: 1; } } ' +
1535      '.vp-popup__img--pc { display: none; width: 100%; height: auto; } ' +
1536      '.vp-popup__img--sp { display: block; width: 100%; height: auto; } ' +
1537      '.vp-popup__kv { display: block; font-size: 0; line-height: 0; cursor: pointer; } ' +
1538      '.vp-popup__btn { position: relative; display: block; padding: 0; width: 90%; max-width: 312px; height: 44px; background: #e60012; color: #fff; text-decoration: none; border: none; border-radius: 6px; margin: 12px auto 0; cursor: pointer; font-size: 16px; font-weight: bold; text-align: center; line-height: 44px; box-sizing: border-box; } ' +
1539      '.vp-popup__btn:after { content: ">"; position: absolute; right: 16px; top: 0; font-weight: bold; } ' +
1540      '.vp-popup__close { position: absolute; top: 8px; right: 10px; width: 28px; height: 28px; background: none; border: none; cursor: pointer; z-index: 1; font-size: 22px; line-height: 28px; text-align: center; color: #333; padding: 0; } ' +
1541      '.vp-popup__close:before { content: "\\00d7"; } ' +
1542      '@media (min-width: 768px) { ' +
1543        '.vp-popup__body { max-width: 600px; padding: 48px 16px 16px; } ' +
1544        '.vp-popup__img--pc { display: block; } ' +
1545        '.vp-popup__img--sp { display: none; } ' +
1546        '.vp-popup__btn { width: 312px; } ' +
1547      '} ';
1548
1549    document.head.appendChild(styles);
1550  }
1551
1552  var popupPrevOverflow = '';
1553
1554  // ポップアップ表示処理
1555  function showPopup() {
1556    var popupElm = document.getElementById('vp-popup');
1557    if (!popupElm) {
1558      var popupHtml = '' +
1559        '<div id="vp-popup" class="vp-popup">' +
1560          '<div class="vp-popup__overlay" data-popup-close></div>' +
1561          '<div class="vp-popup__body">' +
1562            '<button type="button" class="vp-popup__close" data-popup-close></button>' +
1563            '<a href="' + popupConfig.lpUrl + '" ' +
1564              'class="vp-popup__kv" ' +
1565              'data-popup-link ' +
1566              'rel="noopener noreferrer" ' +
1567              'onclick="dataLayer.push({category:\'tsite_top\',action:\'btn_click\',label:\'tsite_popup\',event:\'clickEventTrigger\'});">' +
1568              '<img class="vp-popup__img--pc" src="' + popupConfig.imagePc + '" alt="クーポン祭り" />' +
1569              '<img class="vp-popup__img--sp" src="' + popupConfig.imageSp + '" alt="クーポン祭り" />' +
1570            '</a>' +
1571            '<a href="' + popupConfig.lpUrl + '" ' +
1572              'class="vp-popup__btn" ' +
1573              'data-popup-link ' +
1574              'rel="noopener noreferrer" ' +
1575              'onclick="dataLayer.push({category:\'tsite_top\',action:\'btn_click\',label:\'tsite_popup\',event:\'clickEventTrigger\'});"' +
1576            '>詳細を見る</a>' +
1577          '</div>' +
1578        '</div>';
1579
1580      var tempDiv = document.createElement('div');
1581      tempDiv.innerHTML = popupHtml;
1582      document.body.appendChild(tempDiv.firstChild);
1583      popupElm = document.getElementById('vp-popup');
1584    }
1585
1586    popupPrevOverflow = document.body.style.overflow;
1587    document.body.style.overflow = 'hidden';
1588
1589    attachPopupEventListeners();
1590
1591    popupElm.classList.add('is-open');
1592
1593    dataLayer.push({
1594      event: 'popup_imp',
1595      banner_name: '2608_SummerCP'
1596    });
1597  }
1598
1599  function closePopup() {
1600    var popupElm = document.getElementById('vp-popup');
1601    if (!popupElm || !popupElm.classList.contains('is-open')) {
1602      return;
1603    }
1604
1605    var nowMs = new Date().getTime();

1606    setCookie(popupConfig.cookieClosedKey, String(nowMs), popupConfig.endDate);
1607
1608    popupElm.classList.remove('is-open');
1609
1610    document.body.style.overflow = popupPrevOverflow;
1611
1612    dataLayer.push({
1613      category: 'tsite_top',
1614      action: 'btn_click',
1615      label: 'tsite_popup_close',
1616      event: 'clickEventTrigger'
1617    });
1618  }
1619
1620  function attachPopupEventListeners() {
1621    var closeElms = document.querySelectorAll('[data-popup-close]');
1622
1623    for (var i = 0; i < closeElms.length; i++) {
1624      closeElms[i].addEventListener('click', function(e) {
1625        e.preventDefault();
1626        closePopup();
1627      });
1628    }
1629
1630    document.addEventListener('keydown', function popupEscHandler(e) {
1631      if (e.key === 'Escape') {
1632        var popupElm = document.getElementById('vp-popup');
1633        if (popupElm && popupElm.classList.contains('is-open')) {
1634          closePopup();
1635          document.removeEventListener('keydown', popupEscHandler);
1636        }
1637      }
1638    });
1639  }
1640
1641  function initPopup() {
1642    if (location.pathname !== '/') {
1643      return;
1644    }
1645
1646    var now = new Date();
1647    if (now < popupConfig.startDate || now >= popupConfig.endDate) {
1648      return;
1649    }
1650
1651    if (!navigator.cookieEnabled) {
1652      return;
1653    }
1654
1655    var groupValue = getCookie(popupConfig.cookieGroupKey);
1656    if (!groupValue) {
1657      var rand = Math.random();
1658      if (rand < popupConfig.showRatio) {
1659        groupValue = 'show';
1660      } else {
1661        groupValue = 'hide';
1662      }
1663      setCookie(popupConfig.cookieGroupKey, groupValue, popupConfig.endDate);
1664    }
1665
1666    if (groupValue !== 'show') {
1667      return;
1668    }
1669
1670    var closedAtTimestamp = getCookie(popupConfig.cookieClosedKey);
1671    if (closedAtTimestamp) {
1672      var closedAt = Number(closedAtTimestamp);
1673      var elapsedTime = now.getTime() - closedAt;
1674      if (elapsedTime < popupConfig.reShowInterval) {
1675        return;
1676      }
1677    }
1678
1679    injectPopupStyles();
1680    showPopup();
1681  }
1682
1683  initPopup();
1684});