padmaEssay/text.js

167 lines
4.8 KiB
JavaScript
Raw Normal View History

2010-11-14 01:57:18 +00:00
var padmaContainer;
$(function() {
padmaContainer = $('#padmaSidebar');
padmaContainer.data("currentVideo", false);
var docWidth = $(document).width();
var essayWidth = docWidth - 360;
$('#essay').css("width", essayWidth);
});
function setupPadmaLink(videoObj, data) {
var $a = $(data.jq);
// $a.data("isDisplayed", false);
var linkData = data.linkData;
if (linkData.type != 'tcRange') {
return false;
}
//FIXME: put this as a variable, option somewhere?
var $container = padmaContainer;
videoObj.currentLayers = [];
switch (linkData.type) {
case "tcRange":
var mid_frame_npt = ms2npt(parseInt((npt2ms(linkData.tcIn) + npt2ms(linkData.tcOut)) / 2));
// console.log(mid_frame_npt);
var thumbUrl = videoObj.getFrame(mid_frame_npt);
break;
default:
var frame_npt = ms2npt(videoObj.video.poster_frame);
var thumbUrl = videoObj.getFrame(frame_npt);
}
//FIXME: Html may need to be conditional on linkData.type, probably put html in switch case above.
var html = tmpl("tmpl_tooltip", {'video': videoObj, 'thumbUrl': thumbUrl, 'linkData': linkData});
// $a.attr("title", title);
$a.tooltip({
bodyHandler: function() {
return html;
},
showURL: false
});
$a.click(function(e) {
// sidebarAnimateIn();
e.preventDefault();
var currentVideo = padmaContainer.data("currentVideo");
if (currentVideo == videoObj) {
/*
if (!isSidebarVisible()) {
sidebarAnimateIn();
}
*/
return;
}
if (currentVideo) {
cleanupVideo(currentVideo);
}
$container.data("currentVideo", videoObj);
if (!isSidebarVisible()) {
sidebarAnimateIn();
}
videoObj.getLayersData(displayLayer, {'linkData': linkData});
$('#loading').fadeTo(0.5);
function displayLayer(videoObj, data) {
$('#loading').fadeOut();
var linkData = data.linkData;
var html = tmpl("tmpl_sidebar", {'video': videoObj, 'linkData': linkData});
$('#padmaSidebarWrapper').html(html);
$('#aboutTxt').hide();
//FIXME: should be a better way to deal with displaying default layer.
var currentLayers = videoObj.getLayersAtTimecode(npt2ms(linkData.tcIn));
var transcripts = filterLayersByTracks(currentLayers, ['transcript']);
// console.log(transcripts);
if (transcripts.length > 0) {
var annotHtml = transcripts[0].value_html;
} else {
var annotHtml = '';
}
$('.annotationText').html(annotHtml);
/*
var closeBtn = $('<div />')
.addClass("close")
.click(function() {
sidebarAnimateOut();
})
.text("x")
.appendTo('.padmaViewer');
*/
var videoElem = $('video');
// var videoObj = video;
videoElem.bind("play", function() {
var that = this
videoObj.interval = setInterval(function() {
var currentTime = parseInt(that.currentTime * 1000);
var time_ms = currentTime + npt2ms(linkData.tcIn);
var allLayers = videoObj.getLayersAtTimecode(time_ms);
if (videoObj.currentLayers == allLayers) {
return;
}
// GLOBAL_FOO = allLayers;
var transcript = filterLayersByTracks(allLayers, ['transcript'])[0].value_html;
if (transcript != $('.annotationText').html()) {
$('.annotationText').html(transcript);
}
}, 150);
});
videoElem.bind("pause", function() {
clearInterval(videoObj.interval);
});
videoElem.bind("ended", function() {
clearInterval(videoObj.interval);
// cleanupVideo(videoObj);
sidebarAnimateOut();
});
}
function sidebarAnimateIn() {
/*
$container.animate({'width': '400px'}, function() {
$(this).animate({'backgroundColor': '#000000'});
});
var docWidth = $(document).width();
var newWidth = docWidth - 440;
$('#essay').animate({'width': newWidth + "px"});
*/
// $container.show();
$('#aboutTxt').fadeOut();
}
function sidebarAnimateOut() {
$container.find('.padmaViewer').empty();
$('#aboutTxt').show();
/*
$container.animate({'width': '0px'}, function() {
$(this).animate({'backgroundColor': '#ffffff'});
});
$('#essay').animate({'width': '100%'});
*/
}
function isSidebarVisible() {
if (padmaContainer.width() > 0) {
return true;
} else {
return false;
}
}
});
}
//All functions that destroy the video must call this to ensure clean-ups are handled
//FIXME: actually handle the cleanups.
// parameter is a padmaVideo object.
function cleanupVideo(videoObj) {
$('video')[0].pause();
clearInterval(videoObj.interval);
$('.padmaViewer').remove();
padmaContainer.data("currentVideo", false);
}