From c807edb4e99509bf08fb01997ea05b9b16638d7e Mon Sep 17 00:00:00 2001
From: thex <andreas.kar@gmx.at>
Date: Sun, 30 Dec 2018 00:12:12 +0100
Subject: [PATCH 1/3] added lazy load functionality to owlcarousel

---
 themes/helium/common/particles/owlcarousel.html.twig |  8 +++++++-
 themes/helium/common/particles/owlcarousel.yaml      | 12 ++++++++++++
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/themes/helium/common/particles/owlcarousel.html.twig b/themes/helium/common/particles/owlcarousel.html.twig
index b49c3b872..0e3b4e662 100644
--- a/themes/helium/common/particles/owlcarousel.html.twig
+++ b/themes/helium/common/particles/owlcarousel.html.twig
@@ -12,7 +12,7 @@
                     <div class="g-owlcarousel-item {{ item.class|e }}">
                         <div class="g-owlcarousel-item-wrapper">
                             <div class="g-owlcarousel-item-img">
-                                <img src="{{ url(item.image)|e }}" alt="{{ item.title|e }}" />
+                                <img {% if particle.lazyLoadImages %}class="owl-lazy" data-{% endif %}src="{{ url(item.image)|e }}" alt="{{ item.title|e }}" />
                             </div>
                             <div class="g-owlcarousel-item-content-container">
                                 <div class="g-owlcarousel-item-content-wrapper">
@@ -67,6 +67,12 @@
                 {% else %}
                 autoplay: false,
                 {% endif %}
+                {% if particle.lazyLoadImages %}
+                lazyLoad: true,
+                    {% if particle.lazyLoadEager > 0 %}
+                        lazyLoadEager: {{ particle.lazyLoadEager|default('0') }},
+                    {% endif %}
+                {% endif %}
             })
         });
     </script>
diff --git a/themes/helium/common/particles/owlcarousel.yaml b/themes/helium/common/particles/owlcarousel.yaml
index 28815bfe1..43431421a 100644
--- a/themes/helium/common/particles/owlcarousel.yaml
+++ b/themes/helium/common/particles/owlcarousel.yaml
@@ -68,6 +68,18 @@ form:
         enable: Enable
         disable: Disable
 
+    lazyLoadImages:
+      type: input.checkbox
+      label: Lazy Load Images
+      description: Enable to lazy load the item images.
+      default: false
+
+    lazyLoadEager:
+      type: input.text
+      label: Lazy Load Eager
+      description: Number of eagerly pre-loaded images to the left and right.
+      placeholder: 0
+
     items:
       type: collection.list
       array: true

From b32df114d50aa5514c10650913e80fdbab8bf875 Mon Sep 17 00:00:00 2001
From: thex <andreas.kar@gmx.at>
Date: Thu, 3 Jan 2019 11:21:48 +0100
Subject: [PATCH 2/3] added default value for lazyLoadEager

---
 themes/helium/common/particles/owlcarousel.yaml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/themes/helium/common/particles/owlcarousel.yaml b/themes/helium/common/particles/owlcarousel.yaml
index 43431421a..4086f0c67 100644
--- a/themes/helium/common/particles/owlcarousel.yaml
+++ b/themes/helium/common/particles/owlcarousel.yaml
@@ -79,6 +79,7 @@ form:
       label: Lazy Load Eager
       description: Number of eagerly pre-loaded images to the left and right.
       placeholder: 0
+      default: 0
 
     items:
       type: collection.list

From bdfe65512b224514df180dab0b27893fc24b7687 Mon Sep 17 00:00:00 2001
From: thex <andreas.kar@gmx.at>
Date: Tue, 15 Jan 2019 14:46:27 +0100
Subject: [PATCH 3/3] added js filter and improved code

---
 themes/helium/common/particles/owlcarousel.html.twig | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/themes/helium/common/particles/owlcarousel.html.twig b/themes/helium/common/particles/owlcarousel.html.twig
index 0e3b4e662..f86e7ad32 100644
--- a/themes/helium/common/particles/owlcarousel.html.twig
+++ b/themes/helium/common/particles/owlcarousel.html.twig
@@ -41,6 +41,7 @@
 
 {% endblock %}
 
+{% set loadEager = particle.lazyLoadEager|default('0') %}
 {% block javascript_footer %}
     {% do gantry.load('jquery') %}
     <script src="{{ url('gantry-theme://js/owl.carousel.min.js') }}"></script>
@@ -63,14 +64,14 @@
                 {% endif %}
                 {% if particle.autoplay == 'enable' %}
                 autoplay: true,
-                autoplayTimeout: {{ particle.autoplaySpeed|default('5000') }},
+                autoplayTimeout: {{ particle.autoplaySpeed|default('5000')|e('js') }},
                 {% else %}
                 autoplay: false,
                 {% endif %}
                 {% if particle.lazyLoadImages %}
                 lazyLoad: true,
-                    {% if particle.lazyLoadEager > 0 %}
-                        lazyLoadEager: {{ particle.lazyLoadEager|default('0') }},
+                    {% if loadEager > 0 %}
+                        lazyLoadEager: {{ loadEager|e('js') }},
                     {% endif %}
                 {% endif %}
             })