' + app.data.version + '.'
}
]
},
resize: function() {
[
'logo', 'loading', 'label', 'menu', 'switch'
].forEach(function(element) {
app.$ui[element] && app.$ui[element].css(app.getCSS(element));
});
},
setTheme: function(theme) {
app.user({theme: theme});
(Ox.$('#icon') || Ox.$('').attr({
id: 'icon',
rel: 'shortcut icon',
type: 'image/png'
}).appendTo(Ox.$('head'))).attr({
href: app.getSRC('icon')
});
app.$ui.logo && app.$ui.logo
.attr({src: app.getSRC('logo')})
.css(app.getCSS('logo'));
Ox.Theme
? Ox.Theme(theme)
: Ox.$('body').addClass('OxTheme' + Ox.toTitleCase(theme)
);
},
ui: {
doc: function() {
return Ox.DocPanel({
files: app.data.documentation,
getModule: function(item) {
var file = item.file.replace(/^dev\//, '');
return file.split('/')[0];
},
getSection: function(item) {
var file = item.file.replace(/^dev\//, '');
return item.section || file.split('/')[2].split('.')[0];
},
path: 'dev/',
replace: [app.re.code],
});
},
examples: function() {
return Ox.ExamplePanel({
examples: app.data.examples,
keywords: /\b(Ox\.[\w]+)\b/g,
path: 'examples/',
replaceCode: [app.re.code],
replaceComment: [app.re.comment],
selected: ''
})
.bindEvent({
select: function(data) {
app.url.push(
'examples' + (data.id ? '/' + data.id : '')
)
}
});
},
label: function() {
return Ox.Label({
textAlign: 'center',
title: 'A JavaScript Library for Web Applications',
width: 256
})
.addClass('label animate')
.bindEvent({
anyclick: function() {
app.url.set(app.url.get() ? '' : app.user('url'));
}
});
},
loading: function() {
return Ox.$('')
.addClass('OxSerif page')
.html(html.replace(app.re.version[0], app.re.version[1]))
.appendTo($element);
});
return $element;
},
panel: function() {
return Ox.TabPanel({
content: function(id) {
return app.ui[id] ? app.ui[id]() : app.ui.page(id);
},
size: 32,
tabs: app.data.sections
})
.bindEvent({
change: function(data) {
app.url.push(data.selected);
}
});
},
readme: function() {
var $list = Ox.Container().css({overflowY: 'scroll'}),
$text = Ox.Container().addClass('OxSerif text'),
$panel = Ox.SplitPanel({
elements: [
{element: $list, size: 256},
{element: $text}
],
orientation: 'horizontal'
})
.addClass('readme');
app.data.readme.forEach(function(item, i) {
var $item = $('
')
.addClass('item')
.css({
width: 224 - Ox.UI.SCROLLBAR_SIZE + 'px'
})
.bind({
click: function(e) {
var $this = $(this);
if (!$this.is('.selected')) {
selectItem(item.id, $this);
} else if (e.metaKey) {
selectItem(null, $this);
}
}
})
.appendTo($list);
$('
')
.addClass('OxSerif title')
.html(item.title)
.appendTo($item);
$('
')
.addClass('OxSerif OxLight date')
.html(Ox.formatDate(item.date, '%B %e, %Y', true))
.appendTo($item);
});
function selectItem(id, $element) {
$('.readme .item.selected').removeClass('selected');
if (id) {
$element.addClass('selected');
Ox.get('readme/html/' + id + '.html', function(html) {
$text.html(html);
$text.find('.code').each(function() {
var $this = $(this);
$this.replaceWith(
Ox.SyntaxHighlighter({
source: $this.text()
})
.attr({id: $this.attr('id')})
/*
.css({
border: '1px solid rgb(192, 192, 192)'
})
*/
);
});
});
app.url.push('readme/' + id);
} else {
$text.empty();
app.url.push('readme');
}
}
return $panel;
},
screen: function() {
return Ox.$('
').addClass('screen animate');
},
switch: function() {
return Ox.ButtonGroup({
buttons: [
{id: 'classic', title: 'Light'},
{id: 'modern', title: 'Dark'}
],
selectable: true,
value: app.user('theme')
})
.addClass('switch animate')
.bindEvent({
change: function(data) {
app.setTheme(data.value);
}
});
},
warning: function() {
return $('
')
.addClass('warning')
.html(
'Aw, snap! This website requires an up-to-date, HTML5-compliant web browser. '
+ 'It should work fine in current versions of Chrome, Firefox and Safari, '
+ 'or Internet Explorer with Chrome Frame installed. '
+ 'To proceed at your own risk, click on the logo above.'
);
}
},
url: {
get: function() {
return window.location.hash.substr(1);
},
push: function(url) {
history.pushState({}, '', '#' + url);
url && app.user({url: url});
return app;
},
set: function() {
window.location.hash = '#' + arguments[0];
return app;
}
},
urlchange: function() {
var url = app.url.get(),
section = url.split('/')[0];
url && app.user({url: url});
Ox.print(
'url', url,
'section', section,
'prev', app.previousURL,
'sect', app.previousURL.split('/')[0],
'user url', app.user('url')
);
if (section != app.previousURL.split('/')[0]) {
app.$ui.panel.select(section);
}
app[!url || !app.previousURL ? 'animate' : 'void'](function() {
app.previousURL = url;
});
},
user: Ox.localStorage('OxJS'),
void: function(callback) {
callback();
}
};
app.init();
window.oxjs = app;
});