method code review feature add, several style fixes

intersystems-community · May 13, 2015 · be5be22 · be5be22
1 parent 42010e1
commit be5be22
Show file tree

Hide file tree

Showing 12 changed files with 257 additions and 25 deletions.
diff --git a/README.md b/README.md
@@ -6,11 +6,12 @@ An UML Class explorer for InterSystems Caché.
 + Build diagrams for any package or subpackage;
 + Edit diagrams after build;
 + Export diagrams as an image;
++ View class methods code;
 + Zoom in and out, explore big packages and more.
 
 ## Screenshots
 
-![Demo](https://cloud.githubusercontent.com/assets/4989256/7586381/19008d24-f8b5-11e4-8893-a63d5373dfa1.png)
+![Demo](https://cloud.githubusercontent.com/assets/4989256/7622499/9cb98048-f9d8-11e4-9c27-4257e53ec70d.png)
 
 ## Installation
 

diff --git a/cache/projectTemplate.xml b/cache/projectTemplate.xml
@@ -3,7 +3,7 @@
 <Class name="UMLExplorer.ClassView">
 <Description>
 Class contains methods that return structured classes/packages data.</Description>
-<TimeChanged>63684,52343.305666</TimeChanged>
+<TimeChanged>63686,4398.893381</TimeChanged>
 <TimeCreated>63653,67019.989197</TimeCreated>
 
 <Method name="getClassTree">
@@ -70,38 +70,49 @@ Return structured data about class.</Description>
     set oClass.FINAL = classDefinition.Final
     set oClass.HIDDEN = classDefinition.Hidden
     set oClass.classType = classDefinition.ClassType
+    set oClass.serverOnly = classDefinition.ServerOnly // -
 
     if (oData.restrictPackage) && ('..inPackage(oData.basePackageName, package)) quit oClass
 
     set oClass.properties = oProperties
     set count = classDefinition.Properties.Count()
-    for i = 1:1:count {
+    for i=1:1:count {
         set oProp = ##class(%ZEN.proxyObject).%New()
         set p = classDefinition.Properties.GetAt(i)
         do oProperties.%DispatchSetProperty(p.Name, oProp)
-        do oProp.%DispatchSetProperty("private", p.Private)
-        do oProp.%DispatchSetProperty("readOnly", p.ReadOnly)
-        do oProp.%DispatchSetProperty("type", p.Type)
+        set oProp.private = p.Private
+        set oProp.readOnly = p.ReadOnly
+        set oProp.type = p.Type
         do ..collectAggregation(oData, classDefinition, p.Type, p.Private)
         do ..collectAggregation(oData, classDefinition, package _ "." _ p.Type, p.Private)
     }
 
     set oMethods = ##class(%ZEN.proxyObject).%New()
     set oClass.methods = oMethods
     set count = classDefinition.Methods.Count()
-    for i = 1:1:count {
+    for i=1:1:count {
         set oMeth = ##class(%ZEN.proxyObject).%New()
         set met = classDefinition.Methods.GetAt(i)
         do oMethods.%DispatchSetProperty(met.Name, oMeth)
-        do oMeth.%DispatchSetProperty("private", met.Private)
-        do oMeth.%DispatchSetProperty("returns", met.ReturnType)
-        do oMeth.%DispatchSetProperty("classMethod", met.ClassMethod)
+        set oMeth.private = met.Private
+        set oMeth.returns = met.ReturnType
+        set oMeth.classMethod = met.ClassMethod
+        set oMeth.clientMethod = met.ClientMethod
+        set oMeth.final = met.Final
+        set oMeth.abstract = met.Abstract
+        set oMeth.language = met.Language
+        set oMeth.notInheritable = met.NotInheritable
+        set oMeth.serverOnly = met.ServerOnly
+        set oMeth.sqlProc = met.SqlProc
+        set oMeth.sqlName = met.SqlName
+        set oMeth.webMethod = met.WebMethod
+        set oMeth.zenMethod = met.ZenMethod
     }
 
     set oParameters = ##class(%ZEN.proxyObject).%New()
     set oClass.parameters = oParameters
     set count = classDefinition.Parameters.Count()
-    for i = 1:1:count {
+    for i=1:1:count {
         set oPar = ##class(%ZEN.proxyObject).%New()
         set p = classDefinition.Parameters.GetAt(i)
         do oParameters.%DispatchSetProperty(p.Name, oPar)
@@ -114,6 +125,30 @@ Return structured data about class.</Description>
 ]]></Implementation>
 </Method>
 
+<Method name="getMethod">
+<Description>
+Return method data.</Description>
+<ClassMethod>1</ClassMethod>
+<FormalSpec>className:%String,methodName:%String</FormalSpec>
+<ReturnType>%ZEN.proxyObject</ReturnType>
+<Implementation><![CDATA[
+    set oMeth = ##class(%ZEN.proxyObject).%New()
+    set met = ##class(%Dictionary.MethodDefinition).%OpenId(className _ "||" _ methodName)
+    if (met = "") { set oMeth.error = 1 quit oMeth }
+
+    set oMeth.description = met.Description
+    set oMeth.arguments = met.FormalSpec
+    set oMeth.returns = met.ReturnType
+    set oMeth.code = ""
+    do {
+        set chars = met.Implementation.Read()
+        set oMeth.code = oMeth.code _ chars
+    } while (chars)
+
+    quit oMeth
+]]></Implementation>
+</Method>
+
 <Method name="inPackage">
 <Description><![CDATA[
 Returns if <var>packageName</var> is in <var>basePackageName</var>.]]></Description>
@@ -280,7 +315,7 @@ Returns structured package data</Description>
 <Description>
 REST interface for UMLExplorer</Description>
 <Super>%CSP.REST</Super>
-<TimeChanged>63679,81701.423669</TimeChanged>
+<TimeChanged>63685,85586.177035</TimeChanged>
 <TimeCreated>63648,30450.187229</TimeCreated>
 
 <XData name="UrlMap">
@@ -294,6 +329,7 @@ REST interface for UMLExplorer</Description>
    <Route Url="/GetClassTree" Method="GET" Call="GetClassTree"/>
    <Route Url="/GetClassView/:ClassName" Method="GET" Call="GetClassView"/>
    <Route Url="/GetPackageView/:PackageName" Method="GET" Call="GetPackageView"/>
+   <Route Url="/GetMethod/:ClassName/:MethodName" Method="GET" Call="GetMethod"/>
 </Routes>
 ]]></Data>
 </XData>
@@ -335,6 +371,19 @@ Returns all package class trees by given package name</Description>
 ]]></Implementation>
 </Method>
 
+<Method name="GetMethod">
+<Description>
+Returns method description and code</Description>
+<ClassMethod>1</ClassMethod>
+<FormalSpec>className:%String,methodName:%String</FormalSpec>
+<ReturnType>%Status</ReturnType>
+<Implementation><![CDATA[
+    set methodData = ##class(ClassView).getMethod(className, methodName)
+    do methodData.%ToJSON(, "ou")
+    return $$$OK
+]]></Implementation>
+</Method>
+
 <Method name="GetCss">
 <Description>
 Method returns user application CSS.</Description>

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "CacheUMLExplorer",
-  "version": "0.7.1",
+  "version": "0.8.0",
   "description": "An UML Class explorer for InterSystems Caché",
   "directories": {
     "test": "test"

diff --git a/web/css/classView.css b/web/css/classView.css
@@ -4,6 +4,13 @@ svg {
 }
 
 #classView {
+    position: relative;
+    height: 100%;
+}
+
+#svgContainer {
+    z-index: 0;
+    position: relative;
     height: 100%;
     cursor: -webkit-grab; cursor: -moz-grab;
 }
