split up js into multiple files

This commit is contained in:
Sanjay B 2013-03-04 14:14:48 +05:30
parent c726380a55
commit 7743617aac
11 changed files with 390 additions and 2 deletions

View File

@ -37,8 +37,13 @@
});
}
var prefix = "js/";
Ox.getFile([prefix + "pandora-ui.js"], function() {
var files = ['appPanel', 'mainMenu', 'mainPanel', 'videoPanel', 'videoPlayer', 'openRemoteDialog', 'helpPanel', 'textPanel', 'textArea', 'textToolBar'];
var prefix = "js/ui/";
var filesToLoad = Ox.map(files, function(v) {
return prefix + v + ".js";
});
//console.log(filesToLoad);
Ox.getFile(filesToLoad, function() {
initSpeedtrans();
});
}

18
js/ui/appPanel.js Normal file
View File

@ -0,0 +1,18 @@
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;
}

6
js/ui/helpPanel.js Normal file
View File

@ -0,0 +1,6 @@
pandora.ui.helpPanel = function() {
var that = Ox.Element().text("Help Panel");
return that;
};

66
js/ui/mainMenu.js Normal file
View File

@ -0,0 +1,66 @@
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;
}

18
js/ui/mainPanel.js Normal file
View File

@ -0,0 +1,18 @@
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;
}

62
js/ui/openRemoteDialog.js Normal file
View File

@ -0,0 +1,62 @@
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;
};

155
js/ui/textArea.js Normal file
View File

@ -0,0 +1,155 @@
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;
}

16
js/ui/textPanel.js Normal file
View File

@ -0,0 +1,16 @@
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;
}

4
js/ui/textToolBar.js Normal file
View File

@ -0,0 +1,4 @@
pandora.ui.textToolBar = function() {
var that = Ox.Bar();
return that;
}

16
js/ui/videoPanel.js Normal file
View File

@ -0,0 +1,16 @@
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;
}

22
js/ui/videoPlayer.js Normal file
View File

@ -0,0 +1,22 @@
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;
};