move api to apiDialog
This commit is contained in:
parent
e602ca9dc9
commit
c3abc71fd0
5 changed files with 189 additions and 195 deletions
|
@ -2,30 +2,32 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>{{sitename}} API</title>
|
||||
|
||||
<link rel="shortcut icon" type="image/png" href="/static/png/icon.png"/>
|
||||
<script type="text/javascript" src="/static/oxjs/build/Ox.js"></script>
|
||||
<script type="text/javascript" src="/static/js/api/pandora.js"></script>
|
||||
<title>{{title}}</title>
|
||||
<link rel="icon" type="image/png" href="/static/png/icon.png" />
|
||||
<meta name="application-name" content="{{settings.SITENAME}}"/>
|
||||
<meta name="application-url" content="{{base_url}}"/>
|
||||
<link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="{{settings.SITENAME}}" />
|
||||
<link rel="alternate" type="application/atom+xml" title="{{settings.SITENAME}}" href="/atom.xml" />
|
||||
<script>
|
||||
if (localStorage && !localStorage['Ox.theme'])
|
||||
localStorage['Ox.theme'] = '"{{settings.CONFIG.user.ui.theme}}"';
|
||||
</script>
|
||||
<script type="text/javascript" src="/static/js/pandora.js?{{settings.CONFIG.site.version}}"></script>
|
||||
<meta name="title" content="{{title}}" />
|
||||
<meta name="description" content="{{settings.CONFIG.site.description}}"/>
|
||||
<meta property="og:title" content="{{title}}"/>
|
||||
<meta property="og:type" content="website"/>
|
||||
<meta property="og:url" content="{{base_url}}"/>
|
||||
<meta property="og:image" content="{{base_url}}static/png/icon.png"/>
|
||||
<meta property="og:site_name" content="{{settings.SITENAME}}"/>
|
||||
<meta property="og:description" content="{{settings.CONFIG.site.description}}"/>
|
||||
<meta name="google" value="notranslate"/>
|
||||
</head>
|
||||
<body></body>
|
||||
|
||||
<body>
|
||||
<!--
|
||||
<div id="static_apidocs">
|
||||
<h1>{{sitename}} Public API</h1>
|
||||
<a href="http://code.0x2620.org/pandora/annotate/head%3A/pandora/backend/views.py">look inside</a>
|
||||
<div>
|
||||
{% for f in api %}
|
||||
<div>
|
||||
<h2><a name="{{f.name}}">action: {{f.name}}</a></h2>
|
||||
<pre style="padding-left: 24px">
|
||||
{{f.doc|safe}}
|
||||
</pre>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
<noscript>
|
||||
<h1>{{title}}</h1>
|
||||
<p>{{text|safe}}</p>
|
||||
<p>{{settings.SITENAME}} requires JavaScript</p>
|
||||
</noscript>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1,169 +0,0 @@
|
|||
/***
|
||||
Pandora API
|
||||
***/
|
||||
Ox.load('UI', {
|
||||
hideScreen: false,
|
||||
showScreen: true,
|
||||
theme: 'oxlight'
|
||||
}, function() {
|
||||
|
||||
var app = new Ox.App({
|
||||
url: '/api/',
|
||||
init: 'init',
|
||||
}).bindEvent('load', function(data) {
|
||||
app.site = data.site;
|
||||
app.user = data.user;
|
||||
app.site.default_info = '<div class="OxSelectable"><h2>Pan.do/ra API Overview</h2>use this api in the browser with <a href="/static/oxjs/demos/doc2/index.html#Ox.App">Ox.app</a> or use <a href="http://code.0x2620.org/pandora_client">pandora_client</a> it in python. Further description of the api can be found <a href="https://wiki.0x2620.org/wiki/pandora/API">on the wiki</a></div>';
|
||||
app.$body = $('body');
|
||||
app.$document = $(document);
|
||||
app.$window = $(window);
|
||||
//app.$body.html('');
|
||||
Ox.UI.hideLoadingScreen();
|
||||
|
||||
app.$ui = {};
|
||||
app.$ui.actionList = constructList();
|
||||
app.$ui.actionInfo = Ox.Container().css({padding: '16px'}).html(app.site.default_info);
|
||||
|
||||
app.api.api({docs: true, code: true}, function(results) {
|
||||
app.actions = results.data.actions;
|
||||
if (document.location.hash) {
|
||||
app.$ui.actionList.triggerEvent('select', {
|
||||
ids: document.location.hash.substring(1).split(',')
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
var $left = new Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: new Ox.Element().append(new Ox.Element()
|
||||
.html(app.site.site.name + ' API').css({
|
||||
'padding': '4px',
|
||||
})).css({
|
||||
'background-color': '#ddd',
|
||||
'font-weight': 'bold',
|
||||
}),
|
||||
size: 24
|
||||
},
|
||||
{
|
||||
element: app.$ui.actionList
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
});
|
||||
var $main = new Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: $left,
|
||||
size: 160
|
||||
},
|
||||
{
|
||||
element: app.$ui.actionInfo,
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
});
|
||||
|
||||
$main.appendTo(app.$body);
|
||||
});
|
||||
|
||||
function constructList() {
|
||||
return new Ox.TableList({
|
||||
columns: [
|
||||
{
|
||||
align: "left",
|
||||
id: "name",
|
||||
operator: "+",
|
||||
title: "Name",
|
||||
visible: true,
|
||||
width: 140
|
||||
},
|
||||
],
|
||||
columnsMovable: false,
|
||||
columnsRemovable: false,
|
||||
id: 'actionList',
|
||||
items: function(data, callback) {
|
||||
function _sort(a, b) {
|
||||
return a.name > b.name ? 1 : a.name == b.name ? 0 : -1;
|
||||
}
|
||||
if (!data.keys) {
|
||||
app.api.api(function(results) {
|
||||
var items = [];
|
||||
Ox.forEach(results.data.actions, function(v, k) {
|
||||
items.push({'name': k})
|
||||
});
|
||||
items.sort(_sort);
|
||||
var result = {'data': {'items': items.length}};
|
||||
callback(result);
|
||||
});
|
||||
} else {
|
||||
app.api.api(function(results) {
|
||||
var items = [];
|
||||
Ox.forEach(results.data.actions, function(v, k) {
|
||||
items.push({'name': k})
|
||||
});
|
||||
items.sort(_sort);
|
||||
var result = {'data': {'items': items}};
|
||||
callback(result);
|
||||
});
|
||||
}
|
||||
},
|
||||
scrollbarVisible: true,
|
||||
sort: [{key: "name", operator: "+"}],
|
||||
unique: 'name'
|
||||
}).bindEvent({
|
||||
select: function(data) {
|
||||
var info = $('<div>').addClass('OxSelectable'),
|
||||
hash = '#';
|
||||
if (data.ids.length)
|
||||
data.ids.forEach(function(id) {
|
||||
info.append(
|
||||
$('<h2>')
|
||||
.html(id)
|
||||
.css({
|
||||
marginBottom: '8px'
|
||||
})
|
||||
);
|
||||
var code = app.actions[id].code[1],
|
||||
f = app.actions[id].code[0],
|
||||
line = Math.round(Ox.last(f.split(':')) || 0),
|
||||
doc = app.actions[id].doc.replace('/\n/<br>\n/g'),
|
||||
$code, $doc;
|
||||
|
||||
$doc = Ox.SyntaxHighlighter({
|
||||
source: doc,
|
||||
})
|
||||
.appendTo(info);
|
||||
|
||||
Ox.Button({
|
||||
title: 'View Source (' + f + ')',
|
||||
}).bindEvent({
|
||||
click: function() {
|
||||
$code.toggle();
|
||||
}
|
||||
})
|
||||
.css({
|
||||
margin: '4px'
|
||||
})
|
||||
.appendTo(info);
|
||||
$code = Ox.SyntaxHighlighter({
|
||||
showLineNumbers: true,
|
||||
source: code,
|
||||
offset: line
|
||||
})
|
||||
.css({
|
||||
borderWidth: '1px',
|
||||
}).appendTo(info).hide();
|
||||
Ox.print(code);
|
||||
hash += id + ','
|
||||
});
|
||||
else
|
||||
info.html(app.site.default_info);
|
||||
|
||||
document.location.hash = hash.slice(0, -1);
|
||||
app.$ui.actionInfo.html(info);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
158
static/js/pandora/apiDialog.js
Normal file
158
static/js/pandora/apiDialog.js
Normal file
|
@ -0,0 +1,158 @@
|
|||
// vim: et:ts=4:sw=4:sts=4:ft=javascript
|
||||
'use strict';
|
||||
|
||||
pandora.ui.apiDialog = function() {
|
||||
|
||||
var actions,
|
||||
$loading = Ox.Element()
|
||||
.append(
|
||||
$('<img>')
|
||||
.attr({src: Ox.UI.getImageURL('symbolLoadingAnimated')})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
width: '32px',
|
||||
height: '32px',
|
||||
left: 0,
|
||||
top: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
margin: 'auto'
|
||||
})
|
||||
),
|
||||
|
||||
$panel, $list, $text,
|
||||
|
||||
that = Ox.Dialog({
|
||||
buttons: [
|
||||
Ox.Button({
|
||||
id: 'close',
|
||||
title: 'Close'
|
||||
}).bindEvent({
|
||||
click: function() {
|
||||
that.close();
|
||||
}
|
||||
})
|
||||
],
|
||||
closeButton: true,
|
||||
content: $loading,
|
||||
height: Math.round((window.innerHeight - 24) * 0.75),
|
||||
keys: {escape: 'close'},
|
||||
maximizeButton: true,
|
||||
minHeight: 256,
|
||||
minWidth: 576,
|
||||
title: 'API Documentation',
|
||||
width: Math.round(window.innerWidth * 0.75)
|
||||
})
|
||||
.bindEvent({
|
||||
close: function() {
|
||||
pandora.UI.set({page: ''});
|
||||
},
|
||||
resize: function() {
|
||||
$list.size();
|
||||
}
|
||||
}),
|
||||
overview = '<div class="OxSelectable"><h2>Pan.do/ra API Overview</h2>use this api in the browser with <a href="/static/oxjs/demos/doc2/index.html#Ox.App">Ox.app</a> or use <a href="http://code.0x2620.org/pandora_client">pandora_client</a> it in python. Further description of the api can be found <a href="https://wiki.0x2620.org/wiki/pandora/API">on the wiki</a></div>';
|
||||
|
||||
pandora.api.api({docs: true, code: true}, function(results) {
|
||||
var items = [];
|
||||
actions = results.data.actions;
|
||||
Ox.forEach(results.data.actions, function(v, k) {
|
||||
items.push({
|
||||
'id': k,
|
||||
'title': k
|
||||
});
|
||||
});
|
||||
items.sort(function (a, b) {
|
||||
return a.name > b.name ? 1 : a.name == b.name ? 0 : -1;
|
||||
});
|
||||
|
||||
$list = Ox.TableList({
|
||||
_tree: true,
|
||||
columns: [
|
||||
{
|
||||
id: 'title',
|
||||
visible: true,
|
||||
width: 192 - Ox.UI.SCROLLBAR_SIZE
|
||||
}
|
||||
],
|
||||
items: items,
|
||||
max: 1,
|
||||
min: 1,
|
||||
scrollbarVisible: true,
|
||||
selected: [],
|
||||
sort: [{key: 'title', operator: '+'}],
|
||||
unique: 'id'
|
||||
})
|
||||
.bindEvent({
|
||||
select: selectSection
|
||||
});
|
||||
|
||||
$text = Ox.Element()
|
||||
.css({
|
||||
padding: '16px',
|
||||
overflowY: 'auto'
|
||||
})
|
||||
.html(overview);
|
||||
|
||||
|
||||
$panel = Ox.SplitPanel({
|
||||
elements: [
|
||||
{element: $list, size: 192},
|
||||
{element: $text}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
});
|
||||
|
||||
that.options({content: $panel});
|
||||
|
||||
});
|
||||
|
||||
function selectSection(data) {
|
||||
if (data.ids.length) {
|
||||
$text.html('');
|
||||
data.ids.forEach(function(id) {
|
||||
$text.append(
|
||||
$('<h2>')
|
||||
.html(id)
|
||||
.css({
|
||||
marginBottom: '8px'
|
||||
})
|
||||
);
|
||||
var code = actions[id].code[1],
|
||||
f = actions[id].code[0],
|
||||
line = Math.round(Ox.last(f.split(':')) || 0),
|
||||
doc = actions[id].doc.replace('/\n/<br>\n/g'),
|
||||
$code, $doc;
|
||||
|
||||
$doc = Ox.SyntaxHighlighter({
|
||||
source: doc,
|
||||
})
|
||||
.appendTo($text);
|
||||
|
||||
Ox.Button({
|
||||
title: 'View Source (' + f + ')',
|
||||
}).bindEvent({
|
||||
click: function() {
|
||||
$code.toggle();
|
||||
}
|
||||
})
|
||||
.css({
|
||||
margin: '4px'
|
||||
})
|
||||
.appendTo($text);
|
||||
$code = Ox.SyntaxHighlighter({
|
||||
showLineNumbers: true,
|
||||
source: code,
|
||||
offset: line
|
||||
})
|
||||
.css({
|
||||
borderWidth: '1px',
|
||||
}).appendTo($text).hide();
|
||||
});
|
||||
} else {
|
||||
$text.html(overview);
|
||||
}
|
||||
}
|
||||
return that;
|
||||
|
||||
};
|
|
@ -41,7 +41,7 @@ pandora.ui.appPanel = function() {
|
|||
// unless we're on page load, remove home screen
|
||||
pandora.$ui.home.fadeOutScreen();
|
||||
}
|
||||
['site', 'account', 'preferences', 'help'].forEach(function(dialog) {
|
||||
['site', 'account', 'preferences', 'help', 'api'].forEach(function(dialog) {
|
||||
pandora.$ui[dialog + 'Dialog'] && pandora.$ui[dialog + 'Dialog'].close();
|
||||
});
|
||||
if (pandora.$ui.tv) {
|
||||
|
@ -63,6 +63,8 @@ pandora.ui.appPanel = function() {
|
|||
}
|
||||
} else if (page == 'help') {
|
||||
pandora.$ui.helpDialog = pandora.ui.helpDialog().open();
|
||||
} else if (page == 'api') {
|
||||
pandora.$ui.apiDialog = pandora.ui.apiDialog().open();
|
||||
} else if (['signup', 'signin'].indexOf(page) > -1) {
|
||||
if (pandora.user.level == 'guest') {
|
||||
if (pandora.$ui.accountDialog && pandora.$ui.accountDialog.is(':visible')) {
|
||||
|
|
|
@ -150,7 +150,8 @@ pandora.ui.mainMenu = function() {
|
|||
{ id: 'statistics', title: 'Statistics...', disabled: !pandora.site.capabilities.canManageUsers[pandora.user.level] }
|
||||
] },
|
||||
{ id: 'helpMenu', title: 'Help', items: [
|
||||
{ id: 'help', title: pandora.site.site.name + ' Help', keyboard: 'control ?' }
|
||||
{ id: 'help', title: pandora.site.site.name + ' Help', keyboard: 'control ?' },
|
||||
{ id: 'api', title: pandora.site.site.name + ' API' }
|
||||
] }
|
||||
],
|
||||
pandora.site.capabilities.canSeeDebugMenu[pandora.user.level]
|
||||
|
@ -285,7 +286,7 @@ pandora.ui.mainMenu = function() {
|
|||
click: function(data) {
|
||||
if ([
|
||||
'home', 'software', 'signup', 'signin', 'signout',
|
||||
'preferences', 'tv', 'help'
|
||||
'preferences', 'tv', 'help', 'api'
|
||||
].concat(
|
||||
pandora.site.sitePages.map(function(page) {
|
||||
return page.id;
|
||||
|
|
Loading…
Reference in a new issue