# HG changeset patch # User bastiena # Date 1343744760 -7200 # Node ID a284880780535a8d847622ce95da72648ed27ed1 # Parent d0c393730443608bdbd97521a5741ccda8abee3b Front IDILL: search curves modified : search curves exit when event other than many curves detected. diff -r d0c393730443 -r a28488078053 front_idill/doc/Documentation - Front IDILL.html --- a/front_idill/doc/Documentation - Front IDILL.html Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/doc/Documentation - Front IDILL.html Tue Jul 31 16:26:00 2012 +0200 @@ -234,6 +234,10 @@ videoConfigFileOnlinestring (path)"./player/json/online_videos.json"Chemin vers le fichier de chargement des images, vidéos et métadonnées pour un chargement en ligne. mouseInteractionsbooléentrueSpécifie le mode d'interaction (souris/Kinect). noUserModeEnabledbooléentrueSpécifie si on active la phase d'approche de l'utilisateur (de remplissage de la mosaïque en mode d'interaction Kinect). + kinectMinCoordXint (px)40Borne inférieure en abscisse du champ de liberté des pointeurs de la kinect sur l'écran du Front. + kinectMinCoordYint (px)30Borne inférieure en ordonnée du champ de liberté des pointeurs de la kinect sur l'écran du Front. + kinectMaxCoordXint (px)520Borne supérieure en abscisse du champ de liberté des pointeurs de la kinect sur l'écran du Front. + kinectMaxCoordYint (px)260Borne supérieure en ordonnée du champ de liberté des pointeurs de la kinect sur l'écran du Front. imagesByLineint5Longueur de la mosaïque en images. imagesToShowint20Nombre d'images affichées dans la mosaïque. totalImagesint22Nombre d'images disponibles au total. @@ -270,6 +274,7 @@ hoststring (adresse ip)"127.0.0.1"Adresse ip sur lequel le serveur du Middleware est hébergé (Kinect). portint8090Port sur lequel on peut se connecter au serveur du Middleware (Kinect). mouseUpDownDeltaTresholdint (px)15Distance à partir de laquelle le déplacement du pointeur de la souris lorsqu'on a appuyé sur le bouton gauche est considéré non plus comme le début d'un click mais le début d'un tracé de courbe de recherche. + kinectUpDownDeltaTresholdint (px)20Distance à partir de laquelle le tracé d'un début de courbe est considéré comme un segment dans le mode d'interaction Kinect. curveDictionarystring (path)"./dico.json"Chemin du dictionnaire de courbes de recherche. langstring (abréviation)""Langue utilisée dans le Front (en, fr...). Si elle est vide alors la langue du navigateur est prise. helpBorderSizeint (px)5Taille de la bordure affichant l'aide dans le mode d'interaction souris. @@ -283,6 +288,7 @@

Notices à prendre en compte

