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

DocPanel: add loading indication

Browse source
This commit is contained in:
rolux 2012-07-03 23:41:11 +02:00
parent a150457748
commit 6d2b95e943
1 changed files with 43 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -23,6 +23,7 @@ Ox.DocPanel <f> Documentation Panel
resize <a|[128, 256, 384]> List resize positions resize <a|[128, 256, 384]> List resize positions
runTests <b|false> If true, run tests runTests <b|false> If true, run tests
selected <s|''> Id of the selected item selected <s|''> Id of the selected item
showLoading <b|false> If true, show loading icon when parsing files
showTests <b|false> If true, show test results in list showTests <b|false> If true, show test results in list
showTooltips <b|false> If true, show test result tooltips in list showTooltips <b|false> If true, show test result tooltips in list
size <s|256> Default list size size <s|256> Default list size
@ -56,6 +57,7 @@ Ox.DocPanel = function(options, self) {
results: null, results: null,
runTests: false, runTests: false,
selected: '', selected: '',
showLoading: false,
showTests: false, showTests: false,
showTooltips: false, showTooltips: false,
size: 256, size: 256,
@ -112,16 +114,20 @@ Ox.DocPanel = function(options, self) {
); );
if (self.options.files && self.options.files.length) { if (self.options.files && self.options.files.length) {
self.options.files = Ox.makeArray(self.options.files); setTimeout(function() {
self.options.items = Ox.doc(self.options.files.map(function(file) { self.options.showLoading && showLoadingScreen();
return self.options.path + file; self.options.files = Ox.makeArray(self.options.files);
}), function(docItems) { self.options.items = Ox.doc(self.options.files.map(function(file) {
self.options.items = docItems; return self.options.path + file;
getExamples(function() { }), function(docItems) {
self.$sidebar.replaceElement(1, self.$toolbar); self.options.items = docItems;
renderList(); getExamples(function() {
self.options.runTests && runTests(); self.options.showLoading && hideLoadingScreen();
that.triggerEvent('load', {items: self.options.items}); self.$sidebar.replaceElement(1, self.$toolbar);
renderList();
self.options.runTests && runTests();
that.triggerEvent('load', {items: self.options.items});
});
}); });
}); });
} else { } else {
@ -219,6 +225,11 @@ Ox.DocPanel = function(options, self) {
: 'No tests'; : 'No tests';
} }
function hideLoadingScreen() {
self.$loadingIcon.stop().remove();
self.$loadingText.remove();
}
function parseFiles(callback) { function parseFiles(callback) {
var counter = 0, var counter = 0,
docItems = [], docItems = [],
@ -357,6 +368,28 @@ Ox.DocPanel = function(options, self) {
that.triggerEvent('select', {id: self.options.selected}); that.triggerEvent('select', {id: self.options.selected});
} }
function showLoadingScreen() {
self.$loadingIcon = Ox.LoadingIcon({size: 16})
.css({
position: 'absolute',
left: (self.$page.width() - self.options.size) / 2 - 8,
top: self.$page.height() / 2 - 20
})
.appendTo(self.$page)
.start();
self.$loadingText = $('<div>')
.addClass('OxLight')
.css({
position: 'absolute',
left: (self.$page.width() - self.options.size) / 2 - 128,
top: self.$page.height() / 2 + 4,
width: 256,
textAlign: 'center'
})
.html('Generating Documentation...')
.appendTo(self.$page);
}
function sortByTitle(a, b) { function sortByTitle(a, b) {
var a = Ox.stripTags(a.title).toLowerCase(), var a = Ox.stripTags(a.title).toLowerCase(),
b = Ox.stripTags(b.title).toLowerCase(); b = Ox.stripTags(b.title).toLowerCase();