update annotation import/export dialogs

This commit is contained in:
rolux 2014-09-18 16:44:57 +02:00
parent a9bbc86fda
commit b24b62eccb
2 changed files with 119 additions and 29 deletions

View file

@ -1,5 +1,101 @@
'use strict'; 'use strict';
pandora.ui.exportAnnotationsDialog = function() { pandora.ui.exportAnnotationsDialog = function(options) {
var annotations = pandora.$ui.editor.getCurrentAnnotations(),
layers = pandora.site.layers.map(function(layer) {
return {
disabled: annotations[layer.id].length == 0,
id: layer.id,
title: layer.title
}
}),
enabledLayers = layers.filter(function(layer) {
return layer.disabled == false;
}),
layer = (enabledLayers.length ? enabledLayers : layers)[0].id,
$content = Ox.Element().css({margin: '16px'}),
$layerSelect = Ox.Select({
items: layers,
label: Ox._('Layer'),
labelWidth: 128,
value: layer,
width: 384
})
.css({
marginTop: '16px'
})
.bindEvent({
change: function() {
updateStatus();
that.enableButton('export');
}
})
.appendTo($content),
$status = Ox.$('<div>')
.css({
marginTop: '16px'
})
.appendTo($content),
that = Ox.Dialog({
buttons: [
Ox.Button({
id: 'dontExport',
title: Ox._('Don\'t Export')
})
.bindEvent({
click: function() {
that.close();
}
}),
Ox.Button({
disabled: enabledLayers.length == 0,
id: 'export',
title: Ox._('Export')
})
.bindEvent({
click: exportAnnotations
})
],
closeButton: true,
content: $content,
fixedSize: true,
height: 80,
removeOnClose: true,
title: Ox._('Export Annotations'),
width: 416
});
updateStatus();
function exportAnnotations() {
Ox.print(
Ox.formatSRT(annotations[$layerSelect.value()].map(function(annotation) {
return {
'in': annotation['in'],
out: annotation.out,
text: annotation.value
.replace(/\n/g, ' ')
.replace(/\s+/g, ' ')
.replace(/<br>/g, '\n')
};
}))
);
}
function updateStatus() {
$status.html(Ox._('All {0} currently shown will be exported.', [
Ox.getObjectById(layers, $layerSelect.value()).title.toLowerCase()
]));
}
return that;
}; };

View file

@ -1,7 +1,7 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
'use strict'; 'use strict';
pandora.ui.importAnnotationsDialog = function(duration) { pandora.ui.importAnnotationsDialog = function(options) {
var layers = pandora.site.layers.filter(function(layer) { var layers = pandora.site.layers.filter(function(layer) {
return layer.canAddAnnotations[pandora.user.level]; return layer.canAddAnnotations[pandora.user.level];
@ -11,8 +11,7 @@ pandora.ui.importAnnotationsDialog = function(duration) {
return {id: language.code, title: language.name}; return {id: language.code, title: language.name};
}), 'title'), }), 'title'),
$content = Ox.Element() $content = Ox.Element().css({margin: '16px'}),
.css({margin: '16px'}),
$layerSelect = Ox.Select({ $layerSelect = Ox.Select({
items: layers, items: layers,
@ -80,11 +79,12 @@ pandora.ui.importAnnotationsDialog = function(duration) {
id: 'import', id: 'import',
title: Ox._('Import') title: Ox._('Import')
}).bindEvent({ }).bindEvent({
click: addAnnotations click: importAnnotations
}) })
], ],
closeButton: true, closeButton: true,
content: $content, content: $content,
fixedSize: true,
height: 144, height: 144,
keys: { keys: {
escape: 'dontImport' escape: 'dontImport'
@ -96,7 +96,17 @@ pandora.ui.importAnnotationsDialog = function(duration) {
updateLanguageSelect(); updateLanguageSelect();
function addAnnotations() { function disableButtons() {
that.disableButtons();
that.disableCloseButton();
}
function enableButtons() {
that.enableButtons();
that.enableCloseButton();
}
function importAnnotations() {
var annotations = [], var annotations = [],
language = $languageSelect.value(), language = $languageSelect.value(),
@ -111,7 +121,7 @@ pandora.ui.importAnnotationsDialog = function(duration) {
annotations = parseSRT(this.result); annotations = parseSRT(this.result);
} }
if (annotations.length) { if (annotations.length) {
setStatus(Ox._( $status.html(Ox._(
'Importing {0} annotation' 'Importing {0} annotation'
+ (annotations.length == 1 ? '' : 's') + '...', + (annotations.length == 1 ? '' : 's') + '...',
[annotations.length] [annotations.length]
@ -139,57 +149,41 @@ pandora.ui.importAnnotationsDialog = function(duration) {
if (result.data.taskId) { if (result.data.taskId) {
pandora.wait(result.data.taskId, function(result) { pandora.wait(result.data.taskId, function(result) {
if (result.data.status == 'SUCCESS') { if (result.data.status == 'SUCCESS') {
setStatus(Ox._('Import succeeded.')); $status.html(Ox._('Import succeeded.'));
Ox.Request.clearCache(pandora.user.ui.item); Ox.Request.clearCache(pandora.user.ui.item);
pandora.$ui.contentPanel.replaceElement( pandora.$ui.contentPanel.replaceElement(
1, pandora.$ui.item = pandora.ui.item() 1, pandora.$ui.item = pandora.ui.item()
); );
} else { } else {
setStatus(Ox._('Import failed.')); $status.html(Ox._('Import failed.'));
} }
enableButtons(); enableButtons();
}); });
} else { } else {
setStatus(Ox._('Import failed.')); $status.html(Ox._('Import failed.'));
enableButtons(); enableButtons();
} }
}); });
} else { } else {
setStatus(Ox._('No valid annotations found.')); $status.html(Ox._('No valid annotations found.'));
enableButtons(); enableButtons();
} }
}; };
setTimeout(function() {
reader.readAsText(file); reader.readAsText(file);
}, 250);
} }
function disableButtons() {
that.disableButtons();
that.disableCloseButton();
}
function enableButtons() {
that.enableButtons();
that.enableCloseButton();
}
function parseSRT(srt) { function parseSRT(srt) {
return Ox.parseSRT(srt).filter(function(annotation) { return Ox.parseSRT(srt).filter(function(annotation) {
return !Ox.isUndefined(annotation['in']) return !Ox.isUndefined(annotation['in'])
&& !Ox.isUndefined(annotation.out) && !Ox.isUndefined(annotation.out)
&& annotation['in'] <= annotation.out && annotation['in'] <= annotation.out
&& annotation.out <= duration && annotation.out <= options.duration
&& annotation.text; && annotation.text;
}); });
} }
function setStatus(status) {
$status.html(status);
}
function updateLanguageSelect() { function updateLanguageSelect() {
var layerType = Ox.getObjectById( var layerType = Ox.getObjectById(
pandora.site.layers, $layerSelect.value() pandora.site.layers, $layerSelect.value()