script

(function ($) {
  $(window).on("elementor/frontend/init", function () {
    elementorFrontend.hooks.addAction(
      "frontend/element_ready/cf_slider.default",
      function (scope, $) {
        $(scope)
          .find("#cf_slider")
          .each(function () {
            var a = $(this),
              items = a.data("items") || [1, 1, 1],
              margin = a.data("margin"),
              loop = a.data("loop"),
              nav = a.data("nav"),
              dots = a.data("dots"),
              center = a.data("center"),
              autoplay = a.data("autoplay"),
              autoplaySpeed = a.data("autoplay-speed"),
              rtl = a.data("rtl"),
              autoheight = a.data("autoheight");
            autoplaytimeout = a.data("autoplaytimeout");

            var options = {
              nav: nav || false,
              loop: loop || false,
              dots: dots || false,
              center: center || false,
              autoplay: autoplay || false,
              autoHeight: autoheight || false,
              rtl: rtl || false,
              margin: margin || 0,
              autoplayTimeout: autoplaytimeout || 3000,
              autoplaySpeed: autoplaySpeed || 400,
              autoplayHoverPause: true,
              navText: [
                "<i class='fa fa-chevron-left'></i>",
                "<i class='fa fa-chevron-right'></i>",
              ],
              responsive: {
                0: { items: items[2] || 1 },
                576: { items: items[1] || 1 },
                1200: { items: items[0] || 1 },
              },
            };

            a.owlCarousel(options);
          });
      }
    );
    elementorFrontend.hooks.addAction(
      "frontend/element_ready/cf_action_slider.default",
      function (scope, $) {
        $(scope)
          .find("#cf_action_slider")
          .each(function () {
            var a = $(this),
              items = a.data("items") || [1, 1, 1],
              margin = a.data("margin"),
              loop = a.data("loop"),
              nav = a.data("nav"),
              dots = a.data("dots"),
              center = a.data("center"),
              autoplay = a.data("autoplay"),
              autoplaySpeed = a.data("autoplay-speed"),
              rtl = a.data("rtl"),
              autoheight = a.data("autoheight");
            autoplaytimeout = a.data("autoplaytimeout");

            var options = {
              nav: nav || false,
              loop: loop || false,
              dots: dots || false,
              center: center || false,
              autoplay: autoplay || false,
              autoHeight: autoheight || false,
              rtl: rtl || false,
              margin: margin || 0,
              autoplayTimeout: autoplaytimeout || 3000,
              autoplaySpeed: autoplaySpeed || 400,
              autoplayHoverPause: true,
              navText: [
                "<i class='fa fa-chevron-left'></i>",
                "<i class='fa fa-chevron-right'></i>",
              ],
              responsive: {
                0: { items: items[2] || 1 },
                576: { items: items[1] || 1 },
                1200: { items: items[0] || 1 },
              },
            };

            a.owlCarousel(options);
          });
      }
    );
    elementorFrontend.hooks.addAction(
      "frontend/element_ready/cf_event_slider.default",
      function (scope, $) {
        $(scope)
          .find("#cf_post_slider")
          .each(function () {
            var a = $(this),
              items = a.data("items") || [1, 1, 1],
              margin = a.data("margin"),
              loop = a.data("loop"),
              nav = a.data("nav"),
              dots = a.data("dots"),
              center = a.data("center"),
              autoplay = a.data("autoplay"),
              autoplaySpeed = a.data("autoplay-speed"),
              rtl = a.data("rtl"),
              autoheight = a.data("autoheight");
            autoplaytimeout = a.data("autoplaytimeout");

            var options = {
              nav: nav || false,
              loop: loop || false,
              dots: dots || false,
              center: center || false,
              autoplay: autoplay || false,
              autoHeight: autoheight || false,
              rtl: rtl || false,
              margin: margin || 0,
              autoplayTimeout: autoplaytimeout || 3000,
              autoplaySpeed: autoplaySpeed || 400,
              autoplayHoverPause: true,
              navText: [
                "<i class='fa fa-chevron-left'></i>",
                "<i class='fa fa-chevron-right'></i>",
              ],
              responsive: {
                0: { items: items[2] || 1 },
                576: { items: items[1] || 1 },
                1200: { items: items[0] || 1 },
              },
            };

            a.owlCarousel(options);
          });
      }
    );
    elementorFrontend.hooks.addAction(
      "frontend/element_ready/cf_donate_form.default",
      function (scope, $) {
        $(scope)
          .find("#cf_donate")
          .each(function () {
            var a = $(this),
              items = a.data("items") || [1, 1, 1],
              margin = a.data("margin"),
              loop = a.data("loop"),
              nav = a.data("nav"),
              dots = a.data("dots"),
              center = a.data("center"),
              autoplay = a.data("autoplay"),
              autoplaySpeed = a.data("autoplay-speed"),
              rtl = a.data("rtl"),
              autoheight = a.data("autoheight");
            autoplaytimeout = a.data("autoplaytimeout");

            var options = {
              nav: nav || false,
              loop: loop || false,
              dots: dots || false,
              center: center || false,
              autoplay: autoplay || false,
              autoHeight: autoheight || false,
              rtl: rtl || false,
              margin: margin || 0,
              autoplayTimeout: autoplaytimeout || 3000,
              autoplaySpeed: autoplaySpeed || 400,
              autoplayHoverPause: true,
              navText: [
                "<i class='fa fa-chevron-left'></i>",
                "<i class='fa fa-chevron-right'></i>",
              ],
              responsive: {
                0: { items: items[2] || 1 },
                576: { items: items[1] || 1 },
                1200: { items: items[0] || 1 },
              },
            };

            a.owlCarousel(options);
          });
      }
    );
  });

  var VideoGalleryHandler = function ($scope, $) {
    var $gallery = $scope.find(".pp-video-gallery").eq(0),
      elementSettings = getElementSettings($scope),
      videoPlay = $scope.find(".pp-video-play"),
      $action = $gallery.data("action");

    if ($action === "inline") {
      videoPlay.off("click").on("click", function (e) {
        e.preventDefault();

        var $iframe = $("<iframe/>"),
          $vid_src = $(this).data("src"),
          $player = $(this).find(".pp-video-player");

        $iframe.attr("src", $vid_src);
        $iframe.attr("frameborder", "0");
        $iframe.attr("allowfullscreen", "1");
        $iframe.attr("allow", "autoplay;encrypted-media;");

        $player.html($iframe);
      });
    }

    if (!isEditMode) {
      if (elementSettings.layout === "grid") {
        if ($gallery.hasClass("pp-video-gallery-filter-enabled")) {
          var $isotope_args = {
              itemSelector: ".pp-grid-item-wrap",
              layoutMode: "fitRows",
              percentPosition: true,
            },
            $isotope_gallery = {};

          $scope.imagesLoaded(function () {
            $isotope_gallery = $gallery.isotope($isotope_args);
          });

          $scope.on("click", ".pp-gallery-filter", function () {
            var $this = $(this),
              filterValue = $this.attr("data-filter");

            $this.siblings().removeClass("pp-active");
            $this.addClass("pp-active");

            $isotope_gallery.isotope({ filter: filterValue });
          });
        }
      }
    }

    if (elementSettings.layout === "carousel") {
      var carousel_wrap = $scope.find(".pp-video-gallery-wrapper").eq(0),
        carousel = $scope.find(".pp-video-gallery").eq(0),
        slider_options = JSON.parse(carousel_wrap.attr("data-slider-settings")),
        mySwiper = new Swiper(carousel, slider_options);

      if ("yes" === elementSettings.pause_on_hover) {
        carousel.on({
          mouseenter: function mouseenter() {
            mySwiper.autoplay.stop();
          },
          mouseleave: function mouseleave() {
            mySwiper.autoplay.start();
          },
        });
      }

      PPWidgetUpdate(mySwiper, ".pp-video-gallery", "swiper");

      if (isEditMode) {
        carousel_wrap.resize(function () {
          mySwiper.update();
        });
      }
    }
  };

  elementorFrontend.hooks.addAction(
    "frontend/element_ready/CF_Video_Gallery.default",
    VideoGalleryHandler
  );
})(jQuery);