added closure and proper dependency injection

jeffthompson1971 · Jul 16, 2017 · c4ed770 · c4ed770
1 parent 1cef686
commit c4ed770
Show file tree

Hide file tree

Showing 6 changed files with 132 additions and 105 deletions.
diff --git a/.bowerrc b/.bowerrc
@@ -0,0 +1,3 @@
+{
+  "directory": "bower_components"
+}
diff --git a/example/js/app.js b/example/js/app.js
@@ -13,7 +13,7 @@ angular.module('app', ['angularHelpOverlay']).controller('MainCtrl', function ($
 
   $scope.toggleHelp = function() {
     $scope.showHelp = !$scope.showHelp;
-    /*var picture = $('.jumbotron img');
+    var picture = $('.jumbotron img');
     if (picture.is(':visible')) {
       return ($('body').data('chardinJs')).toggle();
     } else {
@@ -22,7 +22,7 @@ angular.module('app', ['angularHelpOverlay']).controller('MainCtrl', function ($
       }, 600, function() {
         return ($('body').data('chardinJs')).toggle();
       });
-    }*/
+    }
   };
 
 });
diff --git a/example/js/demo.js b/example/js/demo.js
diff --git a/lib/angular-help-overlay.js b/lib/angular-help-overlay.js
@@ -1,53 +1,65 @@
 /*global angular:false */
