281 lines
8.0 KiB
JavaScript
281 lines
8.0 KiB
JavaScript
|
// vim: et:ts=4:sw=4:sts=4:ft=javascript
|
||
|
|
||
|
"use strict";
|
||
|
|
||
|
pandora.ui.appPanel = function() {
|
||
|
var that = Ox.SplitPanel({
|
||
|
elements: [
|
||
|
{
|
||
|
element: pandora.$ui.mainMenu = pandora.ui.mainMenu(),
|
||
|
size: 20
|
||
|
},
|
||
|
{
|
||
|
element: pandora.$ui.mainPanel = pandora.ui.mainPanel()
|
||
|
}
|
||
|
],
|
||
|
orientation: 'vertical'
|
||
|
});
|
||
|
|
||
|
return that;
|
||
|
}
|
||
|
|
||
|
pandora.ui.mainMenu = function() {
|
||
|
var that = Ox.MainMenu({
|
||
|
extras: [],
|
||
|
id: 'mainMenu',
|
||
|
menus: [
|
||
|
{
|
||
|
'id': 'speedtransMenu',
|
||
|
'title': 'Speedtrans',
|
||
|
'items': [
|
||
|
{ id: 'TestMenu1', title: 'Test Menu Item'},
|
||
|
{ id: 'TestMenu2', title: 'Test Menu Itemm'}
|
||
|
]
|
||
|
|
||
|
},
|
||
|
{
|
||
|
'id': 'fileMenu',
|
||
|
'title': 'File',
|
||
|
'items': [
|
||
|
{ id: 'openFileMenu', title: 'Open File'},
|
||
|
{ id: 'saveFileMenu', title: 'Save File', keyboard: 'shift control s'}
|
||
|
]
|
||
|
}
|
||
|
|
||
|
]
|
||
|
})
|
||
|
.bindKeyboard()
|
||
|
.bindEvent({
|
||
|
click: function(data) {
|
||
|
// Ox.print(data);
|
||
|
var selected = data.id;
|
||
|
if (data.id == 'saveFileMenu') {
|
||
|
pandora.$ui.textArea.speedtrans.save();
|
||
|
// speedtrans.saveFile();
|
||
|
} else if (data.id == 'openFileMenu') {
|
||
|
pandora.$ui.textArea.speedtrans.load("/A/480p.webm");
|
||
|
}
|
||
|
},
|
||
|
key_control_shift_s: function() {
|
||
|
pandora.$ui.textArea.speedtrans.save();
|
||
|
}
|
||
|
});
|
||
|
|
||
|
return that;
|
||
|
}
|
||
|
|
||
|
pandora.ui.mainPanel = function() {
|
||
|
var that = Ox.SplitPanel({
|
||
|
elements: [
|
||
|
{
|
||
|
element: pandora.$ui.videoPanel = pandora.ui.videoPanel(),
|
||
|
size: 400,
|
||
|
resizable: true,
|
||
|
resize: [0,600]
|
||
|
},
|
||
|
{
|
||
|
element: pandora.$ui.textPanel = pandora.ui.textPanel()
|
||
|
}
|
||
|
],
|
||
|
orientation: 'horizontal'
|
||
|
});
|
||
|
return that;
|
||
|
}
|
||
|
|
||
|
pandora.ui.videoPanel = function() {
|
||
|
var that = Ox.SplitPanel({
|
||
|
elements: [
|
||
|
{
|
||
|
element: pandora.$ui.videoPlayer = pandora.ui.videoPlayer(),
|
||
|
size: 300
|
||
|
},
|
||
|
{
|
||
|
element: pandora.$ui.helpPanel = pandora.ui.helpPanel()
|
||
|
}
|
||
|
],
|
||
|
orientation: 'vertical'
|
||
|
});
|
||
|
return that;
|
||
|
}
|
||
|
|
||
|
pandora.ui.videoPlayer = function() {
|
||
|
var that = Ox.VideoPlayer({
|
||
|
video: '/A/480p.webm',
|
||
|
controlsTop: ['play', 'fullscreen', 'scale', 'position'],
|
||
|
controlsBottom: ['timeline'],
|
||
|
height: 300,
|
||
|
width: 400,
|
||
|
showControlsOnLoad: true,
|
||
|
duration: 35,
|
||
|
timeline: '/speedtrans/img/timeline16p.png',
|
||
|
title: 'Test Video',
|
||
|
enableTimeline: true,
|
||
|
enableKeyboard: true,
|
||
|
enableMouse: true,
|
||
|
externalControls: true
|
||
|
// enableTimeline: true
|
||
|
});
|
||
|
return that;
|
||
|
}
|
||
|
|
||
|
pandora.ui.helpPanel = function() {
|
||
|
var that = $('<div>').text("Help Panel");
|
||
|
return that;
|
||
|
}
|
||
|
|
||
|
pandora.ui.textPanel = function() {
|
||
|
var that = Ox.SplitPanel({
|
||
|
elements: [
|
||
|
{
|
||
|
element: pandora.$ui.textArea = pandora.ui.textArea()
|
||
|
},
|
||
|
{
|
||
|
element: pandora.$ui.textToolBar = pandora.ui.textToolBar(),
|
||
|
size: 20
|
||
|
}
|
||
|
],
|
||
|
orientation: 'vertical'
|
||
|
});
|
||
|
return that;
|
||
|
}
|
||
|
|
||
|
pandora.ui.textArea = function() {
|
||
|
var that = Ox.Input({
|
||
|
type: 'textarea',
|
||
|
width: 400,
|
||
|
height: 400,
|
||
|
changeOnKeypress: true
|
||
|
});
|
||
|
var $video = pandora.$ui.videoPlayer;
|
||
|
|
||
|
that.speedtrans = {
|
||
|
spans: [],
|
||
|
insertTc: function() {
|
||
|
var eDom = that.find("textarea").get(0); //FIXME
|
||
|
var scrollTop = eDom.scrollTop;
|
||
|
var val = that.value();
|
||
|
var pos = eDom.selectionStart;
|
||
|
var tcNpt = ms2npt($video.options("position") * 1000);
|
||
|
var newVal = val.substring(0,pos) + "\n" + tcNpt + "\n" + val.substring(pos, val.length);
|
||
|
that.value(newVal);
|
||
|
that.find("textarea").focus(); //FIXME
|
||
|
eDom.selectionStart = pos + tcNpt.length + 2;
|
||
|
eDom.selectionEnd = pos + tcNpt.length + 2;
|
||
|
eDom.scrollTop = scrollTop + 15;
|
||
|
},
|
||
|
isTc: function() {
|
||
|
var eDom = that.find("textarea").get(0);
|
||
|
var val = that.value();
|
||
|
var pos = eDom.selectionStart;
|
||
|
var word = that.speedtrans.getWord(pos, val);
|
||
|
|
||
|
if (isValidTimecode(word)) {
|
||
|
return npt2ms(word);
|
||
|
} else {
|
||
|
return false;
|
||
|
}
|
||
|
},
|
||
|
getWord: function(pos, val) {
|
||
|
var c;
|
||
|
var i = pos;
|
||
|
var j = pos;
|
||
|
while (c != " " && c != "\n") {
|
||
|
if (i==0) {
|
||
|
i = -1;
|
||
|
break;
|
||
|
}
|
||
|
i--;
|
||
|
c = val.substring(i,i+1);
|
||
|
}
|
||
|
var firstLetter = i+1;
|
||
|
var d;
|
||
|
while (d != " " && d != "\n") {
|
||
|
if (j >= val.length) {
|
||
|
break;
|
||
|
}
|
||
|
j++;
|
||
|
d = val.substring(j,j+1);
|
||
|
}
|
||
|
var lastLetter = j;
|
||
|
var word = val.substring(firstLetter, lastLetter);
|
||
|
return word;
|
||
|
},
|
||
|
toSrt: function(fmt) {
|
||
|
if (!fmt) var fmt = 'srt';
|
||
|
var text = cleanNewlines(that.value());
|
||
|
var lines = [];
|
||
|
lines = text.split("\n");
|
||
|
var i=0;
|
||
|
var j=0;
|
||
|
var spans = this.spans = [];
|
||
|
while (i < lines.length) {
|
||
|
var l = lines[i];
|
||
|
if (isValidTimecode(l.trim())) {
|
||
|
var tcIn = l.trim();
|
||
|
var t = "";
|
||
|
var thisLine = '';
|
||
|
while (!isValidTimecode(thisLine.trim())) {
|
||
|
i++;
|
||
|
if (i >= lines.length) {
|
||
|
break;
|
||
|
}
|
||
|
thisLine = lines[i];
|
||
|
if (!isValidTimecode(thisLine.trim())) {
|
||
|
t += thisLine + "\n";
|
||
|
}
|
||
|
}
|
||
|
var tcOut = $.trim(thisLine);
|
||
|
spans[j] = {
|
||
|
tcInMs: npt2ms(tcIn),
|
||
|
tcOutMs: npt2ms(tcOut),
|
||
|
text: t,
|
||
|
index: j
|
||
|
};
|
||
|
//this.spans.push(spans[j]);
|
||
|
j++;
|
||
|
} else {
|
||
|
i++;
|
||
|
}
|
||
|
}
|
||
|
this.spans = spans;
|
||
|
var duration = $video.options("duration");
|
||
|
var srt = spansToSrt(duration, spans, fmt);
|
||
|
// console.log(srt);
|
||
|
return srt;
|
||
|
},
|
||
|
|
||
|
save: function() {
|
||
|
var filename = $video.options("video");
|
||
|
localStorage[filename] = that.value();
|
||
|
},
|
||
|
load: function(filename) {
|
||
|
var val = localStorage[filename] || '';
|
||
|
that.value(val);
|
||
|
}
|
||
|
};
|
||
|
that.bindEvent({
|
||
|
key_control_space: function() {
|
||
|
$video.options("paused", !$video.options("paused"));
|
||
|
that.find("textarea").focus(); //FIXME
|
||
|
},
|
||
|
key_control_x: function() {
|
||
|
that.speedtrans.insertTc();
|
||
|
},
|
||
|
key_control_shift_s: function() {
|
||
|
that.speedtrans.save();
|
||
|
}
|
||
|
});
|
||
|
that.dblclick(function() {
|
||
|
var tc = that.speedtrans.isTc();
|
||
|
if (tc) {
|
||
|
$video.options("position", tc / 1000);
|
||
|
}
|
||
|
});
|
||
|
return that;
|
||
|
}
|
||
|
|
||
|
pandora.ui.textToolBar = function() {
|
||
|
var that = Ox.Bar();
|
||
|
return that;
|
||
|
}
|