<script src="/javascripts/debounce.js?20240718"></script>
<script>
//
function selectColorByGclId($newCartArea, gclId) {
const $form = $newCartArea.closest('form');
const formId = $form.attr('id');
const $sizeSelector = $newCartArea.find('.size-selector')
.removeClass('active')
.filter(`[data-gcl-id="${gclId}"]`).addClass('active').find('input.kazu[name^="product_matrix"]').attr('form', formId)
;
}
//
$(function () {
//
$('.new-cart-area').each(function (i) {
//
const $newCartArea = $(this);
const $colorSelector = $newCartArea.find('.color-selector').each(function (j) {
//
const $colorSelector = $(this);
//
$colorSelector.find('.color-tile')
.on('click', function (e) {
//
const $colorTile = $(this);
const $selectedColorImageHolder = $colorTile.find('.image-holder');
const $selectedColorImage = $colorTile.find('img');
const $selectedColorTitle = $selectedColorImageHolder.siblings('.tile-name');
const $currentColorImgHolder = $newCartArea.find('.current-sku-info .current-color .image-holder');
const $currentColorImg = $newCartArea.find('.current-sku-info .current-color .current-color-img');
const $currentColorTitle = $currentColorImgHolder.siblings('.tile-name');
const gclId = $colorTile.data('gclId');
//
selectColorByGclId($newCartArea, gclId);
//
$colorSelector.find('.color-tile').removeClass('active');
$colorTile.addClass('active');
//
$currentColorImgHolder.removeClass('sokujitsu-hassou');
if ($selectedColorImageHolder.is('.sokujitsu-hassou')) $currentColorImgHolder.addClass('sokujitsu-hassou');
$currentColorImg.attr('src', $selectedColorImage.attr('src'));
$currentColorTitle.text($selectedColorTitle.text());
})
.eq(0)
.click()
;
//
});
});
$('.btn_next_item').on("click", function(e) {
const $anchorWrapper = $(this).closest('.anchor-wrapper');
const $currentAnchor = $anchorWrapper.find('.anchor');
const currentIndex = $('.anchor').index($currentAnchor);
const targetIndex = currentIndex + 1;
const $targetAnchor = $('.anchor').eq(targetIndex);
$('body,html').animate({
scrollTop: $targetAnchor.offset().top
}, 500);
});
var isProgress = false;
$(".add-to-cart").on("click", debounce(function(event){
const $button = $(this);
const $form = $button.closest('form');
let getClass = $(this).children().attr('class');
let EstimateType = "{{EstimateType()}}";
let actionUrl = '';
console.log(EstimateType);
if (isProgress){
return;
}
isProgress = true
if(getClass === 'muji'){
actionUrl = "/cart/add_Normal";
}else if(getClass === 'print' || getClass === 'susoage'){
actionUrl = "/cart/valid_estimate";
}else if(getClass === 'sample'){
actionUrl = "/cart/add_sample";
}
$.ajax({
type: "POST",
url: actionUrl,
data: $form.serialize(),
dataTyep: 'text',
timespan: 1000,
})
.done(function(data, textStatus, jqXHR) {
console.log(jqXHR.status); // 200
console.log(textStatus); // success
console.log(data);
if(data.status=='OK'){
console.log(data.data);
if(getClass == 'print' || getClass == 'susoage'){
$form.attr('action','/estimate/');
$form.submit();
}else{
window.location.href= '/cart';
}
}
if(data.status=='Error'){
console.log(data.Errors);
var errorMsg="";
$.each(data.Errors ,function(index,val){
errorMsg += val.message+"\n";
});
if (data.show_error_modal) {
showErrorModal(errorMsg)
} else {
alert(errorMsg);
$form[0].reset();
}
$('#OlToken').val(data.OlToken);
}
})
.fail(function(jqXHR, textStatus, errorThrown) {
console.log(jqXHR.status); // 404...
console.log(textStatus); // error
console.log(errorThrown); // NOT FOUND
$form[0].reset();
alert('送信エラー:もう一度やり直してください');
location.reload();
})
.always(function() {
console.log("complete"); // complete
var overlayEle = $('.bg-load-overlay');
if (overlayEle.length) {
overlayEle.fadeOut(function () {
$(this).remove();
});
}
isProgress = false;
});
}, 500));
$('.sokujitsu-hassou-banner > dl > .overlay').on('click', function () {
$(this).hide();
$(this).parent('dl').removeClass('closed').addClass('opened');
});
$('.btn-up-down').each(function (i) {
//
const $wrapper = $(this);
const $quantity = $wrapper.siblings('input.kazu');
//
$wrapper.find('.btn-up,.btn-down').on('click', function (e) {
//
const $btn = $(this);
const step = parseInt($quantity.attr('step')) || 1;
const min = parseInt($quantity.attr('min')) || 0;
const quantity = parseInt($quantity.val()) || 0;
//
if ($btn.is('.btn-up')) {
$quantity.val(quantity + step);
} else if ($btn.is('.btn-down')) {
$quantity.val(Math.max(min, quantity - step));
}
});
})
});
</script>