example django lsd project
This commit is contained in:
commit
b95ad580d2
10 changed files with 591 additions and 0 deletions
203
static/js/index.js
Normal file
203
static/js/index.js
Normal file
|
|
@ -0,0 +1,203 @@
|
|||
Ox.load('UI', function() {
|
||||
var current,
|
||||
columns = [
|
||||
{
|
||||
id: 'state',
|
||||
title: '+',
|
||||
visible: true,
|
||||
width: 16,
|
||||
operator: '+',
|
||||
format: function(value, data) {
|
||||
return $('<img>')
|
||||
.attr({
|
||||
src: Ox.UI.getImageURL('symbol' + {
|
||||
'available': 'Play',
|
||||
'playing': 'Pause',
|
||||
'downloading': 'Sync',
|
||||
'': 'Down',
|
||||
}[value])
|
||||
})
|
||||
.css({
|
||||
width: '10px',
|
||||
height: '10px',
|
||||
padding: '3px',
|
||||
});
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 'id',
|
||||
title: 'ID',
|
||||
visible: true,
|
||||
width: 48,
|
||||
operator: '+',
|
||||
|
||||
},
|
||||
{
|
||||
id: 'title',
|
||||
title: 'Title',
|
||||
visible: true,
|
||||
width: 512,
|
||||
operator: '+',
|
||||
},
|
||||
{
|
||||
id: 'size',
|
||||
title: 'Size',
|
||||
visible: true,
|
||||
width: 72,
|
||||
operator: '+',
|
||||
format: function(value) {
|
||||
return Ox.formatValue(value, 'b');
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 'extension',
|
||||
title: 'Extension',
|
||||
visible: true,
|
||||
width: 48,
|
||||
operator: '+',
|
||||
},
|
||||
{
|
||||
id: 'info',
|
||||
title: 'Info',
|
||||
visible: true,
|
||||
width: 200,
|
||||
operator: '+',
|
||||
format: function(value) {
|
||||
return value || '';
|
||||
}
|
||||
},
|
||||
];
|
||||
|
||||
window.app = Ox.App({
|
||||
name: 'lsd',
|
||||
url: '/api/'
|
||||
}).bindEvent({
|
||||
load: function(data) {
|
||||
window.app.local = Ox.API({
|
||||
url: 'http://127.0.0.1:15550/api/'
|
||||
}, function() {
|
||||
if (!data.user) {
|
||||
signupDialog();
|
||||
return;
|
||||
}
|
||||
app._seed = setInterval(function() {
|
||||
app.local.seedRequests({});
|
||||
}, 60000);
|
||||
app.local.config({});
|
||||
app.$player = $('<audio>');
|
||||
app.play = function(id) {
|
||||
var url = 'http://127.0.0.1:15550/get/' + id;
|
||||
app.$player.attr('src', url);
|
||||
app.$player[0].play();
|
||||
current = id;
|
||||
}
|
||||
app.stop = function() {
|
||||
app.$player[0].pause();
|
||||
}
|
||||
app.api.find({}, function(result) {
|
||||
app.items = result.data.items;
|
||||
app.$list = Ox.TableList({
|
||||
columns: columns,
|
||||
columnsMovable: true,
|
||||
columnsVisible: true,
|
||||
items: result.data.items,
|
||||
max: 1,
|
||||
pageLength: Math.min(100, result.data.items.length),
|
||||
//query: getQuery(),
|
||||
scrollbarVisible: true,
|
||||
//sortable: true,
|
||||
sort: ['+id'],
|
||||
unique: 'id',
|
||||
}).bindEvent({
|
||||
open: function(data) {
|
||||
var id = data.ids[0],
|
||||
item = app.$list.value(id);
|
||||
if (item.state == 'available') {
|
||||
app.play(id);
|
||||
} else {
|
||||
app.local.addRequests({ids: [id]}, function() {
|
||||
app.$list.value(id, 'state', 'downloading');
|
||||
var interval = setInterval(function () {
|
||||
app.local.info({id: id}, function(result) {
|
||||
if (Ox.isEmpty(result.data)) {
|
||||
clearInterval(interval);
|
||||
app.$list.value(id, 'state', 'available');
|
||||
app.$list.value(id, 'info', '');
|
||||
} else {
|
||||
var percent = Math.round(100
|
||||
* result.data.total_done
|
||||
/ result.data.total_wanted) || 0;
|
||||
app.$list.value(id, 'info', '' + percent + ' % downloaded');
|
||||
}
|
||||
});
|
||||
}, 1000);
|
||||
});
|
||||
}
|
||||
},
|
||||
}).appendTo(Ox.$body);
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
function signupDialog() {
|
||||
var $form,
|
||||
$dialog = Ox.Dialog({
|
||||
buttons: [
|
||||
Ox.Button({
|
||||
title: Ox._('Sign Up')
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
var values = $form.values();
|
||||
app.api.signup({
|
||||
username: values.username,
|
||||
password: values.password,
|
||||
email: values.username
|
||||
}, function(result) {
|
||||
if (result.status.code == 200) {
|
||||
app.local.config({
|
||||
username: values.username,
|
||||
password: values.password,
|
||||
url: document.location.origin + '/api/',
|
||||
extensions: ['ogg', 'mp3']
|
||||
}, function() {
|
||||
document.location.reload();
|
||||
});
|
||||
} else {
|
||||
signupDialog();
|
||||
}
|
||||
})
|
||||
$dialog.close();
|
||||
}
|
||||
})
|
||||
],
|
||||
closeButton: true,
|
||||
content: Ox.Element()
|
||||
.append(
|
||||
$form = Ox.Form({
|
||||
items: [
|
||||
Ox.Input({
|
||||
id: 'username',
|
||||
label: Ox._('Username'),
|
||||
labelWidth: 120,
|
||||
width: 320
|
||||
}),
|
||||
Ox.Input({
|
||||
autovalidate: /.+/,
|
||||
id: 'password',
|
||||
label: Ox._('Password'),
|
||||
labelWidth: 120,
|
||||
type: 'password',
|
||||
width: 320
|
||||
})
|
||||
]
|
||||
})
|
||||
),
|
||||
height: 192,
|
||||
removeOnClose: true,
|
||||
title: 'Sign Up',
|
||||
width: 432
|
||||
}).open();
|
||||
}
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue