trakers: comparison front_idill/src/mosaic/js/notifications.js

Mercurial Mercurial > trakers / comparison

summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | file | latest | revisions | annotate | diff | comparison | raw | help

front_idill/src/mosaic/js/notifications.js

changeset 77	205409da0f32
parent 58	a28488078053
child 79	9eff85166868

equal deleted inserted replaced

-:eae52b187e29
+:205409da0f32
 for(var i = 0 ; i < search_body_tab.length ; i++)
 {
 search_body_imgs += "<div id='body_" + search_body_tab[i] + "' class='notify_imgs_small' style='opacity: " + search_body_tab_opacities[i] + ";'></div>";
 }
 search_body_imgs += "</div>";
+		//On ajoute ce qu'il faut pour quitter l'aide.
 }
 //Titre de la colonne des actions de contrôle.
 var controls_title = "<div id='controls_title'></div>";
 //Image de la colonne.
 var notification_help = "<div id='notify_help'>" + help_search + "<div id='help_sep'></div>" + help_controls + "</div>";
 //On les ajoute à la mosaïque.
 $('body').append(notification_help);
+	if(this.isTablet)
+	{
+		//On rétrécit certaines images si on est sur une tablette.
+		$('#search_img, #controls_img').css(
+		{
+			height: 150,
+			'background-size': '150px 150px'
+		});
+		$('.notify_imgs_small').css(
+		{
+			height: 80,
+			width: 80,
+			'background-size': '80px 80px'
+		});
+		//On ajoute l'icone de sortie.
+		this.exitIcon();
+	}
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $(window).width(), notify_height = $(window).height();
-var notify_margin = parseInt($('#notify_help').css('margin'));
+var notify_margin = parseInt($('#notify_help').css('margin-left'));
 var notify_ = 10;
 //On les positionne.
 $('#notify_help').css(
 {
 height: notify_height - notify_margin * 2,
 'z-index': 1000
 });
 //Taille des marges des images.
-var margins = parseInt($('.notify_imgs_small').css('margin'));
+var margins = parseInt($('.notify_imgs_small').css('margin-left'));
 //Largeur des images.
 var widths = $('.notify_imgs_small').width();
 //Hauteur des images.
 var heights = $('.notify_imgs_small').height();
 //Position horizontale du séparateur de colonnes.
 var sep_left = $('#help_sep').position().left;
 //Marge du panneau d'aide.
