Front IDILL: V00.07
authorbastiena
Wed, 29 Aug 2012 11:19:27 +0200
changeset 85 b244a7bc0844
parent 81 52d9859fd94c
child 86 158f7637e32f
Front IDILL: credits icon mechanism added
front_idill/src/img/creditsIcon.png
front_idill/src/img/creditsIcon2.png
front_idill/src/mosaic/css/mosaic.less
front_idill/src/mosaic/js/mosaic.js
front_idill/src/mosaic/js/mouseInteractions.js
front_idill/src/mosaic/js/notifications.js
front_idill/src/mosaic/js/pointers.js
Binary file front_idill/src/img/creditsIcon.png has changed
Binary file front_idill/src/img/creditsIcon2.png has changed
--- a/front_idill/src/mosaic/css/mosaic.less	Sat Aug 18 02:51:09 2012 +0200
+++ b/front_idill/src/mosaic/css/mosaic.less	Wed Aug 29 11:19:27 2012 +0200
@@ -297,7 +297,7 @@
 /*
  * Panneau d'aide
  */
-#notify_help
+#notify_help, #notify_credits
 {
 	position: absolute;
 	margin: @notify-help-margin;
@@ -475,7 +475,7 @@
 /*
  * Icone permettant d'afficher l'aide dans le mode d'interaction souris.
 */
-#helpIcon, #exitIcon, #homeIcon, #searchExitIcon
+#helpIcon, #creditsIcon, #exitIcon, #homeIcon, #searchExitIcon
 {
 	width: 50px;
 	height: 50px;
--- a/front_idill/src/mosaic/js/mosaic.js	Sat Aug 18 02:51:09 2012 +0200
+++ b/front_idill/src/mosaic/js/mosaic.js	Wed Aug 29 11:19:27 2012 +0200
@@ -132,6 +132,7 @@
     this.isMainPointerDisplayed = false;
     this.isSecondPointerDisplayed = false;
     this.helpDisplayed = false;
+    this.creditsDisplayed = false;
     //Indique si l'utilisateur a manuellement pausé la vidéo.
     this.userPaused = false;
     //Indique si on est en train de se déplacer vers un voisin.
@@ -201,6 +202,10 @@
 	this.isHelpIconZoomed = false;
 	//Indique si l'icone d'aide est dans une interaction de zoom/dezoom en cours.
 	this.isHelpIconZooming = false;
+	//Indique si l'icone des crédits a été agrandie.
+	this.isCreditsIconZoomed = false;
+	//Indique si l'icone des crédits est dans une interaction de zoom/dezoom en cours.
+	this.isCreditsIconZooming = false;
 	//Indique à l'utilisateur s'il doit retirer ses mains pour refaire une recherche par courbes.
 	this.mustTakeOutHands = false;
 	//Indique qu'une vidéo est en lecture.
@@ -472,6 +477,8 @@
 	
 	//On affiche l'icone d'aide.
 	this.helpIcon();
+	//On affiche l'icone des crédits.
+	this.creditsIcon();
 	
 	//Si on est sur tablette, on utilise l'événement touch start.
 	if(this.isTablet)
--- a/front_idill/src/mosaic/js/mouseInteractions.js	Sat Aug 18 02:51:09 2012 +0200
+++ b/front_idill/src/mosaic/js/mouseInteractions.js	Wed Aug 29 11:19:27 2012 +0200
@@ -40,6 +40,13 @@
 		}
 	}
 	
+	//Si on se trouve sur l'icone des crédits et qu'elle est zoomée.
+	if(this.isCredtisIconZoomed)
+	{
+		//On affiche les crédits.
+		this.notifyCredits();
+	}
+	
 	//On met à jour les coordonnées de la souris au dernier mouse down.
 	this.mouseDownPosX = e.pageX;
 	this.mouseDownPosY = e.pageY;
@@ -73,6 +80,18 @@
 		//On la rétrecit sinon.
 		this.showSmallHelp();
 	}
+
+	//On vérifie si la souris n'est pas sur l'icone des crédits.
+	if(this.isOnCreditsIcon(this.mousePosX, this.mousePosY))
+	{
+		//On agrandit l'icone des crédits.
+		this.showBigCredits();
+	}
+	else
+	{
+		//On la rétrecit sinon.
+		this.showSmallCredits();
+	}
 	
 	//Si on n'a pas appuyé sur la souris avant, on part.
 	if(!this.isMouseDown)
@@ -323,4 +342,10 @@
 	{
 		this.removeHelp();
 	}
+	
+	//Si les crédits sont affichés, un clic les ferme.
+	if(this.creditsDisplayed && !this.isCreditsIconZoomed && !this.isCreditsIconZooming)
+	{
+		this.removeCredits();
+	}
 }
