From: Laury GvR <laury@gaslightmedia.com>
Date: Tue, 9 May 2017 13:33:56 +0000 (-0400)
Subject: Fixing the Fancybox redirection/disappearance
X-Git-Tag: v1.0.0^2~17
X-Git-Url: http://cvs2.gaslightmedia.com/gitweb/?a=commitdiff_plain;h=8542b47565681a1cb82912998926ae8a150077ed;p=WP-Themes%2Fmunisinghockey.git

Fixing the Fancybox redirection/disappearance

This was a problem for the images on the shop page. Every time a
 fancybox would open the original image would disappear and not
 come back. We think it may have been due to some javascript
 interference from the WooCommerce plugin.
---

diff --git a/js/app.js b/js/app.js
index e03715a..b814de8 100644
--- a/js/app.js
+++ b/js/app.js
@@ -19,27 +19,22 @@ $(document).ready(function () {
     });
 
     $(".woocommerce-LoopProduct-link").each(function() {
-        // This makes fancybox not work
-        //$(this).attr("href", "#");
-
-        // Fancybox works but <a> is display: none on image click
-        //$(this).attr("href", "");
-
-        // Not doing anything leaves the link active
-    });
-
-
-    $(".woocommerce-LoopProduct-link").on("click",function( event ) {
-        // Doing this makes fancybox not work
-        //event.preventDefault();
+        // Removing all the anchors from the products so that you won't
+        //  navigate away when clicking in one, allowing fancybox to display
+        $(this).attr("href", "");
     });
 
-
     $(".woocommerce-LoopProduct-link").fancybox({
         helpers: {
             overlay: {  locked: false,
                     },
              title: { type: 'inside'},
+        },
+        afterLoad: function(){
+            this.title = $(this.element).find('img').attr('alt');
+        },
+        afterClose: function() {
+            $(this.element).show();
         }
 
     });
diff --git a/js/custom/pageSetup.js b/js/custom/pageSetup.js
index 6a3ff6c..aa3e02b 100644
--- a/js/custom/pageSetup.js
+++ b/js/custom/pageSetup.js
@@ -10,27 +10,22 @@ $(document).ready(function () {
     });
 
     $(".woocommerce-LoopProduct-link").each(function() {
-        // This makes fancybox not work
-        //$(this).attr("href", "#");
-
-        // Fancybox works but <a> is display: none on image click
-        //$(this).attr("href", "");
-
-        // Not doing anything leaves the link active
-    });
-
-
-    $(".woocommerce-LoopProduct-link").on("click",function( event ) {
-        // Doing this makes fancybox not work
-        //event.preventDefault();
+        // Removing all the anchors from the products so that you won't
+        //  navigate away when clicking in one, allowing fancybox to display
+        $(this).attr("href", "");
     });
 
-
     $(".woocommerce-LoopProduct-link").fancybox({
         helpers: {
             overlay: {  locked: false,
                     },
              title: { type: 'inside'},
+        },
+        afterLoad: function(){
+            this.title = $(this.element).find('img').attr('alt');
+        },
+        afterClose: function() {
+            $(this.element).show();
         }
 
     });