front_idill/src/mosaic/js/touchInteractions.js
changeset 79 9eff85166868
parent 77 205409da0f32
--- a/front_idill/src/mosaic/js/touchInteractions.js	Wed Aug 08 18:42:01 2012 +0200
+++ b/front_idill/src/mosaic/js/touchInteractions.js	Thu Aug 16 14:32:19 2012 +0200
@@ -56,51 +56,10 @@
 		}
 	}
 	
-	//Si on est dans une vidéo.
-	if(this.currentMode == 'VIDEO' || this.currentMode == 'SEARCH')
-	{
-		//On regarde si on a touché un snapshot.
-		var snapshot = this.positionToSN(e.pageX - this.notifyLeftVideo, e.pageY - this.notifyTopVideo);
-		
-		if(snapshot && !this.isOnSearchNotification(e.pageX, e.pageY) && !this.isOnSearchExitIcon(e.pageX, e.pageY))
-		{
-			this.canMoveToNeighbour = true;
-			var id = snapshot.attr('id').replace('snapshotDiv-', '');
-			this.correctMoveToNeighbour(id, e.pageX - this.notifyLeftVideo, e.pageY - this.notifyTopVideo);
-			this.canMoveToNeighbour = false;
-		}
-	}
-	
-	//Si on est sur l'icone de sortie de recherche.
-	if(this.isOnSearchExitIcon(e.pageX, e.pageY) && !this.helpDisplayed)
+	//Si on est sur le bouton de lecture de vidéo.
+	if(this.isOnPlayButton(e.pageX, e.pageY) && this.player && this.player.widgets && this.player.widgets[1])
 	{
-		//On ferme l'aide.
-		this.removeSearchExitIcon();
-		
-		this.removeNotifications();
-		if(this.currentMode == 'SEARCH')
-		{
-			this.player.widgets[0].removeSearchByGesture();
-			this.currentMode = 'VIDEO';
-			this.currentSearchGesture[this.centerId] = '';
-		}
-		else if(this.currentMode == 'TIMELINE')
-		{
-			this.player.widgets[0].removeSearchByGesture();
-			this.currentMode = 'TIMELINE';
-			this.currentSearchGesture[this.centerId] = '';
-		}
-		else if(this.currentMode == 'FILTER')
-		{
-			this.removeFilter();
-		}
-		
-		this.alreadyOnNotification = false;
-		this.isCurrentlyInASearchByGesture = false;
-		this.curvesGesturesFound = false;
-		this.canDrawNextCurve = false;
-		this.isSearchByCurvesOn = false;
-		this.canNotifyHelp = false;
+		this.player.widgets[1].onPlayButtonTouchStart();
 	}
 	
 	//On met à jour les coordonnées de la souris au dernier mouse down.
@@ -136,7 +95,8 @@
 	//Si on est en mode de tracé de courbes, on met à jour la courbe.
 	if(this.isSearchByCurvesOn)
 	{
-		this.searchCanvas.onPointerMove(this.mousePosX, this.mousePosY - this.MPTop_margin, null, null);
+		// this.searchCanvas.onPointerMove(this.mousePosX, this.mousePosY - this.MPTop_margin, null, null);
+		this.searchCanvas.onPointerMove(this.mousePosX, this.mousePosY, null, null);
 	}
 	
 	//On met à jour l'ancienne position du doigt si elle est nulle.
@@ -163,7 +123,7 @@
 	}
 	
 	//Si le doigt a parcouru une trop grande distance, on entre en recherche.
-	if(this.touchUpDownDelta > this.config.touchUpDownDeltaTreshold)
+	if(this.touchUpDownDelta > this.config.touchUpDownDeltaTreshold && !this.isTLSelected(true, null))
 	{
 		this.isTouchMove = true;
 		//Si on est en mosaique, on entre en filtrage.
@@ -182,7 +142,14 @@
 		{
 			this.isSearchByCurvesOn = true;
 			this.startSearch();
-			this.searchCanvas.onPointerIn(this.mousePosX, this.mousePosY - this.MPTop_margin, null, null);
+			// this.searchCanvas.onPointerIn(this.mousePosX, this.mousePosY - this.MPTop_margin, null, null);
+			this.searchCanvas.onPointerIn(this.mousePosX, this.mousePosY, null, null);
+		}
+		
+		//Si on est dans une vidéo et qu'on glisse le doigt sur la timeline, ça place le curseur à cet endroit.
+		if(this.playerIsReady && (this.currentMode == 'VIDEO' || this.currentMode == 'SEARCH' || this.currentMode == 'TIMELINE') && this.isTLSelected(true, null))
+		{
+			this.goToTimeline();
 		}
 	}
 }
