203 lines
7.4 KiB
JavaScript
203 lines
7.4 KiB
JavaScript
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();
|
|
}
|
|
});
|