REFACTOR

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') {
+const getCss = async () => {
-    return src('src/sass/**/*.sass', {ignore: 'src/sass/parts/**'})
+  return src(`${pathConfig.src.sass}/**/*.sass`)
-      .pipe(sass())
-      .pipe(cleanCSS({compatibility: 'ie8'}))
-      .pipe(autoprefixer())
-      .pipe(dest('assets/css'))
-  }
 
-  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(gulpif(isProd, cleanCSS({compatibility: 'ie8'})))
-    .pipe(dest('assets/css'))
+    .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')
+  return src(`${pathConfig.src.js}/**/*.js`)
-  .pipe(sourcemaps.init())
+
-  .pipe(uglify())
+  .pipe(gulpif(isDevelop, sourcemaps.init()))
-  .pipe(sourcemaps.write('./'))
+  .pipe(gulpif(isProd, uglify()))
-  .pipe(dest('./assets/js'))
+  .pipe(gulpif(isDevelop, sourcemaps.write('../sourcemaps/js')))
+
+  .pipe(dest(pathConfig.assets.js))
 }
 
 function getFonts() {
-  return src('src/fonts/**/*.{ttf,woff,woff2,svg,eot}')
+  return src(`${pathConfig.src.fonts}/**/*.{ttf,woff,woff2,svg,eot}`)
-    .pipe(dest('assets/fonts/'))
+
+    .pipe(dest(pathConfig.assets.fonts))
 }
 
 function check() {
-  watch('src/sass/**/*.sass', getCss.bind(null, 'develop')).on('change', browser.reload.bind(null, {stream: true}));
+  watch(`${pathConfig.src.sass}/**/*.sass`, getCss).on('change', browser.reload.bind(null, {stream: true}));
-  watch('src/js/**/*.js', getJs).on('change', browser.reload);
+  watch(`${pathConfig.src.js}/**/*.js`, getJs).on('change', browser.reload);
-  watch('src/img/*', compressImages).on('change', browser.reload);
+  watch(`${pathConfig.src.img}/*`, compressImages).on('change', browser.reload);
-  watch('src/fonts/**/*.{ttf,woff,woff2,svg,eot}', getFonts).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);

package-lock.json

@@ -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",

package.json

@@ -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": "",

parts/home/main.php

@@ -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>

src/js/components/certificates.js

@@ -1,22 +1,3 @@
- const certText = document.querySelector('.cert-text'),
+const holidayDescrBtn = document.querySelector('.holiday-descr a');
-       holidayDescrBtn = document.querySelector('.holiday-descr a');
 
-holidayDescrBtn.innerHTML = '';
+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';
-//     }
-//   })
-// }

src/js/components/form.js