@@ -37,6 +44,10 @@ text {
 
 .uml-class-name-text {
     cursor: help;
+    -webkit-transition: all .2s ease;
+    -moz-transition: all .2s ease;
+    -o-transition: all .2s ease;
+    transition: all .2s ease;
 }
 
 .uml-class-name-text:hover {
@@ -59,4 +70,16 @@ text {
     font-family: monospace;
     font-weight: 900;
     fill: magenta;
+}
+
+.line-clickable {
+    cursor: pointer;
+    -webkit-transition: all .2s ease;
+    -moz-transition: all .2s ease;
+    -o-transition: all .2s ease;
+    transition: all .2s ease;
+}
+
+.line-clickable:hover {
+    fill: red;
 }
diff --git a/web/css/extras.css b/web/css/extras.css
@@ -106,6 +106,30 @@
     left: 5px;
 }
 
+.icon.cross:before {
+    content: "";
+    background-color: #fff;
+    width: 4px;
+    height: 14px;
+    border-radius: 1px;
+    position: absolute;
+    top: 5px;
+    left: 10px;
+    transform: rotate(45deg);
+}
+
+.icon.cross:after {
+    content: "";
+    background-color: #fff;
+    width: 14px;
+    height: 4px;
+    border-radius: 1px;
+    position: absolute;
+    top: 10px;
+    left: 5px;
+    transform: rotate(45deg);
+}
+
 .icon.minus:after {
     content: "";
     background-color: #fff;

diff --git a/web/css/methodCodeView.css b/web/css/methodCodeView.css
@@ -0,0 +1,44 @@
+#methodCodeView {
+    position: absolute;
+    width: 100%;
+    bottom: 0;
+    height: 0;
+    background: rgba(245, 245, 245, 0.95);
+    z-index: 10;
+    -webkit-transition: all .5s ease;
+    -moz-transition: all .5s ease;
+    -o-transition: all .5s ease;
+    transition: all .5s ease;
+}
+
+#methodCodeView > div.head {
+    position: relative;
+    overflow: visible; /* kept for button shadow */
+    margin: 1em;
+}
+
+#methodDescription {
+    box-sizing: border-box;
+    padding: 1em;
+    color: gray;
+    font-style: italic;
+}
+
+#methodViewBounds {
+    overflow: auto;
+}
+
+#methodCode {
+    padding: 1em;
+    box-sizing: border-box;
+    white-space: pre;
+}
+
+#closeMethodCodeView {
+    float: right;
+}
+
+#methodCodeView.active {
+    box-shadow: 0 0 5px black;
+    height: 100%;
+}
diff --git a/web/index.html b/web/index.html
@@ -9,6 +9,7 @@
     <link rel="stylesheet" href="css/extras.css"/>
     <link rel="stylesheet" href="css/classView.css"/>
     <link rel="stylesheet" href="css/joint.min.css"/>
