front_idill/src/search/js/searchCanvas.js
changeset 58 a28488078053
parent 52 277c94533395
child 59 e812126f75f4
--- a/front_idill/src/search/js/searchCanvas.js	Mon Jul 30 16:45:46 2012 +0200
+++ b/front_idill/src/search/js/searchCanvas.js	Tue Jul 31 16:26:00 2012 +0200
@@ -117,10 +117,18 @@
 */
 SearchCanvas.prototype.onPointerIn = function(mainPointerX, mainPointerY, secondPointerX, secondPointerY)
 {
+	// console.log('IN');
+	
     if(this.mosaic.currentMode != 'MOSAIC' && this.mosaic.currentMode != 'FILTER')
     {
         mainPointerX -= 130;
         mainPointerY -= 60;
+		
+		if(secondPointerX && secondPointerY)
+		{
+			secondPointerX -= 130;
+			secondPointerY -= 60;
+		}
     }
     
     //On obtient les coordonnées du pointeur principal en px.
@@ -150,14 +158,14 @@
         
         //On forme le contour de la courbe secondaire.
         this.secondPathStroke = new paper.Path();
-        this.secondPathStroke.fillColor = '#366F7A';
-        this.secondPathStroke.strokeWidth = 12;
+        this.secondPathStroke.strokeColor = '#366F7A';
+        this.secondPathStroke.strokeWidth = 18;
         this.secondPathStroke.strokeCap = 'round';
         this.secondPathStroke.strokeJoin = 'round';
         
         //On forme la courbe secondaire.
         this.secondPath = new paper.Path();
-        this.secondPath.fillColor = '#02FEFF';
+        this.secondPath.strokeColor = '#02FEFF';
         this.secondPath.strokeWidth = 10;
         this.secondPath.strokeCap = 'round';
         this.secondPath.strokeJoin = 'round';
@@ -175,11 +183,19 @@
 */
 SearchCanvas.prototype.onPointerMove = function(mainPointerX, mainPointerY, secondPointerX, secondPointerY)
 {
+	// console.log('MOVE');
+	
     //Si on est dans une video, on réhausse
     if(this.mosaic.currentMode != 'MOSAIC' && this.mosaic.currentMode != 'FILTER')
     {
         mainPointerX -= 130;
         mainPointerY -= 60;
+		
+		if(secondPointerX && secondPointerY)
+		{
+			secondPointerX -= 130;
+			secondPointerY -= 60;
+		}
     }
     
     //On obtient les coordonnées du pointeur principal en px.
@@ -205,9 +221,6 @@
     this.mainPath.add(mainPoint);
     this.mainPath.smooth();
     
-    //Variables de construction de la courbe secondaire.
-    var secondPoint, secondDelta, secondStep, secondStepStroke, secondTop, secondBottom, secondTopStroke, secondBottomStroke;
-    
     //Si on a un pointeur secondaire.
     if(secondPointerX && secondPointerY)
     {
@@ -223,8 +236,8 @@
         }
         
         //On crée les points de la courbe secondaire.
-        secondPoint = new paper.Point(mainPointerX, mainPointerY);
-        secondPointStroke = new paper.Point(mainPointerX, mainPointerY);
+        var secondPoint = new paper.Point(secondPointerX, secondPointerY);
+        var secondPointStroke = new paper.Point(secondPointerX, secondPointerY);
         
         //On les ajoute à la courbe.
         this.secondPathStroke.add(secondPointStroke);
@@ -256,7 +269,7 @@
     }
     
     //On met à jour les points dans le détecteur de courbes.
-    this.detector.updatePos(mainPointerX, mainPointerY);
+    this.detector.updatePos(mainPointerX, mainPointerY, secondPointerX, secondPointerY);
     
     //On met à jour l'affichage.
     paper.view.draw();
@@ -270,12 +283,83 @@
 */
 SearchCanvas.prototype.onPointerOut = function()
 {
+	// console.log('OUT');
+	// console.trace();
+	
+	//On quitte la zone de recherche.
+	this.isUserInSearchZone = false;
+		
+	//On regarde si ce qu'on a tracé correspond à une courbe en particulier.
+	var gesture_match = this.mosaic.gestureWithSameCode(this.mosaic.actualCode);
+	this.mosaic.actualCode = '';
+	
+	//Si oui.
+	if(gesture_match.length > 0)
+	{
+		//Si on est en mode recherche dans une vidéo et que le player est prêt.
+		if(this.mosaic.currentMode == "SEARCH" && this.mosaic.playerIsReady)
+		{
+			//On effectue une recherche dans cette vidéo.
+			this.mosaic.player.widgets[0].searchByGesture(gesture_match);
+			this.mosaic.isCurrentlyInASearchByGesture = this.mosaic.player.widgets[0].isCurrentlyInASearchByGesture;
+			
+			//On va au premier marqueur trouvé.
+			if(this.mosaic.player && this.mosaic.player.widgets[0] && this.mosaic.timeToGoAt[this.mosaic.centerId] === 0 && this.mosaic.player.widgets[0].atLeastOneSearchMarker(this.mosaic.currentSearchGesture[this.mosaic.centerId]))
+			{
+				this.mosaic.player.widgets[0].goToFirstSearchedMarker(this.mosaic.currentSearchGesture[this.mosaic.centerId]);
+			}
+			
+			//On affiche la notification de gesture de recherche.
+			this.mosaic.removeNotifications();
+			this.mosaic.currentSearchGesture[this.mosaic.centerId] = gesture_match;
+			this.mosaic.searchGesture(gesture_match, 'valid');
+			this.mosaic.curvesGesturesFound = false;
+		}
+		//Si on est en mode de filtrage de mosaique.
+		else if(this.mosaic.currentMode == "FILTER")
+		{
+			if(this.mosaic.isMosaicFiltered)
+			{
+				//On notifie la recherche par filtrage.
+				this.mosaic.removeNotifications();
+				this.mosaic.filterSearchedType = gesture_match;
+				this.mosaic.filterGesture(gesture_match, 'valid');
+				//On filtre la mosaique.
+				this.mosaic.searchFilter(gesture_match);
+				this.mosaic.curvesGesturesFound = false;
+			}
+		}
+	}
+	//Si aucune gesture ne matche dans le dictionnaire.
+	else if(!this.mosaic.mustTakeOutHands && this.mosaic.mouseInteractions)
+	{
+		//Si on était en mode filtrage de la mosaïque et qu'aucune gesture de filtrage n'avait été détectée avant ca, on revient en mode mosaïque.
+		if(this.mosaic.currentMode == "FILTER" && this.mosaic.filterSearchedType == "")
+		{
+			this.mosaic.currentMode = "MOSAIC";
+			this.mosaic.isMosaicFiltered = false;
+		}
+		//Sinon si on était en mode recherche dans une video et qu'aucune gesture n'avait été détectée avant ca, on revient en mode video.
+		if(this.mosaic.currentMode == "SEARCH" && this.mosaic.currentSearchGesture[this.mosaic.centerId] == "")
+		{
+			this.mosaic.currentMode = "VIDEO";
+		}
+	}
+	
     //On réinitialise la courbe principale.
-    this.mainPathStroke.remove();
-    this.mainPath.remove();
+	if(this.mainPathStroke)
+	{
+		this.mainPathStroke.remove();
+	}
+	if(this.mainPath)
+	{
+		this.mainPath.remove();
+	}
     
     this.mainPointerLastX = 0;
     this.mainPointerLastY = 0;
+	this.mainPointerX = 0;
+	this.mainPointerY = 0;
     
     //On réinitialise le détecteur.
     this.detector.reinit();