padmaAPI/static/js/padmaLayer.js

100 lines
3.8 KiB
JavaScript
Raw Normal View History

2010-07-12 19:09:53 +00:00
var padmaLayer = function(json, video) {
this.id = json.id;
this.video = video.index; //FIXME: Kept for legacy, please clean up.
this.padmaVideo = video;
this.time_in = json.time_in;
this.time_out = json.time_out;
2010-07-15 00:02:35 +00:00
this.time_center = parseInt((this.time_in + this.time_out) / 2);
2010-07-12 19:09:53 +00:00
this.time_in_npt = ms2npt(this.time_in);
2010-07-15 00:02:35 +00:00
this.time_out_npt = ms2npt(this.time_out);
this.time_center_npt = ms2npt(this.time_center);
2010-07-12 19:09:53 +00:00
this.track = json.track;
this.value = json.value;
this.shortValue = this.value.substring(0,100); //FIXME
this.value_html = json.value_html;
this.creator = json.creator;
var that = this;
2010-07-15 00:02:35 +00:00
this.downloadUrl = PADMA_BASE_URL + "/" + this.padmaVideo.id + "/download/" + this.time_in_npt + "-" + this.time_out_npt + ".ogv";
this.firstFrameStr = PADMA_BASE_URL + "/" + this.padmaVideo.id + "/frame/" + ms2npt(that.time_in);
2010-07-12 19:09:53 +00:00
this.firstFrame128 = this.firstFrameStr + ".128.jpg";
this.firstFrame320 = this.firstFrameStr + ".320.jpg";
2010-07-15 00:02:35 +00:00
this.middleFrameStr = PADMA_BASE_URL + "/" + this.padmaVideo.id + "/frame/" + ms2npt(that.time_center);
this.middleFrame128 = this.middleFrameStr + ".128.jpg";
this.middleFrame320 = this.middleFrameStr + ".320.jpg";
this.lastFrameStr = PADMA_BASE_URL + "/" + this.padmaVideo.id + "/frame/" + ms2npt(that.time_out);
2010-07-12 19:09:53 +00:00
this.lastFrame128 = this.lastFrameStr + ".128.jpg";
this.lastFrame320 = this.lastFrameStr + ".320.jpg";
2010-07-15 00:02:35 +00:00
this.videoSrc128 = this.padmaVideo.meta.urls['128'] + "?t=" + this.time_in_npt;
this.videoSrc320 = this.padmaVideo.meta.urls['320'] + "?t=" + this.time_in_npt;
2010-07-13 12:08:50 +00:00
// this.videoSrc128 = PADMA_BASE_URL + "v/128/" + padmaVideos[this.video].id + ".ogv?t=" + ms2npt(that.time_in);
// this.videoSrc320 = PADMA_BASE_URL + "v/320/" + padmaVideos[this.video].id + ".ogv?t=" + ms2npt(that.time_in);
}
2010-07-12 19:09:53 +00:00
padmaLayer.prototype.showResult = function(word) {
var that = this;
// alert(word);
var html = tmpl("tmpl_layerResult", {'layer': that, 'word': word});
this.resultJq = $('<div />').addClass("layerResult").addClass(that.track).attr("id", "layer" + that.id).html(html).data("layer", that);
this.padmaVideo.jq.find(".searchResults").append(that.resultJq);
return this;
}
padmaLayer.prototype.addToClipBin = function() {
var that = this;
var html = tmpl("tmpl_clip", {'layer': that});
this.clipJq = $('<div />').addClass('padmaClip').attr("id", "clip" + that.id).data("layer", that).html(html);
var height = Math.ceil(parseInt(that.padmaVideo.meta.stream_width) / that.padmaVideo.meta.aspectratio) + 16;
2010-07-17 15:18:44 +00:00
// console.log(height);
2010-07-12 19:09:53 +00:00
$('#playBin').append(that.clipJq);
this.clipJq.css({'height': height + "px"});
}
padmaLayer.prototype.getThumbElem = function() {
var that = this;
var e = $('<div />');
e.addClass('matchedLayer');
e.attr("id", that.id);
var img = $('<img />');
if (that.firstFrame128) {
img.attr("src", that.firstFrame128);
e.append(img);
2010-07-13 12:08:50 +00:00
}
2010-07-12 19:09:53 +00:00
e.attr("data-track", that.track);
e.attr("data-value", that.value_html);
e.mouseover(function() {
var html = '';
html += padmaVideos[that.video].title;
html += "<br />";
html += $(this).attr('data-track');
html += '<br />';
html += $(this).attr('data-value');
$('#resultDetails').html(html);
}).mouseout(function() {
$('#resultDetails').html('');
2010-07-13 12:08:50 +00:00
});
2010-07-12 19:09:53 +00:00
return e;
2010-07-13 12:08:50 +00:00
}
2010-07-12 19:09:53 +00:00
padmaLayer.prototype.getVideoElem = function() {
var that = this;
var e = $('<video />');
e.attr("src", that.videoSrc128);
e.attr("width", "128");
e.attr("data-track", that.track);
e.attr("data-value", that.value_html);
e.mouseover(function() {
var html = '';
html += padmaVideos[that.video].title;
html += "<br />";
html += $(this).attr('data-track');
html += '<br />';
html += $(this).attr('data-value');
$('#resultDetails').html(html);
}).mouseout(function() {
$('#resultDetails').html('');
2010-07-13 12:08:50 +00:00
});
2010-07-12 19:09:53 +00:00
e.attr("poster", that.firstFrame128);
return e;
2010-07-13 12:08:50 +00:00
}
2010-07-12 19:09:53 +00:00