+    <link rel="stylesheet" href="css/methodCodeView.css"/>
     <!-- endbuild -->
     <!-- build:js -->
     <script type="text/javascript" src="jsLib/joint.js"></script>
@@ -23,7 +24,7 @@
     <script type="text/javascript" src="js/UI.js"></script>
     <!-- endbuild -->
 </head>
-<body onload="cue = new CacheUMLExplorer(document.getElementById('treeView'), document.getElementById('classView'))">
+<body onload="cue = new CacheUMLExplorer(document.getElementById('treeView'), document.getElementById('svgContainer'))">
     <div class="ui-body" id="ui-body">
         <div class="ui-sideBlock">
             <div id="treeView">
@@ -46,7 +47,23 @@
                 <div id="button.zoomOut" class="icon minus"></div>
             </div>
             <div id="classView">
+                <div id="methodCodeView">
+                    <div class="head">
+                        <div id="closeMethodCodeView" class="icon cross"></div>
+                        <h2 id="methodLabel"></h2>
+                    </div>
+                    <div id="methodViewBounds">
+                        <div id="methodDescription">
 
+                        </div>
+                        <div id="methodCode">
+
+                        </div>
+                    </div>
+                </div>
+                <div id="svgContainer">
+
+                </div>
             </div>
         </div>
     </div>

diff --git a/web/js/CacheUMLExplorer.js b/web/js/CacheUMLExplorer.js
@@ -18,7 +18,15 @@ var CacheUMLExplorer = function (treeViewContainer, classViewContainer) {
         zoomInButton: id("button.zoomIn"),
         zoomOutButton: id("button.zoomOut"),
         zoomNormalButton: id("button.zoomNormal"),
-        infoButton: id("button.showInfo")
+        infoButton: id("button.showInfo"),
+        methodCodeView: id("methodCodeView"),
+        closeMethodCodeView: id("closeMethodCodeView"),
+        methodLabel: id("methodLabel"),
+        methodCode: id("methodCode"),
+        classView: id("classView"),
+        svgContainer: id("svgContainer"),
+        methodDescription: id("methodDescription"),
+        methodViewBounds: id("methodViewBounds")
     };
 
     this.UI = new UI(this);