Blame view

www/index.html~ 2.46 KB
c9c3f16d   thubert   ajout du code sou...
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
  <html>

  	<head>

  		<link rel="stylesheet" href="Design_web_final.css" /> 

  		<title>

  			Projet SC IMA3 2017 : P4

  		</title>

  		<script src="jquery.js"></script>

  			    <script type="text/javascript">

  					window.WebSocket=(window.WebSocket||window.MozWebSocket);

  

  					var websocket=new WebSocket('ws://localhost:9000','myprotocol');

  

  					websocket.onopen=function(){ $('h1').css('color','green'); };

  

  					websocket.onerror=function(){ $('h1').css('color','red'); };

  

  					websocket.onmessage=function(message){

  					console.log(message.data);

  					$('#messages').append($('<p>',{ text: message.data }));

  					};

  

  					function sendhaut(){

  						websocket.send('h');

  					}

  					function senddroite(){

  						websocket.send('d');

  					}

  					function sendbas(){

  						websocket.send('b');

  					}

  					function sendgauche(){

  						websocket.send('g');

  					}

  					function sendup(){

  						websocket.send('u')

  					}

  			    </script>

  	</head>

  	<body onkeydown="if(event.keycode==38)sendhaut()"

   onkeyup="if(event.keycode==38)sendup()">	

   	<center>

   		<h1>

   			Projet SC IMA3 | Groupe 4 : Camera IP

   		</h1>

   	</center>

  	<div id="vetb">	<!-- video + boutons -->	

  				<div>

  						<center>

  							<img src="http://192.168.2.20:8081/?action=stream" /><!-- Pour afficher en streaming -->

  						</center>

  				</div>	

  				<div id="btous"> <!-- boutons -->

  					<div id="bgdh"> <!-- boutons gauche droite haut -->

  						<div>

  							<button class="element" onmousedown="sendgauche()" onmouseup="sendup()" alt="" style="background:white;">

  								<img src="fleche_gauche2.jpg" style="width:50px;">

  							</button>

  						</div>

  						<div>

  								<button class="element" onmousedown="sendhaut()" onmouseup="sendup()" alt="" style="background:white;">

  										<img src="fleche_haut2.jpg" style="width:50px;">	

  								</button>

  								

  						</div>

  						<div>

  							<button class="element" onmousedown="senddroite()" onmouseup="sendup()" alt="" style="background:white;">

  										<img src="fleche_droite2.jpg" style="width:50px;">	

  							</button>

  						</div>

  					</div>

  					<div><!-- bouton bas -->

  		

  							<button class="element" onmousedown="sendbas()" onmouseup="sendup()" alt="" style="background:white;">

  										<img src="fleche_bas2.jpg" style="width:50px;">	

  							</button>

  					

  					</div>	 

  

  				</div>	

  				

  	</div>

  	<p>

  		Carlier Henri<br>

  		Djeraba Taky<br>

  		Boens Quentin<br>

  		Hubert Thomas

  	</p>

  

  

  </html>