clenemt / docdash

:zap: Lodash inspired JSDoc 3 template/theme
http://clenemt.github.io/docdash/
Other
824 stars 201 forks source link

Description of a name space is at the bottom of the page #85

Closed edgar-koster closed 2 years ago

edgar-koster commented 4 years ago

The description you put in the comments for a namespace is right at the bottom of the page. Is there a possibility to place it at the top, say make it look more like the method section (remove the purple bar then). So you get 'title', 'attributes', 'description', 'properties' image

86

edgar-koster commented 4 years ago

I'm happy to tweak it and provide it as an update, but then I'ld need a point which file it is. I found a template file for the methods but not for the namespace otherwise I could see to add a boolean parameter and toggle it or something

ar2rsawseen commented 4 years ago

Hello, hard to say, as I am not original developer myself :) But it could be around here: https://github.com/clenemt/docdash/blob/master/tmpl/container.tmpl#L122-L130

edgar-koster commented 4 years ago

No problem. I'm getting there. Indeed I first changed the container.tmpl.

Old:

<?js } else if (doc.kind === 'class') { ?>
    <?js= self.partial('method.tmpl', doc) ?>
<?js } else { ?>

New:

<?js } else if (doc.kind === 'class') { ?>
    <?js= self.partial('method.tmpl', doc) ?>
<?js } else if (doc.kind === 'namespace') { ?>
    <?js= self.partial('namespace.tmpl', doc) ?>
<?js } else { ?>

Then I copied method.tmpl to interface.tmpl. Right now it looks like:

<?js
var data = obj;
var self = this;
?>

<?js if (data.kind !== 'module' && data.description) { ?>
<div class="description usertext">
    <?js= data.description ?>
</div>
<?js } ?>

<?js= this.partial('details.tmpl', data) ?>

<?js if (data.augments && data.alias && data.alias.indexOf('module:') === 0) { ?>
    <h5>Extends:</h5>
    <?js= self.partial('augments.tmpl', data) ?>
<?js } ?>

<?js if (kind === 'event' && data.type && data.type.names) {?>
    <h5>Type:</h5>
    <ul>
        <li>
            <?js= self.partial('type.tmpl', data.type.names) ?>
        </li>
    </ul>
<?js } ?>

<?js if (data['this']) { ?>
    <h5>This:</h5>
    <ul><li><?js= this.linkto(data['this'], data['this']) ?></li></ul>
<?js } ?>

<?js if (data.examples && examples.length) { ?>
    <h5>Example<?js= examples.length > 1? 's':'' ?></h5>
    <?js= this.partial('examples.tmpl', examples) ?>
<?js } ?>

<?js if (data.params && params.length) { ?>
    <h5>Parameters:</h5>
    <?js= this.partial('params.tmpl', params) ?>
<?js } ?>

<?js if (data.kind !== 'module' && data.requires && data.requires.length) { ?>
<h5>Requires:</h5>
<ul><?js data.requires.forEach(function(r) { ?>
    <li><?js= self.linkto(r) ?></li>
<?js }); ?></ul>
<?js } ?>

<?js if (data.fires && fires.length) { ?>
<h5>Fires:</h5>
<ul><?js fires.forEach(function(f) { ?>
    <li><?js= self.linkto(f) ?></li>
<?js }); ?></ul>
<?js } ?>

<?js if (data.listens && listens.length) { ?>
<h5>Listens to Events:</h5>
<ul><?js listens.forEach(function(f) { ?>
    <li><?js= self.linkto(f) ?></li>
<?js }); ?></ul>
<?js } ?>

<?js if (data.listeners && listeners.length) { ?>
<h5>Listeners of This Event:</h5>
<ul><?js listeners.forEach(function(f) { ?>
    <li><?js= self.linkto(f) ?></li>
<?js }); ?></ul>
<?js } ?>

<?js if (data.modifies && modifies.length) {?>      
<h5>Modifies:</h5>      
<?js if (modifies.length > 1) { ?><ul><?js      
    modifies.forEach(function(m) { ?>       
        <li><?js= self.partial('modifies.tmpl', m) ?></li>      
    <?js });        
?></ul><?js } else {        
    modifies.forEach(function(m) { ?>       
        <?js= self.partial('modifies.tmpl', m) ?>       
    <?js });        
} } ?>

<?js if (data.exceptions && exceptions.length) { ?>
<h5>Throws:</h5>
<?js if (exceptions.length > 1) { ?><ul><?js
    exceptions.forEach(function(r) { ?>
        <li><?js= self.partial('exceptions.tmpl', r) ?></li>
    <?js });
?></ul><?js } else {
    exceptions.forEach(function(r) { ?>
        <?js= self.partial('exceptions.tmpl', r) ?>
    <?js });
} } ?>

<?js if (data.returns && returns.length) { ?>
<h5>Returns:</h5>
<?js if (returns.length > 1) { ?><ul><?js
    returns.forEach(function(r) { ?>
        <li><?js= self.partial('returns.tmpl', r) ?></li>
    <?js });
?></ul><?js } else {
    returns.forEach(function(r) { ?>
        <?js= self.partial('returns.tmpl', r) ?>
    <?js });
} } ?>

<?js if (data.yields && yields.length) { ?>     
<h5>Yields:</h5>        
<?js if (yields.length > 1) { ?><ul><?js        
    yields.forEach(function(r) { ?>     
        <li><?js= self.partial('returns.tmpl', r) ?></li>       
    <?js });        
?></ul><?js } else {        
    yields.forEach(function(r) { ?>     
        <?js= self.partial('returns.tmpl', r) ?>        
    <?js });        
} } ?>

Now it's not 100% I like, but that is a bit more tweaking with if statements containing doc.kind === 'namespace'.