Commit aa84636baf4468937431a22be095c8d283a940da
0 parents
first commit
Showing
6 changed files
with
413 additions
and
0 deletions
Show diff stats
1 | +++ a/Zozo/sc3/index.html | ||
@@ -0,0 +1,32 @@ | @@ -0,0 +1,32 @@ | ||
1 | +<!--#include <stdio.h> | ||
2 | +#include <stdlib.h> | ||
3 | +#include <libwebsockets.h>--> | ||
4 | + | ||
5 | +<html> | ||
6 | +<header> | ||
7 | + <!-- pour associer a la feuille de style --> | ||
8 | + <link rel="stylesheet" type="text/css" href="style.css"> | ||
9 | + <title>PROJET SC | ||
10 | + </title> | ||
11 | +</header> | ||
12 | + | ||
13 | +<body> | ||
14 | + <!-- choix des onglets --> | ||
15 | + <div id="menu"> | ||
16 | + <ul id="onglets"> | ||
17 | + <li class="active"><a href="index.html"> PROJET </a></li> | ||
18 | + <li><a href="options.html"> OPTIONS </a></li> | ||
19 | + </ul> | ||
20 | + </div> | ||
21 | + | ||
22 | + <!-- contenu de la page --> | ||
23 | + <br> | ||
24 | + <div class="titre">TITRE</div> | ||
25 | + <div class="contenu">CONTENU: presentation du projet ...</div> | ||
26 | + | ||
27 | +</body> | ||
28 | + | ||
29 | +<footer> | ||
30 | +</footer> | ||
31 | + | ||
32 | +<html/> |
1 | +++ a/Zozo/sc3/options.html | ||
@@ -0,0 +1,91 @@ | @@ -0,0 +1,91 @@ | ||
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 | + <!-- <script type="text/javascript"> | ||
12 | + $(function() { | ||
13 | + window.WebSocket = window.WebSocket || window.MozWebSocket; | ||
14 | + var websocket = new WebSocket('ws://127.0.0.1:9000', | ||
15 | + 'dumb-increment-protocol'); | ||
16 | + websocket.onmessage = function (message) { | ||
17 | + console.log(message.data); | ||
18 | + $('div').append($('<p>', { text: message.data })); | ||
19 | + }; | ||
20 | + | ||
21 | + $('input').click(function(e) { | ||
22 | + e.preventDefault(); | ||
23 | + websocket.send(valeur); | ||
24 | + $('input').val(''); | ||
25 | + }); | ||
26 | + }); | ||
27 | + </script> --> | ||
28 | + </head> | ||
29 | + | ||
30 | +<body> | ||
31 | + <!-- choix des onglets --> | ||
32 | + <div id="menu"> | ||
33 | + <ul id="onglets"> | ||
34 | + <li><a href="index.html"> PROJET </a></li> | ||
35 | + <li class="active"><a href="options.html"> OPTIONS </a></li> | ||
36 | + </ul> | ||
37 | + </div> | ||
38 | + | ||
39 | + <!-- contenu de la page --> | ||
40 | + </br> | ||
41 | + </br> | ||
42 | + </br> | ||
43 | + | ||
44 | + <div class="titre">CHOIX DES OPTIONS</div> | ||
45 | + <div class="contenu"> | ||
46 | + | ||
47 | + | ||
48 | + <FORM name="form"> | ||
49 | + Lieu : | ||
50 | + <select name="lieu" > | ||
51 | + <option SELECTED>-- Selectionnez un lieu --</option> | ||
52 | + </select> | ||
53 | + | ||
54 | + | ||
55 | + | ||
56 | + <SCRIPT LANGUAGE="JavaScript"> | ||
57 | + | ||
58 | + var bruxelles=new Array("Bruxelles",50.850,4.350,0,0); | ||
59 | + var pekin=new Array("Pekin",39.917,116.433,0,6); | ||
60 | + var split=new Array("Split",43.517,16.467,0,0); | ||
61 | + var lille=new Array("Lille", 50.633, 3.066, 0, 0); | ||
62 | + | ||
63 | + var lieux=new Array(bruxelles,pekin,split,lille); | ||
64 | + | ||
65 | + var d=document.form.lieu; | ||
66 | + for(var i=0; i < lieux.length ; i++) | ||
67 | + { | ||
68 | + d.length++; | ||
69 | + d.options[d.length-1].text = lieux[i][0]; | ||
70 | + } | ||
71 | + | ||
72 | + | ||
73 | + | ||
74 | + </SCRIPT> | ||
75 | + | ||
76 | +<input type="submit" id="test" value="OK"/> | ||
77 | + | ||
78 | + </br> | ||
79 | + </br> | ||
80 | + | ||
81 | + | ||
82 | + </form> | ||
83 | + </div> | ||
84 | + | ||
85 | + | ||
86 | +</body> | ||
87 | + | ||
88 | +<footer> | ||
89 | +</footer> | ||
90 | + | ||
91 | +<html/> |
1 | +++ a/Zozo/sc3/options.html~ | ||
@@ -0,0 +1,73 @@ | @@ -0,0 +1,73 @@ | ||
1 | +#include <stdio.h> | ||
2 | +#include <stdlib.h> | ||
3 | +#include <libwebsockets.h> | ||
4 | + | ||
5 | +static int callback_http(structlibwebsocket_context * this, | ||
6 | + structlibwebsocket *wsi, | ||
7 | + enumlibwebsocket_callback_reasons reason, void *user, | ||
8 | + void *in, size_t len) | ||
9 | +{ | ||
10 | + return 0; | ||
11 | +} | ||
12 | + | ||
13 | +<header> | ||
14 | + <!-- pour associer � la feuille de style --> | ||
15 | + <link rel="stylesheet" type="text/css" href="style.css"> | ||
16 | + <title>PROJET SC | ||
17 | + </title> | ||
18 | +</header> | ||
19 | + | ||
20 | +<body> | ||
21 | + <!-- choix des onglets --> | ||
22 | + <div id="menu"> | ||
23 | + <ul id="onglets"> | ||
24 | + <li><a href="index.html"> PROJET </a></li> | ||
25 | + <li class="active"><a href="options.html"> OPTIONS </a></li> | ||
26 | + </ul> | ||
27 | + </div> | ||
28 | + | ||
29 | + <!-- contenu de la page --> | ||
30 | + </br> | ||
31 | + </br> | ||
32 | + </br> | ||
33 | + | ||
34 | + <div class="titre">CHOIX DES OPTIONS</div> | ||
35 | + <div class="contenu"> | ||
36 | + | ||
37 | + | ||
38 | + <FORM name="form"> | ||
39 | + Lieu : | ||
40 | + <select name="lieu"> | ||
41 | + <option SELECTED>-- Selectionnez un lieu --</option> | ||
42 | + </select> | ||
43 | + | ||
44 | + <SCRIPT LANGUAGE="JavaScript"> | ||
45 | + | ||
46 | + var bruxelles=new Array("Bruxelles",50.850,4.350,0,0); | ||
47 | + var pekin=new Array("Pekin",39.917,116.433,0,6); | ||
48 | + var split=new Array("Split",43.517,16.467,0,0); | ||
49 | + var lille=new Array("Lille", 50.633, 3.066, 0, 0); | ||
50 | + | ||
51 | + var lieux=new Array(bruxelles,pekin,split,lille); | ||
52 | + | ||
53 | + var d=document.form.lieu; | ||
54 | + for(var i=0; i < lieux.length ; i++) | ||
55 | + { d.length++; | ||
56 | + d.options[d.length-1].text = lieux[i][0]; | ||
57 | + } | ||
58 | + | ||
59 | + </SCRIPT> | ||
60 | + </br> | ||
61 | + </br> | ||
62 | + <input type="submit" value="OK"/> | ||
63 | + | ||
64 | + </form> | ||
65 | + </div> | ||
66 | + | ||
67 | + | ||
68 | +</body> | ||
69 | + | ||
70 | +<footer> | ||
71 | +</footer> | ||
72 | + | ||
73 | +<html/> |
1 | +++ a/Zozo/sc3/style.css | ||
@@ -0,0 +1,73 @@ | @@ -0,0 +1,73 @@ | ||
1 | + | ||
2 | +{ | ||
3 | + border-bottom : 1px solid #9EA0A1; | ||
4 | + padding-bottom : 25px; | ||
5 | +} | ||
6 | + | ||
7 | +#onglets | ||
8 | +{ | ||
9 | + position : absolute; | ||
10 | + border : 1px solid transparent; | ||
11 | + padding : 0; | ||
12 | + font : bold 11px Batang, arial, serif; | ||
13 | + list-style-type : none; | ||
14 | + left : 50%; | ||
15 | + margin-top : 0; | ||
16 | + width : 430px; | ||
17 | + margin-left : -215px; /* la moiti� de width */ | ||
18 | +} | ||
19 | + | ||
20 | +#onglets li | ||
21 | +{ | ||
22 | + float : left; | ||
23 | + height : 23px; /* � modifier suivant la taille de la police pour centrer le texte dans l'onglet */ | ||
24 | + background-color: RGB(245,245,245); | ||
25 | + margin : 2px 2px 0 2px !important; /* Pour les navigateurs autre que IE */ | ||
26 | + margin : 1px 2px 0 2px; /* Pour IE */ | ||
27 | + border : 1px solid #9EA0A1; | ||
28 | +} | ||
29 | + | ||
30 | +#onglets li.active | ||
31 | +{ | ||
32 | + border-bottom: 1px solid #fff; | ||
33 | + background-color: #fff; | ||
34 | +} | ||
35 | + | ||
36 | +#onglets a | ||
37 | +{ | ||
38 | + display : block; | ||
39 | + color : #666; | ||
40 | + text-decoration : none; | ||
41 | + padding : 3px; | ||
42 | +} | ||
43 | + | ||
44 | +#onglets a:hover | ||
45 | +{ | ||
46 | + background : #fff; | ||
47 | +} | ||
48 | + | ||
49 | +.titre | ||
50 | +{ | ||
51 | + color : RGB(0,59,84); | ||
52 | + font-size : 20px; | ||
53 | + font-weight : bold; | ||
54 | + text-align : center; | ||
55 | +} | ||
56 | + | ||
57 | +.contenu | ||
58 | +{ | ||
59 | + text-align : center; | ||
60 | +} | ||
61 | + | ||
62 | +/*a | ||
63 | +{ | ||
64 | + color: RGB(255,59,23); | ||
65 | + font-size : 16px; | ||
66 | + font-weight : bold; | ||
67 | +}*/ | ||
68 | + | ||
69 | +* /*pour toute la page*/ | ||
70 | +{ | ||
71 | + font-size: 14px; | ||
72 | +} | ||
73 | + |
1 | +++ a/index.html | ||
@@ -0,0 +1,38 @@ | @@ -0,0 +1,38 @@ | ||
1 | +<!DOCTYPE html> | ||
2 | +<html> | ||
3 | + <head> | ||
4 | + <meta charset="utf-8"> | ||
5 | + <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> | ||
6 | + <script type="text/javascript"> | ||
7 | + $(function() { | ||
8 | + window.WebSocket = window.WebSocket || window.MozWebSocket; | ||
9 | + var websocket = new WebSocket('ws://127.0.0.1:9000', | ||
10 | + 'dumb-increment-protocol'); | ||
11 | + websocket.onopen = function () { | ||
12 | + $('h1').css('color', 'green'); | ||
13 | + }; | ||
14 | + websocket.onerror = function () { | ||
15 | + $('h1').css('color', 'red'); | ||
16 | + }; | ||
17 | + websocket.onmessage = function (message) { | ||
18 | + console.log(message.data); | ||
19 | + $('div').append($('<p>', { text: message.data })); | ||
20 | + }; | ||
21 | + | ||
22 | + $('input').click(function(e) { | ||
23 | + e.preventDefault(); | ||
24 | + websocket.send($('input').val()); | ||
25 | + $('input').val(''); | ||
26 | + }); | ||
27 | + }); | ||
28 | + </script> | ||
29 | + </head> | ||
30 | + <body> | ||
31 | + <h1>WebSockets test</h1> | ||
32 | + <form> | ||
33 | + <input type="text" /> | ||
34 | + <button>Send</button> | ||
35 | + </form> | ||
36 | + <div></div> | ||
37 | + </body> | ||
38 | +</html> |
1 | +++ a/server.c | ||
@@ -0,0 +1,106 @@ | @@ -0,0 +1,106 @@ | ||
1 | +#include <stdio.h> | ||
2 | +#include <stdlib.h> | ||
3 | +#include <libwebsockets.h> | ||
4 | +#define MAX_FRAME_SIZE 1024 | ||
5 | +#define WAIT_DELAY 50 | ||
6 | + | ||
7 | +static int callback_http(struct libwebsocket_context * this, | ||
8 | + struct libwebsocket *wsi, | ||
9 | + enum libwebsocket_callback_reasons reason, void *user, | ||
10 | + void *in, size_t len) | ||
11 | +{ | ||
12 | + return 0; | ||
13 | +} | ||
14 | + | ||
15 | +static int callback_dumb_increment(struct libwebsocket_context * this, | ||
16 | + struct libwebsocket *wsi, | ||
17 | + enum libwebsocket_callback_reasons reason, | ||
18 | + void *user, void *in, size_t len) | ||
19 | +{ | ||
20 | + | ||
21 | + switch (reason) { | ||
22 | + case LWS_CALLBACK_ESTABLISHED: // just log message that someone is connecting | ||
23 | + printf("connection established\n"); | ||
24 | + break; | ||
25 | + case LWS_CALLBACK_RECEIVE: { // the funny part | ||
26 | + // create a buffer to hold our response | ||
27 | + // it has to have some pre and post padding. You don't need to care | ||
28 | + // what comes there, libwebsockets will do everything for you. For more info see | ||
29 | + // http://git.warmcat.com/cgi-bin/cgit/libwebsockets/tree/lib/libwebsockets.h#n597 | ||
30 | + unsigned char *buf = (unsigned char*) malloc(LWS_SEND_BUFFER_PRE_PADDING + len + | ||
31 | + LWS_SEND_BUFFER_POST_PADDING); | ||
32 | + | ||
33 | + int i; | ||
34 | + | ||
35 | + // pointer to `void *in` holds the incomming request | ||
36 | + // we're just going to put it in reverse order and put it in `buf` with | ||
37 | + // correct offset. `len` holds length of the request. | ||
38 | + for (i=0; i < len; i++) { | ||
39 | + buf[LWS_SEND_BUFFER_PRE_PADDING + (len - 1) - i ] = ((char *) in)[i]; | ||
40 | + } | ||
41 | + | ||
42 | + // log what we recieved and what we're going to send as a response. | ||
43 | + // that disco syntax `%.*s` is used to print just a part of our buffer | ||
44 | + // http://stackoverflow.com/questions/5189071/print-part-of-char-array | ||
45 | + printf("received data: %s, replying: %.*s\n", (char *) in, (int) len, | ||
46 | + buf + LWS_SEND_BUFFER_PRE_PADDING); | ||
47 | + | ||
48 | + // send response | ||
49 | + // just notice that we have to tell where exactly our response starts. That's | ||
50 | + // why there's `buf[LWS_SEND_BUFFER_PRE_PADDING]` and how long it is. | ||
51 | + // we know that our response has the same length as request because | ||
52 | + // it's the same message in reverse order. | ||
53 | + libwebsocket_write(wsi, &buf[LWS_SEND_BUFFER_PRE_PADDING], len, LWS_WRITE_TEXT); | ||
54 | + | ||
55 | + // release memory back into the wild | ||
56 | + free(buf); | ||
57 | + break; | ||
58 | + } | ||
59 | + default: | ||
60 | + break; | ||
61 | + } | ||
62 | + | ||
63 | + | ||
64 | + return 0; | ||
65 | +} | ||
66 | + | ||
67 | +static struct libwebsocket_protocols protocols[] = { | ||
68 | + /* first protocol must always be HTTP handler */ | ||
69 | + { | ||
70 | + "http-only", // name | ||
71 | + callback_http, // callback | ||
72 | + 0 // per_session_data_size | ||
73 | + }, | ||
74 | + { | ||
75 | + "dumb-increment-protocol", // protocol name - very important! | ||
76 | + callback_dumb_increment, // callback | ||
77 | + 0 // we don't use any per session data | ||
78 | + | ||
79 | + }, | ||
80 | + { | ||
81 | + NULL, NULL, 0 /* End of list */ | ||
82 | + } | ||
83 | +}; | ||
84 | + | ||
85 | + | ||
86 | + | ||
87 | +int main(void) { | ||
88 | +int port=9000; | ||
89 | +struct lws_context_creation_info info; | ||
90 | +memset(&info,0,sizeof info); | ||
91 | +info.port=port; | ||
92 | +info.protocols=protocols; | ||
93 | +info.gid=-1; | ||
94 | +info.uid=-1; | ||
95 | +struct libwebsocket_context *context=libwebsocket_create_context(&info); | ||
96 | +if(context==NULL){ | ||
97 | + fprintf(stderr, "libwebsocket init failed\n"); | ||
98 | + return -1; | ||
99 | + } | ||
100 | +printf("starting server...\n"); | ||
101 | +while(1){ | ||
102 | + libwebsocket_service(context,WAIT_DELAY); | ||
103 | + } | ||
104 | +libwebsocket_context_destroy(context); | ||
105 | +return 0; | ||
106 | +} |