diff --git a/static/js/editor.js b/static/js/editor.js index 3c7faebb..38652e99 100644 --- a/static/js/editor.js +++ b/static/js/editor.js @@ -169,6 +169,9 @@ pandora.ui.editor = function(data) { pandora.$ui.embedVideoDialog && pandora.$ui.embedVideoDialog.remove(); pandora.$ui.embedVideoDialog = pandora.ui.embedVideoDialog().open(); }, + exportannotations: function() { + // ... + }, find: function(data) { pandora.UI.set({itemFind: data.find}); }, @@ -186,7 +189,7 @@ pandora.ui.editor = function(data) { pandora.$ui.mainMenu.replaceItemMenu(); }, importannotations: function(data) { - pandora.ui.importAnnotations().open(); + pandora.ui.importAnnotationsDialog().open(); }, info: function(data) { pandora.ui.annotationDialog( diff --git a/static/js/importAnnotations.js b/static/js/importAnnotationsDialog.js similarity index 65% rename from static/js/importAnnotations.js rename to static/js/importAnnotationsDialog.js index 7bd53f66..1523a398 100644 --- a/static/js/importAnnotations.js +++ b/static/js/importAnnotationsDialog.js @@ -1,68 +1,127 @@ // vim: et:ts=4:sw=4:sts=4:ft=javascript 'use strict'; -pandora.ui.importAnnotations = function(data) { - var content = Ox.Element().css({margin: '16px'}), - file, - height = 128, - layers = pandora.site.layers.filter(function(layer) { +pandora.ui.importAnnotationsDialog = function(data) { + + var layers = pandora.site.layers.filter(function(layer) { return layer.canAddAnnotations[pandora.user.level]; }), - layer, - srt = [], - total = 0, - importButton, - selectLayer, - selectFile, - that = Ox.Dialog({ - buttons: [ - Ox.Button({ - id: 'close', - title: Ox._('Close') - }).bindEvent({ - click: function() { - that.close(); - } - }), - importButton = Ox.Button({ - disabled: true, - id: 'import', - title: Ox._('Import') - }).bindEvent({ - click: function() { - importButton.hide(); - addAnnotations(); - } - }) - ], - closeButton: true, - content: content, - keys: { - 'escape': 'close' - }, - height: 128, - removeOnClose: true, - width: 368, - title: Ox._('Import Annotations') + + languages = Ox.sortBy(Ox.LANGUAGES.map(function(language) { + return {id: language.code, title: language.name}; + }, 'title')), + + $content = Ox.Element() + .css({margin: '16px'}), + + $layerSelect = Ox.Select({ + items: layers, + label: Ox._('Layer'), + labelWidth: 128 + width: 384 + }) + .css({ + marginTop: '16px' + }) + .appendTo($content), + + $languageSelect = Ox.Select({ + items: layers, + label: Ox._('Language'), + labelWidth: 128 + width: 384 + }) + .css({ + marginTop: '16px' + }) + .appendTo($content), + + $fileInput = Ox.FileInput({ + max: 1, + width: 384 + }) + .css({ + marginTop: '16px' }) .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.$('