Ce projet étant un prototype, il est possible que certains bugs surviennent. Si vous expérimentez ce genre de désagrément, vous pouvez nous en faire part (actions menant au problème + description du problème + capture d'écran).

Si vous voulez évaluer convenablement le champ de liberté des pointeurs dans la fenêtre du Front, en fonction de la position de la Kinect, vous pouvez bouger les pointeurs jusqu'à ce que vos bras ne puissent plus aller plus loin. Ensuite, allez dans la console de Google Chrome (F12), et entrez les variables : mos.minX, mos.minY, mos.maxX, mos.maxY pour obtenir respectivement les valeurs de kinectMinCoordX, kinectMinCoordY, kinectMaxCoordX et kinectMaxCoordY.

Si vous expérimentez des difficultés ou souhaitez nous soumettre une requête, veuillez consulter le fichier contact.txt à la racine du projet.

diff -r d0c393730443 -r a28488078053 front_idill/src/communication/js/client.js --- a/front_idill/src/communication/js/client.js Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/src/communication/js/client.js Tue Jul 31 16:26:00 2012 +0200 @@ -122,8 +122,8 @@ var x = Math.abs(parseFloat(pt[0])), y = Math.abs(parseFloat(pt[1])); // console.log(Math.abs(parseFloat(pt[0])), Math.abs(parseFloat(pt[1]))); - this.pointerLeft = true; - clearTimeout(this.pointerLeftTimeout); + this.pointerRight = true; + clearTimeout(this.pointerRightTimeout); if(!this.mosaic.mouseInteractions && this.mosaic.currentMode != 'NO-USER' && this.mosaic.currentMode.indexOf('INCOMING') == -1) { @@ -138,16 +138,34 @@ this.mosaic.isMainPointerDisplayed = true; } - this.pointerLeftTimeout = setTimeout(function() + this.pointerRightTimeout = setTimeout(function() { // console.log('RELEASE LEFT'); - _this.pointerLeft = false; + //Timeout indiquant quand la main gauche part. + _this.pointerRight = false; if(_this.mosaic.isMainPointerDisplayed) { _this.mosaic.isMainPointerDisplayed = false; _this.mosaic.mainPointerDisplay(false); } + + if(_this.mosaic.isSearchByCurvesOn) + { + _this.mosaic.isSearchByCurvesOn = false; + if(_this.mosaic.searchCanvas) + { + _this.mosaic.searchCanvas.onPointerOut(); + + $('#mainPointer').css('background-image', 'url(./img/cursors/pointerC.png)'); + $('#secondPointer').css('background-image', 'url(./img/cursors/pointer2C.png)'); + } + } + //On peut effectuer de nouveau une recherche par courbes. + if(!_this.pointerLeft) + { + _this.mosaic.mustTakeOutHands = false; + } }, this.timePointers); } //Sinon si ce sont les coordonnées de la main gauche. @@ -158,8 +176,8 @@ var x = Math.abs(parseFloat(pt[0])), y = Math.abs(parseFloat(pt[1])); // console.log(Math.abs(parseFloat(pt[0])), Math.abs(parseFloat(pt[1]))); - this.pointerRight = true; - clearTimeout(this.pointerRightTimeout); + this.pointerLeft = true; + clearTimeout(this.pointerLeftTimeout); if(!this.mosaic.mouseInteractions && this.mosaic.currentMode != 'NO-USER' && this.mosaic.currentMode.indexOf('INCOMING') == -1) { @@ -172,16 +190,34 @@ this.mosaic.isSecondPointerDisplayed = true; } - this.pointerRightTimeout = setTimeout(function() + //Timeout indiquant quand la main droite part. + this.pointerLeftTimeout = setTimeout(function() { // console.log('RELEASE RIGHT'); - _this.pointerRight = false; + _this.pointerLeft = false; if(_this.mosaic.isSecondPointerDisplayed) { _this.mosaic.isSecondPointerDisplayed = false; _this.mosaic.secondPointerDisplay(false); } + + if(_this.mosaic.isSearchByCurvesOn) + { + _this.mosaic.isSearchByCurvesOn = false; + if(_this.mosaic.searchCanvas) + { + _this.mosaic.searchCanvas.onPointerOut(); + + $('#mainPointer').css('background-image', 'url(./img/cursors/pointerC.png)'); + $('#secondPointer').css('background-image', 'url(./img/cursors/pointer2C.png)'); + } + } + //On peut effectuer de nouveau une recherche par courbes. + if(!_this.pointerRight) + { + _this.mosaic.mustTakeOutHands = false; + } }, this.timePointers); } @@ -191,16 +227,6 @@ this.mosaic.pointersIdleAvailable = false; this.mosaic.removeIdlePointers(); this.mosaic.areBothPointersHere = false; - - if(this.mosaic.isSearchByCurvesOn) - { - this.mosaic.isSearchByCurvesOn = false; - if(this.mosaic.searchCanvas) - { - this.mosaic.searchCanvas.onPointerOut(); - console.log('OUT !!!!!'); - } - } } if(!this.pointerLeft && !this.pointerRight) { @@ -209,15 +235,6 @@ this.mosaic.removeIdlePointers(); this.mosaic.areBothPointersHere = false; - if(this.mosaic.isSearchByCurvesOn) - { - this.mosaic.isSearchByCurvesOn = false; - if(this.mosaic.searchCanvas) - { - this.mosaic.searchCanvas.onPointerOut(); - } - } - this.mosaic.deselectAllNeighbours(); this.mosaic.preUnzoom(); } @@ -227,26 +244,34 @@ this.mosaic.areBothPointersHere = true; this.mosaic.removeCheckForBothPointersHere(); - if(this.mosaic.currentMode == 'MOSAIC' || this.mosaic.currentMode == 'FILTER') + //On enlève les requêtes de zoom. + this.mosaic.preUnzoom(); + + if(this.mosaic.currentMode == 'MOSAIC' || this.mosaic.currentMode == 'FILTER' && !this.mosaic.isSearchByCurvesOn) { - $('#mainPointer').css('background-image', './img/cursors/pointer.png'); - $('#secondPointer').css('background-image', './img/cursors/pointer2.png'); + $('#mainPointer').css('background-image', 'url(./img/cursors/pointer.png)'); + $('#secondPointer').css('background-image', 'url(./img/cursors/pointer2.png)'); } - if(this.mosaic.currentMode == 'FILTER' || this.mosaic.currentMode == 'SEARCH') + //Si on est dans un des modes de recherche et que les mains ont été retirées après la précédente recherche. + if((this.mosaic.currentMode == 'FILTER' || this.mosaic.currentMode == 'SEARCH') && !this.mosaic.mustTakeOutHands) { + console.log('ON'); if(this.mosaic.searchCanvas) { var mainPointerX = +$('#mainPointer').position().left + $('#mainPointer').width() / 2; var mainPointerY = +$('#mainPointer').position().top - this.mosaic.MPTop_margin + $('#mainPointer').height() / 2; - var secondPointerX = +$('#secondPointer').position().left + $('#mainPointer').width() / 2; - var secondPointerY = +$('#secondPointer').position().top - this.mosaic.MPTop_margin + $('#mainPointer').height() / 2; + var secondPointerX = +$('#secondPointer').position().left + $('#secondPointer').width() / 2; + var secondPointerY = +$('#secondPointer').position().top - this.mosaic.MPTop_margin + $('#secondPointer').height() / 2; if(!this.mosaic.isSearchByCurvesOn) { this.mosaic.isSearchByCurvesOn = true; + this.mosaic.searchCanvas.onPointerOut(); this.mosaic.searchCanvas.onPointerIn(mainPointerX, mainPointerY, secondPointerX, secondPointerY); this.mosaic.canDrawNextCurve = true; + + this.mosaic.pointersGreen(); } else if(this.mosaic.isSearchByCurvesOn) { @@ -255,8 +280,8 @@ this.mosaic.canDrawNextCurve = false; if(Math.abs(mainPointerX - this.mosaic.mainPointerLastX) > 10 || Math.abs(mainPointerY - this.mosaic.mainPointerLastY) > 10 || Math.abs(secondPointerX - this.mosaic.secondPointerLastX) > 10 || Math.abs(secondPointerY - this.mosaic.secondPointerLastY) > 10) { - console.log('move'); this.mosaic.searchCanvas.onPointerMove(mainPointerX, mainPointerY, secondPointerX, secondPointerY); + this.mosaic.pointersGreen(); } } else @@ -268,6 +293,10 @@ } } } + else + { + this.mosaic.startSearch(); + } } } diff -r d0c393730443 -r a28488078053 front_idill/src/config.json --- a/front_idill/src/config.json Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/src/config.json Tue Jul 31 16:26:00 2012 +0200 @@ -2,8 +2,12 @@ "local":true, "videoConfigFileLocal":"./player/json/local_videos.json", "videoConfigFileOnline":"./player/json/online_videos.json", - "mouseInteractions":true, + "mouseInteractions":false, "noUserModeEnabled":true, + "kinectMinCoordX":"40", + "kinectMinCoordY":"30", + "kinectMaxCoordX":"520", + "kinectMaxCoordY":"260", "imagesByLine":"5", "imagesToShow":"20", "totalImages":"22", @@ -39,6 +43,8 @@ "host":"127.0.0.1", "port":"8090", "mouseUpDownDeltaTreshold":"15", - "curveDictionary":"./dico.json", + "kinectUpDownDeltaTreshold":"20", + "curveDictionaryMI":"./dicoMI.json", + "curveDictionaryKI":"./dicoKI.json", "lang":"" } \ No newline at end of file diff -r d0c393730443 -r a28488078053 front_idill/src/defaults.js --- a/front_idill/src/defaults.js Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/src/defaults.js Tue Jul 31 16:26:00 2012 +0200 @@ -21,6 +21,10 @@ local : true, mouseInteractions : true, noUserModeEnabled : true, + kinectMinCoordX : 40, + kinectMinCoordY : 30, + kinectMaxCoordX : 520, + kinectMaxCoordY : 260, videoConfigFileLocal : "./player/json/local_videos.json", videoConfigFileOnline : "./player/json/online_videos.json", timeReloadAfterResize : 1000, @@ -59,6 +63,8 @@ host : '127.0.0.1', port : '8080', mouseUpDownDeltaTreshold : 15, - curveDictionary : './dico.json', + mouseUpDownDeltaTreshold : 100, + curveDictionaryMI : './dicoMI.json', + curveDictionaryKI : './dicoKI.json', lang : navigator.language } \ No newline at end of file diff -r d0c393730443 -r a28488078053 front_idill/src/dicoKI.json --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/front_idill/src/dicoKI.json Tue Jul 31 16:26:00 2012 +0200 @@ -0,0 +1,42 @@ +{ + "divisions":"6", + "gestures": + [ + { + "name":"contact", + "codes":["D1:D4"] + }, + { + "name":"right-angle", + "codes":["D4D3D4:D1D3D1", "D4D2D4:D1D2D1", "D4D2D4:D1D3D1", "D4D3D4:D1D2D1"] + }, + { + "name":"up-down", + "codes":["D0D3:D0D2", "D5D3:D5D2", "D5D3:D0D2"] + }, + { + "name":"grand-jete", + "codes":["D4:D1", "D5:D0"] + }, + { + "name":"wave", + "codes":["D5D3D5D3:D0D2D0D2", "D5D3D5D3:D0D1D0D1"] + }, + { + "name":"no-motion", + "codes":["D2D3:D3D2"] + }, + { + "name":"circle", + "codes":["D4D5D0D1D2:D4D5D0D1D2"] + }, + { + "name":"screw", + "codes":["D1D0D5D4D3:D4D5D0D1D2"] + }, + { + "name":"arc", + "codes":["D4D5D0:D1D0D5", "D5D0D1:D0D5D4"] + } + ] +} \ No newline at end of file diff -r d0c393730443 -r a28488078053 front_idill/src/dicoMI.json --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/front_idill/src/dicoMI.json Tue Jul 31 16:26:00 2012 +0200 @@ -0,0 +1,58 @@ +{ + "divisions":"6", + "gestures": + [ + { + "name":"contact", + "codes":["D1D0D1", "D1D0D2"] + }, + { + "name":"right-angle", + "codes":["D1D0D1D3D1", "D1D0D1D2D1"] + }, + { + "name":"up-down", + "codes":["D0D1", "D0D2"] + }, + { + "name":"fall", + "codes":["D3"] + }, + { + "name":"jump", + "codes":["D5"] + }, + { + "name":"grand-jete", + "codes":["D1D0", "D2D0"] + }, + { + "name":"wave", + "codes":["D1D0D1D0D1D0D1D0D1", "D2D0D2D0D2D0D2D0D2", "D2D0D1D0D2D0D2D0D2"] + }, + { + "name":"bend", + "codes":["D1D3", "D1D2"] + }, + { + "name":"knee-up", + "codes":["D3D0D3", "D3D2D3"] + }, + { + "name":"no-motion", + "codes":["D2D1D0D5D4D3D4"] + }, + { + "name":"circle", + "codes":["D4D5D0D1D2"] + }, + { + "name":"screw", + "codes":["D4D5D0D1D2D3D4D1D2", "D4D5D0D1D2D0D1D2"] + }, + { + "name":"arc", + "codes":["D0"] + } + ] +} \ No newline at end of file diff -r d0c393730443 -r a28488078053 front_idill/src/img/cursors/pointer2C.png Binary file front_idill/src/img/cursors/pointer2C.png has changed diff -r d0c393730443 -r a28488078053 front_idill/src/img/cursors/pointerC.png Binary file front_idill/src/img/cursors/pointerC.png has changed diff -r d0c393730443 -r a28488078053 front_idill/src/img/cursors/up_blue.png Binary file front_idill/src/img/cursors/up_blue.png has changed diff -r d0c393730443 -r a28488078053 front_idill/src/img/cursors/up_gray.png Binary file front_idill/src/img/cursors/up_gray.png has changed diff -r d0c393730443 -r a28488078053 front_idill/src/mosaic/js/mosaic.js --- a/front_idill/src/mosaic/js/mosaic.js Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/src/mosaic/js/mosaic.js Tue Jul 31 16:26:00 2012 +0200 @@ -26,7 +26,7 @@ */ function Mosaic(config, default_conf) { - this.gestures = ["fall", "jump", "circle", "screw", "bend", "arc", "knee_up", "right_angle", "wave", "slow", "hello", "no_motion", "contact", "up_down", "grand_jete"]; + this.gestures = ["fall", "jump", "circle", "screw", "bend", "arc", "knee-up", "right-angle", "wave", "slow", "hello", "no-motion", "contact", "up-down", "grand-jete"]; //Chemin du fichier de configuration. this.config_path = config; @@ -194,6 +194,8 @@ this.isHelpIconZoomed = false; //Indique si l'icone d'aide est dans une interaction de zoom/dezoom en cours. this.isHelpIconZooming = false; + //Indique à l'utilisateur s'il doit retirer ses mains pour refaire une recherche par courbes. + this.mustTakeOutHands = false; //Timeout (attente) pour le zoom après un préZoom. this.zoomTimeout = null; @@ -498,7 +500,7 @@ if(this.isSearchByCurvesOn) { //On quitte la zone de recherche. - this.isUserInSearchZone = false; + /*this.isUserInSearchZone = false; //On regarde si ce qu'on a tracé correspond à une courbe en particulier. var gesture_match = this.gestureWithSameCode(this.actualCode); @@ -555,7 +557,7 @@ { this.currentMode = "VIDEO"; } - } + }*/ //On dit au module de recherche qu'on arrête de tracer des courbes. this.searchCanvas.onPointerOut(); } @@ -821,7 +823,7 @@ var _this = this; //Variables censées être des ints. - var supposedToBeInt = ['imagesByLine', 'imagesToShow', 'totalImages', 'timeReloadAfterResize', 'timePrezoom', 'timePreUnzoom', 'zoomTime', 'timeUnzoom', 'timeNeighbourGlowing', 'timeNeighbourUnglowing', 'timeMovingToNeighbour', 'timeSearchFade', 'timeNotifyFade', 'timeFilterFade', 'timeANFade', 'timeFilling', 'zoomedMargin', 'timeoutZoom', 'timeoutUnzoom', 'timeoutMoveToNeighbour', 'timeoutPointersIdle', 'timeoutAreBothPointersHere', 'timeoutRemoveNotificationByGesture', 'timeoutNotifySwipe', 'timeoutSelectTL', 'timeoutSlideTL', 'timeoutCanNotifyHelp', 'timeoutRemoveSpinner', 'timeoutNouser', 'timeoutNextDrawCurve', 'mouseUpDownDeltaTreshold', 'helpBorderSize']; + var supposedToBeInt = ['imagesByLine', 'imagesToShow', 'totalImages', 'timeReloadAfterResize', 'timePrezoom', 'timePreUnzoom', 'zoomTime', 'timeUnzoom', 'timeNeighbourGlowing', 'timeNeighbourUnglowing', 'timeMovingToNeighbour', 'timeSearchFade', 'timeNotifyFade', 'timeFilterFade', 'timeANFade', 'timeFilling', 'zoomedMargin', 'timeoutZoom', 'timeoutUnzoom', 'timeoutMoveToNeighbour', 'timeoutPointersIdle', 'timeoutAreBothPointersHere', 'timeoutRemoveNotificationByGesture', 'timeoutNotifySwipe', 'timeoutSelectTL', 'timeoutSlideTL', 'timeoutCanNotifyHelp', 'timeoutRemoveSpinner', 'timeoutNouser', 'timeoutNextDrawCurve', 'mouseUpDownDeltaTreshold', 'kinectUpDownDeltaTreshold', 'helpBorderSize']; //Variables censées êtres des floats. var supposedToBeFloat = ['zoomPercentage', 'prezoomPercentage']; @@ -1084,13 +1086,13 @@ //Après un délai d'absence de l'utilisateur on redémarre. this.nouserTimeout = setTimeout(function() { - window.location.reload(); + // window.location.reload(); }, this.config.timeoutNouser); } //S'il n'y a qu'un snapshot à afficher et qu'on est en préphase, on redémarre. else if((event == "NO-USER" || event == "INCOMING-0" || event == "INCOMING-1") && this.config.noUserModeEnabled) { - window.location.reload(); + // window.location.reload(); } //Si on a fait un swipe. else if(event.indexOf("SWIPE") != -1) @@ -1162,7 +1164,7 @@ //On la met en minuscule. gestureReceived = event.toLowerCase(); //On met à jour la gesture recherchée. - this.currentSearchGesture[centerId] = gestureReceived; + this.currentSearchGesture[this.centerId] = gestureReceived; } //Si on a effectué un hello, qu'on peut notifier l'aide et que les deux mains ne sont pas dans la zone de recherche. else if(event.indexOf("HELLO") != -1 && this.canNotifyHelp && !this.areBothPointersHere) diff -r d0c393730443 -r a28488078053 front_idill/src/mosaic/js/neighbours.js --- a/front_idill/src/mosaic/js/neighbours.js Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/src/mosaic/js/neighbours.js Tue Jul 31 16:26:00 2012 +0200 @@ -490,7 +490,7 @@ $('#snapshotDiv-' + destinationId).css('opacity', '1'); //Si le player est prêt. - if(_this.playerIsReady) + if(_this.player && _this.player.widgets[0] && _this.playerIsReady) { //Si on est en mode timeline on la quitte. if(_this.currentMode == 'TIMELINE') diff -r d0c393730443 -r a28488078053 front_idill/src/mosaic/js/notifications.js --- a/front_idill/src/mosaic/js/notifications.js Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/src/mosaic/js/notifications.js Tue Jul 31 16:26:00 2012 +0200 @@ -68,7 +68,7 @@ search_2hands_tab_text = ['no-motion', 'contact', 'grand-jete', 'screw', 'arc', 'circle', 'up-down', 'wave']; search_body_tab = ['chute', 'knee_up', 'jump', 'bend']; search_body_tab_text = ['fall', 'knee-up', 'jump', 'bend']; - search_2hands_tab_opacities = [0.5, 0.5, 0.5, 0.5, 0.5, 0.5, 0.5, 0.5]; + search_2hands_tab_opacities = [1, 1, 1, 1, 1, 1, 1, 1]; search_body_tab_opacities = [1, 1, 1, 1]; } @@ -91,7 +91,7 @@ else { controls_1hand_tab = ['deplacer', 'precedent', 'suivant', 'mosaique_horizontal', 'mosaique_vertical', 'move_down', 'move_up', 'move_right', 'move_left']; - controls_1hand_tab = ['controls_timeline', 'controls_previous', 'controls_next', 'controls_mos_horizontal', 'controls_mos_vertical', 'controls_move_down', 'controls_move_up', 'controls_move_right', 'controls_move_left']; + controls_1hand_tab_text = ['controls_timeline', 'controls_previous', 'controls_next', 'controls_mos_horizontal', 'controls_mos_vertical', 'controls_move_down', 'controls_move_up', 'controls_move_right', 'controls_move_left']; controls_1hand_tab_opacities = [1, 1, 1, 1, 1, 1, 1, 1, 1]; } } @@ -279,12 +279,12 @@ $('#controls_title').html(this.helpText.controls_title); $('#controls_1hand_text').html(this.helpText.controls_1hand_text); - //On affecte les images des actions de contrôle de l'interface. - for(var i = 0 ; i < controls_1hand_tab.length ; i++) - { - $("#1hand_" + controls_1hand_tab[i]).css("background-image", "url('" + img_directory + controls_1hand_tab[i] + ".png')"); - $("#1hand_" + controls_1hand_tab[i]).html(this.helpText[controls_1hand_tab_text[i]]); - } + //On affecte les images des actions de contrôle de l'interface. + for(var i = 0 ; i < controls_1hand_tab.length ; i++) + { + $("#1hand_" + controls_1hand_tab[i]).css("background-image", "url('" + img_directory + controls_1hand_tab[i] + ".png')"); + $("#1hand_" + controls_1hand_tab[i]).html(this.helpText[controls_1hand_tab_text[i]]); + } //On les fait apparaître. $('#notify_help').css( @@ -307,6 +307,8 @@ */ Mosaic.prototype.removeHelp = function() { + // console.trace(); + //Si l'aide n'est pas affichée, on part. if(!this.helpDisplayed) { @@ -553,7 +555,7 @@ { return; } - + var _this = this; //On spécifie les notifications en div. @@ -569,7 +571,7 @@ if(_.include(this.gestures, gestureName)) { - $('#notify_search_1gesture').css('background-image', 'url("./pictos/big/' + (this.config.mouseInteractions ? 'MI' : '') + '/' + (this.gestureDelRequested ? 'hover' : 'valid') + '/' + gestureName + '.png")'); + $('#notify_search_1gesture').css('background-image', 'url("./pictos/big/' + (this.config.mouseInteractions ? 'MI/' : '') + (this.gestureDelRequested ? 'hover' : 'valid') + '/' + gestureName + '.png")'); } else if(mode == 'none') { @@ -620,7 +622,7 @@ if(_.include(this.gestures, gestureName)) { - $('#notify_search_1gesture').css('background-image', 'url("./pictos/big/' + (this.config.mouseInteractions ? 'MI' : '') + '/' + mode + '/' + gestureName + '.png")'); + $('#notify_search_1gesture').css('background-image', 'url("./pictos/big/' + (this.config.mouseInteractions ? 'MI/' : '') + mode + '/' + gestureName + '.png")'); } else if(mode == 'none') { @@ -682,7 +684,7 @@ var notifyTop = 0, notifyLeft = 0; - if(direction.equals("left")) + if(direction == "left") { this.putText($('#notify_swipe'), this.notificationStrings.next); } @@ -999,7 +1001,7 @@ var notifyTop = 0, notifyLeft = 0; this.putText($('#notify_search'), this.notificationStrings.search); - if(direction.equals("left")) + if(direction == "left") { this.putText($('#notify_swipe'), this.notificationStrings.next); } @@ -1312,7 +1314,7 @@ $('#notify_search_1gesture').css('background-image', 'url("./pictos/big/normal/inconnu.png")'); } - if(direction.equals("left")) + if(direction == "left") { this.putText($('#notify_swipe'), this.notificationStrings.next); } diff -r d0c393730443 -r a28488078053 front_idill/src/mosaic/js/pointers.js --- a/front_idill/src/mosaic/js/pointers.js Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/src/mosaic/js/pointers.js Tue Jul 31 16:26:00 2012 +0200 @@ -29,6 +29,11 @@ { return; } + + this.minX = $(window).width(); + this.minY = $(window).height(); + this.maxX = 0; + this.maxY = 0; //On crée et ajoute les pointeurs. var mainPointer = '

'; @@ -154,13 +159,21 @@ { isOtherPointerDisplayed = this.isSecondPointerDisplayed; pointer = $('#mainPointer'); - pointerImg = 'url(./img/cursors/pointer.png)'; + + if(!this.isSearchByCurvesOn) + { + pointerImg = 'url(./img/cursors/pointer.png)'; + } } else { isOtherPointerDisplayed = this.isMainPointerDisplayed; pointer = $('#secondPointer'); - pointerImg = 'url(./img/cursors/pointer2.png)'; + + if(!this.isSearchByCurvesOn) + { + pointerImg = 'url(./img/cursors/pointer2.png)'; + } } //On regarde si on est sur un snapshot. @@ -217,17 +230,25 @@ { pointer = $('#mainPointer'); thisPointerNeighbourSelectedId = this.mainPointerNeighbourSelectedId; - pointerImg = 'url(./img/cursors/pointer.png)'; thisPointerExitBorder = this.mainPointerExitBorder; otherPointerExitBorder = this.secondPointerExitBorder; + + if(!this.isSearchByCurvesOn) + { + pointerImg = 'url(./img/cursors/pointer.png)'; + } } else { pointer = $('#secondPointer'); thisPointerNeighbourSelectedId = this.secondPointerNeighbourSelectedId; - pointerImg = 'url(./img/cursors/pointer2.png)'; thisPointerExitBorder = this.secondPointerExitBorder; otherPointerExitBorder = this.mainPointerExitBorder; + + if(!this.isSearchByCurvesOn) + { + pointerImg = 'url(./img/cursors/pointer2.png)'; + } } var zoomX = pointerX - this.notifyLeftVideo, zoomY = pointerY - this.notifyTopVideo; @@ -236,7 +257,7 @@ this.pointersTimelineSelection(pointerX, pointerY, isMainPointer); //Si on se trouve actuellement dans une recherche par gestures. - if(this.isCurrentlyInASearchByGesture) + if(this.currentSearchGesture[this.centerId]) { this.checkIfPointerIsOnSearchNotification(pointerX, pointerY, pointer); } @@ -409,19 +430,22 @@ //Si on est en mode d'interaction Kinect. if(!this.config.mouseInteractions) { - //On met le spinner gif sur le pointeur. - var spinner = ""; - $('body').append(spinner); - $('#spinner').css( + //On met le spinner gif sur le pointeur s'il existe. + if(pointer.length > 0) { - position: 'absolute', - top: pointer.position().top, - left: pointer.position().left, - width: 85, - height: 85, - 'z-index': 600 - }); - $('#spinner').attr('src', './img/cursors/selector_anim.gif'); + var spinner = ""; + $('body').append(spinner); + $('#spinner').css( + { + position: 'absolute', + top: pointer.position().top, + left: pointer.position().left, + width: 85, + height: 85, + 'z-index': 600 + }); + $('#spinner').attr('src', './img/cursors/selector_anim.gif'); + } } this.selectTLTimeout = setTimeout(function() @@ -490,10 +514,13 @@ //Si on est en mode d'interaction Kinect, on effectue un réhaussement de la position. if(!this.config.mouseInteractions) { - x *= 7; + this.minMax(x, y); + x = this.scaleIntervals(this.config.kinectMinCoordX, this.config.kinectMaxCoordX, 0, $(window).width(), x); + y = this.scaleIntervals(this.config.kinectMinCoordY, this.config.kinectMaxCoordY, 0, $(window).height(), y); + /*x *= 7; y *= 7; x -= $(window).width() * 3 / 4; - y -= $(window).height() * 2 / 4; + y -= $(window).height() * 2 / 4;*/ } var pointer; @@ -625,7 +652,7 @@ } //Si l'aide est affichée, on la masque. - if(this.helpDisplayed) + if(this.helpDisplayed && !this.mustTakeOutHands) { this.removeHelp(); } @@ -768,13 +795,13 @@ { var _this = this; var notification_search = $('#notify_search_1gesture'); - + //Si la notification de recherche existe (dans le player). if(notification_search.length > 0) { //Pictogramme actuel de la notification. var currentPicto = notification_search.css('background-image'); - + //Si le pointeur est sur la notification. if(x > notification_search.position().left && x < (+notification_search.position().left + notification_search.width()) && y > notification_search.position().top && y < (+notification_search.position().top + notification_search.height())) { @@ -789,22 +816,36 @@ if(!this.config.mouseInteractions) { //On met le spinner gif sur le pointeur. - var spinner = ""; - $('body').append(spinner); - $('#spinner').css( - { - position: 'absolute', - top: pointer.position().top, - left: pointer.position().left, - width: 85, - height: 85, - 'z-index': 600 - }); - $('#spinner').attr('src', './img/cursors/selector_anim.gif'); + if(pointer != null && pointer.length > 0) + { + //On modifie l'apparence du pointeur. + pointer.css('background-image', 'url(./img/cursors/selector_gray.png)'); + var spinner = ""; + $('body').append(spinner); + $('#spinner').css( + { + position: 'absolute', + top: pointer.position().top, + left: pointer.position().left, + width: 85, + height: 85, + 'z-index': 600 + }); + $('#spinner').attr('src', './img/cursors/selector_anim.gif'); + } //Après un laps de temps sur la notification, on supprime la recherche et on revient au mode précédent. this.removeNotificationByGestureTimeout = setTimeout(function() { + if(pointer.attr('id') == 'mainPanel') + { + pointer.css('background-image', 'url(./img/cursors/pointer.png)'); + } + else + { + pointer.css('background-image', 'url(./img/cursors/pointer2.png)'); + } + //Si on est en recherche, on revient en video. if(_this.currentMode == 'SEARCH') { @@ -825,6 +866,7 @@ _this.alreadyOnNotification = false; _this.isCurrentlyInASearchByGesture = false; + _this.gestureDelRequested = false; //Si on n'est ni en recherche, ni en filtrage, on enlève la gesture de recherche. if(_this.currentMode != 'MOSAIC' && _this.currentMode != 'FILTER') @@ -935,4 +977,21 @@ } return false; +} + +/* + * Change la couleur des pointeurs pendant le tracé d'une courbe. +*/ +Mosaic.prototype.pointersGreen = function() +{ + $('#mainPointer').css('background-image', 'url(./img/cursors/pointerC.png)'); + $('#secondPointer').css('background-image', 'url(./img/cursors/pointer2C.png)'); +} + +Mosaic.prototype.minMax = function(x, y) +{ + if(x < this.minX) {this.minX = x;} + if(x > this.maxX) {this.maxX = x;} + if(y < this.minY) {this.minY = y;} + if(y > this.maxY) {this.maxY = y;} } \ No newline at end of file diff -r d0c393730443 -r a28488078053 front_idill/src/mosaic/js/search.js --- a/front_idill/src/mosaic/js/search.js Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/src/mosaic/js/search.js Tue Jul 31 16:26:00 2012 +0200 @@ -61,7 +61,7 @@ */ Mosaic.prototype.getDictionary = function() { - var path = this.config.curveDictionary; + var path = (this.config.mouseInteractions ? this.config.curveDictionaryMI : this.config.curveDictionaryKI); var dico = []; var _this = this; @@ -95,13 +95,16 @@ }); } -/*Mosaic.prototype.listenToPointers = function() +/* + * Ecoute la position des pointeurs si les deux sont détectés afin de tracer des courbes de recherche. +*/ +Mosaic.prototype.listenToPointers = function() { if(this.searchCanvas) { } -}*/ +} /* * Quitte une recherche par courbes. @@ -263,7 +266,15 @@ */ Mosaic.prototype.scaleIntervals = function(A, B, C, D, val) { - return (D - C + A) * val + (C - A); + // return (D - C + A) * val + (C - A); + if(A == B) + { + return (D - C) / 2; + } + else + { + return (D - C) * (val - A) / (B - A) + C; + } } /* diff -r d0c393730443 -r a28488078053 front_idill/src/mosaic/js/zoomInteractions.js --- a/front_idill/src/mosaic/js/zoomInteractions.js Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/src/mosaic/js/zoomInteractions.js Tue Jul 31 16:26:00 2012 +0200 @@ -142,19 +142,22 @@ prezoomPointer = $('#mainPointer'); } - //On crée le spinner qui indique le temps restant avant le zoom. - var spinner = ""; - $('body').append(spinner); - $('#spinner').css( - { - position: 'absolute', - top: prezoomPointer.position().top, - left: prezoomPointer.position().left, - width: 85, - height: 85, - 'z-index': 600 - }); - $('#spinner').attr('src', './img/cursors/selector_anim_2.gif'); + //On crée le spinner s'il y a un pointeur qui indique le temps restant avant le zoom. + if(prezoomPointer != null && prezoomPointer.length > 0) + { + var spinner = ""; + $('body').append(spinner); + $('#spinner').css( + { + position: 'absolute', + top: prezoomPointer.position().top, + left: prezoomPointer.position().left, + width: 85, + height: 85, + 'z-index': 600 + }); + $('#spinner').attr('src', './img/cursors/selector_anim_2.gif'); + } } } //Si on est en mode d'interaction souris, on indique juste qu'on est en prezoom. diff -r d0c393730443 -r a28488078053 front_idill/src/search/js/curvesDetector.js --- a/front_idill/src/search/js/curvesDetector.js Mon Jul 30 16:45:46 2012 +0200 +++ b/front_idill/src/search/js/curvesDetector.js Tue Jul 31 16:26:00 2012 +0200 @@ -35,6 +35,9 @@ //Code actuel généré. Il représente la structure de la courbe de recherche. this.actualCode = ''; + //Les éléments composant le code (correspondant aux courbes. + this.MPCode = ''; + this.SPCode = ''; this.joints = []; this.jInc = 0; @@ -87,13 +90,21 @@ { this.MPrepX = 0; this.MPrepY = 0; + this.SPrepX = 0; + this.SPrepY = 0; this.MPpx = 0; this.MPpy = 0; + this.SPpx = 0; + this.SPpy = 0; this.MPActualAngle = -1; this.SPActualAngle = -1; + this.MPCode = ''; + this.SPCode = ''; this.actualCode = ''; this.MPActualDist = 0; + this.SPActualDist = 0; this.MPTotalDist = 0; + this.SPTotalDist = 0; } /* @@ -141,6 +152,14 @@ { this.SPpy = spy; } + if(!this.SPrepX) + { + this.SPrepX = spx; + } + if(!this.SPrepY) + { + this.SPrepY = spy; + } } //On met à jour la distance des segments courants et on regarde les correspondances dans le dictionnaire. @@ -175,8 +194,11 @@ //Angle courant initialisé à -1. var MPCurrentA = -1; + //Seuil de considération d'un segment. + var treshold = (this.mosaic.config.mouseInteractions ? this.mosaic.config.mouseUpDownDeltaTreshold : this.mosaic.config.kinectUpDownDeltaTreshold); + //Si la distance actuelle du segment existe. - if(MPDist > 0) + if(MPDist > treshold) { //On calcule l'angle courant entre ce segment et MPCurrentA = this.currentAngle(this.MPrepX, this.MPrepY, this.MPx, this.MPy, this.divisions); @@ -191,110 +213,19 @@ //On affecte le nouvel angle. this.MPActualAngle = MPCurrentA; //On construit le code correspondant à ce segment. - this.actualCode += 'D' + MPCurrentA; - //On affecte le code dans la mosaique. - this.mosaic.actualCode = this.actualCode; - //On recherche les gestures commencant par ce code. - foundGestures = this.codeToGestures(this.actualCode); - - //S'il n'y a pas de gestures trouvées ou s'il y en a plus d'une. - if(foundGestures.length == 0 || foundGestures.split(';').length != 1) - { - //On a trouvé quelque chose, même si ce qu'on a trouvé est vide (''). - this.mosaic.curvesGesturesFound = true; - //On notifie ce qu'on a trouvé. Dans le cas où c'est '', on affiche geste inconnu. - this.mosaic.removeNotifications(); - this.mosaic.curvesGestures(foundGestures); - - //Si ce qu'on a trouvé est vide et si l'aide n'est pas affichée. - if(foundGestures.length == 0 && !this.mosaic.helpDisplayed && this.mosaic.mouseInteractions) - { - //On affiche différentes aides en fonction de si on se trouve dans une vidéo ou non. - if(this.mosaic.currentMode == 'SEARCH') - { - this.mosaic.notifyHelp(false); - } - else if(this.mosaic.currentMode == 'FILTER') - { - this.mosaic.notifyHelp(true); - } - foundGestures = ''; - - //On enlève la recherche. - this.mosaic.curvesGesturesFound = false; - this.mosaic.isSearchByCurvesOn = false; - this.mosaic.leaveSearch(); - - //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.centerId] == "") - { - this.mosaic.currentMode = "VIDEO"; - } - } - //Si l'aide est déjà affichée, on l'enlève. - else if(foundGestures.split(';').length != 1 && this.mosaic.helpDisplayed) - { - this.mosaic.removeHelp(); - } - } - //Si on a un seul résultat. - else - { - //On affecte la recherche. - this.mosaic.currentSearchGesture[this.mosaic.centerId] = foundGestures; - this.mosaic.isUserInSearchZone = false; - - //Si on est en mode recherche et que le player est prêt. - if(this.mosaic.currentMode == "SEARCH" && this.mosaic.playerIsReady) - { - //On effectue la recherche. - this.mosaic.player.widgets[0].searchByGesture(foundGestures); - this.mosaic.isCurrentlyInASearchByGesture = this.mosaic.player.widgets[0].isCurrentlyInASearchByGesture; - - //On notifie. - this.mosaic.removeNotifications(); - this.mosaic.searchGesture(foundGestures, 'valid'); - - //S'il y a un marqueur trouvé au moins, on place le curseur sur le premier résultat. - 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 enlève a recherche par courbes. - foundGestures = ''; - this.mosaic.curvesGesturesFound = false; - - this.mosaic.isSearchByCurvesOn = false; - this.mosaic.leaveSearch(); - } - //Si on est en filtrage. - else if(this.mosaic.currentMode == "FILTER") - { - if(this.mosaic.isMosaicFiltered) - { - //On met à jour la gesture de filtrage. - this.mosaic.filterSearchedType = foundGestures; - //On filtre la mosaique. - this.mosaic.searchFilter(foundGestures); - this.mosaic.curvesGesturesFound = false; - //On notifie. - this.mosaic.removeNotifications(); - this.mosaic.filterGesture(foundGestures, 'valid'); - - foundGestures = ''; - //On enlève la recherche par courbes. - this.mosaic.isSearchByCurvesOn = false; - this.mosaic.leaveSearch(); - } - } - } + this.MPCode += 'D' + MPCurrentA; + + if(this.mosaic.config.mouseInteractions) + { + this.actualCode = this.MPCode; + //On affecte le code dans la mosaique. + this.mosaic.actualCode = this.actualCode; + //On recherche les gestures commencant par ce code. + foundGestures = this.codeToGestures(this.actualCode); + // console.log(this.actualCode); + this.foundGesturesManagement(foundGestures); + } + //On réinitialise la distance entre les deux derniers points. this.MPActualDist = 0; } @@ -324,8 +255,9 @@ this.MPpy = this.MPy; } } + //Idem au cas où on aurait un deuxième pointeur. - if(this.SPx && this.SPy && this.SPpx && this.SPpy) + if(this.SPx && this.SPy && this.SPpx && this.SPpy && this.SPrepX && this.SPrepY) { //Distance entre les deux derniers points. var SPDist = Math.floor(Math.sqrt((this.SPx - this.SPpx) * (this.SPx - this.SPpx) + (this.SPy - this.SPpy) * (this.SPy - this.SPpy))); @@ -334,11 +266,47 @@ //Et aussi la distance du segment en cours. this.SPActualDist += SPDist; - //Si la distance actuelle du segment existe. - if(SPDist > 0) + //Angle courant initialisé à -1. + var SPCurrentA = -1; + + //Seuil de considération d'un segment. + var treshold = (this.mosaic.config.mouseInteractions ? this.mosaic.config.mouseUpDownDeltaTreshold : this.mosaic.config.kinectUpDownDeltaTreshold); + + //Si la distance actuelle du segment est plus grande que le treshold. + if(SPDist > treshold) + { + //On calcule l'angle courant entre ce segment en divisions horaires. + SPCurrentA = this.currentAngle(this.SPrepX, this.SPrepY, this.SPx, this.SPy, this.divisions); + } + + //Si la distance du segment actuel excède le seuil de la config et qu'il y a un angle. + if(this.SPActualDist > this.sizeTreshold && SPCurrentA != -1) { - /*En développement*/ - this.currentAngle(this.SPpx, this.SPpy, this.SPx, this.SPy); + //Si l'angle affecté n'a pas encore de valeur ou si l'angle affecté est différent de l'angle calculé. + if(this.SPActualAngle == -1 || this.SPActualAngle != SPCurrentA) + { + //On affecte le nouvel angle. + this.SPActualAngle = SPCurrentA; + //On construit le code correspondant à ce segment. + this.SPCode += 'D' + SPCurrentA; + + //On réinitialise la distance entre les deux derniers points. + this.SPActualDist = 0; + } + //Sinon si l'angle n'a pas changé dans le segment en cours. + else + { + //On met à jour les dernières coordonnées du pointeur principal. + this.SPrepX = this.SPpx; + this.SPrepY = this.SPpy; + } + + //Si l'angle affecté n'a pas encore de valeur. + if(this.SPActualAngle == -1) + { + //On le met à jour. + this.SPActualAngle = SPCurrentA; + } } //On met à jour les coordonnées précédentes. @@ -351,6 +319,16 @@ this.SPpy = this.SPy; } } + + if(!this.mosaic.config.mouseInteractions && (this.SPCode || this.MPCode)) + { + this.actualCode = this.SPCode + ':' + this.MPCode; + // console.log(this.actualCode); + this.mosaic.actualCode = this.actualCode; + //On recherche les gestures commencant par ce code. + foundGestures = this.codeToGestures(this.actualCode); + this.foundGesturesManagement(foundGestures); + } } /* @@ -369,13 +347,27 @@ //Pour touts les codes de chaque gesture du dictionnaire. for(var j = 0 ; j < this.dictionary[i].codes.length ; j++) { - //Si le code en entrée est une partie début d'un des codes. - if(this.dictionary[i].codes[j].indexOf(code) == 0) - { - //On ajoute le nom de la gesture et on passe à la gesture suivante. - retNames += this.dictionary[i].name + ';'; - break; - } + if(this.mosaic.config.mouseInteractions) + { + //Si le code en entrée est une partie début d'un des codes. + if(this.dictionary[i].codes[j].indexOf(code) == 0) + { + //On ajoute le nom de la gesture et on passe à la gesture suivante. + retNames += this.dictionary[i].name + ';'; + break; + } + } + else + { + //On décompose le code dynamique et du dictionnaire en deux parties. + var partsCode = code.split(':'), partsDicoCode = this.dictionary[i].codes[j].split(':'); + //Si les débuts des deux parties correspondent aux deux parties du code dynamique. + if(partsDicoCode[0].indexOf(partsCode[0]) == 0 && partsDicoCode[1].indexOf(partsCode[1]) == 0) + { + retNames += this.dictionary[i].name + ';'; + break; + } + } } } //Comme on sépare chaque nom par un ;, il faut supprimer le dernier si au moins un nom a été trouvé. @@ -407,4 +399,115 @@ } return angleDiv; +} + +/* + * Fonction de gestion des courbes trouvées. +*/ +CurvesDetector.prototype.foundGesturesManagement = function(foundGestures) +{ + //S'il n'y a pas de gestures trouvées ou s'il y en a plus d'une. + if(foundGestures.length == 0 || foundGestures.split(';').length != 1) + { + //On a trouvé quelque chose, même si ce qu'on a trouvé est vide (''). + this.mosaic.curvesGesturesFound = true; + //On notifie ce qu'on a trouvé. Dans le cas où c'est '', on affiche geste inconnu. + this.mosaic.removeNotifications(); + this.mosaic.curvesGestures(foundGestures); + + //Si ce qu'on a trouvé est vide et si l'aide n'est pas affichée. + if(foundGestures.length == 0 && !this.mosaic.helpDisplayed && !this.mosaic.config.mouseInteractions) + { + //Si on est en mode d'interaction Kinect, on désactive les courbes jusqu'à ce que l'utilisateur n'a plus les deux mains dans la zone (pour éviter les erreurs de manipulation). + this.mosaic.mustTakeOutHands = true; + + //On affiche différentes aides en fonction de si on se trouve dans une vidéo ou non. + if(this.mosaic.currentMode == 'SEARCH') + { + this.mosaic.notifyHelp(false); + } + else if(this.mosaic.currentMode == 'FILTER') + { + this.mosaic.notifyHelp(true); + } + foundGestures = ''; + + //On enlève la recherche. + this.mosaic.curvesGesturesFound = false; + this.mosaic.isSearchByCurvesOn = false; + this.mosaic.leaveSearch(); + + //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.centerId] == "") + { + this.mosaic.currentMode = "VIDEO"; + } + } + //Si l'aide est déjà affichée, on l'enlève. + else if(foundGestures.split(';').length != 1 && this.mosaic.helpDisplayed && !this.mosaic.mustTakeOutHands) + { + this.mosaic.removeHelp(); + } + } + //Si on a un seul résultat. + else + { + //Si on est en mode d'interaction Kinect, on désactive les courbes jusqu'à ce que l'utilisateur n'a plus les deux mains dans la zone (pour éviter les erreurs de manipulation). + this.mosaic.mustTakeOutHands = true; + + // On affecte la recherche. + this.mosaic.currentSearchGesture[this.mosaic.centerId] = foundGestures; + this.mosaic.isUserInSearchZone = false; + + //Si on est en mode recherche et que le player est prêt. + if(this.mosaic.currentMode == "SEARCH" && this.mosaic.playerIsReady) + { + //On effectue la recherche. + this.mosaic.player.widgets[0].searchByGesture(foundGestures); + this.mosaic.isCurrentlyInASearchByGesture = this.mosaic.player.widgets[0].isCurrentlyInASearchByGesture; + + //On notifie. + this.mosaic.removeNotifications(); + this.mosaic.searchGesture(foundGestures, 'valid'); + + //S'il y a un marqueur trouvé au moins, on place le curseur sur le premier résultat. + 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 enlève a recherche par courbes. + foundGestures = ''; + this.mosaic.curvesGesturesFound = false; + + this.mosaic.isSearchByCurvesOn = false; + this.mosaic.leaveSearch(); + } + //Si on est en filtrage. + else if(this.mosaic.currentMode == "FILTER") + { + if(this.mosaic.isMosaicFiltered) + { + //On met à jour la gesture de filtrage. + this.mosaic.filterSearchedType = foundGestures; + //On filtre la mosaique. + this.mosaic.searchFilter(foundGestures); + this.mosaic.curvesGesturesFound = false; + //On notifie. + this.mosaic.removeNotifications(); + this.mosaic.filterGesture(foundGestures, 'valid'); + + foundGestures = ''; + //On enlève la recherche par courbes. + this.mosaic.isSearchByCurvesOn = false; + this.mosaic.leaveSearch(); + } + } + } } \ No newline at end of file diff -r d0c393730443 -r a28488078053 front_idill/src/search/js/searchCanvas.js --- 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();