Index

Mobizen2 Web Client API Documentations

Usage

  1. If you want to create documentations with sample files, you can use commands below.

    $ npm install
    $ grunt doc
  2. You can use exclude filter of specific file or folders with a -x option.

    $ grunt -x apps/,tools/
  3. You can see any output related jsdoc process with a --debug flag.

    $ grunt doc --debug
  4. If you already have jsdoc system, you can use this project as jsdoc template.

    $ jsdoc -t `project folder` -c `configuration file` `source files` `README.md file`

conf.json

You can set options for customizing your documentations.

"templates": {
    "applicationName": "Mobizen2",
    "disqus": "",
    "googleAnalytics": "",
    "openGraph": {
        "title": "",
        "type": "website",
        "image": "",
        "site_name": "",
        "url": ""
    },
    "meta": {
        "title": "",
        "description": "",
        "keyword": ""
    },
    "linenums": true
}

Namepaths in JSDoc 3

Basic Syntax Examples of Namepaths in JSDoc 3

myFunction
MyConstructor
MyConstructor#instanceMember
MyConstructor.staticMember
MyConstructor~innerMember // note that JSDoc 2 uses a dash

Use a documentation tag to describe your code.

/** @constructor */
Person = function() {
    this.say = function() {
        return "I'm an instance.";
    }

    function say() {
        return "I'm inner.";
    }
}
Person.say = function() {
    return "I'm static.";
}

var p = new Person();
p.say();      // I'm an instance.
Person.say(); // I'm static.
// there is no way to directly access the inner function from here

Use a documentation tag to describe your code.

Person#say  // the instance method named "say."
Person.say  // the static method named "say."
Person~say  // the inner method named "say."

Standard supported jsdoc directives

The jsdoc utility has basic support for many of the standard jsdoc directives. But in particular it is interested in the following directives:

  • @virtual This member must be implemented (or overridden) by the inheritor.
  • @borrows This object uses something from another object.
  • @const Document an object as a constant.
  • @extends Indicate that a symbol inherits from, ands adds to, a parent symbol.
  • @constructs This function member will be the constructor for the previous class.
  • @deprecated Document that this is no longer the preferred way.
  • @enum Document a collection of related properties.
  • @event Document an event.
  • @example Provide an example of how to use a documented item.
  • @fires Describe the events this method may fire.
  • @method Describe a function or method.
  • @global Document a global object.
  • @implements This symbol is an interface that others can implement.
  • @interface This symbol implements an interface.
  • @lends Document properties on an object literal as if they belonged to a symbol with a given name.
  • @listens List the events that a symbol listens for.
  • @member Document a member.
  • @memberof This symbol belongs to a parent symbol.
  • @namespace Document a namespace object.
  • @override Indicate that a symbol overrides its parent.
  • @param Document the parameter to a function.
  • @private This symbol is meant to be private.
  • @prop Document a property of an object.
  • @protected This symbol is meant to be protected.
  • @public This symbol is meant to be public.
  • @readonly This symbol is meant to be read-only.
  • @requires This file requires a JavaScript module.
  • @return Document the return value of a function.
  • @exception Describe what errors could be thrown.
  • @type Document the type of an object.
  • @typedef Document a custom type.
  • @variation Distinguish different objects with the same name.

Class Diagram of Mobizen2 Web Client

Class Diagram

Functional requirements for Mobizen2 Web Client

  • JSON Parsing
  • XMLHttpRequest2
  • Cross-Origin Resource Sharing
  • Web Sockets(with binary)
  • Web Storage(name/value pairs)
  • Base64 Encoding and Decoding
  • Typed Arrays
  • File and FileReader API
  • Multiple File Selection
  • Drag and Drop
  • Indexed Database
  • ECMAScript 5 Strict Mode
  • ECMAScript 6 Promises
  • Web Workers
  • Web RTC(with data channel)
  • WebGL 3D Canvas graphics
  • Canvas Element
  • Hash Change Event
  • Request Animation Frame
  • Blob URLs
  • Touch Events
  • Get User Media/Stream API
  • Audio and Video Element
  • SVG Element(with inline)
  • Dataset and data-* attributes
  • Download Attributes
  • Transforms(with 3D)
  • Flexible Box Layout Module
  • Web Open Font Format
  • Media Queries
  • Filter Effects
  • Data URIs

