0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

prototype of a documentation page

Browse source
This commit is contained in:
rolux 2011-05-06 19:40:26 +02:00
parent a6ed310087
commit b1d171282c
8 changed files with 476 additions and 85 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

122
demos/doc/deleteme.html Normal file
View file

@ -0,0 +1,122 @@
<!DOCTYPE HTML>
<html>
<head>
<style>
table {
//border: 1px solid black;
}
td {
//border: 1px solid red;
}
</style>
</head>
<body>
<table>
<tr>
<td>Ox.foo</td>
<td>&lt;foo&gt;</td>
<td>foo</td>
</tr>
</table>
<table>
<tr>
<td width=16/>
<td><b>Usage</b></td>
</tr>
</table>
<table>
<tr>
<td width=32/>
<td>Ox.foo(foo)</td>
<td>returns</td>
<td>&lt;foo&gt;</td>
<td>foo</td>
</tr>
<tr>
<td width=32/>
<td>Ox.foo(foo, bar)</td>
<td>returns</td>
<td>&lt;foobar&gt;</td>
<td>foobar</td>
</tr>
</table>
<table>
<tr>
<td width=16/>
<td><b>Arguments</b></td>
</tr>
</table>
<table>
<tr>
<td width=32/>
<td>foo</td>
<td>&lt;foo&gt;</td>
<td>foo</td>
<td width=300></td>
</tr>
<tr>
<td colspan=5>
<table>
<tr>
<td width=48/>
<td><b>Properties</b></td>
</tr>
</table>
<table>
<tr>
<td width=64/>
<td>foo</td>
<td>&lt;foo&gt;</td>
<td>foo</td>
<td width=100></td>
</tr>
<tr>
<td colspan=5>
<table>
<tr>
<td width=80/>
<td><b>Properties</b></td>
</tr>
</table>
<table>
<tr>
<td width=96/>
<td>foo</td>
<td>&lt;foo&gt;</td>
<td>foo</td>
<td width=100></td>
</tr>
<tr>
<td width=96/>
<td>foobar</td>
<td>&lt;foobar&gt;</td>
<td>foobar</td>
<td width=100></td>
</tr>
</table>
</td>
</tr>
<tr>
<td width=64/>
<td>foobar</td>
<td>&lt;foobar&gt;</td>
<td>foobar</td>
<td width=100></td>
</tr>
</table>
</td>
</tr>
<tr>
<td width=32/>
<td>foobar</td>
<td>&lt;foobar&gt;</td>
<td>foobar</td>
<td width=300></td>
</tr>
</table>
</body>
<html>

10
demos/doc/index.html Normal file
View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML>
<html>
<head>
<title>OxJS Doc Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript" src="../../build/Ox.js"></script>
<script type="text/javascript" src="js/doc.js"></script>
</head>
<body></body>
</html>

18
demos/doc/js/doc.js Normal file
View file

@ -0,0 +1,18 @@
Ox.load('UI', {
debug: true,
theme: 'classic'
}, function() {
Ox.Theme('classic');
Ox.get('../../build/Ox.js', function(source) {
var doc = Ox.doc(source);
doc.forEach(function(item) {
Ox.DocPage({doc: item}).appendTo(Ox.UI.$body);
});
Ox.get('../../build/Ox.UI/js/Map/Ox.Map.js', function(source) {
var doc = Ox.doc(source);
doc.forEach(function(item) {
Ox.DocPage({doc: item}).appendTo(Ox.UI.$body);
});
});
});
});

42
source/Ox.UI/css/Ox.UI.css
View file

