--- a/js/playscreen.js Tue Mar 19 12:27:34 2013 +0100
+++ b/js/playscreen.js Thu Mar 21 18:48:12 2013 +0100
@@ -14,6 +14,17 @@
var pageParams = {};
+ var syncVideo = true,
+ syncTimer;
+
+ function deSync() {
+ syncVideo = false;
+ clearTimeout(syncTimer);
+ syncTimer = setTimeout(function() {
+ syncVideo = true;
+ },5000);
+ }
+
topicHash
.replace(/^#/,'')
.split('&')
@@ -61,22 +72,47 @@
return pageParams.visibletopics.indexOf(t.index.toString()) !==-1 && t.index !== topicPoubelle;
});
+ function hasTopics(mmso, topics) {
+ for (var j = 0; j < mmso.topics.length; j++) {
+ if (topics.indexOf(mmso.topics[j].topic) !== -1) {
+ return true;
+ }
+ }
+ return false;
+ }
+
+ function checkOrGoNext() {
+ var topics = Array.prototype.slice.call(
+ $(".topic.selected").map(function() {
+ return parseInt($(this).attr("data-topic-id"))
+ })
+ );
+ var currentMmso = _(data.segments).find(function(s) {
+ return s.start <= player.currentTime && s.end > player.currentTime;
+ });
+
+ if (hasTopics(currentMmso, topics)) {
+ throttledShowLocal();
+ } else {
+ goToNext();
+ }
+
+ }
function goToNext() {
- var topics = Array.prototype.slice.call($(".topic.selected").map(function(){return $(this).attr("data-topic-id")}));
+ var topics = Array.prototype.slice.call(
+ $(".topic.selected").map(function() {
+ return parseInt($(this).attr("data-topic-id"));
+ })
+ );
for (var i = 0; i < data.segments.length; i++) {
var mmso = data.segments[i];
- if (mmso.start >= localpos) {
- for (var j = 0; j < mmso.topics.length; j++) {
- if (topics.indexOf(mmso.topics[j].topic.toString()) !== -1) {
- localpos = mmso.start;
- showLocal();
- return;
- }
- }
+ if (mmso.start >= player.currentTime && hasTopics(mmso, topics)) {
+ player.setCurrentTime(mmso.start);
+ throttledShowLocal();
+ return;
}
}
- console.log("We haven't found a segment");
}
function showTopics(topiclist) {
@@ -175,7 +211,7 @@
tweetLines.forEach(function(tl) { tl.remove(); });
tweetLines = [];
- var deltaY = $(".play-dataviz").offset().top;
+ var deltaY = $(".play-bottom").offset().top;
$(".play-localtweets .tweet:visible").each(function() {
var el = $(this),
@@ -207,7 +243,6 @@
yscale = ph / data.duration,
mx = Math.max.apply(Math, data.minutes.map(function(s) { return s.count})),
xscale = globW/mx;
-
var segmentrects = data.segments.map(function(mmso) {
var rect = paper.rect(globL, yscale * mmso.start, globW, yscale * mmso.duration);
rect.attr({stroke: "none"});
@@ -274,6 +309,10 @@
var cloudTemplate = _.template('<li style="font-size: <%- size %>px;"<% if (selected) {%> class="selected"<% } %>><%- word %></li>');
+ var globalIndic = $(".global-position"),
+ localIndic = $(".local-position"),
+ playTime = $(".current-time");
+
function showLocal() {
localyscale = ph / localduration;
var localstart = localpos - localduration/2;
@@ -293,6 +332,7 @@
localkeywords = {};
entonnoir.attr("path",entonnoird);
+ localIndic.css("top",(player.currentTime - localstart) * localyscale);
localTimes.forEach(function(t) {
t.text.remove();
t.line.remove();
@@ -447,7 +487,7 @@
callnum = 0,
tweetstructure = {},
requestedtweets = {},
- _NTWEETS = 20,
+ _NTWEETS = 50,
selectedWord = false;
function showTweets() {
@@ -676,8 +716,39 @@
var localpos = 300,
localduration = 600;
-
- goToNext();
+
+ var player = new Player();
+
+ player.duration = data.duration;
+
+ player.on("play", function() {
+ $(".play-button").html("▐ ▌");
+ });
+ player.on("pause", function() {
+ $(".play-button").text("▶");
+ });
+ player.on("timeupdate", function(t) {
+ playTime.text(secsToString(t));
+ globalIndic.css("top", yscale * t);
+ if (localyscale) {
+ var localy = (+t - localpos + localduration / 2) * localyscale;
+ localIndic.css("top", localy);
+ }
+ if (syncVideo) {
+ localpos = Math.max(localduration / 2, Math.min(data.duration - localduration / 2, t));
+ throttledShowLocal();
+ }
+ });
+
+ $(".play-button").click(function() {
+ if (player.paused) {
+ player.play();
+ } else {
+ player.pause();
+ }
+ });
+
+ $(".next-button").click(goToNext);
$(".topics-block").on("mouseenter", ".topic", function() {
var el = $(this);
@@ -692,48 +763,58 @@
el.attr("data-timestamp", el.hasClass("selected") ? ++ordertag : 999999);
showTopicViz();
});
-
- var mouseIsDown, isDragging, startY, startT, startPos, scrollGlobal, speedscale, slowiterations;
-
- $(document).mouseup(function() { mouseIsDown = false; isDragging = false; });
-
- $(".play-dataviz").mousedown(function(e) {
- var l = $(this).offset().left,
- scrollLimit = l + 380;
- if (e.pageX < scrollLimit) {
- mouseIsDown = true;
- startY = e.pageY;
- startT = new Date();
- startPos = localpos;
- scrollGlobal = e.pageX < (l + 140);
- e.preventDefault();
+
+ var h = Hammer($(".play-bottom")[0]);
+
+ var scrollGlobal, isDragging, startPos, startLevel, scaleStep = 1/Math.log(Math.sqrt(2));
+
+ h.on("tap", function(e) {
+ var _o = $(this).offset(),
+ posX = e.gesture.center.pageX - _o.left,
+ posY = e.gesture.center.pageY - _o.top;
+ if (posX < 140) {
+ deSync();
+ localpos = Math.max(localduration / 2, Math.min(data.duration - localduration / 2, Math.floor(posY / yscale)));
+ throttledShowLocal();
}
- }).mousemove(function(e) {
- if (mouseIsDown) {
- if (isDragging) {
- var deltaY = e.pageY - startY,
- delta = Math.floor(deltaY / (scrollGlobal ? yscale : - localyscale));
- localpos = Math.max(localduration / 2, Math.min(data.duration - localduration / 2, startPos + delta));
- throttledShowLocal();
- } else {
- isDragging = true;
- }
- }
- }).mouseup(function(e) {
- if (scrollGlobal && !isDragging) {
- var _o = $(this).offset(),
- posX = e.pageX - _o.left,
- posY = e.pageY - _o.top;
- if (posX < 140) {
- localpos = Math.max(localduration / 2, Math.min(data.duration - localduration / 2, Math.floor(posY / yscale)));
- throttledShowLocal();
- }
- }
- });
-
+ })
+ .on("dragstart", function(e) {
+ startPos = localpos;
+ var x = e.gesture.center.pageX - $(this).offset().left;
+ isDragging = (x < 380);
+ scrollGlobal = (x < 140);
+ })
+ .on("drag", function(e) {
+ if (isDragging && e.gesture) {
+ var delta = Math.floor(e.gesture.deltaY / (scrollGlobal ? yscale : - localyscale));
+ deSync();
+ localpos = Math.max(localduration / 2, Math.min(data.duration - localduration / 2, startPos + delta));
+ throttledShowLocal();
+ }
+ })
+ .on("touch", function(e) {
+ startLevel = currentlevel;
+ })
+ .on("pinchin", function(e) {
+ var newlevel = Math.max(0, Math.min(zoomlevels.length - 1, startLevel + Math.round(Math.log(e.gesture.scale)*scaleStep)));
+ if (newlevel !== currentlevel) {
+ currentlevel = newlevel;
+ localduration = zoomlevels[currentlevel];
+ localpos = Math.max(localduration / 2, Math.min(data.duration - localduration / 2, localpos));
+ throttledShowLocal();
+ }
+ });
+
var totalScroll = 0, zoomlevels = [ 1800, 900, 600, 300, 120, 60 ], currentlevel = 2;
- $(".play-dataviz").mousewheel(function(_event, _scrolldelta) {
+ $(".play-bottom")
+ .mousedown(function(_e) {
+ _e.preventDefault();
+ })
+ .on("touchstart", function(_e) {
+ _e.preventDefault();
+ })
+ .mousewheel(function(_event, _scrolldelta) {
totalScroll += _scrolldelta;
if (Math.abs(totalScroll) >= 1) {
var d = (totalScroll > 0 ? 1 : -1),
@@ -746,12 +827,14 @@
}
totalScroll = 0;
}
+ _event.preventDefault();
});
if (pageParams.keywords && pageParams.keywords.length) {
$(".keyword-search a").removeClass("placeholder").text(pageParams.keywords.join(", "));
}
+ checkOrGoNext();
}
var data = { duration: 10200, topics: [] },