0x2620/pandora
2
1
Fork 1
Code Issues 1.3k Pull requests Releases Wiki Activity

update importAnnotationsDialog

Browse source
This commit is contained in:
rolux 2014-09-17 15:10:17 +02:00
parent dbac45f7ac
commit 8b69ef1e47
2 changed files with 114 additions and 106 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
static/js/editor.js
View file

@ -169,6 +169,9 @@ pandora.ui.editor = function(data) {
pandora.$ui.embedVideoDialog && pandora.$ui.embedVideoDialog.remove(); pandora.$ui.embedVideoDialog && pandora.$ui.embedVideoDialog.remove();
pandora.$ui.embedVideoDialog = pandora.ui.embedVideoDialog().open(); pandora.$ui.embedVideoDialog = pandora.ui.embedVideoDialog().open();
}, },
exportannotations: function() {
// ...
},
find: function(data) { find: function(data) {
pandora.UI.set({itemFind: data.find}); pandora.UI.set({itemFind: data.find});
}, },
@ -186,7 +189,7 @@ pandora.ui.editor = function(data) {
pandora.$ui.mainMenu.replaceItemMenu(); pandora.$ui.mainMenu.replaceItemMenu();
}, },
importannotations: function(data) { importannotations: function(data) {
pandora.ui.importAnnotations().open(); pandora.ui.importAnnotationsDialog().open();
}, },
info: function(data) { info: function(data) {
pandora.ui.annotationDialog( pandora.ui.annotationDialog(

215
static/js/importAnnotations.js → static/js/importAnnotationsDialog.js
View file

@ -1,68 +1,127 @@
// 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.importAnnotations = function(data) { pandora.ui.importAnnotationsDialog = function(data) {
var content = Ox.Element().css({margin: '16px'}),
file, var layers = pandora.site.layers.filter(function(layer) {
height = 128,
layers = pandora.site.layers.filter(function(layer) {
return layer.canAddAnnotations[pandora.user.level]; return layer.canAddAnnotations[pandora.user.level];
}), }),
layer,
srt = [], languages = Ox.sortBy(Ox.LANGUAGES.map(function(language) {
total = 0, return {id: language.code, title: language.name};
importButton, }, 'title')),
selectLayer,
selectFile, $content = Ox.Element()
that = Ox.Dialog({ .css({margin: '16px'}),
buttons: [
Ox.Button({ $layerSelect = Ox.Select({
id: 'close', items: layers,
title: Ox._('Close') label: Ox._('Layer'),
}).bindEvent({ labelWidth: 128
click: function() { width: 384
that.close(); })
} .css({
}), marginTop: '16px'
importButton = Ox.Button({ })
disabled: true, .appendTo($content),
id: 'import',
title: Ox._('Import') $languageSelect = Ox.Select({
}).bindEvent({ items: layers,
click: function() { label: Ox._('Language'),
importButton.hide(); labelWidth: 128
addAnnotations(); width: 384
} })
}) .css({
], marginTop: '16px'
closeButton: true, })
content: content, .appendTo($content),
keys: {
'escape': 'close' $fileInput = Ox.FileInput({
}, max: 1,
height: 128, width: 384
removeOnClose: true, })
width: 368, .css({
title: Ox._('Import Annotations') marginTop: '16px'
}) })
.bindEvent({ .bindEvent({
close: function(data) { change: function(data) {
if (data.files.length) {
var reader = new FileReader();
reader.onloadend = function(event) {
srt = parseSRT(this.result);
total = srt.length;
if (total && layer) {
importButton.options({disabled: false});
selectLayer.hide();
selectFile.hide();
}
setStatus(
Ox._('File contains {0} annotation'
+ (total == 1 ? '' : 's') + '.', [total])
);
};
reader.readAsText(data.files[0]);
} else {
srt = [];
total = 0;
importButton.options({
disabled: true
});
}
}
})
.appendTo($content),
$status = Ox.$('<div>')
.css({
marginTop: '16px'
})
.html('foo')
.appendTo($content),
$closeButton = Ox.Button({
id: 'close',
title: Ox._('Close')
})
.bindEvent({
click: function() {
that.close(); that.close();
} }
}), }),
$status = $('<div>').css({
padding: '4px',
paddingBottom: '8px'
}).appendTo(content);
setStatus(Ox._('Please select layer and .srt file')) $importButton = Ox.Button({
disabled: true,
id: 'import',
title: Ox._('Import')
}).bindEvent({
click: function() {
// ...
}
}),
that = Ox.Dialog({
buttons: [
$closeButton,
$importButton
],
content: $content,
height: 144,
keys: {
escape: 'close'
},
removeOnClose: true,
title: Ox._('Import Annotations'),
width: 416
});
function addAnnotations() { function addAnnotations() {
var annotations, task; var annotations, task;
if (srt.length > 0) { if (srt.length > 0) {
setStatus(Ox._('Loading...')); setStatus(Ox._('Loading...'));
var annotations = srt.filter(function(data) { var annotations = srt.filter(function(data) {
return !Ox.isUndefined(data['in']) && !Ox.isUndefined(data.out) && data.text; return !Ox.isUndefined(data['in'])
&& !Ox.isUndefined(data.out)
&& data.text;
}).map(function(data) { }).map(function(data) {
return { return {
'in': data['in'], 'in': data['in'],
@ -99,6 +158,7 @@ pandora.ui.importAnnotations = function(data) {
}); });
} }
} }
function parseSRT(data) { function parseSRT(data) {
var srt = Ox.parseSRT(data), var srt = Ox.parseSRT(data),
length = srt.length - 1; length = srt.length - 1;
@ -118,61 +178,6 @@ pandora.ui.importAnnotations = function(data) {
$status.html(status); $status.html(status);
} }
selectLayer = Ox.Select({
items: layers,
title: Ox._('Select Layer'),
})
.css({
margin: '4px 2px 4px 4px'
})
.bindEvent({
change: function(data) {
selectLayer.options({
title: null
});
layer = data.value;
total && layer && importButton.options({disabled: false});
}
})
.appendTo(content);
selectFile = Ox.FileButton({
image: 'upload',
lbael: 'File',
title: Ox._('Select SRT...'),
width: 156
})
.css({
margin: '4px 2px 4px 4px'
})
.bindEvent({
click: function(data) {
if (data.files.length) {
var reader = new FileReader();
reader.onloadend = function(event) {
srt = parseSRT(this.result);
total = srt.length;
if (total && layer) {
importButton.options({disabled: false});
selectLayer.hide();
selectFile.hide();
}
setStatus(
Ox._('File contains {0} annotation'
+ (total == 1 ? '' : 's') + '.', [total])
);
};
reader.readAsText(data.files[0]);
} else {
srt = [];
total = 0;
importButton.options({
disabled: true
});
}
}
})
.appendTo(content);
return that; return that;
}; };