CHANGELOG

  • CHANGED Updating all of node modules.
  • ADDED Support for mobile device.
  • ADDED Short name for struct type.
  • FIXED Not match pathname in @borrows tag when include whitespace in @name.
  • ADDED Improve @see tag link name display.
  • ADDED Improve the search things.
  • FIXED Broken links if use the name is number string.
  • ADDED Syntax highlight for index page.
  • FIXED Wrong display name of item in the navigation if use @variation tag.
  • CHANGED Improve content and navigation styles.
  • ADDED Exists file or directory when using filter.
  • ADDED A rule of src exclude in grunt using CLI.
  • CHANGED Lightweight templates.
  • ADDED Implementation browser legacy content scrolling.
  • ADDED line of code display for static members.
  • ADDED global tag display to content header.
  • ADDED Small tags of inherited, deprecated, static and inner to navigation items.
  • CHANGED Focus to the selected item of navigation.
  • ADDED Dynamic content update using History API.

JSDoc Module Issues

Fix not match pathname in @borrows tag when include whitespace in @name.

  • name: grunt-jsdoc@0.5.8/jsdoc@3.2.2 ~ grunt-jsdoc@0.6.7/jsdoc@3.3.1
  • file: ./node_modules/grunt-jsdoc/node_modules/jsdoc/lib/jsdoc/tag/dictionary/definitions.js
  • line: 89
  • code:
/** before */
function parseBorrows(doclet, tag) {
    var m = /^(\S+)(?:\s+as\s+(\S+))?$/.exec(tag.text);
    if (m) {
        if (m[1] && m[2]) {
            return { target: m[1], source: m[2] };
        }
        else if (m[1]) {
            return { target: m[1] };
        }
    } else {
        return {};
    }
}

/** after */
function parseBorrows(doclet, tag) {
    // FIXED not match pathname if include whitespace in @name.
    //var m = /^(\S+)(?:\s+as\s+(\S+))?$/.exec(tag.text);
    var m = tag.text && [tag.text].concat(tag.text.split(/\s+as\s+/));
    if (m) {
        if (m[1] && m[2]) {
            return { target: m[1], source: m[2] };
        }
        else if (m[1]) {
            return { target: m[1] };
        }
    } else {
        return {};
    }
}

Fix wrong diaplsy name of items in navigation if use @variation tag.

  • note: resolved in jsdoc@3.3.x
  • name: grunt-jsdoc@0.5.8/jsdoc@3.2.2
  • file: ./node_modules/grunt-jsdoc/node_modules/jsdoc/lib/jsdoc/util/templateHelper.js
  • line: 185
  • code:
/** before */
else if (longname && longname.search(/[<{(]/) !== -1 && /\{\@.+\}/.test(longname) === false) {

/** after */
// FIXED @variation tag issue
//else if (longname && longname.search(/[<{(]/) !== -1 && /\{\@.+\}/.test(longname) === false) {
else if (longname && longname.search(/[<{]/) !== -1 && /\{\@.+\}/.test(longname) === false) {

Fix broken links when using name of member is <number>.toString().

  • note: resolved in jsdoc@3.3.x
  • name: grunt-jsdoc@0.5.8/jsdoc@3.2.2
  • file: ./node_modules/grunt-jsdoc/node_modules/jsdoc/lib/jsdoc/name.js
  • line: 211
  • code:
/** before */
var i = atoms.length;
while (i--) {
    longname = longname.replace('@{'+i+'}@', atoms[i]);
    memberof = memberof.replace('@{'+i+'}@', atoms[i]);
    scope    = scope.replace('@{'+i+'}@', atoms[i]);
    name     = name.replace('@{'+i+'}@', atoms[i]);
}

////
return {longname: longname, memberof: memberof, scope: scope, name: name, variation: variation};

/** after */
var i = atoms.length;
while (i--) {
    longname = longname.replace('@{'+i+'}@', atoms[i]);
    memberof = memberof.replace('@{'+i+'}@', atoms[i]);
    scope    = scope.replace('@{'+i+'}@', atoms[i]);
    name     = name.replace('@{'+i+'}@', atoms[i]);
}

// FIXED broken links on string style @name
if (name && name.match('"')) {
  name = name.replace(/"/g, '\'');
}

if (longname && longname.match('"')) {
  longname = longname.replace(/"/g, '\'');
}

////
return {longname: longname, memberof: memberof, scope: scope, name: name, variation: variation};

Code blocks

In line code can be specified by enclosing the code in back-ticks (`). A block of multi-line code can be enclosed in triple back-ticks (```) but it is formatted better if it is enclosed in

...
tags and the code lines themselves are indented.

License

This project under the MIT License. and this project refered by default template for JSDoc 3.

comments powered by Disqus