clickable class header refers to documentation

Author: nikitaeverywhere

cache/projectTemplate.xml

@@ -58,6 +58,7 @@ return structured data about class</Description>
     set oClass = ##class(%ZEN.proxyObject).%New()
 
     set oProperties = ##class(%ZEN.proxyObject).%New()
+    set oClass.NAMESPACE = $NAMESPACE
     set oClass.super = classDefinition.Super
     set oClass.properties = oProperties
     set count = classDefinition.Properties.Count()

web/css/classView.css

@@ -28,4 +28,12 @@ text {
 .centralText > div {
     display: table-cell;
     vertical-align: middle;
+}
+
+.uml-class-name-text {
+    cursor: help;
+}
+
+.uml-class-name-text:hover {
+    fill: red;
 }

web/js/ClassView.js

@@ -18,6 +18,8 @@ var ClassView = function (parent, container) {
     this.MIN_PAPER_SCALE = 0.2;
     this.MAX_PAPER_SCALE = 4;
 
+    this.CLASS_DOC_PATH = "/csp/documatic/%25CSP.Documatic.cls";
+
     this.init();
 
 };
@@ -60,6 +62,16 @@ ClassView.prototype.resetView = function () {
 
 };
 
+ClassView.prototype.openClassDoc = function (className, nameSpace) {
+
+    window.open(
+        this.CLASS_DOC_PATH + "?LIBRARY=" + encodeURIComponent(nameSpace)
+            + "&CLASSNAME=" + encodeURIComponent(className),
+        "_blank"
+    );
+
+};
+
 /**
  * @param {string} name
  * @param classMetaData
@@ -70,7 +82,8 @@ ClassView.prototype.createClassInstance = function (name, classMetaData) {
     var attrArr, methArr,
         classParams = classMetaData["parameters"],
         classProps = classMetaData["properties"],
-        classMethods = classMetaData["methods"];
+        classMethods = classMetaData["methods"],
+        self = this;
 
     var insertString = function (array, string, extraString) {
         string.match(/.{1,44}/g).forEach(function (p) {
@@ -79,7 +92,7 @@ ClassView.prototype.createClassInstance = function (name, classMetaData) {
     };
 
     return new joint.shapes.uml.Class({
-        name: name,
+        name: name + "\x1b" + JSON.stringify({ url: function () {alert(name)} }),
         attributes: attrArr = (function (params, ps) {
             var arr = [], n;
             for (n in params) {
@@ -108,6 +121,11 @@ ClassView.prototype.createClassInstance = function (name, classMetaData) {
             }
             return arr;
         })(classMethods),
+        directProps: {
+            nameClickHandler: function () {
+                self.openClassDoc(name, classMetaData["NAMESPACE"]);
+            }
+        },
         size: {
             width: 300,
             height: Math.max(attrArr.length*12.1, 15) + Math.max(methArr.length*12.1, 15) + 40

web/jsLib/joint.js

@@ -17222,6 +17222,10 @@ if ( typeof window === "object" && typeof window.document === "object" ) {
 							tspan.node.style[j] = setup["STYLES"][j];
 						}
 					}
+					if (opt.clickHandler) {
+						console.log(1);
+						tspan.node.onclick = opt.clickHandler;
+					}
 				}
 		// Make sure the textContent is never empty. If it is, add an additional 
 		// space (an invisible character) so that following lines are correctly
@@ -20943,7 +20947,7 @@ joint.dia.ElementView = joint.dia.CellView.extend({
 
                 $selected.each(function() {
 
-                    V(this).text(attrs.text + '', { lineHeight: attrs.lineHeight, textPath: attrs.textPath });
+                    V(this).text(attrs.text + '', attrs);
                 });
                 specialAttributes.push('lineHeight','textPath');
             }

web/jsLib/joint.shapes.uml.js

@@ -82,7 +82,8 @@ joint.shapes.uml.Class = joint.shapes.basic.Generic.extend({
 
     updateRectangles: function() {
 
-        var attrs = this.get('attrs');
+        var attrs = this.get('attrs'),
+            self = this;
 
         var rects = [
             { type: 'name', text: this.getClassName() },
@@ -92,15 +93,20 @@ joint.shapes.uml.Class = joint.shapes.basic.Generic.extend({
 
         var offsetY = 0;
 
+        var dp = self.get("directProps") || {},
+            nameClickHandler = dp.nameClickHandler;
+
         _.each(rects, function(rect) {
 
             var lines = _.isArray(rect.text) ? rect.text : [rect.text];
 	        var rectHeight = lines.length * 20 + 20;
 
             attrs['.uml-class-' + rect.type + '-text'].text = lines.join('\n');
+            if (nameClickHandler) {
+                if (rect.type === "name") attrs['.uml-class-' + rect.type + '-text'].clickHandler = nameClickHandler;
+            }
             attrs['.uml-class-' + rect.type + '-rect'].height = rectHeight;
             attrs['.uml-class-' + rect.type + '-rect'].transform = 'translate(0,'+ offsetY + ')';
-
             offsetY += rectHeight;
 
         });