216 lines
6.9 KiB
HTML
216 lines
6.9 KiB
HTML
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
|
<head>
|
||
|
<title>
|
||
|
Pad.ma: Subtitle n more...
|
||
|
</title>
|
||
|
<script type="text/javascript" src="jquery.js"></script>
|
||
|
<script type="text/javascript" src="player.js"></script>
|
||
|
<script type="text/javascript" src="jquery-ui.js"></script>
|
||
|
<script type="text/javascript" src="staticfuncs.js"></script>
|
||
|
<script type="text/javascript" src="classes.js"></script>
|
||
|
<link rel="stylesheet" href="styles.css" />
|
||
|
<script type="text/javascript">
|
||
|
//init globals
|
||
|
var seekBar;
|
||
|
var textArea;
|
||
|
var Video;
|
||
|
var filePath = false;
|
||
|
var spans;
|
||
|
var videoListener;
|
||
|
|
||
|
$(document).ready(function() {
|
||
|
textArea = new TextArea("txt");
|
||
|
$('#saveFile').click(saveFile);
|
||
|
$('#saveSrt').click(saveSrt);
|
||
|
$('#addTime').click(function() {
|
||
|
var timeToAdd = npt2ms($.trim($('#timeToAdd').val()));
|
||
|
var startNo = parseInt($('#startNo').val());
|
||
|
var r = textArea.addTime(timeToAdd, startNo);
|
||
|
$('#addTimeResult').val(r);
|
||
|
});
|
||
|
$('#showMore').toggle(function() {
|
||
|
$(this).text("Show Less Features");
|
||
|
$('#additionalFeatures').show("fast");
|
||
|
}, function() {
|
||
|
$(this).text("Show More Features");
|
||
|
$('#additionalFeatures').hide("fast");
|
||
|
});
|
||
|
$('#saveEncore').click(saveEncore);
|
||
|
$('#selectFile').click(function() {
|
||
|
var videoFile = selectFile();
|
||
|
filePath = getFileNameSansExt(videoFile);
|
||
|
var srtTxtFilename = filePath + ".srt.txt";
|
||
|
var srtFilename = filePath + ".srt";
|
||
|
var metaFilename = filePath + ".txt";
|
||
|
if (checkFileExists(srtTxtFilename)) {
|
||
|
loadSrtTxt(srtTxtFilename);
|
||
|
} else if (checkFileExists(srtFilename)) {
|
||
|
loadSrt(srtFilename);
|
||
|
}
|
||
|
if (checkFileExists(metaFilename)) {
|
||
|
loadMeta(metaFilename);
|
||
|
}
|
||
|
$('#video').attr("src", "file://" + videoFile);
|
||
|
document.getElementById("video").load();
|
||
|
$('#video').one("loadedmetadata", function() {
|
||
|
$('#selectFileDiv').fadeOut();
|
||
|
Video = new VideoPlayer();
|
||
|
Video.init("video");
|
||
|
//
|
||
|
// seekBar = new SeekBar("seekBar");
|
||
|
Video.setDuration(Video.player.duration);
|
||
|
$('#insertTc').click(textArea.insertTc);
|
||
|
/* $('#video').click(function() {
|
||
|
Video.togglePause();
|
||
|
});
|
||
|
*/
|
||
|
$('#video').dblclick(function() {
|
||
|
textArea.insertTc();
|
||
|
});
|
||
|
videoListener = setInterval(Video.listener, 250);
|
||
|
});
|
||
|
});
|
||
|
|
||
|
$(document).keyup(function(e) {
|
||
|
//Esc
|
||
|
if (e.keyCode == 27 && textArea.hasFocus) {
|
||
|
Video.togglePause();
|
||
|
}
|
||
|
//Ins
|
||
|
if (e.keyCode == 45) {
|
||
|
if (!textArea.isTc()) {
|
||
|
textArea.insertTc();
|
||
|
}
|
||
|
}
|
||
|
//Ctrl - Seek Back
|
||
|
if (e.keyCode == 17) {
|
||
|
var seekTime = parseInt(parseFloat($('#seekTime').val()) * 1000);
|
||
|
var currTime = Video.get();
|
||
|
var newTime = currTime - seekTime;
|
||
|
Video.set(newTime);
|
||
|
}
|
||
|
//Alt - Seek Fwd.
|
||
|
if (e.keyCode == 18) {
|
||
|
var seekTime = parseInt(parseFloat($('#seekTime').val()) * 1000);
|
||
|
var currTime = Video.get();
|
||
|
var newTime = currTime + seekTime;
|
||
|
Video.set(newTime);
|
||
|
}
|
||
|
|
||
|
//Space - togglePause if no focus on TA
|
||
|
if (e.keyCode == 32 && textArea.hasFocus == false) {
|
||
|
Video.togglePause();
|
||
|
}
|
||
|
});
|
||
|
$('#fillMeta').click(function() {
|
||
|
$('#txtWrapper').hide();
|
||
|
$('#eventMetadata').show();
|
||
|
});
|
||
|
$('#doneMetadata').click(function() {
|
||
|
$('#eventMetadata').hide();
|
||
|
$('#txtWrapper').show();
|
||
|
});
|
||
|
$('.eventMeta').each(function() {
|
||
|
var defVal = $(this).attr('data-default');
|
||
|
$(this).val(defVal);
|
||
|
$(this).focus(function() {
|
||
|
if ($(this).val() == $(this).attr("data-default")) {
|
||
|
$(this).val('');
|
||
|
}
|
||
|
}).blur(function() {
|
||
|
if ($(this).val() == '') {
|
||
|
$(this).val($(this).attr('data-default'));
|
||
|
}
|
||
|
});
|
||
|
});
|
||
|
});
|
||
|
|
||
|
function saveFile() {
|
||
|
var savePath = filePath + ".srt.txt";
|
||
|
var content = $('#txt').val();
|
||
|
if (mozillaSaveFile(savePath, content)) {
|
||
|
alert("saved file at " + savePath);
|
||
|
} else {
|
||
|
alert("error saving file");
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function saveSrt() {
|
||
|
var srtPath = filePath + ".srt";
|
||
|
var content = textArea.toSrt();
|
||
|
if (mozillaSaveFile(srtPath, content)) {
|
||
|
alert("export .srt file to " + srtPath);
|
||
|
} else {
|
||
|
alert("error exporting srt");
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function saveEncore() {
|
||
|
var encPath = filePath + ".enc.txt";
|
||
|
var content = textArea.toSrt("enc");
|
||
|
if (mozillaSaveFile(encPath, content)) {
|
||
|
alert("saved encore compatible subtitle file at " + encPath);
|
||
|
} else {
|
||
|
alert("error creating encore compatible subtitle file");
|
||
|
}
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
</head>
|
||
|
<body>
|
||
|
<div id="wrapper">
|
||
|
<div id="videoWrapper">
|
||
|
<div id="selectFileDiv">
|
||
|
<button id="selectFile">Select File</button>
|
||
|
</div>
|
||
|
<video id="video" src="" controls="true">
|
||
|
Sorry you need <a href="http://www.mozilla.com/en-US/firefox/all-beta.html">Firefox 3.5 Beta</a> for this to work.
|
||
|
</video>
|
||
|
<div id="seekBar">
|
||
|
|
||
|
</div>
|
||
|
<div id="timeCode">0:00:00.000</div>
|
||
|
<div id="helpWrapper">
|
||
|
Shortcuts: <br /><br />
|
||
|
Esc: Pause / Unpause <br />
|
||
|
Insert: Insert time-code<br />
|
||
|
Double-click in Textarea: insert time-code <br />
|
||
|
Double-click on video: insert time-code<br />
|
||
|
Double-click on time-code in textarea: Seek video to time-code. <br />
|
||
|
Ctrl / Alt: Seek back / forward <input id="seekTime" value="1" /> seconds.
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
<div id="txtWrapper">
|
||
|
<textarea id="txt"></textarea><br /> <br />
|
||
|
<div id="buttonsWrapper">
|
||
|
<!-- <button id="fillMeta" class="button">Enter Metadata</button> -->
|
||
|
<button id="saveFile" class="button">Save File</button>
|
||
|
<button id="saveSrt" class="button">Export SRT</button>
|
||
|
<button id="saveEncore" class="button">Export to Encore</button>
|
||
|
<button id="showMore" class="button">Show More Features</button>
|
||
|
</div>
|
||
|
<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 id="eventMetadata">
|
||
|
<input id="title" data-default="Title" class="eventMeta" /><br />
|
||
|
<input id="director" data-default="Director" class="eventMeta" /><br />
|
||
|
<input id="collection" data-default="Collection" class="eventMeta" /><br />
|
||
|
<input id="source" data-default="Source" class="eventMeta" /><br />
|
||
|
<textarea id="description" data-default="Event Description" class="eventMeta"></textarea><br />
|
||
|
Date: <input id="dateYear" data-default="YYYY" class="eventMeta" /> <input id="dateMonth" data-default="MM" class="eventMeta" /> <input id="dateDay" data-default="DD" class="eventMeta" /><br />
|
||
|
Logged by: <input id="loggedBy" data-default="Your name" class="eventMeta" /><br /><br />
|
||
|
<button id="doneMetadata" class="button">Done Adding Metadata</button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</body>
|
||
|
</html>
|