Merge pull request #75 from rhamilto/tileClick

Migrating tileClick directive from console so it can also be used in …

dist/less/_tile-click.less

+.tile-click {
+  cursor: pointer;
+  position: relative;
+  &:hover {
+    .tile-target {
+      color: @link-hover-color;
+      &:hover {
+        text-decoration: none;
+      }
+    }
+  }
+}

dist/less/common.less

@@ -7,5 +7,6 @@
 @import "_guided-tour.less";
 @import "_mixins.less";
 @import "_notifications.less";
+@import "_tile-click.less";
 @import "_ui-select.less";
 @import "_variables.less";

dist/origin-web-common-ui.js

@@ -872,6 +872,23 @@ angular.module('openshiftCommonUI')
 ;'use strict';
 
 angular.module('openshiftCommonUI')
+  .directive('tileClick', function() {
+    return {
+      restrict: 'AC',
+      link: function($scope, element) {
+        $(element).click(function (evt) {
+          var t = $(evt.target);
+          if (t && t.closest("a", element).length) {
+            return;
+          }
+          $('a.tile-target', element).trigger("click");
+        });
+      }
+    };
+  });
+;'use strict';
+
+angular.module('openshiftCommonUI')
   .directive('toastNotifications', function(NotificationsService, $timeout) {
     return {
       restrict: 'E',

dist/origin-web-common.css

@@ -282,6 +282,16 @@ div.hopscotch-bubble .hopscotch-nav-button.prev {
   margin-bottom: 5px;
   width: 100%;
 }
+.tile-click {
+  cursor: pointer;
+  position: relative;
+}
+.tile-click:hover .tile-target {
+  color: #00659c;
+}
+.tile-click:hover .tile-target:hover {
+  text-decoration: none;
+}
 /* Fix some styles with the angular-ui-select bootstrap theme that isn't right when combined with all of our styles */
 .ui-select-bootstrap {
   /* Fixes ui-select's input box extending to 100% page width if the page has been resized after page-load

dist/origin-web-common.js

@@ -1043,6 +1043,23 @@ angular.module('openshiftCommonUI')
 ;'use strict';
 
 angular.module('openshiftCommonUI')
+  .directive('tileClick', function() {
+    return {
+      restrict: 'AC',
+      link: function($scope, element) {
+        $(element).click(function (evt) {
+          var t = $(evt.target);
+          if (t && t.closest("a", element).length) {
+            return;
+          }
+          $('a.tile-target', element).trigger("click");
+        });
+      }
+    };
+  });
+;'use strict';
+
+angular.module('openshiftCommonUI')
   .directive('toastNotifications', ["NotificationsService", "$timeout", function(NotificationsService, $timeout) {
     return {
       restrict: 'E',

dist/origin-web-common.min.js

@@ -333,7 +333,17 @@ $(element).focus();
 }, 300);
 }
 };
-} ]), angular.module("openshiftCommonUI").directive("toastNotifications", [ "NotificationsService", "$timeout", function(NotificationsService, $timeout) {
+} ]), angular.module("openshiftCommonUI").directive("tileClick", function() {
+return {
+restrict:"AC",
+link:function($scope, element) {
+$(element).click(function(evt) {
+var t = $(evt.target);
+t && t.closest("a", element).length || $("a.tile-target", element).trigger("click");
+});
+}
+};
+}), angular.module("openshiftCommonUI").directive("toastNotifications", [ "NotificationsService", "$timeout", function(NotificationsService, $timeout) {
 return {
 restrict:"E",
 scope:{},

src/components/tile-click/tileClick.js

+'use strict';
+
+angular.module('openshiftCommonUI')
+  .directive('tileClick', function() {
+    return {
+      restrict: 'AC',
+      link: function($scope, element) {
+        $(element).click(function (evt) {
+          var t = $(evt.target);
+          if (t && t.closest("a", element).length) {
+            return;
+          }
+          $('a.tile-target', element).trigger("click");
+        });
+      }
+    };
+  });

src/styles/_tile-click.less

+.tile-click {
+  cursor: pointer;
+  position: relative;
+  &:hover {
+    .tile-target {
+      color: @link-hover-color;
+      &:hover {
+        text-decoration: none;
+      }
+    }
+  }
+}

src/styles/common.less

@@ -7,5 +7,6 @@
 @import "_guided-tour.less";
 @import "_mixins.less";
 @import "_notifications.less";
+@import "_tile-click.less";
 @import "_ui-select.less";
 @import "_variables.less";