1 files changed, 57 insertions, 0 deletions
diff --git a/catalog-ui/src/app/directives/ellipsis/ellipsis-directive.ts b/catalog-ui/src/app/directives/ellipsis/ellipsis-directive.ts
new file mode 100644
index 0000000000..8fbbd4d486
--- /dev/null
+++ b/catalog-ui/src/app/directives/ellipsis/ellipsis-directive.ts
@@ -0,0 +1,57 @@
+'use strict';
+export interface IEllipsisScope extends ng.IScope {
+    ellipsis:string;
+    maxChars:number;
+    toggleText():void;
+    collapsed:boolean;
+    actualText:string;
+
+}
+
+export class EllipsisDirective implements ng.IDirective {
+
+    constructor() {
+    }
+
+    scope = {
+        ellipsis: '=',
+        moreClass: '@',
+        maxChars: '='
+    };
+
+    replace = false;
+    restrict = 'A';
+    template = ():string => {
+        return require('./ellipsis-directive.html');
+    };
+
+    link = (scope:IEllipsisScope, $elem:any) => {
+
+
+        scope.collapsed = true;
+
+        scope.toggleText = ():void => {
+            if (scope.ellipsis && scope.collapsed) {
+                scope.actualText = scope.ellipsis.substr(0, scope.maxChars);
+                scope.actualText += scope.ellipsis.length > scope.maxChars ? '...' : '';
+            }
+            else {
+                scope.actualText = scope.ellipsis;
+            }
+        };
+
+        scope.$watch("ellipsis", function () {
+            scope.collapsed = true;
+            scope.toggleText();
+        });
+
+
+    };
+
+    public static factory = ()=> {
+        return new EllipsisDirective();
+    };
+
+}
+
+EllipsisDirective.factory.$inject = [];