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

add documentation browser (Ox.DocPanel, demo, more documentation)

Browse source
This commit is contained in:
rolux 2011-05-07 17:56:29 +02:00
parent 16dce2e517
commit 698d57abb0
11 changed files with 1610 additions and 1179 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
demos/doc/deleteme.html
View file

@ -1,18 +0,0 @@
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="../../build/Ox.js"></script>
<script>
var element = document.createElement('script');
element.src = '../../build/Ox.UI/js/Map/Ox.Map.js';
element.type = 'text/javascript';
document.head.appendChild(element);
</script>
<script>
Ox.documentReady(function() {
Ox.print(Ox.Map)
})
</script>
</head>
<body></body>
<html>

13
demos/doc/js/doc.js
View file

@ -3,19 +3,26 @@ Ox.load('UI', {
theme: 'classic'
}, function() {
Ox.Theme('classic');
Ox.doc('../../build/Ox.js', function(items) {
items.forEach(function(item) {
Ox.DocPage({doc: item}).appendTo(Ox.UI.$body);
});
});
return;
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);
});
Ox.print('TEST', Ox.test(source))
});
*/
Ox.print('TEST', Ox.test(source))
// */
});
});

10
demos/doc2/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>

19
demos/doc2/js/doc.js Normal file
View file

@ -0,0 +1,19 @@
Ox.load('UI', {
debug: true,
theme: 'classic'
}, function() {
Ox.Theme('classic');
Ox.DocPanel({
files: ['Ox.js', 'Ox.UI/js/Map/Ox.Map.js'],
getModule: function(item) {
var file = item.file.replace(Ox.PATH, '');
return file == 'Ox.js' ? 'Ox' : file.split('/')[0];
},
getSection: function(item) {
var file = item.file.replace(Ox.PATH, '');
return item.section || file.split('/')[2];
},
path: Ox.PATH
})
.appendTo(Ox.UI.$body);
});

2
source/Ox.Geo/Ox.Geo.js
View file

