JAVASCRIPT   10

main.js

Guest on 10th May 2021 04:58:35 PM

  1. var App = {
  2.   init: function(){
  3.     this.map.init();
  4.     this.menu();
  5.     this.eye();
  6.     this.popup();
  7.     this.formField();
  8.     this.contentSlider();
  9.   },
  10.  
  11.   initOnResize: function(){
  12.     this.map.resize();
  13.   },
  14.  
  15.   contentSlider: function(){
  16.     let sliders = $(".js-content-slider");
  17.     if (sliders.length === 0)
  18.       return;
  19.  
  20.     sliders.each(function(){
  21.       let self = $(this);
  22.       let prev = $(".custom-content-swiper-button-prev", self);
  23.       let next = $(".custom-content-swiper-button-next", self);
  24.  
  25.       let mySwiper = new Swiper(this, {
  26.         speed: 500,
  27.         spaceBetween: 60,
  28.         navigation: {
  29.           prevEl: prev.get(0),
  30.           nextEl: next.get(0)
  31.         }
  32.       });
  33.     });
  34.   },
  35.  
  36.   formField: function(){
  37.     $(document).off("keyup.formField").on("keyup.formField", ".js-form-field", function(){
  38.       var self = $(this);
  39.       var value = self.val();
  40.       if (value.length === 0){
  41.         self.addClass("empty");
  42.       } else {
  43.         self.removeClass("empty");
  44.       }
  45.     }).trigger("keyup.formField");
  46.    
  47.     $(".js-form-field").trigger("keyup.formField");
  48.   },
  49.  
  50.   popup: function(){
  51.     var popup = $(".popup-modal");
  52.     if (popup.length === 0)
  53.       return;
  54.  
  55.     var body = $("body");
  56.  
  57.     popup.magnificPopup({
  58.       // alignTop: true,
  59.       closeMarkup: `
  60.         <button title="%title%" type="button" class="popup-block__close">
  61.             <i class="popup-block__close-bg"></i>
  62.         </button>
  63.       `,
  64.       callbacks: {
  65.         open: function(){
  66.           body.addClass("popup-open");
  67.         },
  68.         close: function(){
  69.           body.removeClass("popup-open");
  70.         }
  71.       }
  72.     });
  73.    
  74.     $(document).on("click", ".popup-block__close", function(){
  75.       var inst = $.magnificPopup.instance;
  76.       if (inst){
  77.         inst.close();
  78.       }
  79.     });
  80.   },
  81.  
  82.   menu: function(){
  83.     var body = $("body");
  84.     var menu = $(".mmenu");
  85.     var bodyClass = "mmenu-open";
  86.     var menuClass = "mmenu_open";
  87.  
  88.     $(document).on("click", ".js-open-menu", function(e){
  89.       e.preventDefault();
  90.       menu.addClass(menuClass);
  91.       body.addClass(bodyClass);
  92.     });
  93.  
  94.     $(document).on("click", ".js-close-menu", function(e){
  95.       e.preventDefault();
  96.       menu.removeClass(menuClass);
  97.       body.removeClass(bodyClass);
  98.     });
  99.  
  100.   },
  101.  
  102.   rand: function(min, max){
  103.     var rand = min - 0.5 + Math.random() * (max - min + 1)
  104.     rand = Math.round(rand);
  105.     return rand;
  106.   },
  107.  
  108.   eye: function(){
  109.     var eye = $(".js-eye-target");
  110.     if (!eye.length)
  111.       return;
  112.  
  113.     var $this = this;
  114.     var x = [15, 35];
  115.     var y = [15, 35];
  116.  
  117.     var animate = function(el){
  118.       var randX = $this.rand.apply($this, x);
  119.       var randY = $this.rand.apply($this, y);
  120.  
  121.       el.animate({
  122.         cx: randX,
  123.         cy: randY
  124.       }, {
  125.         duration: 1000,
  126.         complete: function(){
  127.           setTimeout(function(){
  128.             animate(el);
  129.           }, 500);
  130.         }
  131.       });
  132.     };
  133.  
  134.     if (Modernizr.touchevents){
  135.       eye.each(function(){
  136.         animate( $(this) );
  137.       });
  138.     } else {
  139.       $(document).on("mousemove.eye", function(e){
  140.         var coords = {
  141.           x: e.pageX,
  142.           y: e.pageY
  143.         };
  144.  
  145.         eye.each(function(){
  146.           var self = $(this);
  147.           var r = self.prop("r");
  148.           var rval = r.baseVal.value;
  149.           var offset = self.offset();
  150.           var coordsResult = {
  151.             x: (coords.x - offset.left) - rval,
  152.             y: (coords.y - offset.top) - rval
  153.           };
  154.  
  155.           var rad = Math.atan2(coordsResult.y, coordsResult.x);
  156.           var distance = Math.sqrt(Math.pow(coords.x - offset.left, 2) + Math.pow(coords.y - offset.top, 2));
  157.           var cos = Math.cos(rad);
  158.           var sin = Math.sin(rad);
  159.  
  160.           var distanceAbs = Math.abs(distance);
  161.           var number = 10;
  162.           var numberResult = number;
  163.           var max = 50;
  164.           if (distanceAbs < max){
  165.             var dt = distanceAbs / max;
  166.             numberResult = number * dt;
  167.           }
  168.  
  169.           self.attr({
  170.             cx: 25 + numberResult * cos,
  171.             cy: 25 + numberResult * sin
  172.           });
  173.  
  174.         });
  175.       });
  176.     }
  177.    
  178.   },
  179.  
  180.   map: {
  181.     start: false,
  182.     loadScriptStatus: false,
  183.     loadScript: function(cb){
  184.       var $this = this;
  185.  
  186.       if (!this.start){
  187.         $this.start = true;
  188.  
  189.         var script = document.createElement("script");
  190.         script.src = "https://api-maps.yandex.ru/2.1/?lang=ru_RU";
  191.         script.async = true;
  192.         script.onload = function(){
  193.           $this.loadScriptStatus = true;
  194.           cb.call($this);
  195.         };
  196.  
  197.         document.body.appendChild(script);
  198.       }
  199.      
  200.     },
  201.     resize: function(){
  202.       var width = window.innerWidth;
  203.       var map = $("#map");
  204.       if (!map.length)
  205.         return;
  206.        
  207.       if (width >= 768){
  208.         var content = $(".contacts__content");
  209.         var contentOffset = content.offset();
  210.         map.width(contentOffset.left);
  211.       } else {
  212.         map.width('');
  213.       }
  214.     },
  215.     init: function(){
  216.       var map = $("#map");
  217.       if (!map.length)
  218.         return;
  219.      
  220.       if (this.loadScriptStatus){
  221.         this.resize();
  222.  
  223.         var init = function(){
  224.           var myMap = new ymaps.Map("map", {
  225.             center: [53.912971, 27.513219],
  226.             zoom: 17
  227.           });
  228.  
  229.           var myPlacemark = new ymaps.Placemark(myMap.getCenter(), {}, {
  230.             // Š˛ŠæцŠøŠø.
  231. ŠøŠø.
  232.  // Š¯ŠµŠ¾Š±Ń…Š¾Š´ŠøŠ¼Š¾ уŠŗŠ°Š·Š°Ń‚ь Š´Š°Š½Š½Ń‹Š¹ Ń‚ŠøŠæ Š¼Š°ŠŗŠµŃ‚Š°.
  233. °Ń‚ь Š´Š°Š½Š½Ń‹Š¹ Ń‚ŠøŠæ // Š�Š²Š¾Ń‘ ŠøŠ·Š¾Š±Ń€Š°Š¶ŠµŠ½ŠøŠµ ŠøŠŗŠ¾Š½ŠŗŠø Š¼ŠµŃ‚ŠŗŠø.
  234. image',
  235.             // Š�Š²Š¾Ń‘ ŠøŠ·Š¾Š±Ń€// Š Š°Š·Š¼ŠµŃ€Ń‹ Š¼ŠµŃ‚ŠŗŠø.
  236. ŗŠ¾Š½ŠŗŠø Š¼ŠµŃ‚ŠŗŠø.
  237.       // Š�Š¼ŠµŃ‰ŠµŠ½ŠøŠµ Š»ŠµŠ²Š¾Š³Š¾ Š²ŠµŃ€Ń…Š½ŠµŠ³Š¾ уŠ³Š»Š° ŠøŠŗŠ¾Š½ŠŗŠø Š¾Ń‚Š½Š¾ŃŠøŃ‚ŠµŠ»ŃŒŠ½Š¾
  238. Ń‚ŠŗŠ// ŠµŃ‘ "Š½Š¾Š¶ŠŗŠø" (Ń‚Š¾Ń‡ŠŗŠø ŠæŃ€ŠøŠ²Ń¸Š·ŠŗŠø).
  239.  // Š�Š¼ŠµŃ‰ŠµŠ½ŠøŠµ Š»ŠµŠ²Š¾Š³Š¾ Š²ŠµŃ€Ń…Š½ŠµŠ³Š¾ уŠ³Š»Š° ŠøŠŗŠ¾Š½ŠŗŠø Š¾Ń‚Š½Š¾ŃŠøŃ‚ŠµŠ»ŃŒŠ½Š¾
  240.             // ŠµŃ‘ "Š½Š¾Š¶ŠŗŠø" (Ń‚Š¾Ń‡ŠŗŠø ŠæŃ€ŠøŠ²Ń¸Š·ŠŗŠø).
  241.           });
  242.  
  243.           myMap.geoObje

Raw Paste


Login or Register to edit or fork this paste. It's free.