@@ -194,12 +161,15 @@
 */
 Mosaic.prototype.onTouchEnd = function(e)
 {
+	//Coordonnées du doigt.
+	var posX = this.mousePosX, posY = this.mousePosY;
+	
 	// alert(this.mousePosX + ' ' + this.mousePosY);
 	//Si on est dans la mosaïque.
 	if(this.currentMode == 'MOSAIC' || this.currentMode == 'FILTER')
 	{
 		//On regarde si on a touché un snapshot.
-		var snapshot = this.positionToSN(this.mousePosX, this.mousePosY);
+		var snapshot = this.positionToSN(posX, posY);
 		// alert(snapshot);
 		// alert(this.isTouchMove);
 		if(snapshot && !this.isTouchMove)
@@ -209,10 +179,61 @@
 			this.zoom();
 		}
 	}
-	//Sinon si on est dans une video.
+	//Sinon si on est dans une vidéo.
 	else if(this.currentMode == 'VIDEO' || this.currentMode == 'SEARCH' || this.currentMode == 'TIMELINE')
 	{
-		// console.log(this.isTLSelected(true, null));
+		//Si on relache le doigt sur la timeline, ça place le curseur à cet endroit.
+		if(this.playerIsReady && this.isTLSelected(true, null))
+		{
+			this.goToTimeline();
+		}
+		this.exitTimeline('');
+		
+		posX = this.mousePosX - this.notifyLeftVideo;
+		posY = this.mousePosY - this.notifyTopVideo;
+		
+		//On regarde si on a touché un snapshot.
+		var snapshot = this.positionToSN(posX, posY);
+		
+		if(snapshot && !this.isOnSearchNotification(this.mousePosX, this.mousePosY) && !this.isOnSearchExitIcon(this.mousePosX, this.mousePosY))
+		{
+			this.canMoveToNeighbour = true;
+			var id = snapshot.attr('id').replace('snapshotDiv-', '');
+			this.correctMoveToNeighbour(id, posX, posY);
+			this.canMoveToNeighbour = false;
+		}
+	}
+	
+	//Si on est sur l'icone de sortie de recherche.
+	if(this.isOnSearchExitIcon(this.mousePosX, this.mousePosY) && !this.helpDisplayed)
+	{
+		//On ferme l'aide.
+		this.removeSearchExitIcon();
+		
+		this.removeNotifications();
+		if(this.currentMode == 'SEARCH')
+		{
+			this.player.widgets[0].removeSearchByGesture();
+			this.currentMode = 'VIDEO';
+			this.currentSearchGesture[this.centerId] = '';
+		}
+		else if(this.currentMode == 'TIMELINE')
+		{
+			this.player.widgets[0].removeSearchByGesture();
+			this.currentMode = 'TIMELINE';
+			this.currentSearchGesture[this.centerId] = '';
+		}
+		else if(this.currentMode == 'FILTER')
+		{
+			this.removeFilter();
+		}
+		
+		this.alreadyOnNotification = false;
+		this.isCurrentlyInASearchByGesture = false;
+		this.curvesGesturesFound = false;
+		this.canDrawNextCurve = false;
+		this.isSearchByCurvesOn = false;
+		this.canNotifyHelp = false;
 	}
 	
 	this.isTouchStart = false;
@@ -313,4 +334,31 @@
     
     //Si on est arrivé là, c'est que le pointeur n'est pas dans la mosaïque.
     return null;
+}
+
+/*
+ * Se déplace dans la timeline lorsque le doigt est dessus.
+*/
+Mosaic.prototype.goToTimeline = function()
+{
+	var time, TL = $('.Ldt-Timeline'), P = $('.LdtPlayer');
+		
+	//Si le pointeur est trop à gauche, on met le curseur de lecture à 0.
+	if(this.mousePosX < P.position().left)
+	{
+		time = 0;
+	}
+	//S'il est trop à droite, on le place à la fin.
+	else if(this.mousePosX > (+P.position().left + TL.width()))
+	{
+		time = this.player.widgets[0].source.getDuration().getSeconds();
+	}
+	//Sinon, on le met à la position du pointeur.
+	else
+	{
+		time = this.player.widgets[0].scaleIntervals(P.position().left, (+P.position().left + TL.width()), 0, this.player.widgets[0].source.getDuration().getSeconds(), this.mousePosX);
+	}
+	
+	this.player.popcorn.currentTime(time);
+	this.player.popcorn.play();
 }
\ No newline at end of file