From: Laury GvR <laury@gaslightmedia.com>
Date: Mon, 12 Feb 2018 13:43:49 +0000 (-0500)
Subject: Run FP OurImpact CountUp script only when scrolled
X-Git-Tag: v1.0.0^2~7
X-Git-Url: http://cvs2.gaslightmedia.com/gitweb/?a=commitdiff_plain;h=e310ae5bf3ca20b17c3a2379ef27f9d93e5b125e;p=WP-Themes%2Fkhako.git

Run FP OurImpact CountUp script only when scrolled

- Rather than counting up the numbers in Our Impact as soon as the
frontpage is loaded, this now only happens the first time the
relevant section is scrolled into view.

- Also added comments and removed test console logs.
---

diff --git a/functions.php b/functions.php
index 992134e..c8fcbff 100644
--- a/functions.php
+++ b/functions.php
@@ -9,7 +9,7 @@ $includePages = array();
 $frontPageId  = get_option('page_on_front');
 add_action('widgets_init', 'glm_quicksite_widget_init');
 
-DEFINE("GLM_BLOCKS_FRONT_GROUP",270);
+DEFINE("GLM_BLOCKS_FRONT_GROUP",270);//270
 DEFINE("GLM_BLOCKS_OUR_IMPACT_GROUP",271);//271
 
 if (!function_exists('glm_quicksite_widget_init')) {
diff --git a/js/custom/pageSetup.js b/js/custom/pageSetup.js
index 4d7e9fc..6a1ff18 100644
--- a/js/custom/pageSetup.js
+++ b/js/custom/pageSetup.js
@@ -32,16 +32,6 @@ $(document).ready(function () {
     var oc_menu             = page.find( $('.left-off-canvas-list') ).children('ul');
     var oc_menu_items       = oc_menu.children('li');
     
-    var our_impact          = page.find('#our-impact-items');
-    var our_impact_items    = our_impact.children('.linked');
-    
-    our_impact_items.each(function() {
-        this.addEventListener("click", function() {
-            
-            console.log("Clicked");
-            window.location = $(this).attr("href");
-        })
-    });
 });
 
 
diff --git a/parts/glm-blocks-our-impact.php b/parts/glm-blocks-our-impact.php
index b2226ec..247e410 100644
--- a/parts/glm-blocks-our-impact.php
+++ b/parts/glm-blocks-our-impact.php
@@ -26,48 +26,6 @@
                             
                             <h1 class="block-title-suffix block-title-segment"></h1>
                             
-                            <script type="text/javascript">
-                                var options = {
-                                    useEasing: true, 
-                                    useGrouping: true, 
-                                    separator: ',', 
-                                    decimal: '.', 
-                                };
-                                
-                                title_id = <?php echo $block->ID;?>;
-
-                                var page = jQuery('body');
-                                var title_prefix = page.find('#block-title-'+title_id+'-wrapper .block-title-prefix')[0];
-                                var title_suffix = page.find('#block-title-'+title_id+'-wrapper .block-title-suffix')[0];
-
-                                myTitle = jQuery("#block-title-"+title_id).text();
-                                
-                                // Remove all commas and periods for regex work. CountUp should add those back as needed
-                                myTitle = myTitle.replace(/[,.]/g, "");
-                                
-                                thePrefix = myTitle.match(/^(\D+)/g);
-                                theNumber = myTitle.match(/(\d+)/g);
-                                theSuffix = myTitle.match(/(\D+)$/g);
-                                
-                                // Throw the prefix and suffix text into individual elements so they remain unaffected by CountUp
-                                //  code which removes the main block title id.
-                                if (thePrefix) {   
-                                    title_prefix.textContent = thePrefix[0];
-                                }
-                                if (theSuffix) {
-                                    title_suffix.textContent = theSuffix[0];
-                                }
-                                
-                                var our_impact_counter = new CountUp('block-title-'+title_id, 0, parseInt(theNumber), 0, 2.5, options);
-                                if (!our_impact_counter.error) {
-                                  our_impact_counter.start();
-                                } else {
-                                  console.error(our_impact_counter.error);
-                                }
-
-                            </script>
-                            
-
                         </div>
                         <p class="block-description"><?php echo $block->post_content;?></p>
                         <?php if($block->url):?>
@@ -87,4 +45,74 @@
     </div>
 </div>
 
-<?php endif;?>
\ No newline at end of file
+<?php endif;?>
+
+<script type="text/javascript">
+    var countup_options = {
+        useEasing: true, 
+        useGrouping: true, 
+        separator: ',', 
+        decimal: '.', 
+    };
+    
+    var page = jQuery('body');
+    var our_impact              = page.find('#our-impact');
+    var our_impact_items        = our_impact.find('#our-impact-items');
+    var our_impact_item_array   = our_impact_items.children(".our-impact-item");
+    var our_impact_items_linked = our_impact_item_array.children('.linked');
+    
+    var our_impact_seen         = false;
+
+    jQuery(window).scroll(function(){
+        
+        // Add extra 
+        var ourImpactStart = (our_impact_items.offset().top+100);
+        var bottomPos = $(window).scrollTop() + $(window).height();
+        if ( bottomPos >= ourImpactStart && our_impact_seen == false ) {
+            
+            our_impact_item_array.each(function() {
+
+                block_id = this.id.replace("block-","");
+                title_prefix = jQuery(this).find('.block-title-prefix')[0];
+                title_suffix = jQuery(this).find('.block-title-suffix')[0];
+                the_title = jQuery(this).find('.block-title-number').text();
+
+                // Remove all commas and periods for regex work. CountUp should add those back as needed
+                the_title = the_title.replace(/[,.]/g, "");
+
+                // Create prefix/suffix separate from whole title to append 
+                the_prefix = the_title.match(/^(\D+)/g);
+                the_number = the_title.match(/(\d+)/g);
+                the_suffix = the_title.match(/(\D+)$/g);
+
+                // Throw the prefix and suffix text into individual elements so they remain unaffected by CountUp
+                //  code which removes the main block title id.
+                if (the_prefix) {   
+                    title_prefix.textContent = the_prefix[0];
+                }
+                if (the_suffix) {
+                    title_suffix.textContent = the_suffix[0];
+                }
+                var our_impact_counter = new CountUp('block-title-'+block_id, 0, parseInt(the_number), 0, 2.5, countup_options);
+                if (!our_impact_counter.error) {
+                  our_impact_counter.start();
+                } else {
+                  console.error(our_impact_counter.error);
+                }
+            });
+            // To avoid the numbers counting up multiple times
+            our_impact_seen = true;
+        }
+        
+    });
+    
+    // Add click event to each linked item on our_impact since they can not be anchors
+    our_impact_items_linked.each(function() {
+        this.addEventListener("click", function() { 
+            window.location = jQuery(this).attr("href");
+        })
+    });
+
+
+</script>
+                            
\ No newline at end of file