pandora/static/js/importMediaDialog.js

206 lines
6.7 KiB
JavaScript
Raw Normal View History

2016-07-30 00:49:31 +00:00
'use strict';
pandora.ui.importMediaDialog = function(options) {
2016-08-09 12:16:58 +00:00
2016-08-09 13:29:35 +00:00
var help = Ox._('You can import videos from external sites, like YouTube or Vimeo.'),
2016-08-09 12:16:58 +00:00
2016-07-30 00:49:31 +00:00
$content = Ox.Element().css({margin: '16px'}),
2016-08-09 12:16:58 +00:00
$button = Ox.Button({
2016-08-09 13:29:35 +00:00
overlap: 'left',
2016-08-09 12:16:58 +00:00
title: Ox._('Preview'),
width: 128
2016-07-30 00:49:31 +00:00
})
2016-08-09 13:29:35 +00:00
.css({
marginLeft: '-20px',
paddingLeft: '20px',
position: 'absolute',
right: '16px',
top: '16px'
})
2016-07-30 00:49:31 +00:00
.bindEvent({
2016-08-09 12:16:58 +00:00
click: submitURL
2016-08-09 13:29:35 +00:00
})
.appendTo($content),
2016-08-09 12:16:58 +00:00
2016-08-09 13:29:35 +00:00
$input = Ox.Input({
label: Ox._('URL'),
labelWidth: 64,
width: 384
})
.css({
left: '16px',
position: 'absolute',
top: '16px'
})
.bindEvent({
change: submitURL
2016-07-30 00:49:31 +00:00
})
.appendTo($content),
2016-08-09 12:16:58 +00:00
2016-07-30 00:49:31 +00:00
$info = Ox.Element()
2016-08-09 13:29:35 +00:00
.css({
left: '16px',
position: 'absolute',
top: '48px'
})
2016-08-09 12:16:58 +00:00
.html(help)
2016-07-30 00:49:31 +00:00
.appendTo($content),
2016-08-09 12:16:58 +00:00
2016-08-09 13:29:35 +00:00
$loading = Ox.LoadingScreen({
width: 512,
height: 224
}),
2016-07-30 00:49:31 +00:00
that = Ox.Dialog({
buttons: [
Ox.Button({
2016-08-09 12:16:58 +00:00
id: 'close',
title: Ox._('Close')
2016-07-30 00:49:31 +00:00
})
.bindEvent({
click: function() {
that.close();
}
}),
Ox.Button({
disabled: true,
id: 'import',
2016-08-09 12:16:58 +00:00
title: Ox._('Import Video')
2016-07-30 00:49:31 +00:00
}).bindEvent({
click: importMedia
})
],
content: $content,
fixedSize: true,
2016-08-09 12:16:58 +00:00
height: 288,
2016-07-30 00:49:31 +00:00
keys: {
2016-08-09 12:16:58 +00:00
escape: 'close'
2016-07-30 00:49:31 +00:00
},
removeOnClose: true,
2016-08-09 13:29:35 +00:00
title: Ox._('Import Video'),
2016-08-09 12:16:58 +00:00
width: 544
2016-07-30 00:49:31 +00:00
});
function addMedia(url, callback) {
pandora.api.getMediaUrlInfo({url: url}, function(result) {
result.data.items.forEach(function(info) {
2016-08-09 11:17:48 +00:00
var infoKeys = [
2016-08-09 12:16:58 +00:00
'date', 'description', 'id', 'tags',
'title', 'uploader', 'url'
2016-08-09 11:17:48 +00:00
];
var values = Ox.map(pandora.site.importMetadata, function(value, key) {
2016-08-09 11:26:51 +00:00
var type = Ox.getObjectById(pandora.site.itemKeys, key).type;
2016-08-09 11:17:48 +00:00
infoKeys.forEach(function(infoKey) {
2016-08-09 11:30:31 +00:00
var infoValue = info[infoKey];
2016-08-09 11:28:51 +00:00
if (key == 'year' && infoKey == 'date') {
2016-08-09 11:17:48 +00:00
infoValue = infoValue.substr(0, 4);
}
2016-08-09 13:32:40 +00:00
if (infoKey == 'tags' && !Ox.isArray(type)) {
2016-08-09 11:17:48 +00:00
infoValue = infoValue.join(', ');
}
value = value.replace(
2016-08-09 11:21:00 +00:00
new RegExp('\{' + infoKey + '\}', 'g'), infoValue
2016-08-09 11:17:48 +00:00
);
});
if (Ox.isArray(type)) {
value = [value];
}
return value;
});
pandora.api.add({title: values.title || info.title}, function(result) {
var edit = Ox.extend(
Ox.filter(values, function(value, key) {
2016-08-09 11:21:00 +00:00
return key != 'title';
2016-08-09 11:17:48 +00:00
}),
{'id': result.data.id}
);
2016-07-30 00:49:31 +00:00
pandora.api.edit(edit, function(result) {
pandora.api.addMediaUrl({
url: info.url,
item: edit.id
}, function(result) {
if (result.data.taskId) {
pandora.wait(result.data.taskId, function(result) {
callback(edit.id);
});
} else {
callback(edit.id);
}
});
});
});
});
});
};
2016-08-09 12:16:58 +00:00
function getInfo(url, callback) {
pandora.api.getMediaUrlInfo({url: url}, function(result) {
callback(result.data.items);
});
}
2016-07-30 00:49:31 +00:00
function importMedia() {
2016-08-09 12:25:14 +00:00
var url = $input.value();
2016-08-09 13:29:35 +00:00
$input.options({disabled: true});
$button.options({disabled: true});
$info.empty().append($loading.start());
2016-08-09 12:16:58 +00:00
that.disableButton('close');
2016-08-09 13:29:35 +00:00
that.disableButton('import');
2016-07-30 00:49:31 +00:00
addMedia(url, function(item) {
if (item) {
that.close();
Ox.Request.clearCache();
2016-08-09 12:16:58 +00:00
pandora.URL.push('/' + item + '/media');
2016-07-30 00:49:31 +00:00
} else {
2016-08-09 13:29:35 +00:00
$input.options({disabled: false});
$button.options({disabled: false});
$info.empty().html(Ox._('Import failed. Please try again'));
2016-08-09 12:16:58 +00:00
that.enableButton('close');
2016-07-30 00:49:31 +00:00
}
});
}
2016-08-09 12:16:58 +00:00
function submitURL() {
var value = $input.value();
if (value) {
2016-08-09 13:29:35 +00:00
$input.options({disabled: true});
$button.options({disabled: true});
$info.empty().append($loading.start());
that.disableButton('close');
2016-08-09 12:16:58 +00:00
getInfo(value, function(items) {
2016-08-09 13:29:35 +00:00
$input.options({disabled: false});
$button.options({disabled: false});
$loading.stop();
2016-08-09 12:16:58 +00:00
$info.empty();
if (items.length) {
// FIXME: support playlists / multiple items
var info = items[0];
$info.append($('<img>').css({
position: 'absolute',
2016-08-09 12:22:46 +00:00
width: '248px'
2016-08-09 12:16:58 +00:00
}).attr('src', info.thumbnail));
$info.append($('<div>').addClass('OxText').css({
height: '192px',
overflow: 'hidden',
position: 'absolute',
2016-08-09 13:29:35 +00:00
left: '264px',
2016-08-09 12:16:58 +00:00
textOverflow: 'ellipsis',
2016-08-09 12:22:46 +00:00
width: '248px'
2016-08-09 12:16:58 +00:00
}).html(
'<span style="font-weight: bold">' + info.title
+ '</span><br/><br/>' + info.description
));
that.enableButton('import');
} else {
$info.html(help);
}
});
2016-08-09 13:29:35 +00:00
that.enableButton('close');
2016-08-09 12:16:58 +00:00
}
}
2016-07-30 00:49:31 +00:00
return that;
2016-08-09 12:16:58 +00:00
2016-07-30 00:49:31 +00:00
};