Commit 1cf43f8e82b8ba2690dfefe363926d48961bfb4f
1 parent
d0ae1b38
Interface web finale, non optimisée
Showing
1 changed file
with
113 additions
and
0 deletions
Show diff stats
@@ -0,0 +1,113 @@ | @@ -0,0 +1,113 @@ | ||
1 | +<!DOCTYPE html> | ||
2 | +<HTML> | ||
3 | + <HEADER> | ||
4 | + <!-- pour associer la feuille de style --> | ||
5 | + <link rel="stylesheet" type="text/css" href="style.css"> | ||
6 | + <title>PROJET SC</title> | ||
7 | + </HEADER> | ||
8 | + | ||
9 | + <HEAD> | ||
10 | + <SCRIPT src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></SCRIPT> | ||
11 | + | ||
12 | + <SCRIPT LANGUAGE="JavaScript"> | ||
13 | + function save(){ | ||
14 | + var ville; | ||
15 | + ville=document.forms["formulaire"].elements["choix"].value | ||
16 | + var ind; | ||
17 | + | ||
18 | + for(var i=0; i < lieux.length ; i++){ | ||
19 | + if( lieux[i][0]==ville){ | ||
20 | + ind=i; | ||
21 | + } | ||
22 | + } | ||
23 | + | ||
24 | + var lat = lieux[ind][1]; | ||
25 | + var long = lieux[ind][2]; | ||
26 | + var sign = lieux[ind][3]; | ||
27 | + var decal = lieux[ind][4]; | ||
28 | + | ||
29 | + return([lat,long,sign,decal]) | ||
30 | + //document.write("Ville:\t" + ville); | ||
31 | + //document.write("Latitude:\t"+lat); | ||
32 | + //document.write("Longitude:\t"+long); | ||
33 | + //document.write("Signe:\t"+sign); | ||
34 | + //document.write("Decalage:\t"+decal); | ||
35 | + } | ||
36 | + | ||
37 | + </SCRIPT> | ||
38 | + | ||
39 | + <script type="text/javascript"> | ||
40 | + $(function() { | ||
41 | + window.WebSocket = window.WebSocket || window.MozWebSocket; | ||
42 | + var websocket = new WebSocket( | ||
43 | + 'ws://127.0.0.1:9000', 'dumb-increment-protocol'); | ||
44 | + | ||
45 | + websocket.onmessage = function (message) { | ||
46 | + console.log(message.data); | ||
47 | + $('div').append($('<p>', { text: message.data })); | ||
48 | + }; | ||
49 | + $('input').click(function(e) { | ||
50 | + e.preventDefault(); | ||
51 | + websocket.send(save()); | ||
52 | + }); | ||
53 | + }); | ||
54 | + </script> | ||
55 | + | ||
56 | + </HEAD> | ||
57 | + | ||
58 | + <BODY> | ||
59 | + <!-- choix des onglets --> | ||
60 | + <div id="menu"> | ||
61 | + <ul id="onglets"> | ||
62 | + <li><a href="index.html"> PROJET </a></li> | ||
63 | + <li class="active"><a href="options.html"> OPTIONS </a></li> | ||
64 | + </ul> | ||
65 | + | ||
66 | + </div> | ||
67 | + | ||
68 | + <!-- contenu de la page --> | ||
69 | + </br></br></br> | ||
70 | + | ||
71 | + <div class="titre">CHOIX DES OPTIONS</div> | ||
72 | + | ||
73 | + <div class="contenu"> | ||
74 | + | ||
75 | + <FORM name="formulaire"> | ||
76 | + Lieu : | ||
77 | + <select name="lieu" id="choix" > | ||
78 | + | ||
79 | + <option SELECTED>-- Selectionnez un lieu --</option> | ||
80 | + | ||
81 | + </select> | ||
82 | + | ||
83 | + <SCRIPT LANGUAGE="JavaScript"> | ||
84 | + var bruxelles=new Array("Bruxelles",50.850,4.350,0,0); | ||
85 | + var pekin=new Array("Pekin",39.917,116.433,0,6); | ||
86 | + var split=new Array("Split",43.517,16.467,0,0); | ||
87 | + var lille=new Array("Lille", 50.633, 3.066, 0, 0); | ||
88 | + | ||
89 | + var lieux=new Array(bruxelles,pekin,split,lille); | ||
90 | + | ||
91 | + var d=document.formulaire.lieu; | ||
92 | + for(var i=0; i < lieux.length ; i++) | ||
93 | + { | ||
94 | + d.length++; | ||
95 | + d.options[d.length-1].text = lieux[i][0]; | ||
96 | + } | ||
97 | + | ||
98 | + | ||
99 | + </SCRIPT> | ||
100 | + | ||
101 | + <input type="button" onClick="save()" value="OK"> | ||
102 | + </br></br> | ||
103 | + </FORM> | ||
104 | + | ||
105 | + </div> | ||
106 | + | ||
107 | + | ||
108 | +</BODY> | ||
109 | + | ||
110 | +<FOOTER> | ||
111 | +</FOOTER> | ||
112 | + | ||
113 | +<html/> |