remove single file pandora-ui.js
This commit is contained in:
Sanjay B
parent
4336ddc8bf
commit
a8f1c960c9
389
js/pandora-ui.js
389
js/pandora-ui.js
|
|
@ -1,389 +0,0 @@
|
||||||
// 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: 'openLocalFileMenu', title: 'Open Local File', 'file': {
|
|
||||||
'maxFiles': 1
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{ id: 'openRemoteFileMenu', title: 'Open online pan.do/ra 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 == 'openLocalFileMenu') {
|
|
||||||
var file = data.files[0];
|
|
||||||
Ox.oshash(file, function(oshash) {
|
|
||||||
console.log(oshash);
|
|
||||||
var url = window.URL.createObjectURL(file);
|
|
||||||
var options = {
|
|
||||||
'type': 'local',
|
|
||||||
'url': url,
|
|
||||||
'name': oshash
|
|
||||||
}
|
|
||||||
pandora.$ui.textArea.speedtrans.load(options);
|
|
||||||
});
|
|
||||||
//console.log(data.files[0]);
|
|
||||||
|
|
||||||
} else if (data.id == 'openRemoteFileMenu') {
|
|
||||||
pandora.$ui.openRemoteDialog = pandora.ui.openRemoteDialog().open();
|
|
||||||
|
|
||||||
} else if (data.id == 'TestMenu1') {
|
|
||||||
alert("clicked TestMenu1");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
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 = pandora.$ui.videoPanel = Ox.SplitPanel({
|
|
||||||
elements: [
|
|
||||||
{
|
|
||||||
element: pandora.$ui.videoPlayer = Ox.Element().text("no video yet"),
|
|
||||||
size: 300
|
|
||||||
},
|
|
||||||
{
|
|
||||||
element: pandora.$ui.helpPanel = pandora.ui.helpPanel()
|
|
||||||
}
|
|
||||||
],
|
|
||||||
orientation: 'vertical'
|
|
||||||
});
|
|
||||||
return that;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
pandora.ui.videoPlayer = function(options) {
|
|
||||||
var url = options.url;
|
|
||||||
var timeline = options.timeline || "foo.png"; //FIXME
|
|
||||||
var that = pandora.$ui.videoPlayer = Ox.VideoPlayer({
|
|
||||||
video: url,
|
|
||||||
controlsTop: ['fullscreen'],
|
|
||||||
controlsBottom: ['play', 'volume', 'scale', 'timeline', 'position'],
|
|
||||||
height: 300,
|
|
||||||
width: 400,
|
|
||||||
showControlsOnLoad: true,
|
|
||||||
duration: 35,
|
|
||||||
timeline: timeline,
|
|
||||||
title: 'Test Video',
|
|
||||||
enableTimeline: true,
|
|
||||||
enableKeyboard: true,
|
|
||||||
enableMouse: true,
|
|
||||||
externalControls: true
|
|
||||||
// enableTimeline: true
|
|
||||||
});
|
|
||||||
return that;
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
pandora.ui.openRemoteDialog = function() {
|
|
||||||
// var $inputs = Ox.InputGroup({
|
|
||||||
// 'inputs': [
|
|
||||||
// Ox.Input({
|
|
||||||
// 'label': 'Pan.do/ra instance URL',
|
|
||||||
// 'id': 'pandoraInstance',
|
|
||||||
// 'width': 250
|
|
||||||
// }),
|
|
||||||
// Ox.Input({
|
|
||||||
// 'label': 'Pan.do/ra Video ID',
|
|
||||||
// 'id': 'pandoraID',
|
|
||||||
// 'width': 250
|
|
||||||
// })
|
|
||||||
// ],
|
|
||||||
// 'width': 250
|
|
||||||
// });
|
|
||||||
|
|
||||||
//FIXME: convert to SelectInput
|
|
||||||
var $input1 = Ox.Input({
|
|
||||||
'label': 'Pan.do/ra instance URL',
|
|
||||||
'id': 'pandoraInstance',
|
|
||||||
'labelWidth': 250,
|
|
||||||
'width': 600
|
|
||||||
}).css({'margin': '4px'});
|
|
||||||
|
|
||||||
var $input2 = Ox.Input({
|
|
||||||
'label': 'Pan.do/ra Video ID',
|
|
||||||
'id': 'pandoraID',
|
|
||||||
'labelWidth': 250,
|
|
||||||
'width': 600
|
|
||||||
}).css({'margin': '4px'});
|
|
||||||
|
|
||||||
|
|
||||||
var $content = Ox.Element().append($input1).append($input2);
|
|
||||||
var that = Ox.Dialog({
|
|
||||||
'content': $content.css({'padding': '12px'}),
|
|
||||||
'buttons': [
|
|
||||||
Ox.Button({
|
|
||||||
'group': true,
|
|
||||||
'id': 'loadRemoteVideoButton',
|
|
||||||
'title': 'Load Video'
|
|
||||||
}).bindEvent("click", function() {
|
|
||||||
var pandoraInstance = $input1.value();
|
|
||||||
var pandoraID = $input2.value();
|
|
||||||
var base_url = pandoraInstance + "/" + pandoraID;
|
|
||||||
var options = {
|
|
||||||
'name': base_url,
|
|
||||||
'url': base_url + "/480p.webm",
|
|
||||||
'type': 'remote'
|
|
||||||
};
|
|
||||||
pandora.$ui.textArea.speedtrans.load(options);
|
|
||||||
that.close();
|
|
||||||
})
|
|
||||||
],
|
|
||||||
'closeButton': true,
|
|
||||||
'title': 'Open Remote Video',
|
|
||||||
'width': 700,
|
|
||||||
'fixedSize': true
|
|
||||||
});
|
|
||||||
return that;
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
pandora.ui.helpPanel = function() {
|
|
||||||
var that = Ox.Element().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(pandora.$ui.videoPlayer.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 = pandora.$ui.videoPlayer.options("duration");
|
|
||||||
var srt = spansToSrt(duration, spans, fmt);
|
|
||||||
// console.log(srt);
|
|
||||||
return srt;
|
|
||||||
},
|
|
||||||
|
|
||||||
save: function() {
|
|
||||||
|
|
||||||
console.log(that.value());
|
|
||||||
var filename = pandora.$ui.videoPlayer.options("video");
|
|
||||||
console.log(filename);
|
|
||||||
pandora.storage(filename, {'text': that.value()});
|
|
||||||
},
|
|
||||||
load: function(options) {
|
|
||||||
console.log(options);
|
|
||||||
// if (options.type == 'local') {
|
|
||||||
// var file = options.file;
|
|
||||||
// var name = file.name;
|
|
||||||
// var url = window.URL.createObjectURL(file);
|
|
||||||
// } else if (options.type == 'remote') {
|
|
||||||
// var url = options.url;
|
|
||||||
// var name = options.name;
|
|
||||||
// }
|
|
||||||
var val = pandora.storage(options.name) || {'text': ''};
|
|
||||||
that.value(val.text);
|
|
||||||
var videoOptions = {
|
|
||||||
'url': options.url
|
|
||||||
};
|
|
||||||
pandora.$ui.videoPlayer = pandora.ui.videoPlayer(videoOptions);
|
|
||||||
//pandora.$ui.videoPlayer = videoElem;
|
|
||||||
pandora.$ui.videoPanel.replaceElement(0, pandora.$ui.videoPlayer);
|
|
||||||
//console.log(filename);
|
|
||||||
//$video.options("video", filename);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
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;
|
|
||||||
}
|
|
||||||
Loading…
Reference in New Issue
Block a user