forked from 0x2620/oxjs
rename Ox.UI source files, remove Ox. prefix
This commit is contained in:
j
parent
005d50c389
commit
91e1065aab
101 changed files with 0 additions and 0 deletions
195
source/Ox.UI/js/Code/DocPanel.js
Normal file
195
source/Ox.UI/js/Code/DocPanel.js
Normal file
|
|
@ -0,0 +1,195 @@
|
|||
'use strict';
|
||||
|
||||
/*@
|
||||
Ox.DocPanel <f:Ox.Element> Documentation Panel
|
||||
() -> <f> Documentation Panel
|
||||
(options) -> <f> Documentation Panel
|
||||
(options, self) -> <f> Documentation Panel
|
||||
options <o> Options object
|
||||
collapsible <b|false> If true, the list can be collabsed
|
||||
element <e> Default content
|
||||
files <a|[]> Files to parse for docs
|
||||
getModule <f> Returns module for given item
|
||||
getSection <f> Returns section for given item
|
||||
items <a|[]> Array of doc items (alternative to files options)
|
||||
path <s|''> Path prefix
|
||||
replace <[[]]|[]> See Ox.SyntaxHighlighter
|
||||
resizable <b|true> If true, list is resizable
|
||||
resize <a|[128, 256, 384]> List resize positions
|
||||
size <s|256> Default list size
|
||||
self <o> Shared private variable
|
||||
load <!> Fires once all docs are loaded
|
||||
items [o] Array of doc items
|
||||
@*/
|
||||
|
||||
Ox.DocPanel = function(options, self) {
|
||||
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
collapsible: false,
|
||||
element: '',
|
||||
files: [],
|
||||
getModule: function(item) {
|
||||
return item.file.replace(self.options.path, '');
|
||||
},
|
||||
getSection: function(item) {
|
||||
return item.section;
|
||||
},
|
||||
items: [],
|
||||
path: '',
|
||||
replace: [],
|
||||
resizable: false,
|
||||
resize: [128, 256, 384],
|
||||
selected: '',
|
||||
size: 256
|
||||
})
|
||||
.options(options || {})
|
||||
.update({
|
||||
selected: function() {
|
||||
selectItem(self.options.selected);
|
||||
}
|
||||
});
|
||||
|
||||
self.$list = Ox.Element();
|
||||
self.$page = Ox.Element();
|
||||
|
||||
that.setElement(
|
||||
self.$panel = 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'
|
||||
})
|
||||
);
|
||||
|
||||
if (self.options.files) {
|
||||
self.options.items = Ox.doc(self.options.files.map(function(file) {
|
||||
return self.options.path + file;
|
||||
}), function(docItems) {
|
||||
self.options.items = docItems;
|
||||
renderList();
|
||||
that.triggerEvent('load', {items: docItems});
|
||||
});
|
||||
} else {
|
||||
renderList();
|
||||
}
|
||||
|
||||
function parseFiles(callback) {
|
||||
var counter = 0,
|
||||
docItems = [],
|
||||
length = self.options.files.length;
|
||||
self.options.files.forEach(function(file) {
|
||||
Ox.doc(self.options.path + file, function(fileItems) {
|
||||
docItems = docItems.concat(fileItems);
|
||||
++counter == length && callback(docItems);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function renderList() {
|
||||
var treeItems = [];
|
||||
self.options.items.forEach(function(docItem) {
|
||||
var moduleIndex, sectionIndex;
|
||||
docItem.module = self.options.getModule(docItem);
|
||||
moduleIndex = Ox.getIndexById(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.getIndexById(
|
||||
treeItems[moduleIndex].items,
|
||||
'_' + docItem.module + '_' + docItem.section
|
||||
);
|
||||
if (sectionIndex == -1) {
|
||||
treeItems[moduleIndex].items.push({
|
||||
id: '_' + docItem.module + '_' + 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
|
||||
});
|
||||
});
|
||||
treeItems.sort(sortByTitle);
|
||||
treeItems.forEach(function(item) {
|
||||
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] : '')
|
||||
}
|
||||
});
|
||||
that.$element.replaceElement(0, self.$list);
|
||||
selectItem(self.options.selected);
|
||||
}
|
||||
|
||||
function getItemByName(name) {
|
||||
var item = {};
|
||||
Ox.forEach(self.options.items, function(v) {
|
||||
if (v.name == name) {
|
||||
item = v;
|
||||
Ox.Break();
|
||||
}
|
||||
});
|
||||
return item;
|
||||
}
|
||||
|
||||
function selectItem(id) {
|
||||
if (id) {
|
||||
self.options.selected = id;
|
||||
if (self.options.selected[0] != '_') {
|
||||
self.$list.options({selected: [id]});
|
||||
self.$page = Ox.DocPage({
|
||||
item: getItemByName(self.options.selected),
|
||||
replace: self.options.replace
|
||||
});
|
||||
that.$element.replaceElement(1, self.$page);
|
||||
that.triggerEvent('select', {id: self.options.selected});
|
||||
}
|
||||
} else {
|
||||
self.$page.empty().append(self.options.element);
|
||||
}
|
||||
}
|
||||
|
||||
function sortByTitle(a, b) {
|
||||
return a.title < b.title ? -1
|
||||
: a.title > b.title ? 1
|
||||
: 0;
|
||||
}
|
||||
|
||||
return that;
|
||||
|
||||
};
|
||||
Loading…
Add table
Add a link
Reference in a new issue