You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
cosmopet-architecture/wp-content/themes/cosmopet/static/js/layout-form.js

376 lines
13 KiB

'use strict';
// inputPhone('.form-input__phone', '.form-input-phone__icon', '.form-input-phone__code', '.form-input-phone__input', '.form-input-phone__list', 'form-input-phone-list__item', '.form-input-phone-list-item__icon', '.form-input-phone-list-item__code', 'form-input-phone-list__search');
// function inputPhone(main, mainFlag, mainCode, input, list, selects, selectIcon, selectCode, searchInput) {
// let inputs = document.querySelectorAll(main);
// inputs.forEach(e => {
// let thisMainFlag = e.querySelector(mainFlag),
// thisMainCode = e.querySelector(mainCode),
// thisInput = e.querySelector(input),
// thisList = e.querySelector(list),
// thisSelects = e.querySelectorAll(`.${selects}`),
// thisSearchInput = e.querySelector(`.${searchInput}`);
// thisInput.onblur = function (input) {
// if (!(input.relatedTarget != null && (input.relatedTarget.classList.contains(searchInput) || input.relatedTarget.classList.contains(selects)))) {
// thisList.classList.remove('active');
// }
// }
// e.onclick = function (event) {
// if (!event.target.classList.contains(searchInput)) {
// if (thisList.classList.contains('active')) {
// thisList.classList.remove('active');
// }
// thisInput.focus();
// thisList.classList.add('active');
// }
// }
// thisSelects.forEach(e => {
// let newIcon = e.querySelector(selectIcon),
// newCode = e.querySelector(selectCode);
// e.onclick = function (event) {
// event.preventDefault();
// thisMainFlag.style.cssText = `background-image:url("${newIcon.src}");`;
// thisMainCode.textContent = newCode.textContent;
// setTimeout(() => {
// thisList.classList.remove('active');
// }, 0);
// }
// })
// })
// }
if (document.querySelector('.form-input-phone__input')) {
checkPhone('.form-input-phone__input');
}
function checkPhone(input) {
document.querySelector(input).addEventListener('input', function(event) {
let text = event.target.value;
let length = text.length;
let newSymbol = event.data;
if (!(/^\d+$/.test(text.replaceAll(' ', '')))) {
event.target.value = text.slice(0, -1);
return;
}
if (length == 4 || length == 8) {
if (newSymbol != null) {
event.target.value = text.slice(0, -1) + ' ' + newSymbol;
}
}
})
}
inputTabs('.form-input__tabs', '.form-input-tabs__button');
inputTabs('.modal-map__control', '.modal-map-control__item');
function inputTabs(main, button) {
let mains = document.querySelectorAll(main);
mains.forEach(main => {
let buttons = main.querySelectorAll(button);
buttons.forEach(button => {
button.onclick = function () {
main.querySelector('.active').classList.remove('active');
button.classList.add('active');
}
})
})
}
// inputRadio('.form-input__radio', '.form-input-radio__item', '.form-input-radio__title', '.form-input-radio__input')
// function inputRadio(main ,item, textClass, input) {
// let inputRadios = document.querySelectorAll(main);
// inputRadios.forEach(inputRadio => {
// let items = inputRadio.querySelectorAll(item),
// thisInput = inputRadio.querySelector(input);
// items.forEach(radio => {
// let thisText = radio.querySelector(textClass).textContent;
// radio.onclick = function (event) {
// event.preventDefault();
// if (inputRadio.querySelector(`${item}.active`)) {
// inputRadio.querySelector(`${item}.active`).classList.remove('active');
// }
// thisInput.value = thisText;
// radio.classList.add('active');
// }
// })
// })
// }
// listInputRadio('.form-input__list' ,'.form-input-list__item', '.form-input-list-item__text', '.form-input-list__content', '.form-input-list__block-content');
// function listInputRadio(main ,item, textClass, input, content, block) {
// let listInputRadios = document.querySelectorAll(main);
// listInputRadios.forEach(listInputRadio => {
// let thisInput = listInputRadio.querySelector(input),
// items = listInputRadio.querySelectorAll(item),
// thisContent = listInputRadio.querySelector(content),
// thisBlock = listInputRadio.querySelector(block);
// // thisInput.onclick = function () {
// // thisBlock.classList.add('active');
// // thisBlock.style.height = '192px';
// // }
// // thisInput.onblur = function(){
// // thisBlock.classList.remove('active');
// // thisBlock.style.height = '0px';
// // };
// items.forEach(item => {
// item.onclick = function (event) {
// event.preventDefault();
// let newText = item.querySelector(textClass).textContent;
// thisInput.value = newText;
// if (thisContent.querySelector('.active')) {
// thisContent.querySelector('.active').classList.remove('active');
// }
// item.classList.add('active');
// }
// })
// })
// }
// remoteControl('.form-input__remote-control', '.form-input-tabs__button');
// remoteControl('.modal-map__control', '.modal-map-control__item');
// function remoteControl(main, button) {
// let mains = document.querySelectorAll(main);
// console.log(mains);
// mains.forEach(main => {
// let subjectClass = main.dataset.content,
// subject = document.querySelector(`.${subjectClass}`),
// buttons = Array.from(main.querySelectorAll(button));
// main.addEventListener('mousedown', function (eventMain) {
// setTimeout(() => {
// let indexActive = buttons.findIndex((button, index) => {
// if (button.classList.contains('active')) {
// return true;
// }
// });
// subject.querySelector('.remote-control__item.active').classList.remove('active');
// subject.children[indexActive].classList.add('active');
// }, 0);
// })
// })
// }
// formCheck('.modal-form__content', 'input[type=submit]');
// formCheck('.modal-map__form', 'input[type=submit]');
// function formCheck(form, submit) {
// let forms = document.querySelectorAll(form);
// forms.forEach(form => {
// let thisSubmit = form.querySelector(submit);
// thisSubmit.onclick = function () {
// form.classList.add('check')
// }
// })
// }
jQuery('.form-input-list__item').on('click', function(){
var value = jQuery(this).find('p').html()
var content = jQuery(this).closest('.form-input-list__block-content')
jQuery(content).prev().html(value)
jQuery(content).removeClass('active').css('height', '0px')
})
jQuery('.form-input-list__input').on('click', function(){
// jQuery(this).next().toggleClass('active')
if(!jQuery(this).next().hasClass('active')){
jQuery('.form-input-list__block-content').removeClass('active').css('height', '0px')
jQuery(this).next().css('height', '192px').addClass('active')
}
else{
jQuery(this).next().css('height', '0px').removeClass('active')
}
})
jQuery(document).mouseup(function(e){
var container = jQuery(".modal-form-content-line__element");
if(!container.is(e.target) && container.has(e.target).length === 0){
jQuery('.form-input-list__block-content').removeClass('active').css('height', '0px')
}
});
jQuery('#add-pet-form').on('submit', function(e) {
e.preventDefault(); // предотвращаем стандартное поведение формы
var data = jQuery(this).serialize()
jQuery(this).find('button[type="submit"]').addClass('loading').attr('disabled', true)
jQuery.ajax({
type: 'POST',
url: woocommerce_params.ajax_url,
data: data, // отправляем данные формы
complete: function(response) {
location.reload(true)
}
});
});
jQuery('.edit-pet-form').on('submit', function(e) {
e.preventDefault(); // предотвращаем стандартное поведение формы
var data = jQuery(this).serialize()
jQuery(this).find('button[type="submit"]').addClass('loading').attr('disabled', true)
jQuery.ajax({
type: 'POST',
url: woocommerce_params.ajax_url,
data: data, // отправляем данные формы
complete: function(response) {
location.reload(true)
}
});
});
jQuery('.form-input-list__item').on('click', function(){
jQuery(this).closest('.form-input-list__content').find('.form-input-list__item').removeClass('active')
jQuery(this).addClass('active')
})
jQuery('.form-input-radio__item').on('click', function(){
jQuery(this).closest('.form-input__radio').find('.form-input-radio__item').removeClass('active')
jQuery(this).addClass('active')
})
jQuery('.cabinet-card__block-add-pets').on('click', function(){
jQuery('#pet_add_form').addClass('active')
})
// jQuery('#pet-form-submit').on('click', function(e) {
// jQuery(this).closest('form').submit()
// });
jQuery('.popup-wrap, .modal-form__close, .modal-form__button-close').on('click', function(e){
if (e.target == this){
jQuery(this).closest('.modalProfile').removeClass('active')
}
})
jQuery('.close-btn').on('click', function(e){
jQuery(this).closest('.modalProfile').removeClass('active')
})
jQuery('input[name="pet"]').on('change', function(
){
var block = jQuery(this).closest('form').find('.sterilized')
if (jQuery(this).val() == 'cat'){
jQuery(block).show()
jQuery(this).closest('form').find('input[name="sterilized"]').attr('required', true)
}
else{
jQuery(block).hide()
jQuery(this).closest('form').find('input[name="sterilized"]').attr('required', false)
}
})
jQuery('[data-edit]').on('click', function(){
jQuery('#pet_edit_'+jQuery(this).data('edit')).addClass('active')
})
// const reset = () => {
// input.classList.remove("error");
// errorMsg.innerHTML = "";
// errorMsg.classList.add("hide");
// validMsg.classList.add("hide");
// };
// const showError = (msg) => {
// input.classList.add("error");
// errorMsg.innerHTML = msg;
// errorMsg.classList.remove("hide");
// };
jQuery('.user-edit-form').on('submit', function(e) {
e.preventDefault(); // предотвращаем стандартное поведение формы
jQuery('.form-input__phone').removeClass('error')
var data = jQuery(this).serialize()
jQuery(this).find('button[type="submit"]').addClass('loading').attr('disabled', true)
jQuery.ajax({
type: 'POST',
url: woocommerce_params.ajax_url,
data: data, // отправляем данные формы
complete: function(response) {
location.reload(true)
}
});
});
jQuery('.email_approve_form, .foodSub').on('submit', function(e) {
e.preventDefault(); // предотвращаем стандартное поведение формы
var data = jQuery(this).serialize()
jQuery(this).find('button[type="submit"]').addClass('loading').attr('disabled', true)
jQuery.ajax({
type: 'POST',
url: woocommerce_params.ajax_url,
data: data, // отправляем данные формы
complete: function(response) {
location.reload(true)
}
});
});
jQuery('.user-edit-open').on('click', function(){
jQuery('#user_edit').addClass('active')
})
jQuery('[data-rm]').on('click', function(){
var rm = jQuery(this).closest('.rm')
jQuery(rm).find('[data-rmcont]').removeClass('active').find('input').attr('required', false)
jQuery(rm).find('[data-rmcont="' + jQuery(this).data('rm') + '"]').addClass('active').find('input').attr('required', true)
})
jQuery('.form-sub__btn').on('click', function(){
jQuery('#subForm').addClass('active')
})