FM / js

/var/www/cobraambalaj/resources/js

Name	Size	Mode	Actions
app.js	24	0644	edit dl rm
bootstrap.js	1247	0644	edit dl rm
web.js	6169	0644	edit dl rm

Edit: /var/www/cobraambalaj/resources/js/web.js (6169B)

//Fixed Header

$("a").on("click", function (event) {
      if (this.hash !== "" && $(this.hash).length && $("body.home").length) {
         event.preventDefault();
         var hash = this.hash;
         instance.scroll(
            {
               el: $(hash),
               margin: 70,
            },
            500,
            "easeInOutSine"
         );
      }
   });
});

$(".navbar-toggler").on("click", function () {
   $(".sidenav-back").addClass("show");
});
$(".sidenav-back").on("click", function () {
   $(".sidenav-back").removeClass("show");
   $(".navbar-collapse").removeClass("show");
});
$(".navbar-collapse .nav-link").on("click", function () {
   $(".sidenav-back").removeClass("show");
   $(".navbar-collapse").removeClass("show");
});

// Main Slider

$(function () {
   var mainSlider = new Swiper("#mainSlider", {
      speed: 400,
      setWrapperSize: true,
      navigation: {
         nextEl: ".swiper-button-next",
         prevEl: ".swiper-button-prev",
      },
      pagination: {
         el: ".swiper-pagination",
         clickable: true,
         renderBullet: function (index, className) {
            return '<span class="' + className + '">' + (index + 1) + "</span>";
         },
      },
   });
});

// Gallery

var Shuffle = window.Shuffle;

class Demo {
   constructor(element) {
      this.element = element;
      this.shuffle = new Shuffle(element, {
         itemSelector: ".gallery-item",
         sizer: element.querySelector(".gallery-sizer"),
      });

// Log events.
      //this.addShuffleEventListeners();

this._activeFilters = [];
      this.addFilterButtons();
   }

/**
    * Shuffle uses the CustomEvent constructor to dispatch events. You can listen
    * for them like you normally would (with jQuery for example).
    */
   addShuffleEventListeners() {
      this.shuffle.on(Shuffle.EventType.LAYOUT, (data) => {
         console.log("layout. data:", data);
      });
      this.shuffle.on(Shuffle.EventType.REMOVED, (data) => {
         console.log("removed. data:", data);
      });
   }

addFilterButtons() {
      const options = document.querySelector(".gallery-filters");
      if (!options) {
         return;
      }

const filterButtons = Array.from(options.children);
      const onClick = this._handleFilterClick.bind(this);
      filterButtons.forEach((button) => {
         button.addEventListener("click", onClick, false);
         button.addEventListener(
            "click",
            () => {  
               $(".home .gallery-item.shuffle-item--visible").show();
               $(".home .gallery-item.shuffle-item--visible").hide();
               $(".home .gallery-item.shuffle-item--visible:lt(6)").show();
               this.shuffle.update();
            },
            false
         );
      });
   }

_handleFilterClick(evt) {
      const btn = evt.currentTarget;
      const isActive = btn.classList.contains("active");
      const isAll = btn.classList.contains("all-cats");
      const btnGroup = btn.getAttribute("data-group");

this._removeActiveClassFromChildren(btn.parentNode);

let filterGroup;
      btn.classList.remove("active");
      if (isAll) {
         btn.classList.add("active");
         filterGroup = Shuffle.ALL_ITEMS;
      } else {
         btn.classList.add("active");
         filterGroup = btnGroup;
      }

this.shuffle.filter(filterGroup);
   }

_removeActiveClassFromChildren(parent) {
      const { children } = parent;
      for (let i = children.length - 1; i >= 0; i--) {
         children[i].classList.remove("active");
      }
   }
}

document.addEventListener("DOMContentLoaded", () => {
   window.demo = new Demo(document.querySelector(".gallery-container"));
   $(".home .gallery-item").hide();
   $(".home .gallery-item:lt(6)").show();
});

// Work Process Slider

var workProcessSlider = new Swiper("#workProcessSlider", {
   centeredSlides: true,
   setWrapperSize: true,
   loop: true,
   breakpoints: {
      // when window width is >= 320px
      320: {
         slidesPerView: 1,
         spaceBetween: 20,
      },
      // when window width is >= 480px
      480: {
         slidesPerView: 1,
         spaceBetween: 30,
      },
      // when window width is >= 640px
      640: {
         slidesPerView: 2,
         spaceBetween: 40,
      },
      // when window width is >= 1200px
      640: {
         slidesPerView: 3,
         spaceBetween: 40,
      },
   },
   navigation: {
      nextEl: ".swiper-button-next",
      prevEl: ".swiper-button-prev",
   },
   pagination: {
      el: ".swiper-pagination",
      clickable: true,
      renderBullet: function (index, className) {
         return '<span class="' + className + '">' + (index + 1) + "</span>";
      },
   },
});

$(function () {
   setTimeout(function () {
      $("#workProcessSlider").css(
         "height",
         $("#workProcessSlider").innerHeight()
      );
   }, 1000);
});

// Clients Slider

var clientsSlider = new Swiper("#clientsSlider", {
   grabCursor: true,
   loop: true,
   breakpoints: {
      320: {
         slidesPerView: 1,
         spaceBetween: 30,
      },
      480: {
         slidesPerView: 1,
         spaceBetween: 30,
      },
      767: {
         slidesPerView: 5,
         spaceBetween: 30,
      },
   },
});

// Fixing Modal & Scroll Issue

$(document).on("show.bs.modal", ".modal", function () {
   $(this).appendTo("body");
});

cmd: