Added showAll, hidesAll, enableZoom, disableZoom events for the direc…

…tive. Added appendTo option for directive. Update ez-plus 3rd party version.
igorlino · Jun 2, 2015 · 37d18aa · 37d18aa
1 parent d1d1bf1
commit 37d18aa
Show file tree

Hide file tree

Showing 3 changed files with 63 additions and 22 deletions.
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
     "name": "angular-ez-plus",
-    "version": "1.0.4",
+    "version": "1.0.5",
     "author": {
         "name": "Igor Lino",
         "url": "http://igorlino.github.io/angular-elevatezoom-plus/"
@@ -28,7 +28,7 @@
     "dependencies": {
         "jquery": "~2.1.1",
         "angular": "~1.3.4",
-        "ez-plus": "~1.1.1"
+        "ez-plus": "~1.1.3"
     },
     "devDependencies": {
     },

diff --git a/js/ezplus.directive.js b/js/ezplus.directive.js
@@ -16,31 +16,72 @@
 
         ////////////////////////////
 
-
-		link.$inject = ['scope', 'element'];
-        function link(scope, element) {
+
+        link.$inject = ['scope', 'element'];
+        function link(scope, element, attrs) {
+            scope.appendto = typeof(attrs.appendto) !== 'undefined' ? attrs.appendto : null;
+
+            scope.$on("ezp-hidesAll", function (e, msg) {
+                var plugin = angular.element(element).data('ezPlus');
+                if (plugin) {
+                    plugin.showHideWindow('hide');
+                    plugin.showHideTint('hide');
+                    plugin.showHideLens('hide');
+                }
+            });
+            scope.$on("ezp-showAll", function (e, msg) {
+                var plugin = angular.element(element).data('ezPlus');
+                if (plugin) {
+                    plugin.showHideWindow('show');
+                    plugin.showHideTint('show');
+                    plugin.showHideLens('show');
+                }
+            });
+            scope.$on("ezp-disableZoom", function (e, msg) {
+                var plugin = angular.element(element).data('ezPlus');
+                if (plugin) {
+                    plugin.changeState('disable');
+                }
+            });
+            scope.$on("ezp-enableZoom", function (e, msg) {
+                var plugin = angular.element(element).data('ezPlus');
+                if (plugin) {
+                    plugin.changeState('enable');
+                }
+            });
             scope.$watch('ngModel', function (image) {
                 var thumbMediumUrl = (image && image.thumbMediumUrl) || '';
                 var fullSizeUrl = (image && image.fullSizeUrl) || '';
 
                 var plugin = angular.element(element).data('ezPlus');
                 if (plugin) {
-                    var loader = 'images/loader-small.gif';
-                    plugin.swaptheimage(loader, loader);
-                    plugin.swaptheimage(thumbMediumUrl, fullSizeUrl);
-                } else if (image) {
-                    element.attr('src', thumbMediumUrl);
-                    element.attr('data-zoom-image', fullSizeUrl);
-                    angular.element(element).ezPlus({
-                        scrollZoom: true,
-                        zoomWindowWidth: 600,
-                        zoomWindowHeight: 600,
-                        easing : true,
-                        zoomWindowFadeIn: 500,
-                        zoomWindowFadeOut: 500,
-                        lensFadeIn: 500,
-                        lensFadeOut: 500
-                    });
+                    if (image) {
+                        var loader = 'images/loader-small.gif';
+                        plugin.showHideWindow();
+                        plugin.swaptheimage(loader, loader);
+                        plugin.swaptheimage(thumbMediumUrl, fullSizeUrl);
+                    } else {
+                        plugin.closeAll();
+                    }
+                } else {
+                    if (image) {
+                        element.attr('src', thumbMediumUrl);
+                        element.attr('data-zoom-image', fullSizeUrl);
+                        var options = {
+                            scrollZoom: true,
+                            zoomWindowWidth: 600,
+                            zoomWindowHeight: 600,
+                            easing: true,
+                            zoomWindowFadeIn: 500,
+                            zoomWindowFadeOut: 500,
+                            lensFadeIn: 500,
+                            lensFadeOut: 500
+                        };
+                        if (scope.appendto) {
+                            options.zoomContainerAppendTo = scope.appendto;
+                        }
+                        angular.element(element).ezPlus(options);
+                    }
                 }
             });
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "angular-ez-plus",
-    "version": "1.0.4",
+    "version": "1.0.5",
     "title": "Angular EZ Plus",
     "description": "Angular directive for ElevateZoom Plus.",
     "keywords": [