use more OxJS, remove unused code

This commit is contained in:
j 2016-02-29 17:26:25 +05:30
parent e476d2d408
commit 402eae8068
6 changed files with 148 additions and 269 deletions

View file

@ -5,10 +5,6 @@
text-align: center; text-align: center;
} }
#additionalFeatures {
display: none;
}
#wrapper { #wrapper {
margin-top: 30px; margin-top: 30px;
width: 100%; width: 100%;

View file

@ -123,13 +123,6 @@ A transcribing and subtitling tool for Firefox. It is used for transcribing vide
</div> </div>
<div id="txtWrapper"> <div id="txtWrapper">
<textarea id="txt" class="OxThemeClassic"></textarea><br /> <br /> <textarea id="txt" class="OxThemeClassic"></textarea><br /> <br />
<div id="additionalFeatures">
<div id="addTimeWrap">
Time to add: <input id="timeToAdd" /><br />
Start no: <input id="startNo" /> <button id="addTime">Add</button><br />
<textarea id="addTimeResult"></textarea>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

180
js/app.js
View file

@ -144,102 +144,103 @@ Ox.load({
.css({'position': 'fixed', 'top': '0px', 'left': '0px', 'right': '0px', 'height': '20px'}) .css({'position': 'fixed', 'top': '0px', 'left': '0px', 'right': '0px', 'height': '20px'})
.appendTo(Ox.$body) .appendTo(Ox.$body)
.bindEvent({ .bindEvent({
click: function(data) { click: function(data) {
if (data.id == 'load_video') { if (data.id == 'load_video') {
saveTxt(); saveTxt();
videoPath = undefined; videoPath = undefined;
videoHash = undefined; videoHash = undefined;
textArea.elem.val(''); textArea.elem.val('');
var path = data.files[0].name; var path = data.files[0].name;
if ($.inArray(getFileNameExt(path.toLowerCase()), [ var extension = Ox.last(path.toLowerCase().split('.'));
'oga', 'ogg', 'ogv', 'ogx', 'wav', 'webm', 'mp4', 'm4v' if (Ox.contains([
]) != -1) { 'oga', 'ogg', 'ogv', 'ogx', 'wav', 'webm', 'mp4', 'm4v'
loadVideo(data.files[0]); ], extension)) {
} else { loadVideo(data.files[0]);
alert('You can only open videos in formats supported by the browser.'); } else {
} alert('You can only open videos in formats supported by the browser.');
} else if(data.id == 'about') { }
var html = Ox.tmpl("dialog_about", {}); } else if(data.id == 'about') {
stDialog("About", html); var html = Ox.tmpl("dialog_about", {});
} else if(data.id == 'preferences') { stDialog("About", html);
var prefs = globalUser.get_prefs(["fontSize", "theme", "autosave"]); } else if(data.id == 'preferences') {
var html = Ox.tmpl("dialog_preferences", {}); var prefs = globalUser.get_prefs(["fontSize", "theme", "autosave"]);
stDialog("Preferences", html); var html = Ox.tmpl("dialog_preferences", {});
$('.pref_select').each(function() { stDialog("Preferences", html);
var that = this; $('.pref_select').each(function() {
var pref = $(this).attr("data-pref"); var that = this;
var prefVal = prefs[pref]; var pref = $(this).attr("data-pref");
$(this).children('option').each(function() { var prefVal = prefs[pref];
if ($(this).val() == prefVal) { $(this).children('option').each(function() {
$(this).attr("selected", "selected"); if ($(this).val() == prefVal) {
} $(this).attr("selected", "selected");
}); }
}); });
$('.pref_select').change(function() { });
var key = $(this).attr("data-pref"); $('.pref_select').change(function() {
var val = $(this).val(); var key = $(this).attr("data-pref");
globalUser.set_pref(key, val); var val = $(this).val();
}); globalUser.set_pref(key, val);
/* });
$('#pref_fontSize > option').each(function() { /*
if ($(this).val() == prefs.fontSize) { $('#pref_fontSize > option').each(function() {
$(this).attr("selected", "selected"); 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]);
}
loadDialog.close();
}
}),
],
content: Ox.Element().append(html)
}).open();
} }
});
$('#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]);
}
loadDialog.close();
}
}),
],
content: Ox.Element().append(html)
}).open();
} }
}
}); });
textArea = new TextArea("txt"); textArea = new TextArea("txt");
textArea.elem.val(''); textArea.elem.val('');
globalUser.init(); globalUser.init();
//autosave every 1 minute. //autosave every 1 minute.
window.autosaveInterval = setInterval(function() { window.autosaveInterval = setInterval(function() {
if (!Ox.isUndefined(videoHash)) { if (!Ox.isUndefined(videoHash)) {
saveTxt(); saveTxt();
@ -255,7 +256,6 @@ function loadTxt() {
} }
function saveTxt() { function saveTxt() {
var content = textArea.toSrt();
var txt = textArea.elem.val(); var txt = textArea.elem.val();
//console.log('saveTxt', videoHash, txt.length); //console.log('saveTxt', videoHash, txt.length);
globalUser.set_txt(videoHash, txt); globalUser.set_txt(videoHash, txt);

View file

@ -1,6 +1,3 @@
var url = "https://speedtrans.pad.ma";
//elem = string (elementId to make TextArea) //elem = string (elementId to make TextArea)
var TextArea = function(elem) { var TextArea = function(elem) {
this.elem = $('#' + elem); this.elem = $('#' + elem);
@ -39,7 +36,7 @@ TextArea.prototype.isTc = function() {
var pos = eDom.selectionStart; var pos = eDom.selectionStart;
var word = this.getWord(pos); var word = this.getWord(pos);
if (isValidTimecode(word)) { if (isValidTimecode(word)) {
return npt2ms(word); return Ox.parseDuration(word);
} else { } else {
return false; return false;
} }
@ -54,7 +51,7 @@ TextArea.prototype.insertTc = function(tcNpt) {
var val = this.elem.val(); var val = this.elem.val();
var pos = eDom.selectionStart; var pos = eDom.selectionStart;
if(!tcNpt) { if(!tcNpt) {
tcNpt = ms2npt(Video.get()); tcNpt = Ox.formatDuration(Video.get(), 3);
} }
var newVal = val.substring(0,pos) + "\n" + tcNpt + "\n" + val.substring(pos, val.length); var newVal = val.substring(0,pos) + "\n" + tcNpt + "\n" + val.substring(pos, val.length);
e.val(newVal); e.val(newVal);
@ -103,52 +100,29 @@ function cleanNewlines(str) {
TextArea.prototype.fromSrt = function(txt) { TextArea.prototype.fromSrt = function(txt) {
var that = this; var that = this;
this.spans = []; this.spans = [];
var cleaned = cleanNewlines(txt); var srt = Ox.parseSRT(txt);
var srt = strip(cleaned); Ox.print(srt);
var srt_ = srt.split('\n\n'); srt.forEach(function(s) {
var s; that.spans.push(new Span(s['in'], s.out, s.text, that.spans.length));
for(s in srt_) { });
st = srt_[s].split('\n');
if(st.length >=2) {
var n = st[0];
var i = strip(st[1].split(' --> ')[0]);
var o = strip(st[1].split(' --> ')[1]);
var t = st[2];
if(st.length > 2) {
for(j=3; j<st.length;j++) {
t += '\n'+st[j];
}
}
var is = toSeconds(i);
var os = toSeconds(o);
if (parseInt(n) - this.spans.length == 1) {
this.spans[this.spans.length] = new Span(is, os, t, that.spans.length);
} else {
return false;
}
}
}
var out = ''; var out = '';
var spans = this.spans; var spans = this.spans;
for (span in spans) { spans.forEach(function(sp, span) {
if (spans.hasOwnProperty(span)) { out += Ox.formatDuration(sp.tcInMs, 3) + "\n";
var sp = spans[span]; out += sp.text;
out += ms2npt(sp.tcInMs) + "\n"; out += "\n";
out += sp.text;
out += "\n";
//If the outpoint of current span is equal to inpoint of next span, dont print out timecode, and just add the extra \n to go to next span. //If the outpoint of current span is equal to inpoint of next span, dont print out timecode, and just add the extra \n to go to next span.
if (span < spans.length - 1) { if (span < spans.length - 1) {
var p = parseInt(span) + 1; var p = parseInt(span) + 1;
if (spans[p].tcInMs != sp.tcOutMs) { if (spans[p].tcInMs != sp.tcOutMs) {
out += ms2npt(sp.tcOutMs) + "\n\n"; out += Ox.formatDuration(sp.tcOutMs, 3) + "\n\n";
} else { } else {
out += "\n"; out += "\n";
}
} else if (parseInt(sp.tcOutMs) < Video.player.duration) {
out += "\n" + ms2npt(sp.tcOutMs) + "\n\n";
} }
} else if (parseInt(sp.tcOutMs) < Video.player.duration) {
out += "\n" + Ox.formatDuration(sp.tcOutMs, 3) + "\n\n";
} }
} });
this.elem.val(out); this.elem.val(out);
if (this.elem.val == '' || this.spans.length == 0) { if (this.elem.val == '' || this.spans.length == 0) {
return false; return false;
@ -161,48 +135,42 @@ function strip(s) {
return s.replace(/^\s+|\s+$/g,""); return s.replace(/^\s+|\s+$/g,"");
} }
function toSeconds(t) { function formatEnc(data) {
var s = 0.0; var r = '', n = 1;
if(t) { data.forEach(function(item) {
var p = t.split(':'); r += n + ' ' + formatFrames(item['in']) + ' ' + formatFrames(item.out) + ' ' + item.text;
for(i=0;i<p.length;i++) { r += '\n\n';
s = s * 60 + parseFloat(p[i].replace(',', '.')) n++;
} });
} return r;
return s;
} }
function spansToSrt(arr, fmt, start_no) { function spansToSrt(arr, fmt, start_no) {
if (typeof start_no == 'undefined') { if (typeof start_no == 'undefined') {
start_no = 1; start_no = 1;
} }
var srt = ''; var srt = [];
var srtNo = start_no; arr.forEach(function(s) {
for (var k=0; k < arr.length; k++) {
var s = arr[k];
if (s.text.trim() == '') { if (s.text.trim() == '') {
} else { } else {
var text = s.text.trim(); var text = s.text.trim();
linebreaksRegex = new RegExp('\n+', "g") linebreaksRegex = new RegExp('\n+', "g")
text = text.replace(linebreaksRegex, "\n"); text = text.replace(linebreaksRegex, "\n");
if (!s.tcOutMs) { if (!s.tcOutMs) {
s.tcOutMs = Video.player.duration; s.tcOutMs = Video.player.duration;
}
if (fmt == 'srt') {
srt += srtNo + " ";
srt += "\n";
srt += "0" + ms2npt(s.tcInMs).replace(".", ",") + " --> " + "0" + ms2npt(s.tcOutMs).replace(".", ",");
srt += "\n";
srt += text;
srt += "\n\n";
}
else if (fmt == 'enc') {
srt += srtNo + " " + ms2frames(s.tcInMs) + " " + ms2frames(s.tcOutMs) + " " + text;
srt += "\n\n";
}
srtNo++;
} }
srt.push({
'in': s.tcInMs,
out: s.tcOutMs,
text: text
});
} }
});
if (fmt == 'srt') {
return Ox.formatSRT(srt);
} else if (fmt == 'enc') {
return formatEnc(srt);
}
return srt; return srt;
} }
@ -241,24 +209,7 @@ TextArea.prototype.toSrt = function(fmt) {
this.spans = spans; this.spans = spans;
var srt = spansToSrt(spans, fmt); var srt = spansToSrt(spans, fmt);
//console.log(srt); //console.log(srt);
return Ox.encodeUTF8(srt); return srt;
}
TextArea.prototype.addTime = function(ms, start_no) {
//console.log(ms);
this.toSrt();
var s = [];
var spans = this.spans;
for (var i=0; i < spans.length;i++) {
s[i] = {
index: i,
tcOutMs: spans[i].tcOutMs + ms,
text: spans[i].text,
tcInMs: spans[i].tcInMs + ms
}
}
return spansToSrt(s, 'srt', start_no);
} }
@ -270,7 +221,7 @@ TextArea.prototype.toHTML = function() {
span = spans[i]; span = spans[i];
txt = ''; txt = '';
txt += '<p>\n'; txt += '<p>\n';
txt += '<a href="https://pad.ma/PADMA_VIDEO_ID/' + ms2npt(span.tcInMs) + "-" + ms2npt(span.tcOutMs) + '">'; txt += '<a href="https://pad.ma/PADMA_VIDEO_ID/' + Ox.formatDuration(span.tcInMs, 3) + "-" + Ox.formatDuration(span.tcOutMs, 3) + '">';
txt += (i + 1).toString(); txt += (i + 1).toString();
txt += "</a>\n"; txt += "</a>\n";
txt += '<br />\n'; txt += '<br />\n';
@ -285,9 +236,9 @@ TextArea.prototype.toHTML = function() {
//creates new Span (tcIn and tcOut in npt format) //creates new Span (tcIn and tcOut in npt format)
var Span = function(tcIn, tcOut, text, index) { var Span = function(tcIn, tcOut, text, index) {
this.index = index; this.index = index;
this.tcOutMs = npt2ms(tcOut); this.tcOutMs = Ox.isString(tcOut) ? Ox.parseDuration(tcOut) : tcOut;
this.text = text; this.text = text;
this.tcInMs = npt2ms(tcIn); this.tcInMs = Ox.isString(tcOut) ? Ox.parseDuration(tcIn) : tcIn;
} }
var SeekBar = function(elem) { var SeekBar = function(elem) {
@ -307,7 +258,7 @@ SeekBar.prototype.init = function() {
drag: function() { drag: function() {
clearInterval(videoListener); clearInterval(videoListener);
var pos = that.get(); var pos = that.get();
$('#timeCode').html(ms2npt(pos)); $('#timeCode').html(Ox.formatDuration(pos, 3));
}, },
stop: function() { stop: function() {
var pos = that.get(); var pos = that.get();
@ -432,7 +383,7 @@ function loadCuts(url, id) {
pandora_api('get', {id: id, keys: ['cuts']}, function(result) { pandora_api('get', {id: id, keys: ['cuts']}, function(result) {
var txt = ''; var txt = '';
result.data.cuts.forEach(function(cut) { result.data.cuts.forEach(function(cut) {
textArea.insertTc(ms2npt(cut)); textArea.insertTc(Ox.formatDuration(cut));
}); });
}); });
} }

View file

@ -121,12 +121,12 @@ VideoPlayer.prototype.togglePause = function() {
VideoPlayer.prototype.listener = function() { VideoPlayer.prototype.listener = function() {
var t = Video.get(); var t = Video.get();
var npt = ms2npt(t); var npt = Ox.formatDuration(t, 3);
$('#timeCode').html(npt); $('#timeCode').html(npt);
var seekBarPos = parseInt((t/Video.duration) * 320); var seekBarPos = parseInt((t/Video.duration) * 320);
$('#seekPointer').css("left", seekBarPos + "px"); $('#seekPointer').css("left", seekBarPos + "px");
} }
VideoPlayer.prototype.setDuration = function(duration) { VideoPlayer.prototype.setDuration = function(duration) {
this.duration = duration; this.duration = duration;
} }

View file

@ -1,88 +1,27 @@
function npt2ms(npt) { function formatFrames(seconds) {
var ms = 0.0 var npt = Ox.formatDuration(seconds, 3);
npt = String(npt);
var p = npt.split(':')
for(i=0;i<p.length;i++) {
ms = ms * 60 + parseFloat(p[i])
}
return ms;
}
function ms2npt(seconds) {
var ms = seconds * 1000;
var it, ss, mm, hh, npt;
var it = parseInt(ms / 1000)
ms = ms - it * 1000;
if (ms.toString().length > 3) {
ms = ms.toString().substring(0,3);
}
ss = it % 60;
mm = ((it - ss) / 60) % 60;
hh = ((it - (mm * 60) - ss) / 3600) % 60;
npt = hh+':'+strpad(mm.toString(), '0', 2, 'left')
npt += ':'+strpad(ss.toString(), '0', 2, 'left')
npt += '.'+strpad(ms.toString(), '0', 3, 'left')
return npt;
}
function ms2frames(ms, fmt) {
if (!fmt) var fmt = "PAL";
var npt = ms2npt(ms);
var dotpos = npt.lastIndexOf("."); var dotpos = npt.lastIndexOf(".");
var mmStr = npt.substring(dotpos + 1, npt.length); var mmStr = npt.substring(dotpos + 1, npt.length);
var mmInt = parseInt(mmStr); var mmInt = parseInt(mmStr);
if (fmt == 'PAL') { var frames = parseInt((mmInt / 1000) * 24);
var frames = parseInt((mmInt / 1000) * 24);
} else if (fmt == "NTSC") {
var frames = parseInt((mmInt / 1000) * 29.97);
}
var framesTc = ''; var framesTc = '';
var joinToken = ":"; var joinToken = ":";
var framesTc = npt.substring(0, dotpos ) + joinToken + frames; var framesTc = npt.substring(0, dotpos ) + joinToken + frames;
return framesTc; return framesTc;
} }
function ms2time(ms) {
var npt = ms2npt(ms)
return npt.substr(npt.length-9, npt.length-6);
}
function strpad(str, pad, len, dir) {
while (str.length < len) {
if (dir == 'left')
str = pad + str;
else if (dir == 'right')
str = str + pad;
}
return str;
}
function isValidTimecode(tc) { function isValidTimecode(tc) {
var tc = $.trim(tc); var tc = $.trim(tc);
var nptRegex = new RegExp("^[0-9][0-9]?\:[0-9][0-9]\:[0-9][0-9][\.|\,|\:][0-9]?[0-9]?[0-9]?$"); var nptRegex = new RegExp("^[0-9][0-9]?\:[0-9][0-9]\:[0-9][0-9][\.|\,|\:][0-9]?[0-9]?[0-9]?$");
return nptRegex.test(tc);to return nptRegex.test(tc);
}
//where filters is a JSON object, for eg. {'Video Files': '*.dv;*.ogg;*.ogv;*.ogx;*.avi;*.mov;*.mp4;*.mpeg;*.mpg;*.vob'}
function selectFile(filters, callback) {
alert('select file');
//fixme. select file
callback && callback(fp);
}
function getFileNameExt(filename) {
var dotPos = filename.lastIndexOf(".");
var ext = filename.substring(dotPos + 1, filename.length);
return ext;
} }
function getFileNameSansExt(filename) { function getFileNameSansExt(filename) {
var dotPos = filename.lastIndexOf("."); var dotPos = filename.lastIndexOf(".");
if (dotPos != '-1') { if (dotPos != '-1') {
var filenameSansExt = filename.substring(0,dotPos); var filenameSansExt = filename.substring(0, dotPos);
} else { } else {
var filenameSansExt = filename; var filenameSansExt = filename;
} }
return filenameSansExt; return filenameSansExt;
} }