speedtrans/js/app.js

322 lines
10 KiB
JavaScript
Raw Normal View History

2015-04-21 14:25:36 +00:00
//init globals
var textArea;
var Video;
var filePath = false;
var videoListener;
var globalUser;
var videoPath = undefined;
var videoHash = undefined;
Ox.load({
UI: {theme: 'oxlight'},
}, function() {
2016-02-29 09:26:38 +00:00
Ox.$body.show();
globalUser = new User();
adjustSize();
$(document).keydown(function(e) {
if (!Video)
return;
//Esc
if (e.keyCode == 27) {
Video.togglePause();
if (!textArea.hasFocus) {
textArea.elem.focus();
}
e.preventDefault();
}
2015-04-21 14:25:36 +00:00
2016-02-29 09:26:38 +00:00
//The weird `~ key, currently in as a silly hack because Ranjana's Esc key does not work.
if (e.keyCode == 192) {
Video.togglePause();
e.preventDefault();
}
2015-04-21 14:25:36 +00:00
2016-02-29 09:26:38 +00:00
//Ins or TAB
if (e.keyCode == 45 || e.keyCode == 9) {
if (!textArea.isTc()) {
textArea.insertTc();
return false;
} else {
return false;
}
}
//Ctrl - Seek Back
if (e.keyCode == 17) {
2016-02-29 09:36:39 +00:00
var seekTime = parseFloat($('#seekTime').val());
2016-02-29 09:26:38 +00:00
var currTime = Video.get();
var newTime = currTime - seekTime;
Video.set(newTime);
}
//Alt - Seek Fwd.
if (e.keyCode == 18) {
2016-02-29 09:36:39 +00:00
var seekTime = parseFloat($('#seekTime').val());
2016-02-29 09:26:38 +00:00
var currTime = Video.get();
var newTime = currTime + seekTime;
Video.set(newTime);
}
2015-04-21 14:25:36 +00:00
2016-02-29 09:26:38 +00:00
//Space - togglePause if no focus on TA
if (e.keyCode == 32 && textArea.hasFocus == false) {
Video.togglePause();
}
2015-04-21 14:25:36 +00:00
2016-02-29 09:26:38 +00:00
//PageUp - volume Up:
if (e.keyCode == 33) {
Video.volUp();
return false;
}
2015-04-21 14:25:36 +00:00
2016-02-29 09:26:38 +00:00
if (e.keyCode == 34) {
Video.volDown();
return false;
}
});
$(window).bind('resize', adjustSize);
var mainMenu = new Ox.MainMenu({
extras: [],
menus: [
2015-04-21 14:25:36 +00:00
{
id: "speedtrans",
title: "SpeedTrans",
items: [
{ id: "about", title: "About" },
{},
{ id: "contact", title: "Contact", disabled: true}
]
},
{
id: "open",
title: "Open",
items: [
{ id: "load_video", title: "Video", file: {width: 192}},
{ id: "load_srt", title: "Open SRT File", file: {width: 192}},
2015-04-21 14:25:36 +00:00
]
},
{
id: "save",
title: "Save",
items: [
{ id: "save_srt", title: "Save SRT"},
2015-04-21 14:25:36 +00:00
]
},
{
id: "edit",
title: "Edit",
items: [
{ id: "preferences", title: "Preferences" }
]
},
{
id: "tools",
title: "Tools",
items: [
{ id: "add_time", title: "Add / Subtract time and export", disabled: true },
{ id: "export_encore", title: "Export Adobe Encore Subtitle Format" },
{ id: "export_html", title: "Export HTML" },
{},
{ id: "load_cuts", title: "Load cuts from pan.do/ra", disabled: false }
]
},
{
id: "upload",
title: "Upload",
items: [
{ id: "upload_padma", title: "Upload Transcript to Pad.ma", disabled: true }
]
},
{
id: "help",
title: "Help",
items: [
{ id: "shortcuts", title: "Keyboard Shortcuts" }
]
}
],
size: "large"
2016-02-29 09:26:38 +00:00
})
2016-02-29 12:11:53 +00:00
.css({'position': 'fixed', 'top': '0px', 'left': '0px', 'right': '0px', 'height': '20px'})
.appendTo(Ox.$body)
.bindEvent({
click: function(data) {
if (data.id == 'load_video') {
saveTxt();
videoPath = undefined;
videoHash = undefined;
textArea.elem.val('');
var path = data.files[0].name;
var extension = Ox.last(path.toLowerCase().split('.'));
if (Ox.contains([
'oga', 'ogg', 'ogv', 'ogx', 'wav', 'webm', 'mp4', 'm4v'
], extension)) {
loadVideo(data.files[0]);
} else {
alert('You can only open videos in formats supported by the browser.');
}
} else if(data.id == 'about') {
var html = Ox.tmpl("dialog_about", {});
stDialog("About", html);
} else if(data.id == 'preferences') {
var prefs = globalUser.get_prefs(["fontSize", "theme", "autosave"]);
var html = Ox.tmpl("dialog_preferences", {});
stDialog("Preferences", html);
$('.pref_select').each(function() {
var that = this;
var pref = $(this).attr("data-pref");
var prefVal = prefs[pref];
$(this).children('option').each(function() {
if ($(this).val() == prefVal) {
2016-02-29 11:56:25 +00:00
$(this).attr("selected", "selected");
}
});
2016-02-29 12:11:53 +00:00
});
$('.pref_select').change(function() {
var key = $(this).attr("data-pref");
var val = $(this).val();
globalUser.set_pref(key, val);
});
/*
$('#pref_fontSize > option').each(function() {
if ($(this).val() == prefs.fontSize) {
$(this).attr("selected", "selected");
}
});
$('#pref_theme > option').each(function() {
if ($(this).val() == prefs.theme) {
$(this).attr("selected", "selected");
}
});
*/
} else if(data.id == 'shortcuts') {
var html = Ox.tmpl("dialog_shortcuts", {});
stDialog("Keyboard Shortcuts", html);
} else if(data.id == 'save_srt') {
var content = textArea.toSrt();
saveContent(content, 'text/plain', getFileNameSansExt(videoPath) + '.srt');
} else if(data.id == 'load_srt') {
loadSrt(data.files[0]);
} else if(data.id == 'export_encore') {
var content = textArea.toSrt("enc");
saveContent(content, 'text/plain', getFileNameSansExt(videoPath) + '.enc.txt');
} else if(data.id == 'export_html') {
var content = textArea.toHTML();
saveContent(content, 'text/html', getFileNameSansExt(videoPath) + '.html');
} else if(data.id == 'load_cuts') {
var html = Ox.tmpl("dialog_load_cuts");
var loadDialog = Ox.Dialog({
buttons: [
Ox.Button({
title: "Cancel"
}).bindEvent({
click: function() {
loadDialog.close()
}
}),
Ox.Button({
title: "Load Cuts"
}).bindEvent({
click: function() {
var url = loadDialog.find('input')[0].value.trim();
var match = url.match(/(.*)\/([A-Z]+)$/);
if (match) {
loadCuts(match[1] + '/api/', match[2]);
2016-02-29 11:56:25 +00:00
}
2016-02-29 12:11:53 +00:00
loadDialog.close();
}
}),
],
content: Ox.Element().append(html)
}).open();
2016-02-29 11:56:25 +00:00
}
2016-02-29 12:11:53 +00:00
}
});
2016-02-29 09:26:38 +00:00
textArea = new TextArea("txt");
textArea.elem.val('');
globalUser.init();
2015-04-21 14:25:36 +00:00
2016-02-29 11:56:25 +00:00
//autosave every 1 minute.
2016-02-29 09:26:38 +00:00
window.autosaveInterval = setInterval(function() {
if (!Ox.isUndefined(videoHash)) {
saveTxt();
}
}, 60000);
2015-04-21 14:25:36 +00:00
});
2016-02-29 12:11:53 +00:00
function adjustSize() {
var baseHeight = $(window).height() - 24 - 16;
$('#txt').height(baseHeight);
var baseWidth = $(window).width() - 400 - 64;
$('#txt').width(baseWidth);
}
2015-04-21 14:25:36 +00:00
function loadTxt() {
2016-02-29 09:26:38 +00:00
var txt = globalUser.get_txt(videoHash);
//console.log('loadTxt', videoHash, txt.length);
textArea.elem.val(txt);
2015-04-21 14:25:36 +00:00
}
function saveTxt() {
2016-02-29 09:26:38 +00:00
var txt = textArea.elem.val();
//console.log('saveTxt', videoHash, txt.length);
globalUser.set_txt(videoHash, txt);
2015-04-21 14:25:36 +00:00
}
2015-12-20 23:54:18 +00:00
function saveContent(content, type, path) {
2015-12-25 13:47:47 +00:00
var blob = new Blob([content], {type: type});
var url = window.URL.createObjectURL(blob);
var a = document.createElement('a');
a.href = url;
a.download = path;
if (document.createEvent) {
var event = document.createEvent('MouseEvents');
event.initEvent('click', true, true);
2015-12-25 13:47:47 +00:00
a.dispatchEvent(event);
} else {
2015-12-25 13:47:47 +00:00
a.click();
}
2015-12-25 13:47:47 +00:00
window.URL.revokeObjectURL(url);
}
2015-04-21 14:25:36 +00:00
function stDialog(titleTxt, text) {
var that = Ox.Dialog({
buttons: [
Ox.Button({
title: "Close"
}).bindEvent({
click: function() {
that.close();
}
})
],
title: titleTxt,
content: Ox.Element().css({padding: '16px'}).append(text)
}).open()
return that;
2015-04-21 14:25:36 +00:00
}
2015-12-20 23:54:18 +00:00
function loadVideo(videoFile) {
2016-02-29 09:26:38 +00:00
Ox.oshash(videoFile, function(hash) {
videoHash = hash;
var storageKey = 'txt_' + videoHash;
if (storageKey in localStorage) {
loadTxt();
}
});
var videoUrl = URL.createObjectURL(videoFile);
videoPath = videoFile.name;
$('#video').attr("src", videoUrl);
$('#filepath').text(videoFile.path);
document.getElementById("video").load();
$('#video').one("loadedmetadata", function() {
Video = new VideoPlayer();
Video.init("video");
Video.setDuration(Video.player.duration);
$('#insertTc').click(textArea.insertTc);
videoListener = setInterval(Video.listener, 250);
});
};
2015-04-21 14:25:36 +00:00
$(window).unload(function() {
2016-02-29 09:26:38 +00:00
saveTxt();
2015-04-21 14:25:36 +00:00
});