+!(function () {
 
-angular.module('angularHelpOverlay', []).directive('helpOverlay', ['$document', function ($document) {
-  var noop = false; // Special flag in case we get an a chardinJs change event outside of our control.
-  return {
-    restrict: 'A',
-    scope: {
-      helpOverlay: '=',
-      overlayStart: '&overlayStartCallback',
-      overlayStop: '&overlayStopCallback'
-    },
-    link: function (scope, element, attrs) {
-
-      $document.on('chardinJs:start', function (event) {
-        if (angular.isFunction(scope.overlayStart)) {
-          scope.overlayStart(event);
-        }
-
-        if (scope.helpOverlay === false) {
-          scope.$apply(function () {
-            noop = true;
-            scope.helpOverlay = true;
-          });
-        }
-      });
-
-      $document.on('chardinJs:stop', function (event) {
-        if (angular.isFunction(scope.overlayStop)) {
-          scope.overlayStop(event);
-        }
-
-        if (scope.helpOverlay === true) {
-          scope.$apply(function () {
-            noop = true;
-            scope.helpOverlay = false;
-          });
-        }
-      });
-
-      scope.$watch('helpOverlay', function (newValue, oldValue) {
-        if (newValue !== oldValue) {
-          if (noop === true) {
-            noop = false;
-          } else if (newValue === true) {
-            $(element).chardinJs('start');
-          } else if (newValue === false) {
-            $(element).chardinJs('stop');
+ angular.module('angularHelpOverlay', [])
+    .directive('helpOverlay', HelpOverlay);
+
+  HelpOverlay.$inject = ['$document'];
+
+  //angular.module('angularHelpOverlay', []).directive('helpOverlay', ['$document', function ($document) {
+
+  function HelpOverlay($document) {
+    var noop = false; // Special flag in case we get an a chardinJs change event outside of our control.
+    return {
+      restrict: 'A',
+      //controller: HelpOverlayController,
+      //controllerAs: 'vm',
+      scope: {
+        helpOverlay: '=',
+        overlayStart: '&overlayStartCallback',
+        overlayStop: '&overlayStopCallback'
+      },
+      link: function (scope, element, attrs) {
+
+        $(document).on('chardinJs:start', function (event) {
+          if (angular.isFunction(scope.overlayStart)) {
+            scope.overlayStart(event);
           }
-        }
-      });
-    }
-  };
-}]);
+
+          if (scope.helpOverlay === false) {
+            scope.$apply(function () {
+              noop = true;
+              scope.helpOverlay = true;
+            });
+          }
+        });
+
+        $(document).on('chardinJs:stop', function (event) {
+          if (angular.isFunction(scope.overlayStop)) {
+            scope.overlayStop(event);
+          }
+
+          if (scope.helpOverlay === true) {
+            scope.$apply(function () {
+              noop = true;
+              scope.helpOverlay = false;
+            });
+          }
+        });
+
+        scope.$watch('helpOverlay', function (newValue, oldValue) {
+          if (newValue !== oldValue) {
+            if (noop === true) {
+              noop = false;
+            } else if (newValue === true) {
+              $(element).chardinJs('start');
+            } else if (newValue === false) {
+              $(element).chardinJs('stop');
+            }
+          }
+        });
+      }
+    };
+  }
+
+})();
diff --git a/lib/angular-help-overlay.min.js b/lib/angular-help-overlay.min.js
diff --git a/src/angular-help-overlay.js b/src/angular-help-overlay.js
@@ -1,53 +1,65 @@
 /*global angular:false */
+!(function () {
 
-angular.module('angularHelpOverlay', []).directive('helpOverlay', ['$document', function ($document) {
-  var noop = false; // Special flag in case we get an a chardinJs change event outside of our control.
-  return {
-    restrict: 'A',
-    scope: {
-      helpOverlay: '=',
-      overlayStart: '&overlayStartCallback',
-      overlayStop: '&overlayStopCallback'
-    },
-    link: function (scope, element, attrs) {
-
-      $(document).on('chardinJs:start', function (event) {
-        if (angular.isFunction(scope.overlayStart)) {
-          scope.overlayStart(event);
-        }
-
-        if (scope.helpOverlay === false) {
-          scope.$apply(function () {
-            noop = true;
-            scope.helpOverlay = true;
-          });
-        }
-      });
-
-      $(document).on('chardinJs:stop', function (event) {
-        if (angular.isFunction(scope.overlayStop)) {
-          scope.overlayStop(event);
-        }
-
-        if (scope.helpOverlay === true) {
-          scope.$apply(function () {
-            noop = true;
-            scope.helpOverlay = false;
-          });
-        }
-      });
-
-      scope.$watch('helpOverlay', function (newValue, oldValue) {
-        if (newValue !== oldValue) {
-          if (noop === true) {
-            noop = false;
-          } else if (newValue === true) {
-            $(element).chardinJs('start');
-          } else if (newValue === false) {
-            $(element).chardinJs('stop');
+ angular.module('angularHelpOverlay', [])
+    .directive('helpOverlay', HelpOverlay);
+
+  HelpOverlay.$inject = ['$document'];
+
+  //angular.module('angularHelpOverlay', []).directive('helpOverlay', ['$document', function ($document) {
+
+  function HelpOverlay($document) {
+    var noop = false; // Special flag in case we get an a chardinJs change event outside of our control.
+    return {
+      restrict: 'A',
+      //controller: HelpOverlayController,
+      //controllerAs: 'vm',
+      scope: {
+        helpOverlay: '=',
+        overlayStart: '&overlayStartCallback',
+        overlayStop: '&overlayStopCallback'
+      },
+      link: function (scope, element, attrs) {
+
+        $(document).on('chardinJs:start', function (event) {
+          if (angular.isFunction(scope.overlayStart)) {
+            scope.overlayStart(event);
           }
-        }
-      });
-    }
-  };
-}]);
+
+          if (scope.helpOverlay === false) {
+            scope.$apply(function () {
+              noop = true;
+              scope.helpOverlay = true;
+            });
+          }
+        });
+
+        $(document).on('chardinJs:stop', function (event) {
+          if (angular.isFunction(scope.overlayStop)) {
+            scope.overlayStop(event);
+          }
+
+          if (scope.helpOverlay === true) {
+            scope.$apply(function () {
+              noop = true;
+              scope.helpOverlay = false;
+            });
+          }
+        });
+
+        scope.$watch('helpOverlay', function (newValue, oldValue) {
+          if (newValue !== oldValue) {
+            if (noop === true) {
+              noop = false;
+            } else if (newValue === true) {
+              $(element).chardinJs('start');
+            } else if (newValue === false) {
+              $(element).chardinJs('stop');
+            }
+          }
+        });
+      }
+    };
+  }
+
+})();