Skip to content
This repository has been archived by the owner on Jan 23, 2022. It is now read-only.

Commit

Permalink
Merge pull request #205 from marcin-wosinek/feature/component-support
Browse files Browse the repository at this point in the history
feat(ngdocs): add support for component type
  • Loading branch information
Martin committed Sep 28, 2017
2 parents e7dcf87 + cd71c95 commit 067a058
Show file tree
Hide file tree
Showing 3 changed files with 188 additions and 7 deletions.
184 changes: 177 additions & 7 deletions src/ngdoc.js
Original file line number Diff line number Diff line change
Expand Up @@ -287,14 +287,39 @@ Doc.prototype = {
(title || url).replace(/^#/g, '').replace(/\n/g, ' ') +
(isAngular ? '</code>' : '') +
'</a>';
}).
replace(/{@type\s+(\S+)(?:\s+(\S+))?}/g, function(_, type, url) {
url = url || '#';
return '<a href="' + url + '" class="' + self.prepare_type_hint_class_name(type) + '">' + type + '</a>';
}).
replace(/{@installModule\s+(\S+)?}/g, function(_, module) {
return explainModuleInstallation(module);
}).
replace(/{@type\s+(\S+)(?:\s+(\S+))?}/g, function(_, type, url) {
url = url || '#';
return '<a href="' + url + '" class="' + self.prepare_type_hint_class_name(type) + '">' + type + '</a>';
}).
replace(/{@installModule\s+(\S+)?}/g, function(_, module) {
return explainModuleInstallation(module);
});

if(self.options.highlightCodeFences) {
parts[i] = parts[i].replace(/^```([+-]?)([a-z]*)([\s\S]*?)```/i, function(_, alert, type, content){
var tClass = 'prettyprint linenums';

// check if alert type is set - if true, add the corresponding
// bootstrap classes
if(alert) {
tClass += ' alert alert-' + (alert === '+' ? 'success' : 'danger');
}

// if type is set, add lang-* information for google code
// prettify - normally this is not necessary, because the prettifier
// tries to guess the language.
if(type) {
tClass += ' lang-' + type;
}

return placeholder(
'<pre class="' + tClass + '">' +
content.replace(/</g, '&lt;').replace(/>/g, '&gt;') +
'</pre>');
});

}
});
text = parts.join('');

Expand Down Expand Up @@ -664,6 +689,91 @@ Doc.prototype = {
}
},

html_usage_bindings: function(dom) {
var self = this;
var params = this.param ? this.param : [];
if(this.animations) {
dom.h('Animations', this.animations, function(animations){
dom.html('<ul>');
var animations = animations.split("\n");
animations.forEach(function(ani) {
dom.html('<li>');
dom.text(ani);
dom.html('</li>');
});
dom.html('</ul>');
});
// dom.html('<a href="api/ngAnimate.$animate">Click here</a> to learn more about the steps involved in the animation.');
}
if(params.length > 0) {
dom.html('<h2>Bindings</h2>');
dom.html('<table class="variables-matrix table table-bordered table-striped">');
dom.html('<thead>');
dom.html('<tr>');
dom.html('<th>Binding</th>');
dom.html('<th>Type</th>');
dom.html('<th>Details</th>');
dom.html('</tr>');
dom.html('</thead>');
dom.html('<tbody>');
processParams(params);
function processParams(params) {
for(var i=0;i<params.length;i++) {
param = params[i];
var name = param.name;
var types = param.type;
if(types[0]=='(') {
types = types.substr(1);
}

var limit = types.length - 1;
if(types.charAt(limit) == ')' && types.charAt(limit-1) != '(') {
types = types.substr(0,limit);
}
types = types.split(/\|(?![\(\)\w\|\s]+>)/);
if (param.optional) {
name += ' <div><em>(optional)</em></div>';
}
dom.html('<tr>');
dom.html('<td>' + name + '</td>');
dom.html('<td>');
for(var j=0;j<types.length;j++) {
var type = types[j];
dom.html('<a href="" class="' + self.prepare_type_hint_class_name(type) + '">');
dom.text(type);
dom.html('</a>');
}

dom.html('</td>');
dom.html('<td>');
dom.html(param.description);
if (param.default) {
dom.html(' <p><em>(default: ' + param.default + ')</em></p>');
}
if (param.properties) {
// dom.html('<table class="variables-matrix table table-bordered table-striped">');
dom.html('<table>');
dom.html('<thead>');
dom.html('<tr>');
dom.html('<th>Property</th>');
dom.html('<th>Type</th>');
dom.html('<th>Details</th>');
dom.html('</tr>');
dom.html('</thead>');
dom.html('<tbody>');
processParams(param.properties);
dom.html('</tbody>');
dom.html('</table>');
}
dom.html('</td>');
dom.html('</tr>');
};
}
dom.html('</tbody>');
dom.html('</table>');
}
},

