REFACTOR
This commit is contained in:
parent
f9c0c8483e
commit
3d94fd19a3
80
gulpfile.js
80
gulpfile.js
@ -1,4 +1,4 @@
|
||||
const {task, src, dest, parallel, watch} = require('gulp');
|
||||
const {src, dest, parallel, watch} = require('gulp');
|
||||
const sass = require('gulp-sass');
|
||||
const autoprefixer = require('gulp-autoprefixer');
|
||||
const browser = require('browser-sync');
|
||||
@ -13,45 +13,64 @@ const sourcemaps = require('gulp-sourcemaps');
|
||||
const uglify = require('gulp-uglify-es').default;
|
||||
const del = require('del');
|
||||
const header = require('gulp-header');
|
||||
const argv = require('yargs').argv;
|
||||
const gulpif = require('gulp-if');
|
||||
|
||||
const isDevelop = !!argv.develop
|
||||
const isProd = !!argv.production;
|
||||
|
||||
const getCss = async (mode = 'develop') => {
|
||||
const pathConfig = {
|
||||
src: {
|
||||
sass: 'src/sass',
|
||||
js: 'src/js',
|
||||
img: 'src/img',
|
||||
fonts: 'src/fonts',
|
||||
libs: 'src/libs',
|
||||
},
|
||||
assets: {
|
||||
css: 'assets/css',
|
||||
js: 'assets/js',
|
||||
img: 'assets/img',
|
||||
fonts: 'assets/fonts',
|
||||
libs: 'assets/libs',
|
||||
},
|
||||
}
|
||||
|
||||
if (mode == 'build') {
|
||||
return src('src/sass/**/*.sass', {ignore: 'src/sass/parts/**'})
|
||||
.pipe(sass())
|
||||
.pipe(cleanCSS({compatibility: 'ie8'}))
|
||||
.pipe(autoprefixer())
|
||||
.pipe(dest('assets/css'))
|
||||
}
|
||||
const getCss = async () => {
|
||||
return src(`${pathConfig.src.sass}/**/*.sass`)
|
||||
|
||||
return src('src/sass/**/*.sass')
|
||||
.pipe(newer('*'))
|
||||
.pipe(sourcemaps.init())
|
||||
.pipe(gulpif(isDevelop, sourcemaps.init()))
|
||||
.pipe(sass.sync().on('error', sass.logError))
|
||||
.pipe(sourcemaps.write('./maps'))
|
||||
.pipe(dest('assets/css'))
|
||||
.pipe(gulpif(isProd, cleanCSS({compatibility: 'ie8'})))
|
||||
.pipe(gulpif(isProd, autoprefixer()))
|
||||
.pipe(gulpif(isDevelop, sourcemaps.write('../sourcemaps/css')))
|
||||
.pipe(dest(pathConfig.assets.css))
|
||||
|
||||
.pipe(browser.reload({stream: true}));
|
||||
}
|
||||
|
||||
function getJs() {
|
||||
return src('src/js/**/*.js')
|
||||
.pipe(sourcemaps.init())
|
||||
.pipe(uglify())
|
||||
.pipe(sourcemaps.write('./'))
|
||||
.pipe(dest('./assets/js'))
|
||||
return src(`${pathConfig.src.js}/**/*.js`)
|
||||
|
||||
.pipe(gulpif(isDevelop, sourcemaps.init()))
|
||||
.pipe(gulpif(isProd, uglify()))
|
||||
.pipe(gulpif(isDevelop, sourcemaps.write('../sourcemaps/js')))
|
||||
|
||||
.pipe(dest(pathConfig.assets.js))
|
||||
}
|
||||
|
||||
function getFonts() {
|
||||
return src('src/fonts/**/*.{ttf,woff,woff2,svg,eot}')
|
||||
.pipe(dest('assets/fonts/'))
|
||||
return src(`${pathConfig.src.fonts}/**/*.{ttf,woff,woff2,svg,eot}`)
|
||||
|
||||
.pipe(dest(pathConfig.assets.fonts))
|
||||
}
|
||||
|
||||
function check() {
|
||||
watch('src/sass/**/*.sass', getCss.bind(null, 'develop')).on('change', browser.reload.bind(null, {stream: true}));
|
||||
watch('src/js/**/*.js', getJs).on('change', browser.reload);
|
||||
watch('src/img/*', compressImages).on('change', browser.reload);
|
||||
watch('src/fonts/**/*.{ttf,woff,woff2,svg,eot}', getFonts).on('change', browser.reload);
|
||||
watch(`${pathConfig.src.sass}/**/*.sass`, getCss).on('change', browser.reload.bind(null, {stream: true}));
|
||||
watch(`${pathConfig.src.js}/**/*.js`, getJs).on('change', browser.reload);
|
||||
watch(`${pathConfig.src.img}/*`, compressImages).on('change', browser.reload);
|
||||
watch(`${pathConfig.src.fonts}/**/*.{ttf,woff,woff2,svg,eot}`, getFonts).on('change', browser.reload);
|
||||
|
||||
watch('**/*.php').on('change', browser.reload);
|
||||
watch('templates/*.php').on('add', checkNewTemplates);
|
||||
@ -60,17 +79,16 @@ function check() {
|
||||
const build = async () => {
|
||||
console.log('\x1b[32m*** START BUILD ***');
|
||||
|
||||
clean('assets/css');
|
||||
clean(pathConfig.assets.css);
|
||||
await getCss('build')
|
||||
|
||||
console.log('\x1b[33m*** END BUILD ***\x1b[37m');
|
||||
}
|
||||
|
||||
function clean(path) {
|
||||
return del.sync(path);
|
||||
return del.sync(path);
|
||||
}
|
||||
|
||||
|
||||
function startServer(){
|
||||
browser.init({
|
||||
// server: './',
|
||||
@ -80,7 +98,8 @@ function startServer(){
|
||||
}
|
||||
|
||||
function compressImages(){
|
||||
return src('src/img/*/**')
|
||||
return src(`${pathConfig.src.img}/*/**`)
|
||||
|
||||
// .pipe(newer('assets/img'))
|
||||
.pipe(imagemin([
|
||||
imageminGiflossy({
|
||||
@ -112,7 +131,8 @@ function compressImages(){
|
||||
]
|
||||
})
|
||||
]))
|
||||
.pipe(dest('assets/img'))
|
||||
|
||||
.pipe(dest(pathConfig.assets.img))
|
||||
}
|
||||
|
||||
function checkNewTemplates(event) {
|
||||
@ -137,4 +157,4 @@ exports.getcss = getCss;
|
||||
exports.getjs = getJs;
|
||||
exports.check = check;
|
||||
exports.build = build;
|
||||
exports.start = parallel(check, startServer);
|
||||
exports.develop = parallel(check, startServer);
|
||||
|
||||
143
package-lock.json
generated
143
package-lock.json
generated
@ -14,6 +14,7 @@
|
||||
"gulp-autoprefixer": "^7.0.1",
|
||||
"gulp-clean-css": "^4.3.0",
|
||||
"gulp-header": "^2.0.9",
|
||||
"gulp-if": "^3.0.0",
|
||||
"gulp-imagemin": "^7.1.0",
|
||||
"gulp-newer": "^1.4.0",
|
||||
"gulp-sass": "^4.1.0",
|
||||
@ -24,7 +25,8 @@
|
||||
"imagemin-pngquant": "^9.0.2",
|
||||
"imagemin-zopfli": "^7.0.0",
|
||||
"module-alias": "^2.2.2",
|
||||
"node-sass": "^5.0.0"
|
||||
"node-sass": "^5.0.0",
|
||||
"yargs": "^15.4.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@gulp-sourcemaps/identity-map": {
|
||||
@ -4717,6 +4719,12 @@
|
||||
"node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/fork-stream": {
|
||||
"version": "0.0.4",
|
||||
"resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz",
|
||||
"integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA=",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/form-data": {
|
||||
"version": "2.3.3",
|
||||
"resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.3.tgz",
|
||||
@ -6773,6 +6781,17 @@
|
||||
"xtend": "~4.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/gulp-if": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-3.0.0.tgz",
|
||||
"integrity": "sha512-fCUEngzNiEZEK2YuPm+sdMpO6ukb8+/qzbGfJBXyNOXz85bCG7yBI+pPSl+N90d7gnLvMsarthsAImx0qy7BAw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"gulp-match": "^1.1.0",
|
||||
"ternary-stream": "^3.0.0",
|
||||
"through2": "^3.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/gulp-imagemin": {
|
||||
"version": "7.1.0",
|
||||
"resolved": "https://registry.npmjs.org/gulp-imagemin/-/gulp-imagemin-7.1.0.tgz",
|
||||
@ -7639,6 +7658,15 @@
|
||||
"node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/gulp-match": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.1.0.tgz",
|
||||
"integrity": "sha512-DlyVxa1Gj24DitY2OjEsS+X6tDpretuxD6wTfhXE/Rw2hweqc1f6D/XtsJmoiCwLWfXgR87W9ozEityPCVzGtQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"minimatch": "^3.0.3"
|
||||
}
|
||||
},
|
||||
"node_modules/gulp-newer": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/gulp-newer/-/gulp-newer-1.4.0.tgz",
|
||||
@ -17159,6 +17187,50 @@
|
||||
"uuid": "bin/uuid"
|
||||
}
|
||||
},
|
||||
"node_modules/ternary-stream": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-3.0.0.tgz",
|
||||
"integrity": "sha512-oIzdi+UL/JdktkT+7KU5tSIQjj8pbShj3OASuvDEhm0NT5lppsm7aXWAmAq4/QMaBIyfuEcNLbAQA+HpaISobQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"duplexify": "^4.1.1",
|
||||
"fork-stream": "^0.0.4",
|
||||
"merge-stream": "^2.0.0",
|
||||
"through2": "^3.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/ternary-stream/node_modules/duplexify": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.1.tgz",
|
||||
"integrity": "sha512-DY3xVEmVHTv1wSzKNbwoU6nVjzI369Y6sPoqfYr0/xlx3IdX2n94xIszTcjPO8W8ZIv0Wb0PXNcjuZyT4wiICA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"end-of-stream": "^1.4.1",
|
||||
"inherits": "^2.0.3",
|
||||
"readable-stream": "^3.1.1",
|
||||
"stream-shift": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/ternary-stream/node_modules/merge-stream": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
|
||||
"integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/ternary-stream/node_modules/readable-stream": {
|
||||
"version": "3.6.0",
|
||||
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
|
||||
"integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"inherits": "^2.0.3",
|
||||
"string_decoder": "^1.1.1",
|
||||
"util-deprecate": "^1.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 6"
|
||||
}
|
||||
},
|
||||
"node_modules/terser": {
|
||||
"version": "4.8.0",
|
||||
"resolved": "https://registry.npmjs.org/terser/-/terser-4.8.0.tgz",
|
||||
@ -22805,6 +22877,12 @@
|
||||
"integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=",
|
||||
"dev": true
|
||||
},
|
||||
"fork-stream": {
|
||||
"version": "0.0.4",
|
||||
"resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz",
|
||||
"integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA=",
|
||||
"dev": true
|
||||
},
|
||||
"form-data": {
|
||||
"version": "2.3.3",
|
||||
"resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.3.tgz",
|
||||
@ -24487,6 +24565,17 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"gulp-if": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-3.0.0.tgz",
|
||||
"integrity": "sha512-fCUEngzNiEZEK2YuPm+sdMpO6ukb8+/qzbGfJBXyNOXz85bCG7yBI+pPSl+N90d7gnLvMsarthsAImx0qy7BAw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"gulp-match": "^1.1.0",
|
||||
"ternary-stream": "^3.0.0",
|
||||
"through2": "^3.0.1"
|
||||
}
|
||||
},
|
||||
"gulp-imagemin": {
|
||||
"version": "7.1.0",
|
||||
"resolved": "https://registry.npmjs.org/gulp-imagemin/-/gulp-imagemin-7.1.0.tgz",
|
||||
@ -25191,6 +25280,15 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"gulp-match": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.1.0.tgz",
|
||||
"integrity": "sha512-DlyVxa1Gj24DitY2OjEsS+X6tDpretuxD6wTfhXE/Rw2hweqc1f6D/XtsJmoiCwLWfXgR87W9ozEityPCVzGtQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"minimatch": "^3.0.3"
|
||||
}
|
||||
},
|
||||
"gulp-newer": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/gulp-newer/-/gulp-newer-1.4.0.tgz",
|
||||
@ -32757,6 +32855,49 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"ternary-stream": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-3.0.0.tgz",
|
||||
"integrity": "sha512-oIzdi+UL/JdktkT+7KU5tSIQjj8pbShj3OASuvDEhm0NT5lppsm7aXWAmAq4/QMaBIyfuEcNLbAQA+HpaISobQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"duplexify": "^4.1.1",
|
||||
"fork-stream": "^0.0.4",
|
||||
"merge-stream": "^2.0.0",
|
||||
"through2": "^3.0.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"duplexify": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.1.tgz",
|
||||
"integrity": "sha512-DY3xVEmVHTv1wSzKNbwoU6nVjzI369Y6sPoqfYr0/xlx3IdX2n94xIszTcjPO8W8ZIv0Wb0PXNcjuZyT4wiICA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"end-of-stream": "^1.4.1",
|
||||
"inherits": "^2.0.3",
|
||||
"readable-stream": "^3.1.1",
|
||||
"stream-shift": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"merge-stream": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
|
||||
"integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==",
|
||||
"dev": true
|
||||
},
|
||||
"readable-stream": {
|
||||
"version": "3.6.0",
|
||||
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
|
||||
"integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"inherits": "^2.0.3",
|
||||
"string_decoder": "^1.1.1",
|
||||
"util-deprecate": "^1.0.1"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"terser": {
|
||||
"version": "4.8.0",
|
||||
"resolved": "https://registry.npmjs.org/terser/-/terser-4.8.0.tgz",
|
||||
|
||||
@ -10,6 +10,7 @@
|
||||
"gulp-autoprefixer": "^7.0.1",
|
||||
"gulp-clean-css": "^4.3.0",
|
||||
"gulp-header": "^2.0.9",
|
||||
"gulp-if": "^3.0.0",
|
||||
"gulp-imagemin": "^7.1.0",
|
||||
"gulp-newer": "^1.4.0",
|
||||
"gulp-sass": "^4.1.0",
|
||||
@ -20,10 +21,14 @@
|
||||
"imagemin-pngquant": "^9.0.2",
|
||||
"imagemin-zopfli": "^7.0.0",
|
||||
"module-alias": "^2.2.2",
|
||||
"node-sass": "^5.0.0"
|
||||
"node-sass": "^5.0.0",
|
||||
"yargs": "^15.4.1"
|
||||
},
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1"
|
||||
"dev": "gulp develop --develop",
|
||||
"dev::prod": "gulp develop --production",
|
||||
"build::dev": "gulp build --develop",
|
||||
"build::prod": "gulp build --production"
|
||||
},
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
|
||||
@ -1,51 +1,16 @@
|
||||
<div class="main">
|
||||
|
||||
<!-- <?php
|
||||
$images = get_field('main_slider_image');
|
||||
if( $images ): ?>
|
||||
<div id="carousel">
|
||||
<?php foreach( $images as $image ): ?>
|
||||
<img src="<?php echo $image['url']?>" alt="<?php echo $image['alt']; ?>" />
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php
|
||||
$images = get_field('main_slider_image');
|
||||
if( $images ): ?>
|
||||
<div id="carousel-mobile">
|
||||
<?php foreach( $images as $image ): ?>
|
||||
<img src="<?php echo $image['url']?>" alt="<?php echo $image['alt']; ?>" />
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?> -->
|
||||
|
||||
<!-- <?php echo do_shortcode('[smartslider3 slider="2"]') ?> -->
|
||||
<?php echo do_shortcode('[smartslider3 slider="7"]') ?>
|
||||
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.main{
|
||||
height: 325px
|
||||
}
|
||||
|
||||
#carousel {
|
||||
max-height: 325px;
|
||||
}
|
||||
|
||||
#carousel img {
|
||||
max-height: 325px
|
||||
}
|
||||
|
||||
@media screen and (max-width: 425px){
|
||||
.main{
|
||||
height: 180px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#carousel{
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
@ -1,22 +1,3 @@
|
||||
const certText = document.querySelector('.cert-text'),
|
||||
holidayDescrBtn = document.querySelector('.holiday-descr a');
|
||||
const holidayDescrBtn = document.querySelector('.holiday-descr a');
|
||||
|
||||
holidayDescrBtn.innerHTML = '';
|
||||
|
||||
|
||||
// if(certText){
|
||||
// const holidayDescr = holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').offsetHeight;
|
||||
// holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height = holidayDescr/3 + 'px';
|
||||
// holidayDescrBtn.addEventListener('click', (e) => {
|
||||
// e.preventDefault();
|
||||
|
||||
// let currentHeight = holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height.slice(0, -2);
|
||||
// if(currentHeight == holidayDescr){
|
||||
// holidayDescrBtn.textContent = 'Читать далее';
|
||||
// holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height = holidayDescr/3 + 'px';
|
||||
// }else{
|
||||
// holidayDescrBtn.textContent = 'Свернуть';
|
||||
// holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height = holidayDescr + 'px';
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
holidayDescrBtn.innerHTML = '';
|
||||
@ -1,68 +1,163 @@
|
||||
$('.btn-number').click(function(e){
|
||||
e.preventDefault();
|
||||
|
||||
fieldName = $(this).attr('data-field');
|
||||
type = $(this).attr('data-type');
|
||||
var input = $("input[name='"+fieldName+"']");
|
||||
var currentVal = parseInt(input.val());
|
||||
if (!isNaN(currentVal)) {
|
||||
if(type == 'minus') {
|
||||
|
||||
if(currentVal > input.attr('min')) {
|
||||
input.val(currentVal - 1).change();
|
||||
}
|
||||
if(parseInt(input.val()) == input.attr('min')) {
|
||||
$(this).attr('disabled', true);
|
||||
}
|
||||
$(document).ready(() => {
|
||||
|
||||
} else if(type == 'plus') {
|
||||
// Variables
|
||||
const mainForm = document.querySelector('.main-form');
|
||||
const guestHoliday = document.getElementById('guest-holiday');
|
||||
const guestBirthdayName = document.getElementById('guest-birthday-name');
|
||||
const guestBirthdayDate = document.getElementById('datapicker');
|
||||
const guestQuestList = document.getElementById('guest-quest');
|
||||
const guestQuest = document.querySelectorAll('#guest-quest option');
|
||||
const guestRoom = document.querySelectorAll('#guest-room option');
|
||||
const guestRooms = document.getElementById('guest-room');
|
||||
const guestText = document.querySelectorAll('.guest-img .col-md-6');
|
||||
const formAddItem = document.querySelectorAll('.form-add__item');
|
||||
const childCountInput = document.querySelector('.input-number');
|
||||
const changeChildCountBtn = document.querySelectorAll('.btn-number');
|
||||
const orderModal = document.querySelector('.order-modal');
|
||||
|
||||
if(currentVal < input.attr('max')) {
|
||||
input.val(currentVal + 1).change();
|
||||
}
|
||||
if(parseInt(input.val()) == input.attr('max')) {
|
||||
$(this).attr('disabled', true);
|
||||
}
|
||||
const formData = {
|
||||
name: '',
|
||||
phone: '',
|
||||
holidayType: 'Birthday',
|
||||
birthdayName: '',
|
||||
birthdayDate: '',
|
||||
questName: '',
|
||||
questRoom: '',
|
||||
guestCount: 1,
|
||||
date: '',
|
||||
addingItems: [],
|
||||
startSum: 2500,
|
||||
addingSum: 0,
|
||||
sum: 0,
|
||||
getSum() {
|
||||
this.sum = 0;
|
||||
|
||||
let date = formData.date.split('.'),
|
||||
day = date[0],
|
||||
month = date[1],
|
||||
year = date[2],
|
||||
currentDate = new Date(year, month-1, day),
|
||||
addingSum = 0,
|
||||
maxPlayerSum = 0;
|
||||
|
||||
if(currentDate.getDay() === 0 || currentDate.getDay() === 6 || currentDate.getDay() === 5){
|
||||
this.startSum = 3500;
|
||||
}else{
|
||||
this.startSum = 2500;
|
||||
}
|
||||
|
||||
formData.addingItems.forEach(currentItem => {
|
||||
addingSum += +currentItem.price;
|
||||
});
|
||||
|
||||
if(this.questName){
|
||||
|
||||
if (this.questName === 'Аркидс' && this.guestCount > 4) {
|
||||
maxPlayerSum = 500 * (this.guestCount - 4)
|
||||
} else if (this.guestCount > 5) {
|
||||
maxPlayerSum = 500 * (this.guestCount - 5)
|
||||
}
|
||||
|
||||
}
|
||||
} else {
|
||||
input.val(0);
|
||||
}
|
||||
});
|
||||
$('.input-number').focusin(function(){
|
||||
$(this).data('oldValue', $(this).val());
|
||||
});
|
||||
$('.input-number').change(function() {
|
||||
|
||||
minValue = parseInt($(this).attr('min'));
|
||||
maxValue = parseInt($(this).attr('max'));
|
||||
valueCurrent = parseInt($(this).val());
|
||||
this.closest('input').value = valueCurrent
|
||||
name = $(this).attr('name');
|
||||
if(valueCurrent >= minValue) {
|
||||
$(".btn-number[data-type='minus'][data-field='"+name+"']").removeAttr('disabled')
|
||||
} else {
|
||||
alert('Sorry, the minimum value was reached');
|
||||
$(this).val($(this).data('oldValue'));
|
||||
}
|
||||
if(valueCurrent <= maxValue) {
|
||||
$(".btn-number[data-type='plus'][data-field='"+name+"']").removeAttr('disabled')
|
||||
} else {
|
||||
alert(`Извините, больше ${maxValue} нельзя`);
|
||||
$(this).val($(this).data('oldValue'));
|
||||
}
|
||||
|
||||
updateForm();
|
||||
});
|
||||
$(".input-number").keydown(function (e) {
|
||||
|
||||
switch (this.questRoom){
|
||||
case 'Лофт':
|
||||
addingSum += 2500
|
||||
break;
|
||||
|
||||
case 'Большой зал':
|
||||
addingSum += 2000
|
||||
break;
|
||||
|
||||
case 'Малый зал':
|
||||
addingSum += 1000
|
||||
break;
|
||||
}
|
||||
|
||||
this.sum += this.startSum + addingSum + maxPlayerSum;
|
||||
}
|
||||
};
|
||||
let questSlug = 'none';
|
||||
|
||||
// Init styles
|
||||
$(guestHoliday).selectpicker();
|
||||
$(guestQuestList).selectpicker();
|
||||
$(guestRooms).selectpicker();
|
||||
|
||||
$(guestRooms).hide();
|
||||
$(guestText[0]).hide();
|
||||
$(guestText[1]).hide();
|
||||
|
||||
// Add listeners
|
||||
$(changeChildCountBtn).click(function(e){
|
||||
e.preventDefault();
|
||||
|
||||
fieldName = $(this).attr('data-field');
|
||||
type = $(this).attr('data-type');
|
||||
var input = $("input[name='"+fieldName+"']");
|
||||
var currentVal = parseInt(input.val());
|
||||
|
||||
if (!isNaN(currentVal)) {
|
||||
if(type === 'minus') {
|
||||
|
||||
if(currentVal > input.attr('min')) {
|
||||
input.val(currentVal - 1).change();
|
||||
}
|
||||
if(parseInt(input.val()) === input.attr('min')) {
|
||||
$(this).attr('disabled', true);
|
||||
}
|
||||
|
||||
} else if(type === 'plus') {
|
||||
|
||||
if(currentVal < input.attr('max')) {
|
||||
input.val(currentVal + 1).change();
|
||||
}
|
||||
if(parseInt(input.val()) === input.attr('max')) {
|
||||
$(this).attr('disabled', true);
|
||||
}
|
||||
|
||||
}
|
||||
} else {
|
||||
input.val(0);
|
||||
}
|
||||
});
|
||||
|
||||
$(childCountInput).focusin(function(){
|
||||
$(this).data('oldValue', $(this).val());
|
||||
});
|
||||
|
||||
$(childCountInput).change(function() {
|
||||
|
||||
minValue = parseInt($(this).attr('min'));
|
||||
maxValue = parseInt($(this).attr('max'));
|
||||
valueCurrent = parseInt($(this).val());
|
||||
this.closest('input').value = valueCurrent
|
||||
name = $(this).attr('name');
|
||||
if(valueCurrent >= minValue) {
|
||||
$(".btn-number[data-type='minus'][data-field='"+name+"']").removeAttr('disabled')
|
||||
} else {
|
||||
alert('Sorry, the minimum value was reached');
|
||||
$(this).val($(this).data('oldValue'));
|
||||
}
|
||||
if(valueCurrent <= maxValue) {
|
||||
$(".btn-number[data-type='plus'][data-field='"+name+"']").removeAttr('disabled')
|
||||
} else {
|
||||
alert(`Извините, больше ${maxValue} нельзя`);
|
||||
$(this).val($(this).data('oldValue'));
|
||||
}
|
||||
|
||||
updateForm();
|
||||
});
|
||||
|
||||
$(childCountInput).keydown(function (e) {
|
||||
// Allow: backspace, delete, tab, escape, enter and .
|
||||
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 190]) !== -1 ||
|
||||
// Allow: Ctrl+A
|
||||
(e.keyCode == 65 && e.ctrlKey === true) ||
|
||||
// Allow: home, end, left, right
|
||||
// Allow: Ctrl+A
|
||||
(e.keyCode === 65 && e.ctrlKey === true) ||
|
||||
// Allow: home, end, left, right
|
||||
(e.keyCode >= 35 && e.keyCode <= 39)) {
|
||||
// let it happen, don't do anything
|
||||
return;
|
||||
// let it happen, don't do anything
|
||||
return;
|
||||
}
|
||||
// Ensure that it is a number and stop the keypress
|
||||
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
|
||||
@ -70,275 +165,23 @@ $(".input-number").keydown(function (e) {
|
||||
}
|
||||
});
|
||||
|
||||
$('#guest-holiday').selectpicker();
|
||||
$('#guest-quest').selectpicker();
|
||||
$('#guest-room').selectpicker();
|
||||
$("#datapicker").on("dp.change", updateForm);
|
||||
$("#datapicker2").on("dp.change", updateForm);
|
||||
|
||||
const mainForm = document.querySelector('.main-form'),
|
||||
guestHoliday = document.getElementById('guest-holiday'),
|
||||
guestBirthdayName = document.getElementById('guest-birthday-name'),
|
||||
guestBirthdayDate = document.getElementById('datapicker'),
|
||||
guestQuestList = document.getElementById('guest-quest'),
|
||||
guestQuest = document.querySelectorAll('#guest-quest option'),
|
||||
guestRoom = document.querySelectorAll('#guest-room option'),
|
||||
guestRooms = document.getElementById('guest-room'),
|
||||
guestText = document.querySelectorAll('.guest-img .col-md-6'),
|
||||
formAddItem = document.querySelectorAll('.form-add__item');
|
||||
|
||||
let questSlug = 'none';
|
||||
document.querySelector('.guest-room').style.display = 'none';
|
||||
guestText[0].style.display = 'none';
|
||||
guestText[1].style.display = 'none';
|
||||
const formData = {
|
||||
name: '',
|
||||
phone: '',
|
||||
holidayType: 'Birthday',
|
||||
birthdayName: '',
|
||||
birthdayDate: '',
|
||||
questName: '',
|
||||
questRoom: '',
|
||||
guestCount: 1,
|
||||
date: '',
|
||||
addingItems: [],
|
||||
startSum: 2500,
|
||||
addingSum: 0,
|
||||
sum: 0,
|
||||
getSum(){
|
||||
this.sum = 0;
|
||||
|
||||
let date = formData.date.split('.'),
|
||||
day = date[0],
|
||||
month = date[1],
|
||||
year = date[2],
|
||||
currentDate = new Date(year, month-1, day),
|
||||
addingSum = 0,
|
||||
maxPlayerSum = 0;
|
||||
mainForm.addEventListener('change', updateForm);
|
||||
|
||||
if(currentDate.getDay() == 0 || currentDate.getDay() == 6 || currentDate.getDay() == 5){
|
||||
this.startSum = 3500;
|
||||
}else{
|
||||
this.startSum = 2500;
|
||||
}
|
||||
mainForm.addEventListener('submit', (e) =>{
|
||||
e.preventDefault();
|
||||
|
||||
formData.addingItems.forEach(currentItem => {
|
||||
addingSum += +currentItem.price;
|
||||
});
|
||||
|
||||
if(this.questName){
|
||||
|
||||
if (this.questName == 'Аркидс' && this.guestCount > 4) {
|
||||
maxPlayerSum = 500 * (this.guestCount - 4)
|
||||
} else if (this.guestCount > 5) {
|
||||
maxPlayerSum = 500 * (this.guestCount - 5)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
switch (this.questRoom){
|
||||
case 'Лофт':
|
||||
addingSum += 2500
|
||||
break;
|
||||
|
||||
case 'Большой зал':
|
||||
addingSum += 2000
|
||||
break;
|
||||
|
||||
case 'Малый зал':
|
||||
addingSum += 1000
|
||||
break;
|
||||
|
||||
|
||||
}
|
||||
this.sum += this.startSum + addingSum + maxPlayerSum;
|
||||
}
|
||||
};
|
||||
|
||||
const checkForm = () => {
|
||||
formData.name = document.getElementById('guest-name').value;
|
||||
formData.phone = document.getElementById('guest-phone').value;
|
||||
formData.birthdayName = document.getElementById('guest-birthday-name').value;
|
||||
formData.birthdayDate = $("#datapicker").val();
|
||||
formData.date = $("#datapicker2").val();
|
||||
formData.guestCount = document.getElementById('guest-count').value;
|
||||
guestHoliday.addEventListener('change', (e) => {
|
||||
if(!e.target.selectedIndex){
|
||||
guestBirthdayName.style.display = 'block'
|
||||
guestBirthdayDate.style.display = 'block'
|
||||
formData.holidayType = 'Birthday'
|
||||
}else{
|
||||
guestBirthdayName.style.display = 'none'
|
||||
guestBirthdayDate.style.display = 'none'
|
||||
formData.holidayType = 'Graduate';
|
||||
delete formData.birthdayName;
|
||||
delete formData.birthdayDate;
|
||||
}
|
||||
})
|
||||
guestRooms.addEventListener('change', (e) => {
|
||||
let index = e.target.selectedIndex,
|
||||
imgURL = guestRoom[index].dataset.img,
|
||||
roomName = guestRoom[index].textContent,
|
||||
roomDescr = guestRoom[index].dataset.descr;
|
||||
formData.questRoom = roomName;
|
||||
document.querySelector('.guest-room-name').textContent = roomName;
|
||||
document.querySelector('.guest-room-descr').innerHTML = roomDescr;
|
||||
let imgRoom = document.querySelectorAll('.guest-img .col-md-6 img')[1];
|
||||
|
||||
if(index !== 0){
|
||||
guestText[1].style.display = 'flex'
|
||||
}else{
|
||||
guestText[1].style.display = 'none'
|
||||
}
|
||||
imgRoom.setAttribute('src', imgURL)
|
||||
})
|
||||
|
||||
guestQuestList.addEventListener('change', (e) => {
|
||||
document.querySelector('.cheque-label h3').textContent = 'Ваш заказ';
|
||||
let index = e.target.selectedIndex,
|
||||
imgURL = guestQuest[index].dataset.img,
|
||||
questName = guestQuest[index].textContent,
|
||||
maxPlayer = guestQuest[index].dataset.maxplayer;
|
||||
document.querySelector('.guest-quest-name').textContent = questName;
|
||||
questSlug = guestQuest[index].dataset.quest;
|
||||
if (questSlug !== 'none'){
|
||||
document.querySelector('.guest-room').style.display = 'block'
|
||||
$('#guest-room').selectpicker('val', 'default');
|
||||
guestText[0].style.display = 'flex'
|
||||
guestText[1].style.display = 'none'
|
||||
|
||||
|
||||
if (questName != formData.questName) {
|
||||
formData.questName = questName;
|
||||
formData.maxPlayer = maxPlayer;
|
||||
|
||||
// if (questName == 'Аркидс') {
|
||||
// document.getElementById('guest-count').max = 6;
|
||||
|
||||
// document.getElementById('guest-count').value = Math.min(6, document.getElementById('guest-count').value)
|
||||
// } else {
|
||||
// document.getElementById('guest-count').max = 8
|
||||
// }
|
||||
}
|
||||
|
||||
document.querySelector('[data-type="plus"]').disabled = false;
|
||||
|
||||
delete formData.questRoom;
|
||||
}else{
|
||||
document.querySelector('.guest-room').style.display = 'none'
|
||||
guestText[0].style.display = 'none'
|
||||
guestText[1].style.display = 'none'
|
||||
delete formData.questName;
|
||||
delete formData.questRoom;
|
||||
}
|
||||
let imgQuest = document.querySelector('.guest-img .col-md-6 img');
|
||||
imgQuest.setAttribute('src', imgURL)
|
||||
|
||||
})
|
||||
let addItems = document.querySelectorAll('.btn-adding');
|
||||
formData.addingItems = [];
|
||||
addItems.forEach(currentItem => {
|
||||
let add = currentItem.closest('.form-add__item').querySelector('.form-add__item-text');
|
||||
let item = {
|
||||
name: add.querySelector('h6').textContent,
|
||||
price: add.querySelector('span').textContent.slice(0, -3),
|
||||
}
|
||||
formData.addingItems.push(item)
|
||||
});
|
||||
|
||||
return formData
|
||||
}
|
||||
const updateForm = () => {
|
||||
checkForm();
|
||||
formData.getSum();
|
||||
let chequeQuest = document.querySelector('.cheque-quest p'),
|
||||
chequeDate = document.querySelector('.cheque-date p'),
|
||||
chequeGuests = document.querySelector('.cheque-guests p span'),
|
||||
chequeAddItems = document.querySelector('.cheque-adding'),
|
||||
chequeSum = document.querySelector('.cheque-sum'),
|
||||
chequeInfo = document.querySelector('.cheque-info'),
|
||||
span = document.createElement('span')
|
||||
if(!formData.questName){
|
||||
chequeQuest.closest('div').style.display = 'none'
|
||||
}else{
|
||||
chequeQuest.closest('div').style.display = 'block';
|
||||
chequeQuest.textContent = `${formData.questName} - `
|
||||
span.textContent = `${formData.startSum} р.`;
|
||||
chequeQuest.insertAdjacentElement('beforeend', span);
|
||||
}
|
||||
if(!formData.date){
|
||||
chequeDate.closest('div').style.display = 'none'
|
||||
}else{
|
||||
chequeDate.closest('div').style.display = 'block';
|
||||
chequeDate.textContent = `${formData.date}`
|
||||
}
|
||||
if(formData.guestCount == 1){
|
||||
chequeGuests.closest('div').style.display = 'none'
|
||||
}else{
|
||||
chequeGuests.closest('div').style.display = 'block'
|
||||
chequeGuests.textContent = formData.guestCount;
|
||||
}
|
||||
if(!formData.addingItems.length){
|
||||
chequeAddItems.style.display = 'none'
|
||||
}else{
|
||||
chequeAddItems.style.display = 'block';
|
||||
chequeAddItems.querySelectorAll('p').forEach(currentItem => {
|
||||
currentItem.remove()
|
||||
});
|
||||
formData.addingItems.forEach(item => {
|
||||
const p = document.createElement('p'),
|
||||
span = document.createElement('span');
|
||||
p.textContent = `${item.name} - `
|
||||
span.textContent = `${item.price} р.`
|
||||
p.appendChild(span);
|
||||
chequeAddItems.insertAdjacentElement('beforeend', p)
|
||||
});
|
||||
}
|
||||
if(!formData.sum){
|
||||
chequeSum.style.display = 'none';
|
||||
}else{
|
||||
chequeSum.style.display = 'block';
|
||||
chequeInfo.style.display = 'none'
|
||||
chequeSum.querySelector('span').textContent = `${formData.sum} р.`
|
||||
}
|
||||
}
|
||||
|
||||
formAddItem.forEach(item => {
|
||||
item.addEventListener('click', (e) => {
|
||||
let addBtn = e.target.closest('label');
|
||||
if(!addBtn){
|
||||
return
|
||||
}
|
||||
addBtn.classList.toggle('btn-adding');
|
||||
if(addBtn.classList.contains('btn-adding')){
|
||||
addBtn.textContent = 'Убрать';
|
||||
addBtn.setAttribute('checked', 'true');
|
||||
}else{
|
||||
addBtn.textContent = 'Добавить';
|
||||
addBtn.removeAttribute('checked');
|
||||
}
|
||||
updateForm();
|
||||
|
||||
})
|
||||
});
|
||||
|
||||
checkForm();
|
||||
|
||||
$("#datapicker").on("dp.change", updateForm);
|
||||
$("#datapicker2").on("dp.change", updateForm);
|
||||
|
||||
mainForm.addEventListener('change', updateForm);
|
||||
mainForm.addEventListener('submit', (e) =>{
|
||||
e.preventDefault();
|
||||
updateForm();
|
||||
var action = $('.main-form').attr('action');
|
||||
console.log(formData);
|
||||
|
||||
$.ajax({
|
||||
url: action,
|
||||
url: $(mainForm).attr('action'),
|
||||
type: 'POST',
|
||||
data: formData,
|
||||
success: function (response) {
|
||||
$('.order-modal').show();
|
||||
$("body").css("overflow","hidden");
|
||||
success: function () {
|
||||
$(orderModal).show();
|
||||
$("body").css("overflow","hidden");
|
||||
},
|
||||
error: function(request, txtstatus, errorThrown){
|
||||
console.log(request);
|
||||
@ -346,11 +189,184 @@ mainForm.addEventListener('submit', (e) =>{
|
||||
console.log(errorThrown);
|
||||
}
|
||||
});
|
||||
document.querySelector('.order-modal').addEventListener('click', (e) => {
|
||||
if (!e.target.closest('.container')){
|
||||
$('.order-modal').hide();
|
||||
|
||||
orderModal.addEventListener('click', (e) => {
|
||||
if (!e.target.closest('.container')) {
|
||||
$(orderModal).hide();
|
||||
$("body").css("overflow","auto");
|
||||
location = '/';
|
||||
location = '/';
|
||||
}
|
||||
})
|
||||
});
|
||||
});
|
||||
|
||||
formAddItem.forEach(item => {
|
||||
item.addEventListener('click', (e) => {
|
||||
let addBtn = e.target.closest('label');
|
||||
if(!addBtn){
|
||||
return
|
||||
}
|
||||
addBtn.classList.toggle('btn-adding');
|
||||
if(addBtn.classList.contains('btn-adding')){
|
||||
addBtn.textContent = 'Убрать';
|
||||
addBtn.setAttribute('checked', 'true');
|
||||
}else{
|
||||
addBtn.textContent = 'Добавить';
|
||||
addBtn.removeAttribute('checked');
|
||||
}
|
||||
updateForm();
|
||||
|
||||
})
|
||||
});
|
||||
|
||||
function checkForm() {
|
||||
formData.name = document.getElementById('guest-name').value;
|
||||
formData.phone = document.getElementById('guest-phone').value;
|
||||
formData.birthdayName = document.getElementById('guest-birthday-name').value;
|
||||
formData.birthdayDate = $("#datapicker").val();
|
||||
formData.date = $("#datapicker2").val();
|
||||
formData.guestCount = document.getElementById('guest-count').value;
|
||||
guestHoliday.addEventListener('change', (e) => {
|
||||
if(!e.target.selectedIndex){
|
||||
guestBirthdayName.style.display = 'block'
|
||||
guestBirthdayDate.style.display = 'block'
|
||||
formData.holidayType = 'Birthday'
|
||||
}else{
|
||||
guestBirthdayName.style.display = 'none'
|
||||
guestBirthdayDate.style.display = 'none'
|
||||
formData.holidayType = 'Graduate';
|
||||
delete formData.birthdayName;
|
||||
delete formData.birthdayDate;
|
||||
}
|
||||
})
|
||||
|
||||
guestRooms.addEventListener('change', (e) => {
|
||||
let index = e.target.selectedIndex,
|
||||
imgURL = guestRoom[index].dataset.img,
|
||||
roomName = guestRoom[index].textContent,
|
||||
roomDescr = guestRoom[index].dataset.descr;
|
||||
formData.questRoom = roomName;
|
||||
document.querySelector('.guest-room-name').textContent = roomName;
|
||||
document.querySelector('.guest-room-descr').innerHTML = roomDescr;
|
||||
let imgRoom = document.querySelectorAll('.guest-img .col-md-6 img')[1];
|
||||
|
||||
if(index !== 0){
|
||||
guestText[1].style.display = 'flex'
|
||||
}else{
|
||||
guestText[1].style.display = 'none'
|
||||
}
|
||||
imgRoom.setAttribute('src', imgURL)
|
||||
})
|
||||
|
||||
guestQuestList.addEventListener('change', (e) => {
|
||||
document.querySelector('.cheque-label h3').textContent = 'Ваш заказ';
|
||||
let index = e.target.selectedIndex,
|
||||
imgURL = guestQuest[index].dataset.img,
|
||||
questName = guestQuest[index].textContent,
|
||||
maxPlayer = guestQuest[index].dataset.maxplayer;
|
||||
document.querySelector('.guest-quest-name').textContent = questName;
|
||||
questSlug = guestQuest[index].dataset.quest;
|
||||
if (questSlug !== 'none'){
|
||||
document.querySelector('.guest-room').style.display = 'block'
|
||||
$('#guest-room').selectpicker('val', 'default');
|
||||
guestText[0].style.display = 'flex'
|
||||
guestText[1].style.display = 'none'
|
||||
|
||||
|
||||
if (questName !== formData.questName) {
|
||||
formData.questName = questName;
|
||||
formData.maxPlayer = maxPlayer;
|
||||
|
||||
// if (questName == 'Аркидс') {
|
||||
// document.getElementById('guest-count').max = 6;
|
||||
|
||||
// document.getElementById('guest-count').value = Math.min(6, document.getElementById('guest-count').value)
|
||||
// } else {
|
||||
// document.getElementById('guest-count').max = 8
|
||||
// }
|
||||
}
|
||||
|
||||
document.querySelector('[data-type="plus"]').disabled = false;
|
||||
|
||||
delete formData.questRoom;
|
||||
}else{
|
||||
document.querySelector('.guest-room').style.display = 'none'
|
||||
guestText[0].style.display = 'none'
|
||||
guestText[1].style.display = 'none'
|
||||
delete formData.questName;
|
||||
delete formData.questRoom;
|
||||
}
|
||||
let imgQuest = document.querySelector('.guest-img .col-md-6 img');
|
||||
imgQuest.setAttribute('src', imgURL)
|
||||
|
||||
})
|
||||
let addItems = document.querySelectorAll('.btn-adding');
|
||||
formData.addingItems = [];
|
||||
addItems.forEach(currentItem => {
|
||||
let add = currentItem.closest('.form-add__item').querySelector('.form-add__item-text');
|
||||
let item = {
|
||||
name: add.querySelector('h6').textContent,
|
||||
price: add.querySelector('span').textContent.slice(0, -3),
|
||||
}
|
||||
formData.addingItems.push(item)
|
||||
});
|
||||
|
||||
return formData
|
||||
}
|
||||
|
||||
function updateForm() {
|
||||
checkForm();
|
||||
formData.getSum();
|
||||
let chequeQuest = document.querySelector('.cheque-quest p'),
|
||||
chequeDate = document.querySelector('.cheque-date p'),
|
||||
chequeGuests = document.querySelector('.cheque-guests p span'),
|
||||
chequeAddItems = document.querySelector('.cheque-adding'),
|
||||
chequeSum = document.querySelector('.cheque-sum'),
|
||||
chequeInfo = document.querySelector('.cheque-info'),
|
||||
span = document.createElement('span')
|
||||
if(!formData.questName){
|
||||
chequeQuest.closest('div').style.display = 'none'
|
||||
}else{
|
||||
chequeQuest.closest('div').style.display = 'block';
|
||||
chequeQuest.textContent = `${formData.questName} - `
|
||||
span.textContent = `${formData.startSum} р.`;
|
||||
chequeQuest.insertAdjacentElement('beforeend', span);
|
||||
}
|
||||
if(!formData.date){
|
||||
chequeDate.closest('div').style.display = 'none'
|
||||
}else{
|
||||
chequeDate.closest('div').style.display = 'block';
|
||||
chequeDate.textContent = `${formData.date}`
|
||||
}
|
||||
if(formData.guestCount === 1){
|
||||
chequeGuests.closest('div').style.display = 'none'
|
||||
}else{
|
||||
chequeGuests.closest('div').style.display = 'block'
|
||||
chequeGuests.textContent = formData.guestCount;
|
||||
}
|
||||
if(!formData.addingItems.length){
|
||||
chequeAddItems.style.display = 'none'
|
||||
}else{
|
||||
chequeAddItems.style.display = 'block';
|
||||
chequeAddItems.querySelectorAll('p').forEach(currentItem => {
|
||||
currentItem.remove()
|
||||
});
|
||||
formData.addingItems.forEach(item => {
|
||||
const p = document.createElement('p'),
|
||||
span = document.createElement('span');
|
||||
p.textContent = `${item.name} - `
|
||||
span.textContent = `${item.price} р.`
|
||||
p.appendChild(span);
|
||||
chequeAddItems.insertAdjacentElement('beforeend', p)
|
||||
});
|
||||
}
|
||||
if(!formData.sum){
|
||||
chequeSum.style.display = 'none';
|
||||
}else{
|
||||
chequeSum.style.display = 'block';
|
||||
chequeInfo.style.display = 'none'
|
||||
chequeSum.querySelector('span').textContent = `${formData.sum} р.`
|
||||
}
|
||||
}
|
||||
|
||||
checkForm();
|
||||
})
|
||||
|
||||
@ -1,28 +1,29 @@
|
||||
const holidayDescrBtn = document.querySelector('.holiday-descr .turn'),
|
||||
addingService = document.querySelector('.adding-service');
|
||||
const holidayDescrBtn = document.querySelector('.holiday-descr .turn');
|
||||
const addingService = document.querySelector('.adding-service');
|
||||
const entContainerHeader = document.querySelector('.ent-container h2');
|
||||
const packageSlider = document.querySelector('.packages-slider');
|
||||
|
||||
if(holidayDescrBtn && document.querySelector('.ent-container h2')){
|
||||
if (holidayDescrBtn && entContainerHeader) {
|
||||
const holidayDescr = holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').offsetHeight;
|
||||
holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height = holidayDescr/3 + 'px';
|
||||
|
||||
console.log('A', holidayDescrBtn);
|
||||
|
||||
holidayDescrBtn.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
let currentHeight = holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height.slice(0, -2);
|
||||
if(currentHeight == holidayDescr){
|
||||
|
||||
if (currentHeight === holidayDescr) {
|
||||
holidayDescrBtn.textContent = 'Читать далее';
|
||||
holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height = holidayDescr/3 + 'px';
|
||||
}else{
|
||||
} else {
|
||||
holidayDescrBtn.textContent = 'Свернуть';
|
||||
holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height = holidayDescr + 'px';
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
if(addingService){
|
||||
$('.packages-slider').owlCarousel({
|
||||
if (addingService) {
|
||||
$(packageSlider).owlCarousel({
|
||||
responsive: {
|
||||
0 : {
|
||||
margin: 10,
|
||||
@ -43,12 +44,9 @@ if(addingService){
|
||||
margin: 10,
|
||||
stagePadding: 60,
|
||||
items: 1,
|
||||
normal: false,
|
||||
nav: false,
|
||||
dots: false,
|
||||
// autoWidth: true,
|
||||
normal: true
|
||||
// stagePadding: 30,
|
||||
},
|
||||
769 : {
|
||||
margin: 30,
|
||||
@ -56,7 +54,6 @@ if(addingService){
|
||||
normal: true,
|
||||
nav: false,
|
||||
dots: false
|
||||
// stagePadding: 30,
|
||||
},
|
||||
1025 : {
|
||||
margin: 30,
|
||||
@ -64,8 +61,7 @@ if(addingService){
|
||||
normal: true,
|
||||
nav: false,
|
||||
dots: false
|
||||
// stagePadding: 30,
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,304 +1,318 @@
|
||||
const discountModal = document.querySelector('.discount-modal'),
|
||||
discountClose = document.querySelector('.discount-modal-close'),
|
||||
discountOpen = document.querySelectorAll('.discount-item__content button'),
|
||||
places = document.querySelectorAll('.places .owl-item');
|
||||
|
||||
$('#orderTel').mask('+7 (900) 000-00-00');
|
||||
$('[data-toggle="popover"]').popover();
|
||||
$('.main-slider').owlCarousel({
|
||||
responsive: {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 0,
|
||||
dots: true,
|
||||
loop: true,
|
||||
center: true,
|
||||
normal: false,
|
||||
lazyLoad: true,
|
||||
lazyLoadEager: 1
|
||||
// autoWidth: true
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
items: 6,
|
||||
margin: 0
|
||||
},
|
||||
768 : {
|
||||
smartSpeed: 400,
|
||||
items: 1,
|
||||
margin: 30,
|
||||
loop: true,
|
||||
autoWidth: true,
|
||||
center: true,
|
||||
dots: true,
|
||||
dotsEach: true,
|
||||
// autoplay: true,
|
||||
autoplayTimeout: 3000,
|
||||
autoplaySpeed: 1000,
|
||||
autoplayHoverPause: true
|
||||
// nav: true,
|
||||
// navText: ['<div class="principals-slider__prev"><i class="fa fa-chevron-left" aria-hidden="true"></i></div>','<div class="principals-slider__next"><i class="fa fa-chevron-right" aria-hidden="true"></i></div>'],
|
||||
}
|
||||
}
|
||||
});
|
||||
$('.ent-slider').owlCarousel({
|
||||
responsive: {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 80,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
autoWidth: false,
|
||||
loop:true
|
||||
},
|
||||
360 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true,
|
||||
autoWidth: false
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
margin: 20,
|
||||
loop: true,
|
||||
dots: false,
|
||||
autoWidth: false
|
||||
},
|
||||
768 : {
|
||||
smartSpeed: 400,
|
||||
margin: 50,
|
||||
items: 3,
|
||||
// stagePadding: 30,
|
||||
}
|
||||
}
|
||||
});
|
||||
$('.places-slider').owlCarousel({
|
||||
responsive : {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true,
|
||||
autoWidth: false
|
||||
},
|
||||
360 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true,
|
||||
autoWidth: false
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true,
|
||||
autoWidth: false
|
||||
},
|
||||
768: {
|
||||
smartSpeed: 400,
|
||||
margin: 150,
|
||||
item: 1,
|
||||
autoWidth: true,
|
||||
nav: true,
|
||||
dots: false,
|
||||
loop: true,
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
$('.discount-slider').owlCarousel({
|
||||
responsive : {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 80,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true
|
||||
},
|
||||
360 : {
|
||||
smartSpeed: 400,
|
||||
margin: 35,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
margin: 20,
|
||||
loop: true,
|
||||
dots: false,
|
||||
autoWidth: false
|
||||
},
|
||||
1200: {
|
||||
margin: 10,
|
||||
smartSpeed: 400,
|
||||
item: 3,
|
||||
// autoWidth: true,
|
||||
nav: true,
|
||||
navText: ['<div class="discount-slider__prev"><i class="fa fa-chevron-left" aria-hidden="true"></i></div>','<div class="discount-slider__next"><i class="fa fa-chevron-right" aria-hidden="true"></i></div>'],
|
||||
dots: false,
|
||||
loop: true,
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
$('.discount-modal-slider').owlCarousel({
|
||||
responsive: {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 0,
|
||||
dots: false,
|
||||
loop: true,
|
||||
center: true,
|
||||
normal: false,
|
||||
// lazyLoad: true,
|
||||
// lazyLoadEager: 1
|
||||
// autoWidth: true
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
items: 6,
|
||||
margin: 0
|
||||
},
|
||||
768 : {
|
||||
smartSpeed: 400,
|
||||
items: 1,
|
||||
margin: 30,
|
||||
nav: false,
|
||||
dots: false,
|
||||
loop: true
|
||||
// loop: true,
|
||||
// autoWidth: true,
|
||||
// center: true,
|
||||
// dots: true,
|
||||
// dotsEach: true,
|
||||
// autoplay: true,
|
||||
// autoplayTimeout: 3000,
|
||||
// autoplaySpeed: 1000,
|
||||
// autoplayHoverPause: true
|
||||
// nav: true,
|
||||
// navText: ['<div class="principals-slider__prev"><i class="fa fa-chevron-left" aria-hidden="true"></i></div>','<div class="principals-slider__next"><i class="fa fa-chevron-right" aria-hidden="true"></i></div>'],
|
||||
}
|
||||
}
|
||||
});
|
||||
$('.principals-slider').owlCarousel({
|
||||
responsive: {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 30,
|
||||
items: 1,
|
||||
stagePadding: 40,
|
||||
dots: false,
|
||||
loop: true,
|
||||
// center: true,
|
||||
autoWidth: true,
|
||||
// normal: false
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
items: 2,
|
||||
stagePadding: 10,
|
||||
margin: 30,
|
||||
loop: true,
|
||||
dots: false,
|
||||
autoWidth: false
|
||||
},
|
||||
1200 : {
|
||||
smartSpeed: 400,
|
||||
dots: false,
|
||||
items: 6,
|
||||
margin: 30,
|
||||
loop: true,
|
||||
autoWidth: false,
|
||||
nav: true,
|
||||
navText: ['<div class="principals-slider__prev"><i class="fa fa-chevron-left" aria-hidden="true"></i></div>','<div class="principals-slider__next"><i class="fa fa-chevron-right" aria-hidden="true"></i></div>'],
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
var owl=$(".discount-modal-slider");
|
||||
owl.owlCarousel();
|
||||
if(discountClose){
|
||||
discountOpen.forEach((item, index) => {
|
||||
item.addEventListener('click', () => {
|
||||
discountModal.style.display = 'block';
|
||||
owl.trigger("to.owl.carousel", index, 100);
|
||||
});
|
||||
});
|
||||
discountModal.addEventListener('click', (e) => {
|
||||
let target = e.target;
|
||||
if(target.classList.contains('discount-modal-layout')){
|
||||
discountModal.style.display = 'none';
|
||||
}
|
||||
})
|
||||
discountClose.addEventListener('click', () => {
|
||||
discountModal.style.display = 'none';
|
||||
})
|
||||
$(".discount-modal-slider-nav-next").click(function(){
|
||||
owl.trigger("next.owl.carousel");
|
||||
});
|
||||
$(".discount-modal-slider-nav-prev").click(function(){
|
||||
owl.trigger("prev.owl.carousel");
|
||||
});
|
||||
}
|
||||
|
||||
if(places){
|
||||
const placesItems = [...document.querySelectorAll('.places .owl-item')].filter(item => !item.classList.contains('cloned'));
|
||||
|
||||
placesItems.forEach((currentItem, index) => {
|
||||
const placesSpans = currentItem.querySelectorAll('.places-img span');
|
||||
placesSpans[0].textContent = index + 1;
|
||||
placesSpans[1].textContent = placesItems.length;
|
||||
// console.log(currentItem, index);
|
||||
|
||||
// placesSpans[1] = placesItems.length();
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
$(document).ready(function () {
|
||||
var form = $('.order__form'),
|
||||
action = $('.order__form').attr('action');
|
||||
form.on('submit', (e) => {
|
||||
|
||||
var formData = {
|
||||
orderName: $('#orderName').val(),
|
||||
orderTel: $('#orderTel').val(),
|
||||
orderEmail: $('#orderEmail').val(),
|
||||
orderOthers: $('#orderOthers').val(),
|
||||
|
||||
// Variables
|
||||
const discountModal = document.querySelector('.discount-modal');
|
||||
const discountClose = document.querySelector('.discount-modal-close');
|
||||
const discountOpen = document.querySelectorAll('.discount-item__content button');
|
||||
const discountSlider = document.querySelector('.discount-slider')
|
||||
const discountModalSlider = document.querySelector('.discount-modal-slider');
|
||||
const places = document.querySelectorAll('.places .owl-item');
|
||||
|
||||
const orderForm = document.querySelector('.order__form');
|
||||
const orderPhone = document.getElementById('orderTel');
|
||||
const orderName = document.getElementById('orderName');
|
||||
const orderEmail = document.getElementById('orderEmail');
|
||||
const orderOthers = document.getElementById('orderOthers');
|
||||
const orderModal = document.querySelector('.order-modal');
|
||||
|
||||
const mainSlider = document.querySelector('.main-slider');
|
||||
const entSlider = document.querySelector('.ent-slider');
|
||||
const placesSlider = document.querySelector('.places-slider');
|
||||
const principalsSlider = document.querySelector('.principals-slider');
|
||||
|
||||
$(orderPhone).mask('+7 (900) 000-00-00');
|
||||
|
||||
$('[data-toggle="popover"]').popover();
|
||||
|
||||
// Init sliders
|
||||
$(mainSlider).owlCarousel({
|
||||
responsive: {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 0,
|
||||
dots: true,
|
||||
loop: true,
|
||||
center: true,
|
||||
normal: false,
|
||||
lazyLoad: true,
|
||||
lazyLoadEager: 1
|
||||
// autoWidth: true
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
items: 6,
|
||||
margin: 0
|
||||
},
|
||||
768 : {
|
||||
smartSpeed: 400,
|
||||
items: 1,
|
||||
margin: 30,
|
||||
loop: true,
|
||||
autoWidth: true,
|
||||
center: true,
|
||||
dots: true,
|
||||
dotsEach: true,
|
||||
// autoplay: true,
|
||||
autoplayTimeout: 3000,
|
||||
autoplaySpeed: 1000,
|
||||
autoplayHoverPause: true
|
||||
// nav: true,
|
||||
// navText: ['<div class="principals-slider__prev"><i class="fa fa-chevron-left" aria-hidden="true"></i></div>','<div class="principals-slider__next"><i class="fa fa-chevron-right" aria-hidden="true"></i></div>'],
|
||||
}
|
||||
}
|
||||
console.log(formData);
|
||||
|
||||
});
|
||||
$(entSlider).owlCarousel({
|
||||
responsive: {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 80,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
autoWidth: false,
|
||||
loop:true
|
||||
},
|
||||
360 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true,
|
||||
autoWidth: false
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
margin: 20,
|
||||
loop: true,
|
||||
dots: false,
|
||||
autoWidth: false
|
||||
},
|
||||
768 : {
|
||||
smartSpeed: 400,
|
||||
margin: 50,
|
||||
items: 3,
|
||||
// stagePadding: 30,
|
||||
}
|
||||
}
|
||||
});
|
||||
$(placesSlider).owlCarousel({
|
||||
responsive : {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true,
|
||||
autoWidth: false
|
||||
},
|
||||
360 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true,
|
||||
autoWidth: false
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true,
|
||||
autoWidth: false
|
||||
},
|
||||
768: {
|
||||
smartSpeed: 400,
|
||||
margin: 150,
|
||||
item: 1,
|
||||
autoWidth: true,
|
||||
nav: true,
|
||||
dots: false,
|
||||
loop: true,
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
$(discountSlider).owlCarousel({
|
||||
responsive : {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 80,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true
|
||||
},
|
||||
360 : {
|
||||
smartSpeed: 400,
|
||||
margin: 35,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
dots: false,
|
||||
loop:true
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
items: 1,
|
||||
stagePadding: 60,
|
||||
margin: 20,
|
||||
loop: true,
|
||||
dots: false,
|
||||
autoWidth: false
|
||||
},
|
||||
1200: {
|
||||
margin: 10,
|
||||
smartSpeed: 400,
|
||||
item: 3,
|
||||
// autoWidth: true,
|
||||
nav: true,
|
||||
navText: ['<div class="discount-slider__prev"><i class="fa fa-chevron-left" aria-hidden="true"></i></div>','<div class="discount-slider__next"><i class="fa fa-chevron-right" aria-hidden="true"></i></div>'],
|
||||
dots: false,
|
||||
loop: true,
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
$(discountModalSlider).owlCarousel({
|
||||
responsive: {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 10,
|
||||
items: 1,
|
||||
stagePadding: 0,
|
||||
dots: false,
|
||||
loop: true,
|
||||
center: true,
|
||||
normal: false,
|
||||
// lazyLoad: true,
|
||||
// lazyLoadEager: 1
|
||||
// autoWidth: true
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
items: 6,
|
||||
margin: 0
|
||||
},
|
||||
768 : {
|
||||
smartSpeed: 400,
|
||||
items: 1,
|
||||
margin: 30,
|
||||
nav: false,
|
||||
dots: false,
|
||||
loop: true
|
||||
// loop: true,
|
||||
// autoWidth: true,
|
||||
// center: true,
|
||||
// dots: true,
|
||||
// dotsEach: true,
|
||||
// autoplay: true,
|
||||
// autoplayTimeout: 3000,
|
||||
// autoplaySpeed: 1000,
|
||||
// autoplayHoverPause: true
|
||||
// nav: true,
|
||||
// navText: ['<div class="principals-slider__prev"><i class="fa fa-chevron-left" aria-hidden="true"></i></div>','<div class="principals-slider__next"><i class="fa fa-chevron-right" aria-hidden="true"></i></div>'],
|
||||
}
|
||||
}
|
||||
});
|
||||
$(principalsSlider).owlCarousel({
|
||||
responsive: {
|
||||
0 : {
|
||||
smartSpeed: 400,
|
||||
margin: 30,
|
||||
items: 1,
|
||||
stagePadding: 40,
|
||||
dots: false,
|
||||
loop: true,
|
||||
// center: true,
|
||||
autoWidth: true,
|
||||
// normal: false
|
||||
},
|
||||
480 : {
|
||||
smartSpeed: 400,
|
||||
items: 2,
|
||||
stagePadding: 10,
|
||||
margin: 30,
|
||||
loop: true,
|
||||
dots: false,
|
||||
autoWidth: false
|
||||
},
|
||||
1200 : {
|
||||
smartSpeed: 400,
|
||||
dots: false,
|
||||
items: 6,
|
||||
margin: 30,
|
||||
loop: true,
|
||||
autoWidth: false,
|
||||
nav: true,
|
||||
navText: ['<div class="principals-slider__prev"><i class="fa fa-chevron-left" aria-hidden="true"></i></div>','<div class="principals-slider__next"><i class="fa fa-chevron-right" aria-hidden="true"></i></div>'],
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
$(discountModalSlider).owlCarousel();
|
||||
|
||||
if(discountClose){
|
||||
discountOpen.forEach((item, index) => {
|
||||
item.addEventListener('click', () => {
|
||||
$(discountModal).show();
|
||||
owl.trigger("to.owl.carousel", index, 100);
|
||||
});
|
||||
});
|
||||
|
||||
discountModal.addEventListener('click', (e) => {
|
||||
let target = e.target;
|
||||
if(target.classList.contains('discount-modal-layout')){
|
||||
$(discountModal).hide();
|
||||
}
|
||||
})
|
||||
|
||||
discountClose.addEventListener('click', $(discountModal).hide)
|
||||
|
||||
$(".discount-modal-slider-nav-next").click(function() {
|
||||
owl.trigger("next.owl.carousel");
|
||||
});
|
||||
|
||||
$(".discount-modal-slider-nav-prev").click(function() {
|
||||
owl.trigger("prev.owl.carousel");
|
||||
});
|
||||
}
|
||||
|
||||
if (places) {
|
||||
const placesItems = Array.from(places).filter(item => !item.classList.contains('cloned'));
|
||||
|
||||
placesItems.forEach((currentItem, index) => {
|
||||
const placesSpans = currentItem.querySelectorAll('.places-img span');
|
||||
|
||||
placesSpans[0].textContent = index + 1;
|
||||
placesSpans[1].textContent = placesItems.length;
|
||||
});
|
||||
}
|
||||
|
||||
$(orderForm).on('submit', (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
var formData = {
|
||||
orderName: orderName.value,
|
||||
orderTel: orderPhone.value,
|
||||
orderEmail: orderEmail.value,
|
||||
orderOthers: orderOthers.value,
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
url: action,
|
||||
url: $(orderForm).attr('action'),
|
||||
type: 'POST',
|
||||
data: formData,
|
||||
success: function (response) {
|
||||
// form.html("Ваш запрос отправлен, спрсибо !");
|
||||
$('.order-modal').show();
|
||||
$("body").css("overflow","hidden");
|
||||
success: function () {
|
||||
$(orderModal).show();
|
||||
$("body").css("overflow","hidden");
|
||||
},
|
||||
error: function(request, txtstatus, errorThrown){
|
||||
console.log(request);
|
||||
@ -306,62 +320,26 @@ $(document).ready(function () {
|
||||
console.log(errorThrown);
|
||||
}
|
||||
});
|
||||
e.preventDefault();
|
||||
|
||||
|
||||
})
|
||||
document.querySelector('.order-modal').addEventListener('click', (e) => {
|
||||
|
||||
orderModal && orderModal.addEventListener('click', (e) => {
|
||||
if (!e.target.closest('.container')){
|
||||
$('.order-modal').hide();
|
||||
$("body").css("overflow","auto");
|
||||
$(orderModal).hide();
|
||||
$("body").css("overflow","auto");
|
||||
}
|
||||
})
|
||||
$('.packages-item a').on( 'click', function(){
|
||||
|
||||
$('.packages-item a').on( 'click', function(){
|
||||
var el = $(this);
|
||||
var dest = el.attr('href'); // получаем направление
|
||||
if(dest !== undefined && dest !== '') { // проверяем существование
|
||||
$('html').animate({
|
||||
$('html').animate({
|
||||
scrollTop: $(dest).offset().top // прокручиваем страницу к требуемому элементу
|
||||
}, 500 // скорость прокрутки
|
||||
);
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
const mainSlider = $("#carousel").waterwheelCarousel({
|
||||
// separation: 135,
|
||||
separation: 435,
|
||||
});
|
||||
|
||||
$("#carousel").swipe( {
|
||||
//Generic swipe handler for all directions
|
||||
swipe:function(event, direction, distance, duration, fingerCount, fingerData) {
|
||||
if(direction === 'right'){
|
||||
mainSlider.prev();
|
||||
}
|
||||
if(direction === 'left'){
|
||||
mainSlider.next();
|
||||
}
|
||||
},
|
||||
//Default is 75px, set to 0 for demo so any distance triggers swipe
|
||||
threshold:0
|
||||
});
|
||||
$('#carousel-mobile').slick({
|
||||
responsive: {
|
||||
0 : {
|
||||
infinite: true,
|
||||
dots: false,
|
||||
arrows: false,
|
||||
adaptiveHeight: true
|
||||
|
||||
},
|
||||
1200: {
|
||||
arrows: false,
|
||||
dots: true
|
||||
}
|
||||
}
|
||||
});
|
||||
document.querySelector('#carousel-mobile .slick-prev').innerHTML = '<i class="fa fa-arrow-left" aria-hidden="true"></i>';
|
||||
document.querySelector('#carousel-mobile .slick-next').innerHTML = '<i class="fa fa-arrow-right" aria-hidden="true"></i>';
|
||||
});
|
||||
|
||||
|
||||
@ -1,24 +1,29 @@
|
||||
const compoundTurn = document.querySelector('.compound .turn'),
|
||||
compoundText = document.querySelector('.compound__text'),
|
||||
questItem = document.querySelectorAll('.quests-content__item .quest-level');
|
||||
if(compoundTurn){
|
||||
const compoundTurn = document.querySelector('.compound .turn');
|
||||
const compoundText = document.querySelector('.compound__text');
|
||||
const questItem = document.querySelectorAll('.quests-content__item .quest-level');
|
||||
|
||||
if (compoundTurn) {
|
||||
const compoundTextHeight = compoundText.offsetHeight;
|
||||
|
||||
questItem.forEach(item => {
|
||||
let levelIcons = item.querySelectorAll('img');
|
||||
for(let i = 0; i < item.dataset.level; i++){
|
||||
|
||||
for (let i = 0; i < item.dataset.level; i++) {
|
||||
levelIcons[i].classList.remove('icon-hidden')
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
compoundText.style.height = compoundTextHeight/3 + 'px';
|
||||
|
||||
compoundTurn.addEventListener('click', () => {
|
||||
let currentHeight = compoundText.style.height.slice(0, -2);
|
||||
if(currentHeight == compoundTextHeight){
|
||||
|
||||
if (currentHeight === compoundTextHeight) {
|
||||
compoundTurn.textContent = 'Читать далее';
|
||||
compoundText.style.height = compoundTextHeight/3 + 'px';
|
||||
}else{
|
||||
} else{
|
||||
compoundTurn.textContent = 'Свернуть';
|
||||
compoundText.style.height = compoundTextHeight + 'px';
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,22 +1,9 @@
|
||||
const holidayDescrBtn = document.querySelector('.holiday-descr a'),
|
||||
sales = document.querySelector('.sales');
|
||||
if(sales){
|
||||
$('.discount-slider').owlCarousel().trigger('destroy.owl.carousel');
|
||||
document.querySelector('.discount-slider').classList.remove('owl-carousel');
|
||||
document.querySelector('.discount-slider').classList.add('sales-block');
|
||||
const sales = document.querySelector('.sales');
|
||||
const discountSlider = document.querySelector('.discount-slider');
|
||||
|
||||
const holidayDescr = holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').offsetHeight;
|
||||
holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height = holidayDescr/3 + 'px';
|
||||
holidayDescrBtn.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
if (sales) {
|
||||
$(discountSlider).owlCarousel().trigger('destroy.owl.carousel');
|
||||
|
||||
let currentHeight = holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height.slice(0, -2);
|
||||
if(currentHeight == holidayDescr){
|
||||
holidayDescrBtn.textContent = 'Читать далее';
|
||||
holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height = holidayDescr/3 + 'px';
|
||||
}else{
|
||||
holidayDescrBtn.textContent = 'Свернуть';
|
||||
holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height = holidayDescr + 'px';
|
||||
}
|
||||
})
|
||||
discountSlider.classList.remove('owl-carousel');
|
||||
discountSlider.classList.add('sales-block');
|
||||
}
|
||||
233
src/js/script.js
233
src/js/script.js
@ -1,142 +1,72 @@
|
||||
$(document).ready(function(){
|
||||
|
||||
const footerLinks = document.querySelectorAll('.footer__menu .footer-open'),
|
||||
headerContainer = document.querySelector('.header-wrapper'),
|
||||
|
||||
aboutJoki = document.querySelector('.about-joki');
|
||||
// Variables
|
||||
const headerContainer = document.querySelector('.header-wrapper');
|
||||
const submenu = document.querySelector('.header-submenu');
|
||||
const openSubMenu = document.querySelector('.header-navmenu__item .fa-bars');
|
||||
const sub = document.querySelectorAll('.header-submenu')[1];
|
||||
|
||||
if(aboutJoki){
|
||||
const aboutJoki = document.querySelector('.about-joki');
|
||||
const aboutHeaders = document.querySelectorAll('.about-joki__header h3');
|
||||
const aboutContent = document.querySelectorAll('.about-joki__body-item');
|
||||
const containers = document.querySelectorAll('.about-joki__body-item')
|
||||
|
||||
const aboutHeaders = document.querySelectorAll('.about-joki__header h3'),
|
||||
aboutContent = document.querySelectorAll('.about-joki__body-item');
|
||||
const orderModal = document.querySelector('.order-modal');
|
||||
const orderModalOverlay = document.querySelector('.order-modal__overlay');
|
||||
|
||||
let content = 'about';
|
||||
const callBackBtn = document.querySelector('.order-call');
|
||||
const callBackForm = document.querySelector('.callback-modal form');
|
||||
const callBackModal = document.querySelector('.callback-modal');
|
||||
const callBackLayout = document.querySelector('.callback-modal__layout');
|
||||
const callBackClose = document.querySelector('.callback-modal__close');
|
||||
const callbackName = document.getElementById('callback-name');
|
||||
const callbackPhone = document.getElementById('callback-phone');
|
||||
|
||||
aboutHeaders.forEach(item => {
|
||||
item.addEventListener('click', (e) => {
|
||||
aboutHeaders.forEach(header => {
|
||||
header.classList.remove('active');
|
||||
})
|
||||
item.classList.add('active');
|
||||
content = item.dataset.content;
|
||||
aboutContent.forEach(currentItem => {
|
||||
if(currentItem.dataset.content === content){
|
||||
currentItem.style.display = 'block'
|
||||
}else{
|
||||
currentItem.style.display = 'none';
|
||||
}
|
||||
});
|
||||
})
|
||||
});
|
||||
}
|
||||
let scrollPos = 0;
|
||||
|
||||
if(document.documentElement.clientWidth <= '425'){
|
||||
const submenu = document.querySelector('.header-submenu'),
|
||||
openSubMenu = document.querySelector('.header-navmenu__item .fa-bars'),
|
||||
closeSubmenu = document.createElement('a');
|
||||
closeSubmenu.classList.add('header-submenu-close-sub');
|
||||
closeSubmenu.innerHTML = `<li class="header-submenu__item header-submenu__item-close"><i class="fa fa-times" aria-hidden="true"></i></li>`
|
||||
submenu.insertAdjacentElement('afterbegin', closeSubmenu);
|
||||
closeSubmenu.addEventListener('click', (e)=>{
|
||||
document.querySelector('.header-submenu').style.display = 'none';
|
||||
})
|
||||
// Add styles
|
||||
$('#datapicker').datetimepicker({locale: 'ru', format: 'DD.MM.YYYY'});
|
||||
$('#datapicker2').datetimepicker({locale: 'ru', format: 'DD.MM.YYYY'});
|
||||
$(callbackPhone).mask('+7 (900) 000-00-00');
|
||||
|
||||
openSubMenu.closest('li').addEventListener('click', (e) => {
|
||||
const sub = document.querySelectorAll('.header-submenu')[1]
|
||||
|
||||
if (sub.style.display === 'block') {
|
||||
sub.style.display = 'none'
|
||||
openSubMenu.closest('li').style.background = '#fff'
|
||||
} else {
|
||||
sub.style.display = 'block';
|
||||
openSubMenu.closest('li').style.background = '#f2f2f2'
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
$('#datapicker').datetimepicker({
|
||||
locale: 'ru',
|
||||
format: 'DD.MM.YYYY'
|
||||
});
|
||||
$('#datapicker2').datetimepicker({
|
||||
locale: 'ru',
|
||||
format: 'DD.MM.YYYY'
|
||||
});
|
||||
|
||||
// footerLinks.forEach(item => {
|
||||
// item.querySelector('a').addEventListener('click', (e) => {
|
||||
// e.preventDefault();
|
||||
// e.target.nextElementSibling.classList.toggle('footer__submenu__hide');
|
||||
// })
|
||||
// });
|
||||
var scrollPos = 0;
|
||||
|
||||
$(window).scroll(function(){
|
||||
if (!headerContainer) return
|
||||
var st = $(this).scrollTop();
|
||||
if (!st) return;
|
||||
if(st < 199){
|
||||
return
|
||||
}
|
||||
if (st > scrollPos){
|
||||
headerContainer && headerContainer.classList.add('header-menu__hide');
|
||||
} else {
|
||||
headerContainer && headerContainer.classList.remove('header-menu__hide');
|
||||
}
|
||||
scrollPos = st;
|
||||
});
|
||||
|
||||
const callBackBtn = document.querySelector('.order-call'),
|
||||
callBackForm = document.querySelector('.callback-modal form'),
|
||||
callBackModal = document.querySelector('.callback-modal'),
|
||||
callBackLayout = document.querySelector('.callback-modal__layout'),
|
||||
callBackClose = document.querySelector('.callback-modal__close');
|
||||
|
||||
$('#callback-phone').mask('+7 (900) 000-00-00');
|
||||
// Add listeners
|
||||
|
||||
callBackBtn.addEventListener('click', (e) => {
|
||||
e.preventDefault()
|
||||
e.preventDefault();
|
||||
|
||||
callBackModal.style.display = 'block'
|
||||
$("body").css("overflow","hidden");
|
||||
|
||||
$(document.body).css("overflow","hidden");
|
||||
})
|
||||
|
||||
callBackLayout.addEventListener('click', () => {
|
||||
callBackModal.style.display = 'none'
|
||||
$("body").css("overflow","auto");
|
||||
callBackModal.style.display = 'none';
|
||||
$(document.body).css("overflow","auto");
|
||||
})
|
||||
|
||||
callBackClose.addEventListener('click', () => {
|
||||
callBackModal.style.display = 'none'
|
||||
$("body").css("overflow","auto");
|
||||
$(document.body).css("overflow","auto");
|
||||
})
|
||||
|
||||
callBackForm.addEventListener('submit', (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
|
||||
const formData = {
|
||||
name: '',
|
||||
phone: ''
|
||||
name: callbackName.value,
|
||||
phone: callbackPhone.value,
|
||||
}
|
||||
formData.name = document.getElementById('callback-name').value
|
||||
formData.phone = document.getElementById('callback-phone').value
|
||||
console.log(formData);
|
||||
var action = $('.callback-modal form').attr('action'); ;
|
||||
|
||||
|
||||
const action = $(callBackForm).attr('action');
|
||||
|
||||
$.ajax({
|
||||
url: action,
|
||||
type: 'POST',
|
||||
data: formData,
|
||||
success: function (response) {
|
||||
success: function () {
|
||||
callBackModal.style.display = 'none'
|
||||
$('.order-modal').show();
|
||||
document.getElementById('callback-name').value = ''
|
||||
document.getElementById('callback-phone').value = ''
|
||||
$('.order-modal__overlay').on('click', () => {
|
||||
$('.order-modal').hide();
|
||||
})
|
||||
|
||||
$(orderModal).show();
|
||||
callbackName.value = ''
|
||||
callbackPhone.value = ''
|
||||
},
|
||||
error: function(request, txtstatus, errorThrown){
|
||||
console.error(request);
|
||||
@ -146,20 +76,71 @@ $(document).ready(function(){
|
||||
});
|
||||
|
||||
})
|
||||
|
||||
orderModalOverlay && orderModalOverlay.addEventListener('click', $(orderModal).hide);
|
||||
|
||||
window.addEventListener('scroll', () => {
|
||||
if (!headerContainer) return
|
||||
|
||||
let st = $(this).scrollTop();
|
||||
if (!st || st < 199) return;
|
||||
|
||||
if (st > scrollPos) headerContainer && headerContainer.classList.add('header-menu__hide');
|
||||
else headerContainer && headerContainer.classList.remove('header-menu__hide');
|
||||
|
||||
scrollPos = st;
|
||||
})
|
||||
|
||||
if (aboutJoki) {
|
||||
let content = 'about';
|
||||
|
||||
aboutHeaders.forEach(item => {
|
||||
item.addEventListener('click', () => {
|
||||
aboutHeaders.forEach(header => header.classList.remove('active'))
|
||||
|
||||
item.classList.add('active');
|
||||
content = item.dataset.content;
|
||||
|
||||
aboutContent.forEach(currentItem => {
|
||||
if (currentItem.dataset.content === content) {
|
||||
$(currentItem).show();
|
||||
} else{
|
||||
$(currentItem).hide();
|
||||
}
|
||||
});
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
if (document.documentElement.clientWidth <= '425') {
|
||||
const closeSubmenu = document.createElement('a');
|
||||
|
||||
closeSubmenu.classList.add('header-submenu-close-sub');
|
||||
closeSubmenu.innerHTML = `<li class="header-submenu__item header-submenu__item-close"><i class="fa fa-times" aria-hidden="true"></i></li>`
|
||||
|
||||
submenu.insertAdjacentElement('afterbegin', closeSubmenu);
|
||||
|
||||
closeSubmenu.addEventListener('click', $(submenu).show)
|
||||
|
||||
openSubMenu.closest('li').addEventListener('click', () => {
|
||||
if (sub.style.display === 'block') {
|
||||
$(sub).hide();
|
||||
openSubMenu.closest('li').style.background = '#fff';
|
||||
} else {
|
||||
$(sub).show();
|
||||
openSubMenu.closest('li').style.background = '#f2f2f2';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (window.location.hash === '#feedback') {
|
||||
aboutHeaders.forEach(header => header.classList.remove('active'))
|
||||
|
||||
document.querySelector(`.about-joki__header [data-content='feedback']`).classList.add('active')
|
||||
|
||||
containers.forEach(cont => cont.style.display = 'none')
|
||||
|
||||
document.querySelector(`.about-joki__body-item[data-content='feedback']`).style.display = 'block'
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
if (window.location.hash == '#feedback') {
|
||||
const headers = document.querySelectorAll('.about-joki__header h3')
|
||||
|
||||
headers.forEach(header => header.classList.remove('active'))
|
||||
|
||||
document.querySelector(`.about-joki__header [data-content='feedback']`).classList.add('active')
|
||||
|
||||
const containers = document.querySelectorAll('.about-joki__body-item')
|
||||
|
||||
containers.forEach(cont => cont.style.display = 'none')
|
||||
|
||||
document.querySelector(`.about-joki__body-item[data-content='feedback']`).style.display = 'block'
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -46,15 +46,6 @@
|
||||
a
|
||||
display: none
|
||||
|
||||
#carousel-mobile
|
||||
display: none
|
||||
img
|
||||
margin: 0 auto
|
||||
display: block !important
|
||||
width: 100%
|
||||
height: 100%
|
||||
max-width: 435px
|
||||
|
||||
.map-block-in-home
|
||||
&::after
|
||||
background-color: #f2f2f2 !important
|
||||
@ -145,26 +136,7 @@
|
||||
@media screen and (max-width: 1024px)
|
||||
.main
|
||||
height: 250px !important
|
||||
#carousel
|
||||
display: none
|
||||
#carousel-mobile
|
||||
display: flex
|
||||
justify-content: space-around
|
||||
align-items: center
|
||||
.slick-arrow
|
||||
border-radius: 50%
|
||||
outline: none
|
||||
width: 36px !important
|
||||
height: 36px !important
|
||||
display: flex
|
||||
justify-content: center
|
||||
align-items: center
|
||||
border: none
|
||||
opacity: 0.5
|
||||
transition: opacity .3s ease-in-out
|
||||
padding: 1px 12px
|
||||
&:hover
|
||||
opacity: 1
|
||||
|
||||
.present .container
|
||||
&::after
|
||||
right: 0 !important
|
||||
@ -200,9 +172,7 @@
|
||||
h1
|
||||
font-size: 28px
|
||||
line-height: 1.2
|
||||
#carousel-mobile
|
||||
.slick-arrow
|
||||
display: none !important
|
||||
|
||||
.main
|
||||
height: 200px !important
|
||||
padding: 0 !important
|
||||
@ -312,9 +282,6 @@
|
||||
.hide-menu
|
||||
display: block !important
|
||||
|
||||
#carousel img
|
||||
transform: scale(1.2)
|
||||
|
||||
@media (min-width: 1200px)
|
||||
.container, .container-lg, .container-md, .container-sm, .container-xl
|
||||
max-width: 1195px
|
||||
@ -341,7 +308,7 @@
|
||||
height: auto !important
|
||||
display: none
|
||||
.callback-modal__body
|
||||
width: 80%
|
||||
width: 80%
|
||||
.form-block
|
||||
padding-bottom: 10px
|
||||
|
||||
|
||||
@ -24,10 +24,8 @@
|
||||
|
||||
get_template_part('parts/certificates/modal'); ?>
|
||||
<script>
|
||||
// document.querySelector('.page-header h1').textContent = 'Подарочный сертификат на квест Armanty Quests';
|
||||
document.querySelector('.page-header').style.background = 'url("<?php echo the_field('cert_bg', 35)?>") top left no-repeat';
|
||||
document.querySelector('.page-header').style.backgroundSize = 'cover';
|
||||
// document.querySelector('.holiday-descr h2').textContent = `Подарочный сертификат на квест`;
|
||||
document.querySelector('.holiday-descr__text').innerHTML = `<?php echo the_field('cert_text', 35)?>`;
|
||||
$('.holiday-descr h2').remove();
|
||||
</script>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user