Add directive info to directive docs

Directive doc objects have a directiveInfo property that has two
properties: doc.directiveInfo.type and doc.directiveInfo.properties.

type: 'Component' or 'Directive'

properties: array of objects in the format { name, values }, where name
is either 'selector', 'inputs', or 'outputs' and values is an array of
strings.

Ex: {
      type: 'Component',
      properties: [
        {
          name: 'selector',
          values: ['button', '[button]']
        },
        {
          name: 'inputs',
          values: ['icon', 'color']
        }
      ]
    }

scripts/docs/templates/common.template.html

@@ -118,10 +118,10 @@ docType: "<$ doc.docType $>"
 defined in <$ githubViewLink(doc) $>
 </p>
 
-<@- if doc.decorators @>
+<@- if doc.directiveInfo @>
-<h2>Annotations</h2>
+<h2><$ doc.directiveInfo.type $></h2>
-<@- for decorator in doc.decorators @>
+<@- for prop in doc.directiveInfo.properties @>
-  <h3 class="annotation">@<$ decorator.name $><$ paramList(decorator.arguments) $></h3>
+  <span><$ prop.name $>: <@ for v in prop.values @><$ v $><@ if not loop.last @>, <@ endif @><@ endfor @></span>
 <@ endfor @>
 <@ endif -@>
 

scripts/docs/typescript-package/index.js

@@ -14,6 +14,7 @@ module.exports = new Package('typescript-parsing', [basePackage])
 .factory(require('./services/tsParser/getFileInfo'))
 .factory(require('./services/tsParser/getExportDocType'))
 .factory(require('./services/tsParser/getContent'))
+.factory(require('./services/tsParser/getDirectiveInfo'))
 
 .factory('EXPORT_DOC_TYPES', function() {
   return [

scripts/docs/typescript-package/processors/readTypeScriptModules.js

@@ -4,7 +4,8 @@ var _ = require('lodash');
 var ts = require('typescript');
 
 module.exports = function readTypeScriptModules(tsParser, modules, getFileInfo,
-                                                getExportDocType, getContent, log) {
+                                                getExportDocType, getContent,
+                                                getDirectiveInfo, log) {
 
   return {
     $runAfter: ['files-read'],
@@ -180,7 +181,8 @@ module.exports = function readTypeScriptModules(tsParser, modules, getFileInfo,
       moduleDoc: moduleDoc,
       content: getContent(exportSymbol),
       fileInfo: getFileInfo(exportSymbol, basePath),
-      location: getLocation(exportSymbol)
+      location: getLocation(exportSymbol),
+      directiveInfo: getDirectiveInfo(exportSymbol)
     };
 
     if(exportSymbol.flags & ts.SymbolFlags.Function) {

scripts/docs/typescript-package/services/tsParser/getDirectiveInfo.js

@@ -0,0 +1,34 @@
+
+module.exports = function getDirectiveInfo() {
+
+  return function (symbol) {
+    var directiveInfo;
+    if (symbol.valueDeclaration) {
+      var decorators = symbol.valueDeclaration.decorators;
+      decorators && decorators.forEach(function(decorator){
+        try {
+          var expr = decorator.expression;
+          var type = expr.expression.text.match(/Component|Directive/);
+          if (type) {
+            // type is either Component or Directive
+            // properties are selector, inputs and outputs
+            directiveInfo = { type: type[0], properties: [] };
+
+            //Directive only takes one argument
+            expr.arguments[0].properties.forEach(function(prop){
+              var name = prop.name.text;
+              if (name === "selector") {
+                directiveInfo.properties.push({name: name, values: prop.initializer.text.split(",")});
+              }
+              if (name === "inputs" || name === "outputs") {
+                var values = prop.initializer.elements.map(function(e){ return e.text });
+                directiveInfo.properties.push({name: name, values: values });
+              }
+            });
+          }
+        } catch(e){}
+      });
+    }
+    return directiveInfo;
+  };
+};