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

faster doc panel: allow for caching of doc items

Browse source
This commit is contained in:
rolux 2012-04-09 10:39:56 +02:00
parent 1651b3f565
commit ffa8f1738a
1 changed files with 85 additions and 93 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

178
source/Ox.UI/js/Code/Ox.DocPanel.js
View file

@ -6,18 +6,20 @@ Ox.DocPanel <f> Documentation Panel
(options) -> <f> Documentation Panel (options) -> <f> Documentation Panel
(options, self) -> <f> Documentation Panel (options, self) -> <f> Documentation Panel
options <o> Options object options <o> Options object
collapsible <b|true> can be collabsed collapsible <b|false> If true, the list can be collabsed
element <e> Default content element <e> Default content
files <a|[]> files to parse for docs files <a|[]> Files to parse for docs
getModule <f> returns module for given item getModule <f> Returns module for given item
getSection <f> returns section for given item getSection <f> Returns section for given item
path <s|''> path prefix items <a|[]> Array of doc items (alternative to files options)
path <s|''> Path prefix
replace <[[]]|[]> See Ox.SyntaxHighlighter replace <[[]]|[]> See Ox.SyntaxHighlighter
resizable <b|true> is resizable resizable <b|true> If true, list is resizable
resize <a|[128, 256, 384]> resize positions resize <a|[128, 256, 384]> List resize positions
size <s|256> default size size <s|256> Default list size
self <o> shared private variable self <o> Shared private variable
load <!> fired once all docs are loaded load <!> Fires once all docs are loaded
items [o] Array of doc items
@*/ @*/
Ox.DocPanel = function(options, self) { Ox.DocPanel = function(options, self) {
@ -34,6 +36,7 @@ Ox.DocPanel = function(options, self) {
getSection: function(item) { getSection: function(item) {
return item.section; return item.section;
}, },
items: [],
path: '', path: '',
replace: [], replace: [],
resizable: false, resizable: false,
@ -44,8 +47,7 @@ Ox.DocPanel = function(options, self) {
.options(options || {}); .options(options || {});
self.$list = Ox.Element(); self.$list = Ox.Element();
self.$page = Ox.Element().addClass('OxDocument').append(self.options.element); self.$page = Ox.Element().append(self.options.element);
Ox.print('ELEMENT', self.options.element)
that.setElement( that.setElement(
self.$panel = Ox.SplitPanel({ self.$panel = Ox.SplitPanel({
@ -65,98 +67,93 @@ Ox.DocPanel = function(options, self) {
}) })
); );
loadList(function(docItems) { if (self.options.files) {
self.items = docItems; self.options.items = Ox.doc(self.options.files.map(function(file) {
self.options.selected && selectItem(self.options.selected); return self.options.path + file;
that.triggerEvent('load', {}); }), function(docItems) {
}); self.options.items = docItems;
renderList();
function loadList(callback) { that.triggerEvent('load', {items: docItems});
});
} else {
renderList();
}
function parseFiles(callback) {
var counter = 0, var counter = 0,
docItems = [], docItems = [],
length = self.options.files.length; length = self.options.files.length;
self.options.files.forEach(function(file) { self.options.files.forEach(function(file) {
Ox.doc(self.options.path + file, function(fileItems) { Ox.doc(self.options.path + file, function(fileItems) {
docItems = Ox.merge(docItems, fileItems); docItems = Ox.merge(docItems, fileItems);
if (++counter == length) { ++counter == length && callback(docItems);
makeTree(docItems);
callback(docItems);
}
}); });
}); });
}
function makeTree(docItems) { function renderList() {
var treeItems = []; var treeItems = [];
docItems.forEach(function(docItem) { self.options.items.forEach(function(docItem) {
var moduleIndex, sectionIndex; var moduleIndex, sectionIndex;
docItem.module = self.options.getModule(docItem); docItem.module = self.options.getModule(docItem);
moduleIndex = Ox.getIndexById(treeItems, '_' + docItem.module); moduleIndex = Ox.getIndexById(treeItems, '_' + docItem.module);
if (moduleIndex == -1) { if (moduleIndex == -1) {
treeItems.push({ treeItems.push({
id: '_' + docItem.module, id: '_' + docItem.module,
items: [],
title: docItem.module
});
moduleIndex = treeItems.length - 1;
}
docItem.section = self.options.getSection(docItem);
if (docItem.section) {
sectionIndex = Ox.getIndexById(
treeItems[moduleIndex].items,
'_' + docItem.module + '_' + docItem.section
);
if (sectionIndex == -1) {
treeItems[moduleIndex].items.push({
id: '_' + docItem.module + '_' + docItem.section,
items: [], items: [],
title: docItem.module title: docItem.section
}); });
moduleIndex = treeItems.length - 1; sectionIndex = treeItems[moduleIndex].items.length - 1;
} }
docItem.section = self.options.getSection(docItem); }
if (docItem.section) { (
sectionIndex = Ox.getIndexById( docItem.section
treeItems[moduleIndex].items, ? treeItems[moduleIndex].items[sectionIndex]
'_' + docItem.module + '_' + docItem.section : treeItems[moduleIndex]
); ).items.push({
if (sectionIndex == -1) { id: docItem.name,
treeItems[moduleIndex].items.push({ title: docItem.name
id: '_' + docItem.module + '_' + docItem.section, });
items: [], });
title: docItem.section treeItems.sort(sortByTitle);
}); treeItems.forEach(function(item) {
sectionIndex = treeItems[moduleIndex].items.length - 1; item.items.sort(sortByTitle);
} item.items.forEach(function(subitem) {
subitem.items.sort(sortByTitle);
});
});
self.$list = Ox.TreeList({
items: treeItems,
selected: self.options.selected
? [self.options.selected] : '',
width: self.options.size - Ox.UI.SCROLLBAR_SIZE
})
.bindEvent({
select: function(data) {
selectItem(data.ids.length ? data.ids[0] : '')
} }
(
docItem.section
? treeItems[moduleIndex].items[sectionIndex]
: treeItems[moduleIndex]
).items.push({
id: docItem.name,
title: docItem.name
});
}); });
treeItems.sort(sortByTitle); that.$element.replaceElement(0, self.$list);
treeItems.forEach(function(item) { selectItem(self.options.selected);
item.items.sort(sortByTitle);
item.items.forEach(function(subitem) {
subitem.items.sort(sortByTitle);
});
});
self.$list = Ox.TreeList({
items: treeItems,
selected: self.options.selected
? [self.options.selected] : '',
width: self.options.size - Ox.UI.SCROLLBAR_SIZE
})
.bindEvent({
select: function(data) {
selectItem(data.ids.length ? data.ids[0] : '')
}
});
// fixme
/*
var $foo = Ox.Container();
self.$list.appendTo($foo);
that.$element.replaceElement(0, $foo);
*/
that.$element.replaceElement(0, self.$list);
}
} }
function getItemByName(name) { function getItemByName(name) {
var item = {}; var item = {};
Ox.forEach(self.items, function(v) { Ox.forEach(self.options.items, function(v) {
if (v.name == name) { if (v.name == name) {
item = v; item = v;
return false; return false;
@ -170,7 +167,6 @@ Ox.DocPanel = function(options, self) {
self.options.selected = id; self.options.selected = id;
if (self.options.selected[0] != '_') { if (self.options.selected[0] != '_') {
self.$list.options({selected: [id]}); self.$list.options({selected: [id]});
Ox.print('OVERWRITTING')
self.$page = Ox.DocPage({ self.$page = Ox.DocPage({
item: getItemByName(self.options.selected), item: getItemByName(self.options.selected),
replace: self.options.replace replace: self.options.replace
@ -182,13 +178,9 @@ Ox.DocPanel = function(options, self) {
} }
function sortByTitle(a, b) { function sortByTitle(a, b) {
var ret = 0; return a.title < b.title ? -1
if (a.title < b.title) { : a.title > b.title ? 1
ret = -1; : 0;
} else if (a.title > b.title) {
ret = 1;
}
return ret;
} }
self.setOption = function(key, value) { self.setOption = function(key, value) {