-var help_margin = parseInt($('#notify_help').css('margin'));
+var help_margin = parseInt($('#notify_help').css('margin-left'));
 //On calcule la taille d'une zone de recherche (une des deux parties).
 var help_column_width = sep_left - help_margin;
 //Longueur d'une image.
 var img_width = (margins * 2 + widths);
 //On positionne la section de recherche par courbes.
 $('#search_2hands_imgs').css(
 {
 'padding-left': search_2hands_padding_left,
-'height': ($('.notify_imgs_small').height() * 2 + parseInt($('.notify_imgs_small').css('margin')))
+'height': ($('.notify_imgs_small').height() * 2 + parseInt($('.notify_imgs_small').css('margin-left')))
 });
 //On récupère le nombre d'images affichables horizontalement pour les gestures de recherche corporelles dans une des parties de l'aide.
 var search_body_n_imgs = Math.floor(help_column_width / img_width);
 //Calcul du padding-left de cette section.
 //On positionne la section de recherche par gestures corporelles.
 $('#search_body_imgs').css(
 {
 'padding-left': search_body_padding_left,
-'height': ($('.notify_imgs_small').height() * 2 + parseInt($('.notify_imgs_small').css('margin')))
+'height': ($('.notify_imgs_small').height() * 2 + parseInt($('.notify_imgs_small').css('margin-left')))
 });
 //On récupère le nombre d'images affichables horizontalement pour les gestures de controle dans une des parties de l'aide.
 var controls_1hand_n_imgs = Math.floor(help_column_width / img_width);
 //Calcul du padding-left de cette section.
 	if(this.config.mouseInteractions)
 	{
 		//On ajoute à la mosaïque seulement la recherche.
 		$('body').append(notification_search);
-		notify_margin = parseInt($('.notifications').css('margin'));
+		notify_margin = parseInt($('.notifications').css('margin-left'));
 		notify_width = $('.notifications').width();
 		notify_height = $('.notifications').height();
 		//On calcule leurs coordonnées.
 		search_left = ($(window).width() / 2 - notify_width / 2 - notify_margin);
 		var img = $('#notify_search').css('background-image');
 	}
 	else
 	{
 		//On les ajoute à la mosaïque.
 		$('body').append(notification_selection + notification_search);
-		notify_margin = parseInt($('.notifications').css('margin'));
+		notify_margin = parseInt($('.notifications').css('margin-left'));
 		notify_width = $('.notifications').width();
 		notify_height = $('.notifications').height();
 		//On calcule leurs coordonnées.
 		selection_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
 		search_left = selection_left + notify_width + notify_margin;
 //On l'ajoute à la mosaïque.
 $('body').append(notification_selection);
 //On calcule ses coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var selection_left = $(window).width() / 2 - (notify_width) / 2 - notify_margin;
 	if(this.config.mouseInteractions)
 	{
 		var img = $('#notify_selection').css('background-image');
 //On l'ajoute à la mosaïque.
 $('body').append(notification_search);
 //On calcule ses coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_left = $(window).width() / 2 - notify_width / 2 - notify_margin;
 	if(this.config.mouseInteractions)
 	{
 		var img = $('#notify_search').css('background-image');
 var notification_search = "<div id='notify_search' class='notifications'></div>";
 	//On les ajoute à la mosaïque.
 	$('body').append(notification_selection + notification_search);
-	var notify_width = $('.notifications').width(), notify_height = $('.notifications').height(), notify_margin = parseInt($('.notifications').css('margin'));
+	var notify_width = $('.notifications').width(), notify_height = $('.notifications').height(), notify_margin = parseInt($('.notifications').css('margin-left'));
 	//On calcule leurs coordonnées.
 	var selection_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
 	var search_left = selection_left + notify_width + notify_margin;
 //On les ajoute à la mosaïque.
 $('body').append(notification_search_1gesture);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var point_left = $(window).width() / 2 - (notify_width) / 2 - notify_margin;
 if(_.include(this.gestures, gestureName))
 {
 $('#notify_search_1gesture').css('background-image', 'url("./pictos/big/' + (this.config.mouseInteractions ? 'MI/' : '') + (this.gestureDelRequested ? 'hover' : 'valid') + '/' + gestureName + '.png")');
 //On les fait apparaître.
 $('.notifications').css(
 {
 opacity: "0.9"
 });
+	if(this.isTablet)
+	{
+		this.searchExitIcon();
+	}
 }
 /*
 * Affichage de la notification de résultat de gesture & de sélection dans la mosaïque filtrée.
 * Est appelé dans le fichier :
 //On les ajoute à la mosaïque.
 $('body').append(notification_search_1gesture + notification_selection);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_1gesture_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
 var selection_left = search_1gesture_left + notify_width + notify_margin;
 if(_.include(this.gestures, gestureName))
 {
 //On les ajoute à la mosaïque.
 $('body').append(notification_swipe);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var point_left = $(window).width() / 2 - (notify_width) / 2 - notify_margin;
 var notifyTop = 0, notifyLeft = 0;
 	if(direction == "left")
 //On les ajoute à la mosaïque.
 $('body').append(notification_move);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var move_left = $(window).width() / 2 - (notify_width) / 2 + notify_margin;
 var side = $.inArray(parseInt(targetId), this.neighboursIds);
 if(side == -1)
 //On les ajoute à la mosaïque.
 $('body').append(notification_move + notification_unzoom);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var move_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
 var unzoom_left = move_left + notify_width + notify_margin;
 var side = $.inArray(parseInt(targetId), this.neighboursIds);
 //On l'ajoute à la mosaïque.
 $('body').append(notification_unzoom);
 //On calcule ses coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var unzoom_left = $(window).width() / 2 - notify_width / 2 - notify_margin;
 var side = $.inArray(parseInt(targetId), this.neighboursIds);
 if(side == -1)
 {
 //On l'ajoute à la mosaïque.
 $('body').append(notification_timeline);
 //On calcule ses coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var timeline_left = $(window).width() / 2 - notify_width / 2 - notify_margin;
 var notifyTop = 0, notifyLeft = 0;
 	this.putText($('#notify_timeline'), this.notificationStrings.timeline);
 //On l'ajoute à la mosaïque.
 $('body').append(notification_search);
 //On calcule ses coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_left = $(window).width() / 2 - notify_width / 2 - notify_margin;
 var notifyTop = 0, notifyLeft = 0;
 	this.putText($('#notify_search'), this.notificationStrings.search);
 //On les ajoute à la mosaïque.
 $('body').append(notification_search + notification_swipe);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
 var swipe_left = search_left + notify_width + notify_margin;
 var notifyTop = 0, notifyLeft = 0;
 //On les ajoute à la mosaïque.
 $('body').append(notification_search + notification_move);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
 var move_left = search_left + notify_width + notify_margin;
 var side = $.inArray(parseInt(targetId), this.neighboursIds);
 //On les ajoute à la mosaïque.
 $('body').append(notification_search + notification_move + notification_unzoom);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_left = $(window).width() / 2 - (notify_width * 3 + notify_margin * 4) / 2;
 var move_left = search_left + notify_width + notify_margin;
 var unzoom_left = move_left + notify_width + notify_margin;
 var side = $.inArray(parseInt(targetId), this.neighboursIds);
 //On les ajoute à la mosaïque.
 $('body').append(notification_search + notification_unzoom);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
 var unzoom_left = search_left + notify_width + notify_margin;
 var side = $.inArray(parseInt(targetId), this.neighboursIds);
 //On spécifie les notifications en div.
 var notification_search_1gesture = "<div id='notify_search_1gesture' class='notifications'></div>";
 //On les ajoute à la mosaïque.
 $('body').append(notification_search_1gesture);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var point_left = $(window).width() / 2 - (notify_width) / 2 - notify_margin;
 if(_.include(this.gestures, gestureName))
 {
 $('#notify_search_1gesture').css('background-image', 'url("./pictos/big/' + (this.config.mouseInteractions ? 'MI/' : '') + mode + '/' + gestureName + '.png")');
 //On les fait apparaître.
 $('.notifications').css(
 {
 opacity: "0.9"
 });
+	if(this.isTablet)
+	{
+		this.searchExitIcon();
+	}
 }
 /*
 * Affichage de la notification de résultat & de swipe dans une vidéo de recherche.
 * Est appelé dans le fichier :
 var notification_search_1gesture = "<div id='notify_search_1gesture' class='notifications'></div>";
 var notification_swipe = "<div id='notify_swipe' class='notifications'></div>";
 //On les ajoute à la mosaïque.
 $('body').append(notification_search_1gesture + notification_swipe);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_1gesture_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
 var swipe_left = search_1gesture_left + notify_width + notify_margin;
 if(_.include(this.gestures, gestureName))
 {
 var notification_search_1gesture = "<div id='notify_search_1gesture' class='notifications'></div>";
 var notification_move = "<div id='notify_move' class='notifications'></div>";
 //On les ajoute à la mosaïque.
 $('body').append(notification_search_1gesture + notification_move);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_1gesture_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
 var move_left = search_1gesture_left + notify_width + notify_margin;
 if(_.include(this.gestures, gestureName))
 {
 //On les fait apparaître.
 $('.notifications').css(
 {
 opacity: "0.9"
 });
+	if(this.isTablet)
+	{
+		this.searchExitIcon();
+	}
 }
 /*
 * Affichage de la notification de résultat, de move vers un voisin & de dézoom dans une vidéo de recherche.
 * Est appelé dans le fichier :
 //On les ajoute à la mosaïque.
 $('body').append(notification_search_1gesture + notification_move + notification_unzoom);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_1gesture_left = $(window).width() / 2 - (notify_width * 3 + notify_margin * 4) / 2;
 var move_left = search_1gesture_left + notify_width + notify_margin;
 var unzoom_left = move_left + notify_width + notify_margin;
 if(_.include(this.gestures, gestureName))
 //On les fait apparaître.
 $('.notifications').css(
 {
 opacity: "0.9"
 });
+	if(this.isTablet)
+	{
+		this.searchExitIcon();
+	}
 }
 /*
 * Affichage de la notification de résultat & de dézoom dans une vidéo de recherche.
 * Est appelé dans le fichier :
 //On les ajoute à la mosaïque.
 $('body').append(notification_search_1gesture + notification_unzoom);
 //On calcule leurs coordonnées et dimensions.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var search_1gesture_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
 var unzoom_left = search_1gesture_left + notify_width + notify_margin;
 if(_.include(this.gestures, gestureName))
 {
 var notification_curves = "<div class='notifications' id='notify_curves'></div>";
 $('body').append(notification_curves);
 //On calcule leurs dimensions et coordonnées.
 var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notifications').css('margin-left'));
 var curves_left = $(window).width() / 2 - (notify_width + notify_margin * 2) / 2;
 $('#notify_curves').css(
 {
 left: curves_left,
 }
 //Sinon, on les met dans un tableau.
 var gestures_tab = gestures.split(';');
-var notifications_curves_gestures = '';
+var notifications_curves_gestures = "<div id='notify_curves_container'>";
 //On crée autant de notifications qu'il y a de gestures.
 for(var i = 0 ; i < gestures_tab.length ; i++)
 {
-notifications_curves_gestures += "<div class='notifications' id='notify_curves_" + gestures_tab[i] + "'></div>";
+notifications_curves_gestures += "<div class='notification_curves' id='notify_curves_" + gestures_tab[i] + "'></div>";
 }
+	notifications_curves_gestures += "</div>";
 //On les ajoute à la mosaïque.
 $('body').append(notifications_curves_gestures);
 //On calcule leurs dimensions.
-var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
+var notify_width = $('.notification_curves').width(), notify_height = $('.notification_curves').height();
-var notify_margin = parseInt($('.notifications').css('margin'));
+var notify_margin = parseInt($('.notification_curves').css('margin-left'));
-var curves_gestures_left = [];
+	//Nombre de notifications dans une ligne.
+	var notify_in_a_row = Math.floor($(window).width() / (+notify_width + 2 * notify_margin));
+	//Espace libre restant sur la ligne.
+	var free_space = $(window).width() - notify_in_a_row * (+notify_width + 2 * notify_margin);
+	//On met à jour le container.
+	$('#notify_curves_container').css(
+	{
+		height: Math.ceil(gestures_tab.length * (+notify_width + 2 * notify_margin) / $(window).width()),
+		'margin-left': free_space / 2,
+		'margin-right': free_space / 2
+	});
+// var curves_gestures_left = [];
 //On calcule leurs dimensions et leur backgrounds.
-curves_gestures_left[0] = $(window).width() / 2 - (notify_width * (gestures_tab.length) + notify_margin * (gestures_tab.length + 2)) / 2;
+// curves_gestures_left[0] = $(window).width() / 2 - (notify_width * (gestures_tab.length) + notify_margin * (gestures_tab.length + 2)) / 2;
 for(var i = 0 ; i < gestures_tab.length ; i++)
 {
 //On va chercher leurs backgrounds.
 $('#notify_curves_' + gestures_tab[i]).css('background-image', 'url("./pictos/big/' + (this.config.mouseInteractions ? 'MI/' : '') + 'normal/' + gestures_tab[i] + '.png")');
 //On calcule leurs coordonnées.
 if(i+1 < gestures_tab.length)
 {
-curves_gestures_left[i+1] = curves_gestures_left[i] + notify_width + notify_margin * 2;
+// curves_gestures_left[i+1] = curves_gestures_left[i] + notify_width + notify_margin * 2;
 }
 //On les place.
-$('#notify_curves_' + gestures_tab[i]).css('left', curves_gestures_left[i]);
+// $('#notify_curves_' + gestures_tab[i]).css('left', curves_gestures_left[i]);
 		this.putText($('#notify_curves_' + gestures_tab[i]), this.notificationStrings[gestures_tab[i]]);
 }
 //On les fait apparaître.
-$('.notifications').css(
+$('.notification_curves').css(
 {
 opacity: "0.9"
 });
 }
 * curvesDetector > fonction updateDists.
 */
 Mosaic.prototype.removeNotifications = function()
 {
 $('.notifications').remove();
+$('#notify_curves_container').remove();
+$('.notification_curves').remove();
 }
 /*
 * Place un texte sur la notification.
 * Est appelé dans chaque fonction servant à notifier dans le fichier de notification.
 	$('body').append(helpIcon);
 	//On spécifie ses coordonnées.
 	$('#helpIcon').css(
 	{
 		top: 0,
-		left: $(window).width() - $('#helpIcon').width() - 2 * parseInt($('#helpIcon').css('margin'))
+		left: $(window).width() - $('#helpIcon').width() - 2 * parseInt($('#helpIcon').css('margin-left'))
 	});
 }
 /*
 * Supprime l'icone d'aide.
 	$('#helpIcon').animate(
 	{
 		width: 100,
 		height: 100,
-		left: $(window).width() - 100 - 2 * parseInt($('#helpIcon').css('margin'))
+		left: $(window).width() - 100 - 2 * parseInt($('#helpIcon').css('margin-left'))
 	}, this.config.timeShowBigHelp, function()
 	{
 		_this.isHelpIconZoomed = true;
 		_this.isHelpIconZooming = false;
 	});
 	$('#helpIcon').animate(
 	{
 		width: 50,
 		height: 50,
-		left: $(window).width() - 50 - 2 * parseInt($('#helpIcon').css('margin'))
+		left: $(window).width() - 50 - 2 * parseInt($('#helpIcon').css('margin-left'))
 	}, this.config.timeShowBigHelp, function()
 	{
 		_this.isHelpIconZoomed = false;
 		_this.isHelpIconZooming = false;
 	});
 }
+/*
+* Affiche l'icone de sortie pour tablettes.
+*/
+Mosaic.prototype.exitIcon = function()
+{
+	this.removeExitIcon();
+	//On construit le div.
+	var exitIcon = "<img id='exitIcon' src='./img/exitIcon.png' />";
+	//On l'ajoute.
+	$('body').append(exitIcon);
+	//On spécifie ses coordonnées.
+	$('#exitIcon').css(
+	{
+		top: 0,
+		left: $(window).width() - $('#exitIcon').width() - 2 * parseInt($('#exitIcon').css('margin-left')),
+		'z-index': 1000
+	});
+}
+/*
+* Supprime l'icone de sortie pour tablettes.
+*/
+Mosaic.prototype.removeExitIcon = function()
+{
+	$('#exitIcon').remove();
+}
+/*
+* Affiche l'icone de retour à la mosaïque pour tablettes.
+*/
+Mosaic.prototype.homeIcon = function()
+{
+	this.removeHomeIcon();
+	//On construit le div.
+	var homeIcon = "<img id='homeIcon' src='./img/homeIcon.png' />";
+	//On l'ajoute.
+	$('body').append(homeIcon);
+	//On spécifie ses coordonnées.
+	$('#homeIcon').css(
+	{
+		top: 0,
+		left: 0,
+		'z-index': 900
+	});
+}
+/*
+* Supprime l'icone de sortie pour tablettes.
+*/
+Mosaic.prototype.removeHomeIcon = function()
+{
+	$('#homeIcon').remove();
+}
+/*
+* Affiche l'icone de sortie de recherche pour tablettes.
+*/
+Mosaic.prototype.searchExitIcon = function()
+{
+	//S'il n'y a pas de notification de recherche, on s'en va.
+	if($('#notify_search_1gesture').length == 0)
+	{
+		return;
+	}
+	this.removeSearchExitIcon();
+	//On construit le div.
+	var searchExitIcon = "<img id='searchExitIcon' src='./img/exitIcon.png' />";
+	//On l'ajoute.
+	$('body').append(searchExitIcon);
+	//On spécifie ses coordonnées.
+	$('#searchExitIcon').css(
+	{
+		top: 0,
+		left: +$('#notify_search_1gesture').position().left + $('#notify_search_1gesture').width() - $('#searchExitIcon').width() - parseInt($('#searchExitIcon').css('margin-left')) / 2,
+		'z-index': 900
+	});
+}
+/*
+* Supprime l'icone de sortie de recherche pour tablettes.
+*/
+Mosaic.prototype.removeSearchExitIcon = function()
+{
+	$('#searchExitIcon').remove();
+}

trakers