|
|
@ -37,7 +37,11 @@ pandora.ui.mainMenu = function() { |
|
|
|
'id': 'fileMenu', |
|
|
|
'title': 'File', |
|
|
|
'items': [ |
|
|
|
{ id: 'openFileMenu', title: 'Open File'}, |
|
|
|
{ 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'} |
|
|
|
] |
|
|
|
} |
|
|
@ -52,8 +56,25 @@ pandora.ui.mainMenu = function() { |
|
|
|
if (data.id == 'saveFileMenu') { |
|
|
|
pandora.$ui.textArea.speedtrans.save(); |
|
|
|
// speedtrans.saveFile();
|
|
|
|
} else if (data.id == 'openFileMenu') { |
|
|
|
pandora.$ui.textArea.speedtrans.load("/A/480p.webm"); |
|
|
|
} 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() { |
|
|
@ -83,10 +104,10 @@ pandora.ui.mainPanel = function() { |
|
|
|
} |
|
|
|
|
|
|
|
pandora.ui.videoPanel = function() { |
|
|
|
var that = Ox.SplitPanel({ |
|
|
|
var that = pandora.$ui.videoPanel = Ox.SplitPanel({ |
|
|
|
elements: [ |
|
|
|
{ |
|
|
|
element: pandora.$ui.videoPlayer = pandora.ui.videoPlayer(), |
|
|
|
element: pandora.$ui.videoPlayer = Ox.Element().text("no video yet"), |
|
|
|
size: 300 |
|
|
|
}, |
|
|
|
{ |
|
|
@ -98,16 +119,20 @@ pandora.ui.videoPanel = function() { |
|
|
|
return that; |
|
|
|
} |
|
|
|
|
|
|
|
pandora.ui.videoPlayer = function() { |
|
|
|
var that = Ox.VideoPlayer({ |
|
|
|
video: '/A/480p.webm', |
|
|
|
controlsTop: ['play', 'fullscreen', 'scale', 'position'], |
|
|
|
controlsBottom: ['timeline'], |
|
|
|
|
|
|
|
//FIXME: should be ui.videoPlayer
|
|
|
|
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: '/speedtrans/img/timeline16p.png', |
|
|
|
timeline: timeline, |
|
|
|
title: 'Test Video', |
|
|
|
enableTimeline: true, |
|
|
|
enableKeyboard: true, |
|
|
@ -116,12 +141,77 @@ pandora.ui.videoPlayer = function() { |
|
|
|
// 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 = $('<div>').text("Help Panel"); |
|
|
|
var that = Ox.Element().text("Help Panel"); |
|
|
|
return that; |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
pandora.ui.textPanel = function() { |
|
|
|
var that = Ox.SplitPanel({ |
|
|
@ -155,7 +245,7 @@ pandora.ui.textArea = function() { |
|
|
|
var scrollTop = eDom.scrollTop; |
|
|
|
var val = that.value(); |
|
|
|
var pos = eDom.selectionStart; |
|
|
|
var tcNpt = ms2npt($video.options("position") * 1000); |
|
|
|
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
|
|
|
@ -238,19 +328,39 @@ pandora.ui.textArea = function() { |
|
|
|
} |
|
|
|
} |
|
|
|
this.spans = spans; |
|
|
|
var duration = $video.options("duration"); |
|
|
|
var duration = pandora.$ui.videoPlayer.options("duration"); |
|
|
|
var srt = spansToSrt(duration, spans, fmt); |
|
|
|
// console.log(srt);
|
|
|
|
return srt; |
|
|
|
}, |
|
|
|
|
|
|
|
save: function() { |
|
|
|
var filename = $video.options("video"); |
|
|
|
pandora.storage(filename, that.value); |
|
|
|
|
|
|
|
console.log(that.value()); |
|
|
|
var filename = pandora.$ui.videoPlayer.options("video"); |
|
|
|
console.log(filename); |
|
|
|
pandora.storage(filename, {'text': that.value()}); |
|
|
|
}, |
|
|
|
load: function(filename) { |
|
|
|
var val = pandora.storage(filename) || ''; |
|
|
|
that.value(val); |
|
|
|
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({ |
|
|
|