forked from 0x2620/oxjs
make SyntaxHighlighter and SourceViewer more useful by allowing replacements; remove index.json and source/Ox/png; plus some other small and/or cosmetic changes
This commit is contained in:
parent
24eb4bdc64
commit
03f4f77ce6
16 changed files with 213 additions and 230 deletions
82
index.js
82
index.js
|
|
@ -59,7 +59,7 @@ Ox.load(function() {
|
|||
opacity: 0
|
||||
},
|
||||
line: {
|
||||
top: app.window.middle + 12 + 'px',
|
||||
top: app.window.middle + 16 + 'px',
|
||||
left: app.window.center - 192 + 'px',
|
||||
width: '384px',
|
||||
fontSize: '12px',
|
||||
|
|
@ -72,11 +72,11 @@ Ox.load(function() {
|
|||
height: '128px'
|
||||
},
|
||||
sections: {
|
||||
top: app.window.middle + 36 + 'px',
|
||||
top: app.window.middle + 48 + 'px',
|
||||
left: app.window.center - 256 + 'px'
|
||||
},
|
||||
themes: {
|
||||
top: app.window.middle + 60 + 'px',
|
||||
top: app.window.middle + 80 + 'px',
|
||||
right: app.window.center - 40 + 'px'
|
||||
}
|
||||
}
|
||||
|
|
@ -126,7 +126,7 @@ Ox.load(function() {
|
|||
resize: app.fn.resize
|
||||
});
|
||||
window.oxjs = app; // so that you can play with it in the console
|
||||
Ox.load({UI: {debug: true, theme: app.user('theme')}}, app.fn.render);
|
||||
Ox.load({UI: {theme: app.user('theme')}}, app.fn.render);
|
||||
},
|
||||
|
||||
render: function() {
|
||||
|
|
@ -146,7 +146,9 @@ Ox.load(function() {
|
|||
},
|
||||
|
||||
setSection: function(section) {
|
||||
app.$ui.panel.replaceElement(1, app.ui[section]());
|
||||
app.$ui.panel.replaceElement(1, app.ui[section]
|
||||
? app.ui[section]() : app.ui.page(section)
|
||||
);
|
||||
},
|
||||
|
||||
setTheme: function(theme) {
|
||||
|
|
@ -198,20 +200,23 @@ Ox.load(function() {
|
|||
|
||||
},
|
||||
|
||||
re: {
|
||||
|
||||
code: new RegExp(
|
||||
'<span class="OxIdentifier">Ox</span>'
|
||||
+ '(<span class="OxOperator">\.</span>'
|
||||
+ '<span class="OxIdentifier">UI</span>)?'
|
||||
+ '<span class="OxOperator">\.</span>'
|
||||
+ '<span class="OxIdentifier">([\\$\\w]+)<\/span>',
|
||||
'g'
|
||||
),
|
||||
|
||||
comment: /\b(Ox\.\w+)\b/g
|
||||
|
||||
},
|
||||
|
||||
ui: {
|
||||
|
||||
about: function() {
|
||||
return Ox.Element();
|
||||
},
|
||||
|
||||
contact: function() {
|
||||
return Ox.Element();
|
||||
},
|
||||
|
||||
development: function() {
|
||||
return Ox.Element();
|
||||
},
|
||||
|
||||
documentation: function() {
|
||||
return Ox.DocPanel({
|
||||
files: app.data.documentation,
|
||||
|
|
@ -227,17 +232,22 @@ Ox.load(function() {
|
|||
});
|
||||
},
|
||||
|
||||
download: function() {
|
||||
return Ox.Element()
|
||||
.html('<code>bzr branch http://code.0x2620.org/oxjs</code>');
|
||||
},
|
||||
|
||||
examples: function() {
|
||||
return Ox.ExamplePanel({
|
||||
examples: app.data.examples,
|
||||
keywords: /\b(Ox\.[\w]+)\b/g,
|
||||
path: 'examples/',
|
||||
replace: [[/\b(Ox[\.\w]+)\b/g, '<b>$1</b>']],
|
||||
replaceCode: [[
|
||||
app.re.code,
|
||||
function (str) {
|
||||
return '<a href="#doc/' + Ox.stripTags(str)
|
||||
+ '" class="doclink">' + str + '</a>';
|
||||
}
|
||||
]],
|
||||
replaceComment: [[
|
||||
app.re.comment,
|
||||
'<a href="#doc/$1" class="OxMonospace doclink">$1</a>'
|
||||
]],
|
||||
selected: ''
|
||||
})
|
||||
.bindEvent({
|
||||
|
|
@ -272,6 +282,17 @@ Ox.load(function() {
|
|||
});
|
||||
},
|
||||
|
||||
page: function(page) {
|
||||
var $element = Ox.Container();
|
||||
Ox.get('readme/html/_' + page + '.html', function(html) {
|
||||
$('<div>')
|
||||
.addClass('OxSerif page')
|
||||
.html(html)
|
||||
.appendTo($element);
|
||||
});
|
||||
return $element;
|
||||
},
|
||||
|
||||
panel: function() {
|
||||
return Ox.UI
|
||||
? Ox.SplitPanel({
|
||||
|
|
@ -287,7 +308,12 @@ Ox.load(function() {
|
|||
orientation: 'vertical'
|
||||
})
|
||||
.css({opacity: 0})
|
||||
: Ox.$('<div>')
|
||||
: Ox.$('<div>').append(
|
||||
Ox.$('<div>').addClass('bar').css({
|
||||
width: '100%',
|
||||
height: '32px'
|
||||
})
|
||||
);
|
||||
},
|
||||
|
||||
readme: function() {
|
||||
|
|
@ -298,11 +324,10 @@ Ox.load(function() {
|
|||
var $element = (Ox.UI ? $ : Ox.$)('<div>').addClass('ui sections');
|
||||
[
|
||||
'about', 'readme', 'examples', 'documentation',
|
||||
'download', 'development', 'contact'
|
||||
'downloads', 'development', 'contact'
|
||||
].forEach(function(section, i) {
|
||||
i && $element.append(Ox.$('<span>').html(' | '));
|
||||
Ox.$('<span>')
|
||||
.addClass('link' + (
|
||||
.addClass('button' + (
|
||||
app.user('section') == section ? ' selected' : ''
|
||||
))
|
||||
.html(Ox.toTitleCase(section))
|
||||
|
|
@ -321,9 +346,8 @@ Ox.load(function() {
|
|||
themes: function() {
|
||||
var $element = (Ox.UI ? $ : Ox.$)('<div>').addClass('ui themes');
|
||||
['classic', 'modern'].forEach(function(theme, i) {
|
||||
i && $element.append(Ox.$('<span>').html(' | '));
|
||||
Ox.$('<span>')
|
||||
.addClass('link' + (
|
||||
.addClass('button' + (
|
||||
app.user('theme') == theme ? ' selected' : ''
|
||||
))
|
||||
.html(theme == 'classic' ? 'Light' : 'Dark')
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue