1 string url; // Our base http-in url
  2 
  3 //string svg1 = "<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" width=\"500\" height=\"300\"><title>Exemple simple de figure SVG</title><desc>Cette figure est constituée d'un rectangle, d'un segment de droite et d'un cercle.</desc><rect width=\"100\" height=\"80\"  x=\"0\" y=\"70\" fill=\"green\" /><line x1=\"5\" y1=\"5\" x2=\"250\" y2=\"95\" stroke=\"red\" /><circle cx=\"90\" cy=\"80\" r=\"50\" fill=\"blue\" /><text x=\"300\" y=\"60\">Shared medias SVG</text></svg>";
  4 
  5 //string svg1 = "<rect width=\"100\" height=\"80\"  x=\"0\" y=\"70\" fill=\"green\" /><line x1=\"5\" y1=\"5\" x2=\"250\" y2=\"95\" stroke=\"red\" /><circle cx=\"90\" cy=\"80\" r=\"50\" fill=\"blue\" /><text x=\"300\" y=\"60\">Shared medias SVG</text>";
  6 
  7 string svg2 = "<svg version=\"1.1\" baseProfile=\"full\" xmlns=\"http://www.w3.org/2000/svg\"><rect width=\"100%\" height=\"100%\" fill=\"white\" /><rect x=\"30\" y=\"50\" width=\"240\" height=\"100\" fill=\"red\" /><circle cx=\"150\" cy=\"100\" r=\"80\" fill=\"red\" /><text x=\"150\" y=\"125\" font-size=\"60\" text-anchor=\"middle\" fill=\"white\">SVG</text></svg>";
  8 
  9 //string svg3 = "<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"xMidYMid slice\" style=\"width:100%; height:100%; position:absolute; top:0; left:0; z-index:-1;\"><linearGradient id=\"gradient\"><stop class=\"begin\" offset=\"0%\"/><stop class=\"end\" offset=\"100%\"/></linearGradient><rect x=\"0\" y=\"0\" width=\"100\" height=\"100\" style=\"fill:url(#gradient)\" /><circle cx=\"50\" cy=\"50\" r=\"30\" style=\"fill:url(#gradient)\" /></svg>";
 10 
 11 show(string html)
 12 {
 13     llSetPrimMediaParams(0,                  // Side to display the media on.
 14             [PRIM_MEDIA_AUTO_PLAY,TRUE,      // Show this page immediately
 15              PRIM_MEDIA_CURRENT_URL,html,    // The url if they hit 'home'
 16              PRIM_MEDIA_HOME_URL,html,       // The url currently showing
 17              PRIM_MEDIA_HEIGHT_PIXELS,512,   // Height/width of media texture will be
 18              PRIM_MEDIA_WIDTH_PIXELS,512]);  //   rounded up to nearest power of 2.
 19 }
 20 
 21 string httpRequest(string url, string type, string elementID)
 22 {
 23     //string content = "function httpRequest(IDRequest){";
 24     //content += "var Script=document.createElement('script');";
 25     //content += "Script.src='" + url + "httpRequest?' + IDRequest;";
 26     //content += "document.body.appendChild(Script);}";
 27     //return content;
 28     string content = "";
 29     content += "function ajaxHandler() {";
 30     content += "var xhr=null; ";
 31     content += "if (window.XMLHttpRequest) xhr = new XMLHttpRequest();";
 32     content += "else {httpResponse('texte','No XMLHttpRequest', 'blue'); return;}";
 33     content += "if (xhr!=null){";
 34     content += "xhr.onreadystatechange = function() { ";
 35     content += "if(xhr.readyState  == 4) { if(xhr.status == 200)"; 
 36     content += "httpResponse('texte', xhr.responseText, 'blue');";
 37     content += "else httpResponse('texte', 'xhr.readyState: ' + xhr.readyState + ' xhr.status: ' + xhr.status, 'blue');}};";
 38     content += "xhr.open('GET', '" + url + type + "', true);";
 39     content += "xhr.send();";
 40     content += "}}";
 41     return content;
 42 }
 43 
 44 string httpResponse()
 45 {
 46     string content = "function httpResponse(id,sText,color)
 47     {
 48         var objet = document.getElementById(id);
 49         //var objet = svgdoc.getElementById(id);
 50         var child = objet.firstChild; 
 51         child.data = sText;
 52         objet.setAttributeNS(null ,'fill', color);
 53     }";
 54     return content;
 55 }
 56 
 57 string build_url(string url)
 58 {
 59     return "data:image/svg+xml," + llEscapeURL("<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"512\" height=\"512\" onload='init(evt)'><script xlink:href='" + url + "' type='text/javascript'></script></svg>");
 60 
 61 }
 62 
 63 string build_response(string body)
 64 { 
 65     string str = "";
 66     str += "var svgdoc;";
 67     str += "function init(evt){
 68         ns_svg = 'http://www.w3.org/2000/svg';
 69         svgdoc = evt.target.ownerDocument;
 70         
 71         // create a g tag
 72         node=svgdoc.createElementNS(ns_svg , 'g');
 73         node.setAttributeNS(null , 'id' , 'node1');
 74         node.addEventListener('mousemove', move, false);
 75         node.addEventListener('mousedown', cliquer, false);
 76         node.addEventListener('mouseup', upmouse, false);
 77         ou=evt.target;
 78         ou.appendChild(node);
 79 
 80         // Create a rectangle in the tag g , id = node1
 81         node=svgdoc.createElementNS(ns_svg ,'rect');
 82         //node.setAttributeNS(null , 'id' , 'rectle');
 83         //node.setAttributeNS(null , 'transform', 'matrix(1 0 0 1 50 50)');
 84         node.setAttributeNS(null ,'x','0');node.setAttributeNS(null ,'y','0');
 85         node.setAttributeNS(null ,'width','500');node.setAttributeNS(null ,'height','400');
 86         node.setAttributeNS(null ,'fill','#EEEEEE');
 87         node.setAttributeNS(null ,'stroke','#0E0E0E');
 88         //node.addEventListener('click' , change_grect, false);
 89         ou=svgdoc.getElementById('node1');
 90         ou.appendChild(node);
 91 
 92         // Create a circle in the tag g , id = node1 
 93         node=svgdoc.createElementNS(ns_svg ,'ellipse');
 94         node.setAttributeNS(null , 'id' , 'cercle');
 95         node.setAttributeNS(null , 'transform', 'matrix(1 0 0 1 300 200)');
 96         node.setAttributeNS(null ,'cx','0');node.setAttributeNS(null ,'cy','0');
 97         node.setAttributeNS(null ,'rx','50');node.setAttributeNS(null ,'ry','50');
 98         node.setAttributeNS(null ,'fill','red');
 99         node.setAttributeNS(null ,'stroke','#0E0E0E');
100         node.addEventListener('click' , change_circle, false);
101         ou=svgdoc.getElementById('node1');
102         ou.appendChild(node);
103         
104         // Create a rectangle in the tag g , id = node1
105         node=svgdoc.createElementNS(ns_svg ,'rect');
106         node.setAttributeNS(null , 'id' , 'rectangle');
107         node.setAttributeNS(null , 'transform', 'matrix(1 0 0 1 50 50)');
108         node.setAttributeNS(null ,'x','50');node.setAttributeNS(null ,'y','100');
109         node.setAttributeNS(null ,'width','100');node.setAttributeNS(null ,'height','50');
110         node.setAttributeNS(null ,'stroke','#0E0E0E');
111         node.setAttributeNS(null ,'fill','green');
112         node.addEventListener('click' , change_grect, false);
113         ou=svgdoc.getElementById('node1');
114         ou.appendChild(node);
115         
116         // Create a rectangle for ajax handler in the tag g , id = node1
117         node=svgdoc.createElementNS(ns_svg ,'rect');
118         node.setAttributeNS(null , 'id' , 'clickrectangle');
119         node.setAttributeNS(null ,'x','300'); node.setAttributeNS(null ,'y','300');
120         node.setAttributeNS(null ,'width','100');node.setAttributeNS(null ,'height','50');
121         node.setAttributeNS(null ,'stroke','#0E0E0E');
122         node.setAttributeNS(null ,'fill','grey');
123         node.addEventListener('click' , ajax_call, false);
124         ou=svgdoc.getElementById('node1');
125         ou.appendChild(node);
126         
127         // Create a text area in the tag g , id = node1 
128         node=svgdoc.createElementNS(ns_svg ,'text');
129         node.setAttributeNS(null, 'id' , 'texte1');
130         node.setAttributeNS(null, 'x','350');node.setAttributeNS(null ,'y','335');
131         node.setAttributeNS(null, 'text-anchor','middle');
132         node.setAttributeNS(null, 'font-size','25');
133         node.setAttributeNS(null, 'font-family','Arial');
134         node.setAttributeNS(null, 'fill','black');
135         node.setAttributeNS(null ,'stroke','#FFFFFF');
136         node.addEventListener('click' , ajax_call, false);
137         var texte1=svgdoc.createTextNode('Ajax call');
138         node.appendChild(texte1);
139         ou=svgdoc.getElementById('node1');
140         ou.appendChild(node);
141         
142         // Create a rectangle in the tag g , id = node1
143         node=svgdoc.createElementNS(ns_svg ,'rect');
144         node.setAttributeNS(null, 'id', 'rectangle1');
145         node.setAttributeNS(null, 'transform', 'matrix(1 0 0 1 50 50)');
146         node.setAttributeNS(null, 'x','50');node.setAttributeNS(null,'y','200');
147         node.setAttributeNS(null, 'width','100');node.setAttributeNS(null,'height','50');
148         node.setAttributeNS(null ,'stroke','#0E0E0E');
149         node.setAttributeNS(null, 'fill','blue');
150         node.addEventListener('click', change_brect, false);
151         ou=svgdoc.getElementById('node1');
152         ou.appendChild(node);
153         
154         
155         // Create a text area in the tag g , id = node1 
156         node=svgdoc.createElementNS(ns_svg ,'text');
157         node.setAttributeNS(null, 'id' , 'texte');
158         node.setAttributeNS(null, 'x','200');node.setAttributeNS(null ,'y','50');
159         node.setAttributeNS(null, 'text-anchor','middle');
160         node.setAttributeNS(null, 'font-size','25');
161         node.setAttributeNS(null, 'font-family','Arial');
162         node.setAttributeNS(null, 'fill','red');
163         node.setAttributeNS(null ,'stroke','#0E0E0E');
164         var texte=svgdoc.createTextNode('Clic and move objects');
165         node.appendChild(texte);
166         ou=svgdoc.getElementById('node1');
167         ou.appendChild(node);
168         
169         // import a svg document (does not work for now)
170         node=svgdoc.createElementNS(ns_svg , 'g');
171         node.setAttributeNS(null , 'id' , 'tag_g1');
172         ou=evt.target;
173         ou.appendChild(node);
174         node=svgdoc.createElementNS(ns_svg ,'svg:svg');
175         node.setAttribute('type', 'image/svg+xml');
176         node.setAttribute('data', 'data:image/svg+xml, "+ body +"');
177         node.setAttributeNS(null ,'x','50');node.setAttributeNS(null ,'y','350');
178         node.setAttributeNS(null ,'width','100');node.setAttributeNS(null ,'height','50');
179         ou=svgdoc.getElementById('tag_g1');
180         ou.appendChild(node);
181         }";
182         
183     str += "function ajax_call(evt){ajaxHandler();}";
184     
185     str += "function change_brect(evt){httpResponse('texte','You clicked blue rectangle', 'blue');}";
186     str += "function change_grect(evt){httpResponse('texte','You clicked green rectangle', 'green');}";
187     str += "function change_circle(evt){httpResponse('texte','You clicked circle', 'red');}";
188     str += httpRequest(url, "SVG_GET", "dummy");
189     str += httpResponse();
190     str += "var appui=false , cible='' , xd2=0 , yd2=0 , xd1=0 , yd1=0 , coeffs = new Array();";
191     str += "function upmouse(evt) {appui = false;}";
192     str += "function move(evt){
193             if (!appui) return;
194             var xm = evt.clientX;
195             var ym = evt.clientY;
196             if ((xm<=5)||(xm>=495)||(ym<=5)||(ym>=395)) {appui=false; return;}
197             if ((cible != 'rectangle') && (cible != 'rectangle1') &&(cible != 'cercle')) return;
198             svgdoc = evt.target.ownerDocument;  
199             coeffs[4] = xm + xd1 - xd2;
200             coeffs[5] = ym + yd1 - yd2; 
201             if (cible=='rectangle' || cible=='rectangle1'){
202                 if (coeffs[4] < 0)   coeffs[4] = 0;
203                 if (coeffs[4] > 400) coeffs[4] = 400;
204                 if (coeffs[5] < 0)   coeffs[5] = 0;
205                 if (coeffs[5] > 350) coeffs[5] = 350;};
206             if (cible=='cercle'){
207                 if (coeffs[4] < 50)  coeffs[4] = 50;
208                 if (coeffs[4] > 450) coeffs[4] = 450;
209                 if (coeffs[5] < 50)  coeffs[5] = 50;
210                 if (coeffs[5] > 350) coeffs[5] = 350;} 
211             var chaine = 'matrix(' + coeffs.join(' ') + ')';
212             svgdoc.getElementById(cible).setAttributeNS(null , 'transform' , chaine)}";
213 
214     str += "function cliquer(evt){
215         cible=evt.target.getAttributeNS(null , 'id');
216         if ((cible=='rectangle')|| (cible=='rectangle1')||(cible=='cercle')){
217             appui=true;
218             xd2 = evt.clientX;
219             yd2 = evt.clientY;
220             var transfo = evt.target.getAttributeNS(null , 'transform')
221             transfo = transfo.substring(7 , transfo.length - 1)
222             if (transfo.indexOf(',') > 0) coeffs = transfo.split(',')
223             else coeffs = transfo.split(' ')
224             xd1 = parseInt(coeffs[4]);
225             yd1 = parseInt(coeffs[5]);}}";
226     return str;
227 }
228 
229 
230 string BuildBody()
231 {
232     
233     string content = "";
234     content += svg2;
235     return content;
236 }
237 
238 default
239 {
240     state_entry()
241     {
242         llRequestURL();
243     }
244 
245     http_request(key id, string method, string body)
246     {
247         if (method == URL_REQUEST_GRANTED)
248         {
249             url = body + "/";
250             show(build_url(url));
251         }
252         else if (method == "GET")
253         {
254             string path = llGetHTTPHeader(id,"x-path-info");
255             if (path == "/SVG_GET")
256             {
257                 llOwnerSay ("One day... it will work!!!!!!");
258                 llHTTPResponse(id, 200, "reponse");
259             }
260             else
261             {
262                 string content = BuildBody();
263                 llHTTPResponse(id, 200, build_response(content));
264             }
265         }
266         
267     }
268 }