refactor overlay directive to follow angular style guide

src/Umbraco.Web.UI.Client/src/common/directives/components/overlays/umboverlay.directive.js

@@ -3,30 +3,21 @@
  * @name umbraco.directives.directive:umbProperty
  * @restrict E
  **/
-angular.module("umbraco.directives")
-    .directive('umbOverlay', function ($timeout, formHelper) {
-        return {
 
-            scope: {
-                model: "=",
-                view: "=",
-                position: "@",
-                animation: "@",
-                shadow: "@"
-            },
+(function() {
+   'use strict';
 
-            transclude: true,
-            restrict: 'E',
-            replace: true,
-            templateUrl: 'views/components/overlays/umb-overlay.html',
-            link: function(scope, element, attrs) {
+   function OverlayDirective($timeout) {
+
+      function link(scope, el, attr, ctrl) {
 
          var modelCopy = {};
 
          function activate() {
+
             var cssClass = "umb-overlay-center";
-                  if(scope.position)
-                  {
+
+            if (scope.position) {
                cssClass = "umb-overlay-" + scope.position;
             }
 
@@ -35,9 +26,11 @@ angular.module("umbraco.directives")
             }
 
             var shadow = "shadow-depth-3";
+
             if (scope.shadow) {
                shadow = "shadow-depth-" + scope.shadow;
             }
+
             cssClass += " " + shadow;
 
             scope.overlayCssClass = cssClass;
@@ -88,8 +81,8 @@ angular.module("umbraco.directives")
                mousePositionClickY = scope.model.event.pageY;
 
                // element size
-                      elementHeight = element.context.clientHeight;
-                      elementWidth = element.context.clientWidth;
+               elementHeight = el.context.clientHeight;
+               elementWidth = el.context.clientWidth;
 
                // move element to this position
                position.left = mousePositionClickX - (elementWidth / 2);
@@ -108,7 +101,7 @@ angular.module("umbraco.directives")
                   position.top = "inherit";
                }
 
-                      element.css(position);
+               el.css(position);
 
                // else change overlay to center position
             } else {
@@ -130,9 +123,13 @@ angular.module("umbraco.directives")
 
          scope.submitForm = function(model) {
 
-                  if (formHelper.submitForm({ scope: scope })) {
+            if (formHelper.submitForm({
+                  scope: scope
+               })) {
 
-                      formHelper.resetForm({ scope: scope });
+               formHelper.resetForm({
+                  scope: scope
+               });
 
                scope.model.submit(model);
 
@@ -151,6 +148,24 @@ angular.module("umbraco.directives")
 
       }
 
-
+      var directive = {
+         transclude: true,
+         restrict: 'E',
+         replace: true,
+         templateUrl: 'views/components/overlays/umb-overlay.html',
+         scope: {
+            model: "=",
+            view: "=",
+            position: "@",
+            animation: "@",
+            shadow: "@"
+         },
+         link: link
       };
-    });
+
+      return directive;
+   }
+
+   angular.module('umbraco.directives').directive('umbOverlay', OverlayDirective);
+
+})();