diff -r 52277fe2279c -r 9eff85166868 front_idill/src/mosaic/js/touchInteractions.js --- 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