\ No newline at end of file
--- a/front_idill/src/mosaic/js/notifications.js	Sat Aug 18 02:51:09 2012 +0200
+++ b/front_idill/src/mosaic/js/notifications.js	Wed Aug 29 11:19:27 2012 +0200
@@ -1929,4 +1929,123 @@
 Mosaic.prototype.removeSearchExitIcon = function()
 {
 	$('#searchExitIcon').remove();
+}
+
+/*
+ * Affiche l'icone des credits.
+ * Est appelé dans les fichiers :
+ * mosaic > fonction loadMosaic.
+ * zoomInteractions > fonctions zoom et unzoom.
+*/
+Mosaic.prototype.creditsIcon = function()
+{
+	this.removeCreditsIcon();
+	//On construit le div.
+	var creditsIcon = "<img id='creditsIcon' src='./img/creditsIcon.png' />";
+	//On l'ajoute.
+	$('body').append(creditsIcon);
+	//On spécifie ses coordonnées.
+	$('#creditsIcon').css(
+	{
+		top: $(window).height() - $('#creditsIcon').height() - 2 * parseInt($('#creditsIcon').css('margin-left')),
+		left: $(window).width() - $('#creditsIcon').width() - 2 * parseInt($('#creditsIcon').css('margin-left'))
+	});
+}
+
+/*
+ * Supprime l'icone des credits.
+ * Est appelé dans les fichiers :
+ * zoomInteractions > fonctions zoom et unzoom.
+ * notifications > fonction helpIcon.
+*/
+Mosaic.prototype.removeCreditsIcon = function()
+{
+	this.isCreditsIconZooming = false;
+	this.isCreditsIconZoomed = false;
+	$('#creditsIcon').remove();
+}
+
+/*
+ * Agrandit l'icone des credits.
+ * Est appelé dans le fichier :
+ * mosaic > fonction onMouseMove.
+*/
+Mosaic.prototype.showBigCredits = function()
+{
+	//Si on a déjà zoomé on quitte.
+	if(this.isCreditsIconZoomed || this.isCreditsIconZooming)
+	{
+		return;
+	}
+	
+	this.isCreditsIconZooming = true;
+	
+	var _this = this;
+	
+	$('#creditsIcon').animate(
+	{
+		width: 100,
+		height: 100,
+		top: $(window).height() - 100 - 2 * parseInt($('#creditsIcon').css('margin-left')),
+		left: $(window).width() - 100 - 2 * parseInt($('#creditsIcon').css('margin-left'))
+	}, this.config.timeShowBigCredits, function()
+	{
+		_this.isCreditsIconZoomed = true;
+		_this.isCreditsIconZooming = false;
+	});
+}
+
+/*
+ * Rétrecit l'icone des credits.
+ * Est appelé dans le fichier :
+ * mosaic > fonction onMouseMove.
+*/
+Mosaic.prototype.showSmallCredits = function()
+{
+	//Si on n'a pas zoomé on quitte.
+	if(!this.isCreditsIconZoomed || this.isCreditsIconZooming)
+	{
+		return;
+	}
+	
+	this.isCreditsIconZooming = true;
+	
+	var _this = this;
+	
+	var creditsIconWidth = $('#creditsIcon').width();
+	
+	$('#creditsIcon').animate(
+	{
+		width: 50,
+		height: 50,
+		top: $(window).height() - 50 - 2 * parseInt($('#creditsIcon').css('margin-left')),
+		left: $(window).width() - 50 - 2 * parseInt($('#creditsIcon').css('margin-left'))
+	}, this.config.timeShowBigCredits, function()
+	{
+		_this.isCreditsIconZoomed = false;
+		_this.isCreditsIconZooming = false;
+	});
+}
+
+/*
+ * Affiche les crédits.
+*/
+Mosaic.prototype.notifyCredits = function()
+{
+	if($('#notify_credits').length())
+	{
+		return;
+	}
+	
+	var credits = "<div id='notify_credits'></div>";
+	
+	$('body').append(credits);
+}
+
+/*
+ * Supprime les crédits.
+*/
+Mosaic.prototype.removeCredits = function()
+{
+	$('#notify_credits').remove();
 }
\ No newline at end of file
--- a/front_idill/src/mosaic/js/pointers.js	Sat Aug 18 02:51:09 2012 +0200
+++ b/front_idill/src/mosaic/js/pointers.js	Wed Aug 29 11:19:27 2012 +0200
@@ -992,6 +992,29 @@
 }
 
 /*
+ * Retourne vrai si la souris est sur la notification des crédits dans le mode d'interaction souris.
+ * Est appelé dans les fichiers :
+ * mosaic > onMouseMove.
+*/
+Mosaic.prototype.isOnCreditsIcon = function(x, y)
+{
+	var creditsIcon = $('#creditsIcon');
+	//S'il n'y a pas d'icone des crédits, on quitte.
+	if(creditsIcon.length <= 0)
+	{
+		return;
+	}
+	
+	//Si la souris est sur l'icone, on retourne true.
+	if(x > creditsIcon.position().left && x < +creditsIcon.position().left + creditsIcon.width() + 2 * parseInt(creditsIcon.css('margin-left')) && y > creditsIcon.position().top && y < +creditsIcon.position().top + creditsIcon.height() + 2 * parseInt(creditsIcon.css('margin-left')))
+	{
+		return true;
+	}
+	
+	return false;
+}
+
+/*
  * Retourne vrai si le doigt est sur la notification de sortie dans le mode d'interaction tablettes.
 */
 Mosaic.prototype.isOnExitIcon = function(x, y)