The_asMan
The_asMan

Reputation: 6402

How to document jQuery-ui widgets with jsdoc-toolkit?

How can i document this widget so the toolkit can expose the methods and options.
Everything I have tried will not see anything inside the closure.

/**
* @fileOverview
* @version 1.0
*/

(function($) {
    "use strict";
    $.widget('mynamespace.nameofwidget', {

        // foo should show up in the docs
        options: {
            'foo': 'bar'
        },

        // public function name and parameters should be documented
        myPublic function () {
            // code here....
        },

        // private function no need to document
        _create: function () {
            // code here....
        },

        // private function no need to document
        _setOption: function (key, value) {
            // code here....
        },
    });

})(jQuery);

[EDIT]

Here is my config file

{
    // source files to use
    _: ['js/test/'],

    // document all functions, even uncommented ones
    a: true,

    // including those marked @private
    p: true,

    // use this directory as the output directory
    d: "js/docs/",

    // use this template
    t: "jsdoc-toolkit/templates/jsdoc",

}

Here is the command line command I am using.

java -jar jsdoc-toolkit/jsrun.jar jsdoc-toolkit/app/run.js  -c=js/docs/conf/ilo.conf

[UPDATED CONF]

{
    "opts": {
        "destination": "../js/out/",
        "private": true
    },
    "tags": {
        "allowUnknownTags": true
    },
    "source": {
        "include": [ "../js/test" ],
        "includePattern": ".+\\.js(doc)?$",
        "excludePattern": "(^|\\/|\\\\)_"
    },
    "plugins": [],
    "templates": {
        "cleverLinks": false,
        "monospaceLinks": false,
        "default": {
            "outputSourceFiles": true
        }
    }
}

Upvotes: 2

Views: 1515

Answers (1)

J David Smith
J David Smith

Reputation: 4810

Use the @name and @namespace directives (alternatively, you can use the @name directive on a constructor function). Below is a sample documentation for your code:

/**                                                                                                                                                                                           
 *@fileOverview                                                                                                                                                                               
 *@version 1.0                                                                                                                                                                                
 *                                                                                                                                                                                            
 * @namespace mynamespace.nameofwidget                                                                                                                                                        
 */                                                                                                                                                                                           

(function($) {                                                                                                                                                                                
    "use strict";                                                                                                                                                                             
    $.widget('mynamespace.nameofwidget', {                                                                                                                                                    

        /**                                                                                                                                                                                   
         * @name mynamespace.nameofwidget#foo                                                                                                                                                 
         * @description Description of Foo                                                                                                                                                    
         */                                                                                                                                                                                   
        options: {                                                                                                                                                                            
            'foo': 'bar'                                                                                                                                                                      
        },                                                                                                                                                                                    

        /**                                                                                                                                                                                   
         * @name mynamespace.nameofwidget#myPublic
         * @function
         * @description some description                                                                                                                                                      
         */                                                                                                                                                                                   
        myPublic: function () {                                                                                                                                                               
            // code here....                                                                                                                                                                  
        },                                                                                                                                                                                    

        /**                                                                                                                                                                                   
         * @name mynamespace.nameofwidget#_create                                                                                                                                             
         * @function
         * @private                                                                                                                                                                           
         * @description will not show up in HTML docs, but the comments are good to have                                                                                                      
         */                                                                                                                                                                                   
        // private function no need to document                                                                                                                                               
        _create: function () {                                                                                                                                                                
            // code here....                                                                                                                                                                  
        },                                                                                                                                                                                    

        /**                                                                                                                                                                                   
         * @name mynamespace.nameofwidget#_setOption                                                                                    
         * @function
         * @private                                                                                                                                                                           
         * @param {String} key                                                                                                                                                                
         * @param {String} value                                                                                                                                                              
         * @description will not show up in HTML docs, but the comments are good to have                                                                                                      
         */                                                                                                                                                                                   
        // private function no need to document                                                                                                                                               
        _setOption: function (key, value) {                                                                                                                                                   
            // code here....                                                                                                                                                                  
        }                                                                                                                                                                                     
    });                                                                                                                                                                                       

})(jQuery);

Note that if the -p parameter is used on the command line, the @private directive will not hide commands from the generated documentation.

See this page for more information about namepaths and this page for more information about the @private directive.

Upvotes: 7

Related Questions