update oxdoc example
This commit is contained in:
parent
050a348061
commit
1fb1cf2727
2 changed files with 45 additions and 37 deletions
|
@ -1,7 +1,7 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>OxDoc</title>
|
<title>OxDoc Tutorial</title>
|
||||||
<meta http-equiv="Keywords" content="Documentation"/>
|
<meta http-equiv="Keywords" content="Documentation"/>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||||
<link rel="shortcut icon" type="image/png" href="../../../source/Ox.UI/themes/classic/png/icon16.png"/>
|
<link rel="shortcut icon" type="image/png" href="../../../source/Ox.UI/themes/classic/png/icon16.png"/>
|
|
@ -1,9 +1,5 @@
|
||||||
/*
|
/*
|
||||||
**OxDoc Tutorial**
|
An `OxDoc` comment is an inline or multi-line comment that starts with `@`:
|
||||||
*/
|
|
||||||
'use strict';
|
|
||||||
/*
|
|
||||||
An OxDoc comment is an inline or multi-line comment that starts with `@`:
|
|
||||||
```
|
```
|
||||||
//@ ...
|
//@ ...
|
||||||
/*@
|
/*@
|
||||||
|
@ -13,6 +9,8 @@ An OxDoc comment is an inline or multi-line comment that starts with `@`:
|
||||||
The syntax is simple: almost every line has the form `name <type> summary`. If
|
The syntax is simple: almost every line has the form `name <type> summary`. If
|
||||||
it doesn't, its meaning depends on its context.
|
it doesn't, its meaning depends on its context.
|
||||||
*/
|
*/
|
||||||
|
'use strict';
|
||||||
|
|
||||||
this.My = {};
|
this.My = {};
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
@ -32,7 +30,7 @@ My.REQUEST_TIMEOUT = 60000;
|
||||||
In a multiline comment, lines that follow the inital definition are indented, as
|
In a multiline comment, lines that follow the inital definition are indented, as
|
||||||
they refer to the item defined in the line above. Lines that don't match `name
|
they refer to the item defined in the line above. Lines that don't match `name
|
||||||
<type> summary` are parsed as a description. Like the summary, the description
|
<type> summary` are parsed as a description. Like the summary, the description
|
||||||
can contain `markdown`.
|
can contain some `markdown` (see Ox.parseMarkdown).
|
||||||
*/
|
*/
|
||||||
/*@
|
/*@
|
||||||
My.MAGIC_CONSTANT <number> Magic constant, needed for HTTP requests
|
My.MAGIC_CONSTANT <number> Magic constant, needed for HTTP requests
|
||||||
|
@ -47,15 +45,19 @@ This defines a new section named 'Objects'.
|
||||||
//@ Objects
|
//@ Objects
|
||||||
|
|
||||||
/*
|
/*
|
||||||
Lines that start with `#` are inline comments. The follwing lines document
|
A line that starts with `#` is an inline comment that will be ignored by the
|
||||||
properties of the `My.favorites` object. This example shows all possible values
|
parser.
|
||||||
for `type`. These values can be shortened, it's sufficient to specify their
|
|
||||||
first character. A line that starts with `>` is an inline test statement,
|
The following lines document properties of the `My.favorites` object. This
|
||||||
followed by its expected result.
|
example shows all possible values for `type`. These values can be shortened —
|
||||||
|
it's sufficient to specify their first character.
|
||||||
|
|
||||||
|
A line that starts with `>` is an inline test statement, followed by the
|
||||||
|
expected result. (Yes, it's that simple!)
|
||||||
*/
|
*/
|
||||||
/*@
|
/*@
|
||||||
My.favorite <object> ...
|
My.favorite <object> Collection of favorites
|
||||||
# Properties --------------------------------------------------------------
|
# Properties ---------------------------------------------------------------
|
||||||
array <a> My favorite array
|
array <a> My favorite array
|
||||||
boolean <b> My favorite boolean value
|
boolean <b> My favorite boolean value
|
||||||
date <d> My favorite date
|
date <d> My favorite date
|
||||||
|
@ -74,6 +76,7 @@ My.favorite <object> ...
|
||||||
any <*> Favorite of the day
|
any <*> Favorite of the day
|
||||||
# Events -------------------------------------------------------------------
|
# Events -------------------------------------------------------------------
|
||||||
event <!> Fires when My.favorite['function'] is called
|
event <!> Fires when My.favorite['function'] is called
|
||||||
|
# Tests --------------------------------------------------------------------
|
||||||
> My.favorite.array.length + My.favorite.string.length
|
> My.favorite.array.length + My.favorite.string.length
|
||||||
0
|
0
|
||||||
> My.favorite['function'].length + My.favorite.arguments.length
|
> My.favorite['function'].length + My.favorite.arguments.length
|
||||||
|
@ -112,9 +115,10 @@ My.favorite = (function() {
|
||||||
|
|
||||||
/*
|
/*
|
||||||
Documentation can be nested. In other words, one can document the properties of
|
Documentation can be nested. In other words, one can document the properties of
|
||||||
a property (of a property...). Also, if all elements of an array are of a known
|
a property (of a property...).
|
||||||
type (in this case `string`), one can mark the type as `<[s]>` instead of just
|
|
||||||
`<a>`.
|
If all elements of an array are of a known type (in this case `string`), one can
|
||||||
|
mark the type as `<[s]>` instead of just `<a>`.
|
||||||
*/
|
*/
|
||||||
/*@
|
/*@
|
||||||
My.HTMLUtils <o> HTML Utilities
|
My.HTMLUtils <o> HTML Utilities
|
||||||
|
@ -166,11 +170,13 @@ The beginning of another section, named 'Functions'.
|
||||||
In the case of a function, the indented lines don't document properties, but the
|
In the case of a function, the indented lines don't document properties, but the
|
||||||
function's signature, return value and arguments. Signature and return value are
|
function's signature, return value and arguments. Signature and return value are
|
||||||
just a special case of `name <type> summary`, where `name` has the form
|
just a special case of `name <type> summary`, where `name` has the form
|
||||||
`(arguments) ->`. If an item can be of more than one type (in this case `string`
|
`(arguments) ->`.
|
||||||
or `function`), this is documented as `<s|f>`. If it has a default value (in
|
|
||||||
this case the string `'GET'`), this is documented as `<s|'GET'>`. For a
|
If an item can be of more than one type (in this case `string` or `function`),
|
||||||
`function`-type argument (usually a callback function), there is no return value
|
this is documented as `<s|f>`. If it has a default value (in this case the
|
||||||
to document, only the arguments it gets passed.
|
string `'GET'`), this is documented as `<s|'GET'>`. For a `function`-type
|
||||||
|
argument (usually a callback function), there is no return value to document,
|
||||||
|
only the arguments it gets passed.
|
||||||
*/
|
*/
|
||||||
/*@
|
/*@
|
||||||
My.readURL <f> Asynchronously reads a remote resource
|
My.readURL <f> Asynchronously reads a remote resource
|
||||||
|
@ -212,8 +218,9 @@ My.readURL = function(url, method, callback) {
|
||||||
|
|
||||||
/*
|
/*
|
||||||
If a function's return value depends on the absence or presence of optional
|
If a function's return value depends on the absence or presence of optional
|
||||||
arguments, there can be multiple `(arguments) -> <type> summary` lines. And to
|
arguments, there can be multiple `(arguments) -> <type> summary` lines.
|
||||||
test asynchronous functions, call `Ox.test(actual, expected)` in the
|
|
||||||
|
To test asynchronous functions, just call `Ox.test(actual, expected)` in the
|
||||||
callback.
|
callback.
|
||||||
*/
|
*/
|
||||||
/*@
|
/*@
|
||||||
|
@ -336,9 +343,10 @@ And another section, named 'UI Elements'.
|
||||||
When documenting a constructor function, the returned object may come with a lot
|
When documenting a constructor function, the returned object may come with a lot
|
||||||
more documentation than the function itself. In this case, one may want to
|
more documentation than the function itself. In this case, one may want to
|
||||||
document the contructor's arguments first, then the signature and return value,
|
document the contructor's arguments first, then the signature and return value,
|
||||||
follwed by the documentation of the returned object. Further, if an event has
|
follwed by the documentation of the returned object
|
||||||
event data, i.e. passes an object to its handlers, the properties of that object
|
|
||||||
are documented as properties of the event.
|
If an event has properties (i.e. passes an object to its handler), these
|
||||||
|
properties can be documented as well, just like regular object properties.
|
||||||
*/
|
*/
|
||||||
/*@
|
/*@
|
||||||
My.Box <f> A very simple colored box
|
My.Box <f> A very simple colored box
|
||||||
|
@ -370,10 +378,10 @@ My.Box = function(options, self) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/*
|
/*
|
||||||
It can be more convenient to document properties at the place where they are
|
Sometimes, it can be more convenient to document properties at the place
|
||||||
defined. A name prefixed with a `.` signals that what follows is not a
|
where they are defined. A name prefixed with a `.` signals that what follows
|
||||||
standalone item, but a property of the previous one (or, in case the
|
is not a standalone item, but a property of the previous one (or, in case
|
||||||
previous item is a function that returns an object, a property of the
|
the previous item is a function that returns an object, a property of the
|
||||||
retuned object).
|
retuned object).
|
||||||
*/
|
*/
|
||||||
/*@
|
/*@
|
||||||
|
@ -405,9 +413,9 @@ My.Box = function(options, self) {
|
||||||
|
|
||||||
/*
|
/*
|
||||||
If an object extends or inherits from another one, one can specify its "class"
|
If an object extends or inherits from another one, one can specify its "class"
|
||||||
(i.e. the name of the constuctor of the object it inherits from). Here,
|
(the name of the constuctor of the object it inherits from). Here,
|
||||||
`My.ExtendedBox` extends `My.Box`. All events and properties of the latter,
|
`My.ExtendedBox` extends `My.Box`. All events and properties of the latter,
|
||||||
unless redefined will, be present on the former.
|
unless redefined, will be present on the former.
|
||||||
*/
|
*/
|
||||||
/*@
|
/*@
|
||||||
My.ExtendedBox <f> An extended box with random color
|
My.ExtendedBox <f> An extended box with random color
|
||||||
|
@ -460,14 +468,14 @@ My.ExtendedBox = function(options, self) {
|
||||||
};
|
};
|
||||||
|
|
||||||
/*
|
/*
|
||||||
The last item gets added to the 'Objects' section.
|
The last item will get added to the 'Objects' section.
|
||||||
*/
|
*/
|
||||||
//@ Objects
|
//@ Objects
|
||||||
|
|
||||||
/*
|
/*
|
||||||
Whenever code is hard to test with just a series of one-liners, a `<script>` tag
|
Whenever code cannot be tested with just a series of one-liners, a `<script>`
|
||||||
can be added before the tests. Note that the script will be evaluated in the
|
tag can be added before the tests. Since the script will be evaluated in the
|
||||||
global context, so it's a good idea not to create or leave any clutter.
|
global context, it's a good idea not to create or leave any clutter.
|
||||||
*/
|
*/
|
||||||
/*@
|
/*@
|
||||||
My.Event <o> Provides basic event handling
|
My.Event <o> Provides basic event handling
|
Loading…
Reference in a new issue