@@ -1,68 +1,163 @@
-$('.btn-number').click(function(e){
+$(document).ready(() => {
-  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') {
+  // 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')) {
+  const formData = {
-              input.val(currentVal + 1).change();
+    name: '',
-          }
+    phone: '',
-          if(parseInt(input.val()) == input.attr('max')) {
+    holidayType: 'Birthday',
-              $(this).attr('disabled', true);
+    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);
+      switch (this.questRoom){
-  }
+        case 'Лофт':
-});
+          addingSum += 2500
-$('.input-number').focusin(function(){
+          break;
- $(this).data('oldValue', $(this).val());
+
-});
+        case 'Большой зал':
-$('.input-number').change(function() {
+          addingSum += 2000
-  
+          break;
-  minValue =  parseInt($(this).attr('min'));
+
-  maxValue =  parseInt($(this).attr('max'));
+        case 'Малый зал':
-  valueCurrent = parseInt($(this).val());
+          addingSum += 1000
-  this.closest('input').value = valueCurrent
+          break;
-  name = $(this).attr('name');
+      }
-  if(valueCurrent >= minValue) {
+
-      $(".btn-number[data-type='minus'][data-field='"+name+"']").removeAttr('disabled')
+      this.sum += this.startSum + addingSum + maxPlayerSum;
-  } else {
+    }
-      alert('Sorry, the minimum value was reached');
+  };
-      $(this).val($(this).data('oldValue'));
+  let questSlug = 'none';
-  }
+
-  if(valueCurrent <= maxValue) {
+  // Init styles
-      $(".btn-number[data-type='plus'][data-field='"+name+"']").removeAttr('disabled')
+  $(guestHoliday).selectpicker();
-  } else {
+  $(guestQuestList).selectpicker();
-      alert(`Извините, больше ${maxValue} нельзя`);
+  $(guestRooms).selectpicker();
-      $(this).val($(this).data('oldValue'));
+
-  }
+  $(guestRooms).hide();
-  
+  $(guestText[0]).hide();
-  updateForm();
+  $(guestText[1]).hide();
-});
+
-$(".input-number").keydown(function (e) {
+  // 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
+          // Allow: Ctrl+A
-          (e.keyCode == 65 && e.ctrlKey === true) || 
+          (e.keyCode === 65 && e.ctrlKey === true) ||
-           // Allow: home, end, left, right
+          // Allow: home, end, left, right
           (e.keyCode >= 35 && e.keyCode <= 39)) {
-               // let it happen, don't do anything
+              // let it happen, don't do anything
-               return;
+              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();
+  $("#datapicker").on("dp.change", updateForm);
-$('#guest-quest').selectpicker();
+  $("#datapicker2").on("dp.change", updateForm);
-$('#guest-room').selectpicker();
 
-const mainForm = document.querySelector('.main-form'),
+  mainForm.addEventListener('change', updateForm);
-      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;
 
-    if(currentDate.getDay() == 0 || currentDate.getDay() == 6 || currentDate.getDay() == 5){
+  mainForm.addEventListener('submit', (e) =>{
-      this.startSum = 3500;
+    e.preventDefault();
-    }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)
-      }
-
-    }
-
-    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) {
+      success: function () {
-        $('.order-modal').show();
+        $(orderModal).show();
-        $("body").css("overflow","hidden"); 
+        $("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')){
+    orderModal.addEventListener('click', (e) => {
-        $('.order-modal').hide();
+      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();
+})

src/js/components/holiday.js

@@ -1,28 +1,29 @@
-const holidayDescrBtn = document.querySelector('.holiday-descr .turn'),
+const holidayDescrBtn = document.querySelector('.holiday-descr .turn');
-      addingService = document.querySelector('.adding-service');
+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){
+if (addingService) {
-  $('.packages-slider').owlCarousel({
+  $(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,
       }
     }
   });
-}
+}

src/js/components/main.js

@@ -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');   
+  // Variables
-  form.on('submit', (e) => {
+  const discountModal = document.querySelector('.discount-modal');
-    
+  const discountClose = document.querySelector('.discount-modal-close');
-    var formData = {
+  const discountOpen = document.querySelectorAll('.discount-item__content button');
-      orderName: $('#orderName').val(),
+  const discountSlider = document.querySelector('.discount-slider')
-      orderTel: $('#orderTel').val(),
+  const discountModalSlider = document.querySelector('.discount-modal-slider');
-      orderEmail: $('#orderEmail').val(),
+  const places = document.querySelectorAll('.places .owl-item');
-      orderOthers: $('#orderOthers').val(),
+
+  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) {
+      success: function () {
-        // form.html("Ваш запрос отправлен, спрсибо !");
+        $(orderModal).show();
-        $('.order-modal').show();
+        $("body").css("overflow","hidden");
-        $("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();
+      $(orderModal).hide();
-      $("body").css("overflow","auto"); 
+      $("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>';
 });
 

src/js/components/quests.js

@@ -1,24 +1,29 @@
-const compoundTurn = document.querySelector('.compound .turn'),
+const compoundTurn = document.querySelector('.compound .turn');
-      compoundText = document.querySelector('.compound__text'),
+const compoundText = document.querySelector('.compound__text');
-      questItem = document.querySelectorAll('.quests-content__item .quest-level');
+const questItem = document.querySelectorAll('.quests-content__item .quest-level');
-if(compoundTurn){
+
+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';
     }
   })
-}  
+}

src/js/components/sales.js

@@ -1,22 +1,9 @@
-const holidayDescrBtn = document.querySelector('.holiday-descr a'),
+const sales = document.querySelector('.sales');
-      sales = document.querySelector('.sales');
+const discountSlider = document.querySelector('.discount-slider');
-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 holidayDescr = holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').offsetHeight;
+if (sales) {
-  holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height = holidayDescr/3 + 'px';
+  $(discountSlider).owlCarousel().trigger('destroy.owl.carousel');
-  holidayDescrBtn.addEventListener('click', (e) => {
-    e.preventDefault();
 
-    let currentHeight = holidayDescrBtn.closest('.holiday-descr').querySelector('.holiday-descr__text').style.height.slice(0, -2);
+  discountSlider.classList.remove('owl-carousel');
-    if(currentHeight == holidayDescr){
+  discountSlider.classList.add('sales-block');
-      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';
-    }
-  })
 }

src/js/script.js

@@ -1,142 +1,72 @@
 $(document).ready(function(){
 
-  const footerLinks = document.querySelectorAll('.footer__menu .footer-open'),
+  // Variables
-        headerContainer = document.querySelector('.header-wrapper'),
+  const headerContainer = document.querySelector('.header-wrapper');
-        
+  const submenu = document.querySelector('.header-submenu');
-        aboutJoki = document.querySelector('.about-joki');
+  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'),
+  const orderModal = document.querySelector('.order-modal');
-          aboutContent = document.querySelectorAll('.about-joki__body-item');
+  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 => {
+  let scrollPos = 0;
-      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';
-          }
-        });
-      })
-    });
-  }
 
-  if(document.documentElement.clientWidth <= '425'){
+  // Add styles
-    const submenu = document.querySelector('.header-submenu'),
+  $('#datapicker').datetimepicker({locale: 'ru', format: 'DD.MM.YYYY'});
-          openSubMenu = document.querySelector('.header-navmenu__item .fa-bars'),
+  $('#datapicker2').datetimepicker({locale: 'ru', format: 'DD.MM.YYYY'});
-          closeSubmenu = document.createElement('a');
+  $(callbackPhone).mask('+7 (900) 000-00-00');
-    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';
-  })
 
-  openSubMenu.closest('li').addEventListener('click', (e) => {
+  // Add listeners
-    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');
 
   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'
+    callBackModal.style.display = 'none';
-    $("body").css("overflow","auto"); 
+    $(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: '',
+      name: callbackName.value,
-      phone: ''
+      phone: callbackPhone.value,
     }
-    formData.name = document.getElementById('callback-name').value
+    const action = $(callBackForm).attr('action');
-    formData.phone = document.getElementById('callback-phone').value
+
-    console.log(formData);
-    var action = $('.callback-modal form').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 = ''
+        $(orderModal).show();
-        document.getElementById('callback-phone').value = ''
+        callbackName.value = ''
-        $('.order-modal__overlay').on('click', () => {
+        callbackPhone.value = ''
-          $('.order-modal').hide();
-        })
       },
       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'
-
-}
-

src/sass/other.sass

@@ -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
 

templates/certificates.php

@@ -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>