1 /*

     2  * Un client est défini par une socket, qui permettra de recevoir les données du server websocket du Middleware.

     3  * On accède aussi à la mosaïque.

     4 */

     5 function client(host, port, _mosaic)

     6 {

     7 	this.socket;

     8 	this.mosaic = _mosaic;

     9 	

    10 	this.pointerLeft = false;

    11 	this.pointerRight = false;

    12 	this.timePointers = 100;

    13 	this.pointerLeftTimeout;

    14 	this.pointerRightTimeout;

    15 	this.isLeftHanded = false;

    16 	

    17 	this.createWebSocket('ws://' + host + ':' + port + '/');

    18 }

    19 

    20 /*

    21  * Création et Initialisation des sockets et listeners permettant d'écouter le server.

    22 */

    23 client.prototype.createWebSocket = function(host)

    24 {

    25 	var _this = this;

    26 	

    27 	//Initialise la fonctionnalité websocket du naviguateur.

    28     if(window.MozWebSocket)

    29 	{

    30         window.WebSocket = window.MozWebSocket;

    31 	}

    32 	

    33 	//Si le naviguateur ne supporte pas les websockets, on s'arrête là.

    34     if(!window.WebSocket)

    35 	{

    36         alert('Votre navigateur ne supporte pas les webSocket!');

    37         return false;

    38     }

    39 	//Sinon

    40 	else

    41 	{

    42 		//On initialise la socket.

    43 		this.socket = new WebSocket(host);

    44 		

    45 		//Si elle est ouverte, on notifie le Front.

    46 		this.socket.onopen = function()

    47 		{

    48 			console.log('Socket ouverte.');

    49 		}

    50 		//Si elle est fermée, on notifie le Front.

    51 		this.socket.onclose = function()

    52 		{

    53 			console.log('Socket fermée.');

    54 		}

    55 		//S'il y a un problème dans la connection, on notifie le Front.

    56 		this.socket.onerror = function()

    57 		{

    58 			console.log('Une erreur est survenue dans le module de Communication.');

    59 		}

    60 		//Si on reçoit un message.

    61 		this.socket.onmessage = function(msg)

    62 		{

    63 			_this.processMsg(msg);

    64 		}

    65     }

    66 }

    67 

    68 /*

    69  * Traite un message reçu du Middleware.

    70 */

    71 client.prototype.processMsg = function(msg)

    72 {

    73 	if(typeof msg === 'undefined' || typeof msg.data === 'undefined')

    74 	{

    75 		return;

    76 	}

    77 	

    78 	var _this = this;

    79 	

    80 	

    81 	//S'il s'agit d'une string et non d'une instruction pour les pointeurs.

    82 	if(msg.data[0] === '2')

    83 	{

    84 		var instruction = msg.data.substring(2, msg.data.length);

    85 		

    86 		// if(instruction.indexOf("INCOMING") == -1 && instruction.indexOf('NO-USER') == -1)

    87 		// {

    88 			this.mosaic.manageControlEvents(instruction);

    89 		// }

    90 	}

    91 	//Sinon si ce sont les coordonnées de la main droite.

    92 	// /!\/!\ //

    93 	else if(msg.data[0] == '1')

    94 	{

    95 		var instruction = msg.data.substring(2, msg.data.length);

    96 		pt = instruction.split(';');

    97 		var x = Math.abs(parseFloat(pt[0])), y = Math.abs(parseFloat(pt[1]));

    98 		// console.log(Math.abs(parseFloat(pt[0])), Math.abs(parseFloat(pt[1])));

    99 		

   100 		this.pointerLeft = true;

   101 		clearTimeout(this.pointerLeftTimeout);

   102 		

   103 		if(!this.mosaic.mouseInteractions && this.mosaic.currentMode != 'NO-USER' && this.mosaic.currentMode.indexOf('INCOMING') == -1)

   104 		{

   105 			// console.log('pt');

   106 			this.mosaic.refreshMainPointer(x, y);

   107 		}

   108 		

   109 		// /!\ //

   110 		if(!this.mosaic.isMainPointerDisplayed)

   111 		{

   112 			this.mosaic.mainPointerDisplay(true);

   113 			this.mosaic.isMainPointerDisplayed = true;

   114 		}

   115 		

   116 		this.pointerLeftTimeout = setTimeout(function()

   117 		{

   118 			// console.log('RELEASE LEFT');

   119 			_this.pointerLeft = false;

   120 			

   121 			if(_this.mosaic.isMainPointerDisplayed)

   122 			{

   123 				_this.mosaic.isMainPointerDisplayed = false;

   124 				_this.mosaic.mainPointerDisplay(false);

   125 			}

   126 		}, this.timePointers);

   127 	}

   128 	//Sinon si ce sont les coordonnées de la main gauche.

   129 	else if(msg.data[0] == '0')

   130 	{

   131 		var instruction = msg.data.substring(2, msg.data.length);

   132 		pt = instruction.split(';');

   133 		var x = Math.abs(parseFloat(pt[0])), y = Math.abs(parseFloat(pt[1]));

   134 		// console.log(Math.abs(parseFloat(pt[0])), Math.abs(parseFloat(pt[1])));

   135 		

   136 		this.pointerRight = true;

   137 		clearTimeout(this.pointerRightTimeout);

   138 		

   139 		if(!this.mosaic.mouseInteractions && this.mosaic.currentMode != 'NO-USER' && this.mosaic.currentMode.indexOf('INCOMING') == -1)

   140 		{

   141 			this.mosaic.refreshSecondPointer(x, y);

   142 		}

   143 		

   144 		if(!this.mosaic.isSecondPointerDisplayed)

   145 		{

   146 			this.mosaic.secondPointerDisplay(true);

   147 			this.mosaic.isSecondPointerDisplayed = true;

   148 		}

   149 		

   150 		this.pointerRightTimeout = setTimeout(function()

   151 		{

   152 			// console.log('RELEASE RIGHT');

   153 			_this.pointerRight = false;

   154 			

   155 			if(_this.mosaic.isSecondPointerDisplayed)

   156 			{

   157 				_this.mosaic.isSecondPointerDisplayed = false;

   158 				_this.mosaic.secondPointerDisplay(false);

   159 			}

   160 		}, this.timePointers);

   161 	}

   162 	

   163 	if(this.pointerLeft && !this.pointerRight || !this.pointerLeft && this.pointerRight)

   164 	{

   165 		//On interrompt l'idle des pointeurs.

   166 		this.mosaic.pointersIdleAvailable = false;

   167 		this.mosaic.removeIdlePointers();

   168 		this.mosaic.areBothPointersHere = false;

   169 		

   170 		if(this.mosaic.isSearchByCurvesOn)

   171 		{

   172 			this.mosaic.isSearchByCurvesOn = false;

   173 			if(this.mosaic.searchCanvas)

   174 			{

   175 				this.mosaic.searchCanvas.onPointerOut();

   176 				console.log('OUT !!!!!');

   177 			}

   178 		}

   179 	}

   180 	if(!this.pointerLeft && !this.pointerRight)

   181 	{

   182 		//On interrompt l'idle des pointeurs.

   183 		this.mosaic.pointersIdleAvailable = false;

   184 		this.mosaic.removeIdlePointers();

   185 		this.mosaic.areBothPointersHere = false;

   186 		

   187 		if(this.mosaic.isSearchByCurvesOn)

   188 		{

   189 			this.mosaic.isSearchByCurvesOn = false;

   190 			if(this.mosaic.searchCanvas)

   191 			{

   192 				this.mosaic.searchCanvas.onPointerOut();

   193 			}

   194 		}

   195 		

   196 		this.mosaic.deselectAllNeighbours();

   197 		this.mosaic.preUnzoom();

   198 	}

   199 	

   200 	if(this.pointerLeft && this.pointerRight)

   201 	{

   202 		this.mosaic.areBothPointersHere = true;

   203 		this.mosaic.removeCheckForBothPointersHere();

   204 		

   205 		if(this.mosaic.currentMode == 'MOSAIC' || this.mosaic.currentMode == 'FILTER')

   206 		{

   207 			$('#mainPointer').css('background-image', './img/cursors/pointer.png');

   208 			$('#secondPointer').css('background-image', './img/cursors/pointer2.png');

   209 		}

   210 		

   211 		if(this.mosaic.currentMode == 'FILTER' || this.mosaic.currentMode == 'SEARCH')

   212 		{

   213 			if(this.mosaic.searchCanvas)

   214 			{

   215 				var mainPointerX = +$('#mainPointer').position().left + $('#mainPointer').width() / 2;

   216 				var mainPointerY = +$('#mainPointer').position().top - this.mosaic.MPTop_margin + $('#mainPointer').height() / 2;

   217 				var secondPointerX = +$('#secondPointer').position().left + $('#mainPointer').width() / 2;

   218 				var secondPointerY = +$('#secondPointer').position().top - this.mosaic.MPTop_margin + $('#mainPointer').height() / 2;

   219 				

   220 				if(!this.mosaic.isSearchByCurvesOn)

   221 				{

   222 					this.mosaic.isSearchByCurvesOn = true;

   223 					this.mosaic.searchCanvas.onPointerIn(mainPointerX, mainPointerY, secondPointerX, secondPointerY);

   224 					this.mosaic.canDrawNextCurve = true;

   225 				}

   226 				else if(this.mosaic.isSearchByCurvesOn)

   227 				{

   228 					if(this.mosaic.canDrawNextCurve)

   229 					{

   230 						this.mosaic.canDrawNextCurve = false;

   231 						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)

   232 						{

   233 							console.log('move');

   234 							this.mosaic.searchCanvas.onPointerMove(mainPointerX, mainPointerY, secondPointerX, secondPointerY);

   235 						}

   236 					}

   237 					else

   238 					{

   239 						this.mosaic.nextDrawCurveTimeout = setTimeout(function()

   240 						{

   241 							_this.mosaic.canDrawNextCurve = true;

   242 						}, this.mosaic.config['timeoutNextDrawCurve']);

   243 					}

   244 				}

   245 			}

   246 		}

   247 	}

   248 	

   249 	//Quant on a reçu un message, on vérifie la présence des deux pointeurs.

   250 	this.mosaic.checkForBothPointersHere();

   251 	

   252 	if(this.mosaic.pointersIdleAvailable)

   253 	{

   254 		//On effectue une vérification de la position des pointeurs pour l'idle.

   255 		this.mosaic.detectIdlePointers();

   256 	}

   257 	

   258 	//Si le timeout a besoin d'être relancé ou bien que l'affichage de l'aide est disponible.

   259 	if(this.mosaic.pointersIdleNeedLaunch || this.mosaic.canNotifyHelp)

   260 	{

   261 		// console.log('launch idle');

   262 		this.mosaic.launchIdlePointers();

   263 		this.mosaic.pointersIdleNeedLaunch = false;

   264 	}

   265 	

   266 	//Si la détection d'idle n'est pas activée et qu'on est dans un mode permettant l'interaction de l'utilisateur. 

   267 	if(!this.mosaic.pointersIdleAvailable && this.mosaic.currentMode != "NO-USER" && this.mosaic.currentMode.indexOf("INCOMING") == -1 && this.mosaic.areBothPointersHere)

   268 	{

   269 		//On enclenche la détection d'idle.

   270 		this.mosaic.pointersIdleAvailable = true;

   271 		this.mosaic.pointersIdleNeedLaunch = true;

   272 	}

   273 	// /!\/!\ //

   274 }

   275 

   276 /*

   277  * Permet d'envoyer un message au Middleware (optionnel).

   278 */

   279 client.prototype.sendMessage = function(data)

   280 {

   281 	//Si data est un objet, on le change en chaine.

   282 	if(typeof data === 'object')

   283 	{

   284 		data = JSON.stringify(data);

   285 	}

   286 	this.socket.send(data);

   287 }