@ -1464,6 +1464,48 @@ SyntaxHightlighter
-webkit-user-select: none; -webkit-user-select: none;
} }
/*
================================================================================
Text
================================================================================
*/
.OxText {
padding: 8px;
-moz-user-select: text;
-webkit-user-select: text;
}
.OxText div {
font-size: 12px;
line-height: 16px;
-moz-user-select: text;
-webkit-user-select: text;
}
.OxText code {
font-family: Menlo, Monaco, DejaVu Sans Mono, Bitstream Vera Sans Mono, Consolas, Lucida Console;
color: rgb(0, 0, 128);
}
.OxText h1 {
font-weight: bold;
font-size: 16px;
line-height: 20px;
}
.OxText table {
border-spacing: 0;
//border: 1px solid red;
}
.OxText td {
padding: 0 4px 0 4px;
//border: 1px solid rgb(128, 128, 128);
vertical-align: top;
}
.OxText td:first-child {
padding-left: 0;
}
.OxText td:last-child {
padding-right: 0;
}
/* /*
================================================================================ ================================================================================
Video Video

146
source/Ox.UI/js/Core/Ox.DocPage.js Normal file
View file

@ -0,0 +1,146 @@
Ox.DocPage = function(options, self) {
self = self || {};
var that = Ox.Element({}, self)
.defaults({
doc: ''
})
.options(options || {})
.addClass('OxText')
.css({
width: '640px'
});
$('body').css('overflowY', 'auto')
that.append($('<h1>').append('<code>' + self.options.doc.name + '</code>'));
getItem(self.options.doc, 0, '').forEach(function($element) {
that.append($element);
})
function getItem(item, level) {
var $elements = [$('<div>')
.css({paddingLeft: ((level * 32) + 'px')})
.html(
'<code><b>' + item.name + '</b> ' +
'&lt;' + item.types.join('&gt;</code> or <code>&lt;') + '&gt; </code>' +
Ox.parseHTML(item.summary)
)
];
[
'description', 'usage', 'arguments', 'properties', 'events', 'examples', 'source'
].forEach(function(section) {
var className = 'OxLine' + Ox.uid();
if (item[section]) {
if (section == 'description') {
$elements.push($('<div>')
.css({paddingLeft: ((level * 32 + 16) + 'px')})
.html(item.description)
);
} else {
$elements.push($('<div>')
.css({paddingLeft: ((level * 32 + 16) + 'px')})
.append(
$('<img>')
.attr({src: Ox.UI.getImagePath('symbolDown.svg')})
.css({
width: '12px',
height: '12px',
margin: '0 4px -1px 0'
})
.click(function() {
var $this = $(this),
isExpanded = $this.attr('src') == Ox.UI.getImagePath('symbolDown.svg');
$this.attr({
src: isExpanded ?
Ox.UI.getImagePath('symbolRight.svg') :
Ox.UI.getImagePath('symbolDown.svg')
});
$('.' + className).each(function() {
var $this = $(this);
$this[isExpanded ? 'addClass' : 'removeClass'](className + 'Hidden');
if (isExpanded) {
$this.hide();
} else {
var hidden = false;
Ox.forEach(this.className.split(' '), function(v) {
if (/Hidden$/.test(v)) {
hidden = true;
return false;
}
});
if (!hidden) {
$this.show()
}
}
});
})
)
.append('<b>' + Ox.toTitleCase(section) + '</b>')
);
if (section == 'examples') {
item.examples.forEach(function(example) {
$elements.push($('<div>')
.addClass(className)
.css({marginLeft: ((level * 32 + 32) + 'px')})
.html(
'<code><b>&gt;</b>&nbsp;' +
//Ox.encodeHTML(example.statement)
example.statement
.replace(/ /g, '&nbsp;')
.replace(/\n/g, '<br/>\n&nbsp;&nbsp;') +
'</code>'
)
);
example.result && $elements.push($('<div>')
.addClass(className)
.css({marginLeft: ((level * 32 + 32) + 'px')})
.html(
'<code>' + Ox.parseHTML(example.result) + '</code>'
)
)
});
} else if (section == 'source') {
var html = '';
var flag = false;
item.source.forEach(function(token) {
if (token.type != 'linebreak' && token.type != 'whitespace') {
flag = true;
}
if (flag) {
html += '<span class="Ox' + Ox.toTitleCase(token.type) + '">' +
Ox.encodeHTML(token.source)
.replace(/ /g, '&nbsp;')
.replace(/\n/g, '<br/>') +
'</span>';
}
});
$elements.push($('<div>')
.addClass('OxSourceCode ' + className)
.css({background: 'rgb(255, 255, 255)', padding: '4px'})
.css({marginLeft: ((level * 32 + 32) + 'px')})
.html('<code>' + html + '</code>')
);
} else {
item[section].forEach(function(v) {
if (section == 'usage') {
v.name = item.name + v.name + ' </b></code>returns<code> <b>';
}
$elements = Ox.merge(
$elements,
Ox.map(getItem(v, level + 1), function($element) {
return $element.addClass(className);
})
);
});
}
}
}
})
return $elements;
}
return that;
};

14
source/Ox.UI/js/Core/Ox.SyntaxHighlighter.js
View file

@ -39,7 +39,8 @@ Ox.SyntaxHighlighter = function(options, self) {
self.source = ''; self.source = '';
self.tokens = Ox.tokenize(self.options.source); self.tokens = Ox.tokenize(self.options.source);
self.tokens.forEach(function(token, i) { self.tokens.forEach(function(token, i) {
var classNames; var classNames,
source = self.options.source.substr(token.offset, token.length);
if ( if (
!(self.options.stripComments && token.type == 'comment') !(self.options.stripComments && token.type == 'comment')
) { ) {
@ -52,7 +53,7 @@ Ox.SyntaxHighlighter = function(options, self) {
} }
} }
self.source += '<span class="' + classNames + '">' + self.source += '<span class="' + classNames + '">' +
encodeToken(token.source, token.type) + '</span>'; encodeToken(source, token.type) + '</span>';
} }
self.cursor += token.length; self.cursor += token.length;
function isAfterLinebreak() { function isAfterLinebreak() {
@ -64,7 +65,7 @@ Ox.SyntaxHighlighter = function(options, self) {
self.tokens[i + 1].type == 'linebreak'; self.tokens[i + 1].type == 'linebreak';
} }
function hasIrregularSpaces() { function hasIrregularSpaces() {
return token.source.split('').reduce(function(prev, curr) { return source.split('').reduce(function(prev, curr) {
return prev + (curr == ' ' ? 1 : 0); return prev + (curr == ' ' ? 1 : 0);
}, 0) % self.options.tabLength; }, 0) % self.options.tabLength;
} }
@ -107,11 +108,11 @@ Ox.SyntaxHighlighter = function(options, self) {
.html(self.source) .html(self.source)
.appendTo(that); .appendTo(that);
function encodeToken(source, type) { function encodeToken(source, token) {
var linebreak = '<br/>', var linebreak = '<br/>',
tab = Ox.repeat('&nbsp;', self.options.tabLength); tab = Ox.repeat('&nbsp;', self.options.tabLength);
if (self.options.showLinebreaks) { if (self.options.showLinebreaks) {
if (type == 'linebreak') { if (token.type == 'linebreak') {
linebreak = '\u21A9' + linebreak; linebreak = '\u21A9' + linebreak;
} else { } else {
linebreak = '<span class="OxLinebreak">\u21A9</span>' + linebreak; linebreak = '<span class="OxLinebreak">\u21A9</span>' + linebreak;
@ -120,11 +121,10 @@ Ox.SyntaxHighlighter = function(options, self) {
if (self.options.showTabs) { if (self.options.showTabs) {
tab = '<span class="OxTab">\u2192' + tab.substr(6) + '</span>'; tab = '<span class="OxTab">\u2192' + tab.substr(6) + '</span>';
} }
source = Ox.encodeHTML(source) return Ox.encodeHTML(source)
.replace(/ /g, '&nbsp;') .replace(/ /g, '&nbsp;')
.replace(/\t/g, tab) .replace(/\t/g, tab)
.replace(/\n/g, linebreak); .replace(/\n/g, linebreak);
return source;
} }
self.setOption = function() { self.setOption = function() {

30
source/Ox.UI/themes/classic/css/classic.css
View file

@ -375,54 +375,54 @@ SyntaxHighlighter
background-color: rgb(224, 224, 224); background-color: rgb(224, 224, 224);
color: rgb(128, 128, 128); color: rgb(128, 128, 128);
} }
.OxThemeClassic .OxSyntaxHighlighter .OxComment { .OxThemeClassic .OxSourceCode .OxComment {
color: rgb(128, 128, 128); color: rgb(128, 128, 128);
font-style: italic; font-style: italic;
} }
.OxThemeClassic .OxSyntaxHighlighter .OxConstant { .OxThemeClassic .OxSourceCode .OxConstant {
color: rgb(128, 0, 0); color: rgb(128, 0, 0);
font-weight: bold; font-weight: bold;
} }
.OxThemeClassic .OxSyntaxHighlighter .OxIdentifier { .OxThemeClassic .OxSourceCode .OxIdentifier {
color: rgb(0, 0, 0); color: rgb(0, 0, 0);
} }
.OxThemeClassic .OxSyntaxHighlighter .OxKeyword { .OxThemeClassic .OxSourceCode .OxKeyword {
color: rgb(0, 0, 128); color: rgb(0, 0, 128);
font-weight: bold; font-weight: bold;
} }
.OxThemeClassic .OxSyntaxHighlighter .OxLinebreak { .OxThemeClassic .OxSourceCode .OxLinebreak {
color: rgb(192, 192, 192); color: rgb(192, 192, 192);
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
.OxThemeClassic .OxSyntaxHighlighter .OxMethod { .OxThemeClassic .OxSourceCode .OxMethod {
color: rgb(0, 128, 128); color: rgb(0, 128, 128);
} }
.OxThemeClassic .OxSyntaxHighlighter .OxNumber { .OxThemeClassic .OxSourceCode .OxNumber {
color: rgb(128, 0, 0); color: rgb(128, 0, 0);
} }
.OxThemeClassic .OxSyntaxHighlighter .OxObject { .OxThemeClassic .OxSourceCode .OxObject {
color: rgb(0, 128, 128); color: rgb(0, 128, 128);
font-weight: bold; font-weight: bold;
} }
.OxThemeClassic .OxSyntaxHighlighter .OxOperator { .OxThemeClassic .OxSourceCode .OxOperator {
color: rgb(0, 0, 128); color: rgb(0, 0, 128);
} }
.OxThemeClassic .OxSyntaxHighlighter .OxProperty { .OxThemeClassic .OxSourceCode .OxProperty {
color: rgb(0, 128, 0); color: rgb(0, 128, 0);
font-weight: bold; font-weight: bold;
} }
.OxThemeClassic .OxSyntaxHighlighter .OxRegexp { .OxThemeClassic .OxSourceCode .OxRegexp {
color: rgb(128, 128, 0); color: rgb(128, 128, 0);
} }
.OxThemeClassic .OxSyntaxHighlighter .OxString { .OxThemeClassic .OxSourceCode .OxString {
color: rgb(0, 128, 0); color: rgb(0, 128, 0);
} }
.OxThemeClassic .OxSyntaxHighlighter .OxTab { .OxThemeClassic .OxSourceCode .OxTab {
color: rgb(192, 192, 192); color: rgb(192, 192, 192);
} }
.OxThemeClassic .OxSyntaxHighlighter .OxWhitespace.OxLeading, .OxThemeClassic .OxSourceCode .OxWhitespace.OxLeading,
.OxThemeClassic .OxSyntaxHighlighter .OxWhitespace.OxTrailing { .OxThemeClassic .OxSourceCode .OxWhitespace.OxTrailing {
background: rgb(255, 128, 128); background: rgb(255, 128, 128);
} }

179
source/Ox.js
View file

@ -1,12 +1,14 @@
// vim: et:ts=4:sw=4:sts=4:ft=js // vim: et:ts=4:sw=4:sts=4:ft=js
// todo: check http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/
// OxJS (c) 2007-2011 Ox2620, dual-licensed (GPL/MIT), see oxjs.org for details
// todo: check http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/
// also see https://github.com/tlrobinson/narwhal/blob/master/lib/util.js // also see https://github.com/tlrobinson/narwhal/blob/master/lib/util.js
/*@ /*@
Ox <f> The Ox object Ox <f> The <code>Ox</code> object
See Ox.wrap for details. See <code>Ox.wrap</code> for details.
(value) -> <o> wrapped value (value) -> <o> wrapped value
value <*> any value value <*> any value
@*/ @*/
@ -51,10 +53,11 @@ Ox.KEYS = {
85: 'u', 86: 'v', 87: 'w', 88: 'x', 89: 'y', 90: 'z', 85: 'u', 86: 'v', 87: 'w', 88: 'x', 89: 'y', 90: 'z',
// fixme: this is usually 91: window.left, 92: window.right, 93: select // fixme: this is usually 91: window.left, 92: window.right, 93: select
91: 'meta.left', 92: 'meta.right', 93: 'meta.right', 91: 'meta.left', 92: 'meta.right', 93: 'meta.right',
96: '0.numpad', 97: '1.numpad', 98: '2.numpad', 99: '3.numpad', 96: '0.numpad', 97: '1.numpad', 98: '2.numpad',
100: '4.numpad', 101: '5.numpad', 102: '6.numpad', 103: '7.numpad', 99: '3.numpad', 100: '4.numpad', 101: '5.numpad',
104: '8.numpad', 105: '9.numpad', 106: 'asterisk.numpad', 107: 'plus.numpad', 102: '6.numpad', 103: '7.numpad', 104: '8.numpad', 105: '9.numpad',
109: 'minus.numpad', 108: 'enter.numpad', 110: 'dot.numpad', 111: 'slash.numpad', 106: 'asterisk.numpad', 107: 'plus.numpad', 109: 'minus.numpad',
108: 'enter.numpad', 110: 'dot.numpad', 111: 'slash.numpad',
112: 'f1', 113: 'f2', 114: 'f3', 115: 'f4', 116: 'f5', 112: 'f1', 113: 'f2', 114: 'f3', 115: 'f4', 116: 'f5',
117: 'f6', 118: 'f7', 119: 'f8', 120: 'f9', 121: 'f10', 117: 'f6', 118: 'f7', 119: 'f8', 120: 'f9', 121: 'f10',
122: 'f11', 123: 'f12', 124: 'f13', 125: 'f14', 126: 'f15', 127: 'f16', 122: 'f11', 123: 'f12', 124: 'f13', 125: 'f14', 126: 'f15', 127: 'f16',
@ -89,7 +92,7 @@ Ox.PATH = Array.prototype.slice.apply(
).filter(function(element) { ).filter(function(element) {
return /Ox\.js$/.test(element.src); return /Ox\.js$/.test(element.src);
})[0].src.replace('Ox.js', ''); })[0].src.replace('Ox.js', '');
//@ Ox.PREFIXES <arr> ['K', 'M', 'G', 'T', 'P'] //@ Ox.PREFIXES <[str]> <code>['K', 'M', 'G', 'T', 'P']</code>
Ox.PREFIXES = ['K', 'M', 'G', 'T', 'P']; Ox.PREFIXES = ['K', 'M', 'G', 'T', 'P'];
//@ Ox.SYMBOLS <obj> Unicode characters for symbols //@ Ox.SYMBOLS <obj> Unicode characters for symbols
Ox.SYMBOLS = { Ox.SYMBOLS = {
@ -117,7 +120,7 @@ Ox.SYMBOLS = {
CLOSE: '\u2715', BALLOT: '\u2717', WINDOWS: '\u2756', CLOSE: '\u2715', BALLOT: '\u2717', WINDOWS: '\u2756',
EDIT: '\uF802', CLICK: '\uF803', APPLE: '\uF8FF' EDIT: '\uF802', CLICK: '\uF803', APPLE: '\uF8FF'
}; };
//@ Ox.TYPES <[str]> list of types, as returned by Ox.type() //@ Ox.TYPES <[str]> list of types, as returned by <code>Ox.type()</code>
Ox.TYPES = [ Ox.TYPES = [
'Arguments', 'Array', 'Boolean', 'Date', 'Element', 'Function', 'Infinity', 'Arguments', 'Array', 'Boolean', 'Date', 'Element', 'Function', 'Infinity',
'NaN', 'Null', 'Number', 'Object', 'RegExp', 'String', 'Undefined' 'NaN', 'Null', 'Number', 'Object', 'RegExp', 'String', 'Undefined'
@ -143,13 +146,13 @@ Core functions
Ox.doc <f> Generates documentation for annotated JavaScript Ox.doc <f> Generates documentation for annotated JavaScript
(source) <a> Array of documentation objects (source) <a> Array of documentation objects
source <s> JavaScript source code source <s> JavaScript source code
> Ox.doc("//@ Ox.foo <s> bar") > Ox.doc("//@ Ox.foo <string> just some string")
[{"name": "Ox.foo", "summary": "bar", "type": "string"}] [{"name": "Ox.foo", "summary": "just some string", "type": "string"}]
@*/ @*/
Ox.doc = (function() { Ox.doc = (function() {
var re = { var re = {
item: /^(.+) <(.+)> (.+)$/, item: /^(.+?) <(.+?)> (.+)$/,
multiline: /^\/\*\@.*?\n([\w\W]+)\n.*?\@\*\/$/, multiline: /^\/\*\@.*?\n([\w\W]+)\n.*?\@\*\/$/,
script: /\n(\s*<script>s*\n[\w\W]+\n\s*<\/script>s*)/g, script: /\n(\s*<script>s*\n[\w\W]+\n\s*<\/script>s*)/g,
singleline: /^\/\/@\s*(.*?)\s*$/, singleline: /^\/\/@\s*(.*?)\s*$/,
@ -157,29 +160,47 @@ Ox.doc = (function() {
usage: /\(.*?\)/ usage: /\(.*?\)/
}, },
types = { types = {
b: 'boolean', d: 'date', e: 'element', a: 'array', b: 'boolean', d: 'date',
f: 'function', n: 'number', o: 'object', e: 'element', f: 'function', n: 'number',
r: 'regexp', s: 'string', u: 'undefined', o: 'object', r: 'regexp', s: 'string',
'*': 'any', '!': 'event' u: 'undefined', '*': 'any', '!': 'event'
} }
return function(source) { return function(source) {
var blocks = [],
items = [],
tokens = [];
Ox.tokenize(source).forEach(function(token) {
var match;
token.source = source.substr(token.offset, token.length);
if (token.type == 'comment' && (match =
re.multiline(token.source) || re.singleline(token.source)
)) {
blocks.push(match[1]);
tokens.push([]);
} else if (tokens.length) {
tokens[tokens.length - 1].push(token);
}
});
/*
var blocks = Ox.map(Ox.tokenize(source), function(token) { var blocks = Ox.map(Ox.tokenize(source), function(token) {
// filter out tokens that are not comments // filter out tokens that are not comments
// or don't match the doc comment pattern // or don't match the doc comment pattern
var match; var match;
token.source = source.substr(token.offset, token.length);
return token.type == 'comment' && (match = return token.type == 'comment' && (match =
re.multiline(token.source) || re.singleline(token.source) re.multiline(token.source) || re.singleline(token.source)
) ? match[1] : null; ) ? match[1] : null;
}), }),
items = []; items = [];
blocks.forEach(function(block) { */
blocks.forEach(function(block, i) {
var item, lastItem, var item, lastItem,
lines = block lines = block
.replace(re.script, encodeLinebreaks) .replace(re.script, encodeLinebreaks)
.replace(re.test, encodeLinebreaks) .replace(re.test, encodeLinebreaks)
.split('\n'); .split('\n');
// create a tree and parse its root node // create a tree and parse its root node
item = parseNode(parseTree(lines)); item = Ox.extend(parseNode(parseTree(lines)), {source: tokens[i]});
if (/^[A-Z]/.test(item.name)) { if (/^[A-Z]/.test(item.name)) {
items.push(item); items.push(item);
} else { } else {
@ -266,7 +287,8 @@ Ox.doc = (function() {
var lines = decodeLinebreaks(str).split('\n'); var lines = decodeLinebreaks(str).split('\n');
return { return {
statement: lines[0].substr(2), statement: lines[0].substr(2),
result: JSON.parse(lines[1].trim()) // result: JSON.parse(lines[1].trim())
result: lines[1].trim()
}; };
} }
function parseTree(lines) { function parseTree(lines) {
@ -332,7 +354,7 @@ Ox.doc = (function() {
str = str.substr(1, str.length - 2) : str; str = str.substr(1, str.length - 2) : str;
} }
function wrap(str) { function wrap(str) {
return isArray ? 'array[' + str + 's]' : str; return isArray ? '[' + str + ']' : str;
} }
return ret; return ret;
} }
@ -375,7 +397,7 @@ Ox.getset <f> Generic getter and setter function
for every key/value pair that was added or modified for every key/value pair that was added or modified
# Arguments ---------------------------------------------------------------- # Arguments ----------------------------------------------------------------
options <obj> Options object (key/value pairs) options <obj> Options object (key/value pairs)
args <[*]> The arguments "array" of the caller function args <arr> The arguments "array" of the caller function
callback <fun> Callback function callback <fun> Callback function
The callback is called for every key/value pair that was added or The callback is called for every key/value pair that was added or
modified. modified.
@ -530,15 +552,13 @@ Ox.print <f> Prints its arguments to the console
@*/ @*/
Ox.print = function() { Ox.print = function() {
if (window.console) { var args = Ox.makeArray(arguments),
var args = Ox.makeArray(arguments), date = new Date();
date = new Date(); args.unshift(
args.unshift( Ox.formatDate(date, '%H:%M:%S.') + (+date).toString().substr(-3),
Ox.formatDate(date, '%H:%M:%S.') + (+date).toString().substr(-3), arguments.callee.caller.name || '(anonymous)'
arguments.callee.caller.name || '(anonymous)' );
); window.console && window.console.log.apply(window.console, args);
window.console.log.apply(window.console, args);
}
return args.join(' '); return args.join(' ');
}; };
@ -601,14 +621,16 @@ Array and Object functions
================================================================================ ================================================================================
*/ */
Ox.avg = function(obj) { /*@
/*** Ox.avg <f> returns the average of an array's values, or an object's properties
returns the average of an array's values, or an object's properties (collection) -> <n> average
>>> Ox.avg([-1, 0, 1]) collection <[n]|o> An array or object with numerical values
> Ox.avg([-1, 0, 1])
0 0
>>> Ox.avg({a: 1, b: 2, c: 3}) > Ox.avg({a: 1, b: 2, c: 3})
2 2
***/ @*/
Ox.avg = function(obj) {
return Ox.sum(obj) / Ox.len(obj); return Ox.sum(obj) / Ox.len(obj);
}; };
@ -764,6 +786,20 @@ Ox.flatten = function(arr) {
return ret; return ret;
} }
/*@
Ox.forEach <f> forEach loop
<code>Ox.forEach()</code> loops over arrays, objects and strings.
Returning <code>false</code> from the iterator function acts like a
<code>break</code> statement (unlike <code>[].forEach()</code>, like
<code>$.each()</code>). The arguments of the iterator function are
<code>(value, key)</code> (like <code>[].forEach()</code>, unlike
<code>$.each()</code>).
(collection, callback) <a|o|s> The collection
collection <a|o|s> An array, object or string
callback <f> Callback function
value <*> Value
key <n|s> Key
@*/
Ox.forEach = function(obj, fn) { Ox.forEach = function(obj, fn) {
/* /*
Ox.forEach() works for arrays, objects and strings, Ox.forEach() works for arrays, objects and strings,
@ -1238,15 +1274,18 @@ Color functions
================================================================================ ================================================================================
*/ */
Ox.hsl = function(rgb) { /*@
/* Ox.hsl <f> Takes RGB values and returns HSL values
>>> Ox.hsl([0, 0, 0]) (rgb) <[n]> HSL values
rgb <[n]> RGB values
> Ox.hsl([0, 0, 0])
[0, 0, 0] [0, 0, 0]
>>> Ox.hsl([255, 255, 255]) > Ox.hsl([255, 255, 255])
[0, 0, 1] [0, 0, 1]
>>> Ox.hsl([0, 255, 0]) > Ox.hsl([0, 255, 0])
[120, 1, 0.5] [120, 1, 0.5]
*/ @*/
Ox.hsl = function(rgb) {
rgb = rgb.map(function(v) { rgb = rgb.map(function(v) {
return v / 255; return v / 255;
}); });
@ -1274,15 +1313,19 @@ Ox.hsl = function(rgb) {
return hsl; return hsl;
}; };
Ox.rgb = function(hsl) { /*@
/* Ox.rgb <f> Takes HSL values and returns RGB values
>>> Ox.rgb([0, 0, 0]) (hsl) <[n]> RGB values
hsl <[n]> HSL values
> Ox.rgb([0, 0, 0])
[0, 0, 0] [0, 0, 0]
>>> Ox.rgb([0, 0, 1]) > Ox.rgb([0, 0, 1])
[255, 255, 255] [255, 255, 255]
>>> Ox.rgb([120, 1, 0.5]) > Ox.rgb([120, 1, 0.5])
[0, 255, 0] [0, 255, 0]
*/ @*/
Ox.rgb = function(hsl) {
hsl[0] /= 360; hsl[0] /= 360;
var rgb = [0, 0, 0], var rgb = [0, 0, 0],
v1, v2, v3; v1, v2, v3;
@ -1328,11 +1371,11 @@ Date functions
Ox.getDateInWeek <f> Get the date that falls on a given weekday in the same week Ox.getDateInWeek <f> Get the date that falls on a given weekday in the same week
# Usage # Usage
(date, weekday) -> <dat> Date (date, weekday) -> <dat> Date
(date, weekday, utc) -> <dat> UTC Date (date, weekday, utc) -> <dat> Date
# Arguments # Arguments
date <d> Date date <d> Date
weekday <n|s> 1-7 (Monday-Sunday) or name, full ("Monday") or short ("Sun") weekday <n|s> 1-7 (Monday-Sunday) or name, full ("Monday") or short ("Sun")
utc <b> if true, all dates are UTC utc <b> If true, all dates are UTC
# Examples # Examples
> Ox.formatDate(Ox.getDateInWeek(new Date("January 1 2000"), "Sunday"), "%A, %B %e, %Y") > Ox.formatDate(Ox.getDateInWeek(new Date("January 1 2000"), "Sunday"), "%A, %B %e, %Y")
"Sunday, January 2, 2000" "Sunday, January 2, 2000"
@ -1356,15 +1399,24 @@ Ox.getDateInWeek = function(date, weekday, utc) {
return Ox.setDate(date, Ox.getDate(date, utc) - sourceWeekday + targetWeekday, utc); return Ox.setDate(date, Ox.getDate(date, utc) - sourceWeekday + targetWeekday, utc);
} }
Ox.getDayOfTheYear = function(date, utc) { /*@
/* Ox.getDayOfTheYear <f> Get the day of the year for a given date
>>> Ox.getDayOfTheYear(new Date("12/31/2000")) # Usage
(date) -> <d> Date
(date, utc) -> <d> Date
# Arguments
date <d> Date
utc <b> If true, all dates are UTC
# Examples
> Ox.getDayOfTheYear(new Date("12/31/2000"))
366 366
>>> Ox.getDayOfTheYear(new Date("12/31/2002")) > Ox.getDayOfTheYear(new Date("12/31/2002"))
365 365
>>> Ox.getDayOfTheYear(new Date("12/31/2004")) > Ox.getDayOfTheYear(new Date("12/31/2004"))
366 366
*/ @*/
Ox.getDayOfTheYear = function(date, utc) {
date = Ox.makeDate(date); date = Ox.makeDate(date);
var month = Ox.getMonth(date, utc), var month = Ox.getMonth(date, utc),
year = Ox.getFullYear(date, utc); year = Ox.getFullYear(date, utc);
@ -1607,7 +1659,7 @@ Ox.documentReady = (function() {
}()); }());
/*@ /*@
Ox.Element <f> Generic HTML element, mimics jQuery Ox.element <f> Generic HTML element, mimics jQuery
(str) -> <o> Element object (str) -> <o> Element object
str <s> Tagname ('<tagname>') or selector ('tagname', '.classname', '#id') str <s> Tagname ('<tagname>') or selector ('tagname', '.classname', '#id')
> Ox.element("<div>").addClass("red").addClass("red")[0].classname > Ox.element("<div>").addClass("red").addClass("red")[0].classname
@ -1638,7 +1690,7 @@ Ox.element = function(str) {
return this; return this;
}, },
/*@ /*@
append() <f> Appends another element to this element append <f> Appends another element to this element
(element) -> <o> This element (element) -> <o> This element
element <o> Another element element <o> Another element
@*/ @*/
@ -2751,7 +2803,7 @@ Ox.parseHTML = (function() {
return function(html, tags, wikilinks) { return function(html, tags, wikilinks) {
var matches = [], var matches = [],
tags = tags || defaultTags; tags = tags || defaultTags;
html = Ox.clean(html); // html = Ox.clean(html); fixme: can this be a parameter?
if (tags.indexOf('[]') > -1) { if (tags.indexOf('[]') > -1) {
html = html.replace(/\[(https?:\/\/.+?) (.+?)\]/gi, '<a href="$1">$2</a>'); html = html.replace(/\[(https?:\/\/.+?) (.+?)\]/gi, '<a href="$1">$2</a>');
tags = tags.filter(function(tag) { tags = tags.filter(function(tag) {
@ -3374,7 +3426,8 @@ Ox.tokenize = (function() {
} }
tokenize[type](); tokenize[type]();
tokens.push({ tokens.push({
source: source.substr(start, cursor - start), length: cursor - start,
offset: start,
type: type, type: type,
}); });
} }