html_usage_returns: function(dom) {
var self = this;
if (self.returns) {
Expand Down Expand Up @@ -809,6 +919,46 @@ Doc.prototype = {

},

html_usage_component: function(dom){
//this.html_usage_interface(dom)
var self = this;
dom.h('Usage', function() {
dom.code(function() {
dom.text('<');
dom.text(dashCase(self.shortName));

renderParams('\n ', '="', '"');
dom.text('>\n</');
dom.text(dashCase(self.shortName));
dom.text('>');
});
self.html_usage_componentInfo(dom);
self.html_usage_bindings(dom);
});

self.method_properties_events(dom);

function renderParams(prefix, infix, suffix, skipSelf) {
(self.param||[]).forEach(function(param) {
var skip = skipSelf && (param.name == self.shortName || param.name.indexOf(self.shortName + '|') == 0);
if (!skip) {
dom.text(prefix);
dom.text(param.optional ? '[' : '');
var parts = param.name.split('|');
dom.text(dashCase(parts[skipSelf ? 0 : 1] || parts[0]));
}
if (BOOLEAN_ATTR[param.name]) {
dom.text(param.optional ? ']' : '');
} else {
dom.text(BOOLEAN_ATTR[param.name] ? '' : infix );
dom.text(('{' + param.type + '}').replace(/^\{\'(.*)\'\}$/, '$1'));
dom.text(suffix);
dom.text(param.optional && !skip ? ']' : '');
}
});
}
},

html_usage_filter: function(dom){
var self = this;
dom.h('Usage', function() {
Expand Down Expand Up @@ -880,6 +1030,22 @@ Doc.prototype = {
}
},

html_usage_componentInfo: function(dom) {
var self = this;
var list = [];


if (self.bindings !== undefined) {
list.push('This component uses:');
}

if (list.length) {
dom.h('Component info', function() {
dom.ul(list);
});
}
},

html_usage_overview: function(dom){
dom.html(this.description);
},
Expand Down Expand Up @@ -920,6 +1086,7 @@ Doc.prototype = {
this.html_usage_interface(dom)
},


method_properties_events: function(dom) {
var self = this;
if (self.methods.length) {
Expand Down Expand Up @@ -1009,6 +1176,7 @@ var GLOBALS = /^angular\.([^\.]+)$/,
MODULE = /^([^\.]+)$/,
MODULE_MOCK = /^angular\.mock\.([^\.]+)$/,
MODULE_CONTROLLER = /^(.+)\.controllers?:([^\.]+)$/,
MODULE_COMPONENT = /^(.+)\.components?:([^\.]+)$/,
MODULE_DIRECTIVE = /^(.+)\.directives?:([^\.]+)$/,
MODULE_DIRECTIVE_INPUT = /^(.+)\.directives?:input\.([^\.]+)$/,
MODULE_CUSTOM = /^(.+)\.([^\.]+):([^\.]+)$/,
Expand Down Expand Up @@ -1059,6 +1227,8 @@ function title(doc) {
return makeTitle('angular.mock.' + match[1], 'API', 'module', 'ng');
} else if (match = text.match(MODULE_CONTROLLER) && doc.type === 'controller') {
return makeTitle(match[2], 'controller', 'module', match[1]);
} else if (match = text.match(MODULE_COMPONENT)) {
return makeTitle(match[2], 'component', 'module', match[1]);
} else if (match = text.match(MODULE_DIRECTIVE)) {
return makeTitle(match[2], 'directive', 'module', match[1]);
} else if (match = text.match(MODULE_DIRECTIVE_INPUT)) {
Expand Down
7 changes: 7 additions & 0 deletions src/templates/index.tmpl
Original file line number Diff line number Diff line change
Expand Up @@ -177,6 +177,13 @@
<a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
</li>

<li class="nav-header section" ng-show="module.components.length">
<a class="guide">component</a>
</li>
<li ng-repeat="page in module.components track by page.url" ng-class="navClass(page)" class="api-list-item expand">
<a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
</li>

<li class="nav-header section" ng-show="module.directives.length">
<a class="guide">directive</a>
</li>
Expand Down
4 changes: 4 additions & 0 deletions src/templates/js/docs.js
Original file line number Diff line number Diff line change
Expand Up @@ -231,6 +231,7 @@ docsApp.controller.DocsController = function($scope, $location, $window, section
GLOBALS = /^angular\.([^\.]+)$/,
MODULE = /^([^\.]+)$/,
MODULE_MOCK = /^angular\.mock\.([^\.]+)$/,
MODULE_COMPONENT = /^(.+)\.components?:([^\.]+)$/,
MODULE_CONTROLLER = /^(.+)\.controllers?:([^\.]+)$/,
MODULE_DIRECTIVE = /^(.+)\.directives?:([^\.]+)$/,
MODULE_DIRECTIVE_INPUT = /^(.+)\.directives?:input\.([^\.]+)$/,
Expand Down Expand Up @@ -409,6 +410,8 @@ docsApp.controller.DocsController = function($scope, $location, $window, section
module(page.moduleName || match[1], section);
} else if (match = id.match(MODULE_FILTER)) {
module(page.moduleName || match[1], section).filters.push(page);
} else if (match = id.match(MODULE_COMPONENT)) {
module(page.moduleName || match[1], section).components.push(page);
} else if (match = id.match(MODULE_CONTROLLER) && page.type === 'controller') {
module(page.moduleName || match[1], section).controllers.push(page);
} else if (match = id.match(MODULE_DIRECTIVE)) {
Expand Down Expand Up @@ -453,6 +456,7 @@ docsApp.controller.DocsController = function($scope, $location, $window, section
name: name,
url: (NG_DOCS.html5Mode ? '' : '#/') + section + '/' + name,
globals: [],
components: [],
controllers: [],
directives: [],
services: [],
Expand Down

0 comments on commit 067a058

Please sign in to comment.