@ -1,6 +1,6 @@
Ox.load.Geo = function(options, callback) {
Ox.loadJSON(Ox.PATH + 'Ox.Geo/Ox.Geo.json', function(data) {
Ox.getJSON(Ox.PATH + 'Ox.Geo/json/Ox.Geo.json', function(data) {
Ox.COUNTRIES = data;

5
source/Ox.UI/Ox.UI.js
View file

@ -41,6 +41,8 @@ Ox.load.UI = function(options, callback) {
});
Ox.documentReady(function() {
Ox.element('body')
.addClass('OxTheme' + Ox.toTitleCase(options.theme || 'classic'));
options.showScreen && showScreen();
});
@ -48,8 +50,7 @@ Ox.load.UI = function(options, callback) {
function showScreen() {
var body = Ox.element('body')
.addClass('OxTheme' + Ox.toTitleCase(options.theme)),
var body = Ox.element('body'),
css = {
position: 'absolute',
left: 0,

25
source/Ox.UI/js/Core/Ox.DocPage.js
View file

@ -3,30 +3,29 @@ Ox.DocPage = function(options, self) {
self = self || {};
var that = Ox.Element({}, self)
.defaults({
doc: ''
item: {}
})
.options(options || {})
.addClass('OxText')
.css({
width: '640px',
height: '400px',
overflow: 'auto'
});
$('body').css('overflowY', 'scroll')
Ox.print('-------------------item', self.options.item)
that.append($('<h1>').append('<code>' + self.options.doc.name + '</code>'));
that.append($('<h1>').append('<code>' + self.options.item.name + '</code>'));
getItem(self.options.doc, 0, '').forEach(function($element) {
getItem(self.options.item, 0).forEach(function($element) {
that.append($element);
})
});
function getItem(item, level) {
function getItem(item, level, name) {
var $elements = [$('<div>')
.css({paddingLeft: ((level * 32) + 'px')})
.html(
'<code><b>' + item.name + '</b> ' +
'<code><b>' + (name || item.name) + '</b> ' +
'&lt;' + item.types.join('&gt;</code> or <code>&lt;') + '&gt; </code>' +
(item.default ? 'default: <code>' + item.default + ' </code>' : '') +
Ox.parseHTML(item.summary)
)
];
@ -89,7 +88,6 @@ Ox.DocPage = function(options, self) {
.html(
'<code><b>&gt;&nbsp;' +
Ox.encodeHTML(example.statement)
//example.statement
.replace(/ /g, '&nbsp;')
.replace(/\n/g, '<br/>\n&nbsp;&nbsp;') +
'</b></code>'
@ -120,12 +118,11 @@ Ox.DocPage = function(options, self) {
);
} else {
item[section].forEach(function(v) {
if (section == 'usage') {
v.name = item.name + v.name + ' </b></code>returns<code> <b>';
}
var name = section == 'usage' ?
item.name + v.name + ' </b></code>returns<code> <b>' : null;
$elements = Ox.merge(
$elements,
Ox.map(getItem(v, level + 1), function($element) {
Ox.map(getItem(v, level + 1, name), function($element) {
return $element.addClass(className);
})
);

132
source/Ox.UI/js/Core/Ox.DocPanel.js Normal file
View file

@ -0,0 +1,132 @@
/*@
Ox.DocPanel <f> Documentation Panel
@*/
Ox.DocPanel = function(options, self) {
self = self || {};
var that = Ox.Element({}, self)
.defaults({
collapsible: true,
files: [],
getModule: function(item) {
return item.file.replace(self.options.path, '');
},
getSection: function(item) {
return item.section;
},
path: '',
resizable: true,
resize: [128, 256, 384],
size: 256
})
.options(options || {});
self.$list = Ox.Element();
self.$page = Ox.Element();
that.$element = Ox.SplitPanel({
elements: [
{
collapsible: self.options.collapsible,
element: self.$list,
resizable: self.options.resizable,
resize: self.options.resize,
size: self.options.size
},
{
element: self.$page
}
],
orientation: 'horizontal'
});
loadList(function(docItems) {
self.items = docItems;
});
function loadList(callback) {
var counter = 0,
length = self.options.files.length;
docItems = [];
self.options.files.forEach(function(file) {
Ox.doc(self.options.path + file, function(fileItems) {
docItems = Ox.merge(docItems, fileItems);
if (++counter == length) {
makeTree(docItems);
callback(docItems);
}
});
});
function makeTree(docItems) {
var treeItems = [];
docItems.forEach(function(docItem) {
var moduleIndex, sectionIndex;
docItem.module = self.options.getModule(docItem);
moduleIndex = Ox.getPositionById(treeItems, '_' + docItem.module);
if (moduleIndex == -1) {
treeItems.push({
id: '_' + docItem.module,
items: [],
title: docItem.module
});
moduleIndex = treeItems.length - 1;
}
docItem.section = self.options.getSection(docItem);
if (docItem.section) {
sectionIndex = Ox.getPositionById(
treeItems[moduleIndex].items, '_' + docItem.section
);
if (sectionIndex == -1) {
treeItems[moduleIndex].items.push({
id: '_' + docItem.section,
items: [],
title: docItem.section
});
sectionIndex = treeItems[moduleIndex].items.length - 1;
}
}
(
docItem.section ?
treeItems[moduleIndex].items[sectionIndex] :
treeItems[moduleIndex]
).items.push({
id: docItem.name,
title: docItem.name
});
});
self.$list = Ox.TreeList({
items: treeItems,
width: self.options.width
})
.bindEvent({
select: selectItem
});
that.$element.replaceElement(0, self.$list);
}
}
function getItemByName(name) {
var item = {};
Ox.forEach(self.items, function(v) {
if (v.name == name) {
item = v;
return false;
}
});
return item;
}
function selectItem(data) {
var selected = data.ids[0];
if (selected[0] != '_') {
self.$page = Ox.DocPage({
item: getItemByName(selected)
});
that.$element.replaceElement(1, self.$page);
}
}
return that;
};

1
source/Ox.UI/js/Core/Ox.Theme.js
View file

@ -22,7 +22,6 @@ Ox.Theme = function(theme) {
return false;
}
});
Ox.print('getTheme', theme)
return theme;
}

15
source/Ox.UI/js/List/Ox.TreeList.js
View file

@ -156,7 +156,7 @@ Ox.TreeList = function(options, self) {
}
function toggleItem(item, expanded) {
var $img, $item, pos;
var $img, pos;
item.expanded = expanded;
$.each(that.$element.find('.OxItem'), function(i, v) {
var $item = $(v);
@ -166,12 +166,23 @@ Ox.TreeList = function(options, self) {
return false;
}
});
Ox.print('i.e', item.expanded)
Ox.print('i.e', item.expanded, $img, $img.attr('src'));
// FIXME: why does this not work??
///*
$img.attr({
src: Ox.UI.getImagePath(
'symbol' + (item.expanded ? 'Down' : 'Right') + '.svg'
)
});
//*/
/*
Ox.print($img.attr('src'))
$img.attr({
src: $img.attr('src') == Ox.UI.getImagePath('symbolDown.svg') ?
Ox.UI.getImagePath('symbolRight.svg') :
Ox.UI.getImagePath('symbolDown.svg')
});
*/
item.expanded ?
that.$element.addItems(pos + 1, parseItems(item.items, item.level + 1)) :
that.$element.removeItems(pos + 1, parseItems(item.items, item.level + 1).length);

2549
source/Ox.js
View file

File diff suppressed because it is too large Load diff