Difference between revisions of "User:Ama Omega/archive/lsl hacks"
Kelly Linden (talk | contribs) |
(Replaced <source> with <syntaxhighlight>; attempted to get a consistent style of coding LSL, since it includes code from different authors; promoted to LSL Library category, since these are so useful) |
||
(29 intermediate revisions by 7 users not shown) | |||
Line 1: | Line 1: | ||
== Shared Media and HTTP-In == | == Shared Media and HTTP-In == | ||
Pre-Viewer 2.0 interfacing with an [[LSL]] script is a jumble of [[llDialog]], chats, [[touch_start|touches]] and possibly external web sites. With [[Shared Media]] that all changes. | |||
One step at a time ....... | One step at a time ....... | ||
=== llSetPrimMediaParams === | === llSetPrimMediaParams === | ||
* Use llSetPrimMediaParams to set the url and various parameters on the face of a prim via LSL. | * Use llSetPrimMediaParams to set the {{Wikipedia|url}} and various parameters on the face of a prim via LSL. | ||
< | <syntaxhighlight lang="lsl2"> | ||
default | default | ||
{ | { | ||
Line 9: | Line 11: | ||
{ | { | ||
llSetPrimMediaParams(0, // Side to display the media on. | llSetPrimMediaParams(0, // Side to display the media on. | ||
[PRIM_MEDIA_AUTO_PLAY,TRUE, | [PRIM_MEDIA_AUTO_PLAY, TRUE, // Show this page immediately | ||
PRIM_MEDIA_CURRENT_URL,"http://google.com", | PRIM_MEDIA_CURRENT_URL, "http://google.com", // The url currently showing | ||
PRIM_MEDIA_HOME_URL,"http://google.com", | PRIM_MEDIA_HOME_URL, "http://google.com", // The url if they hit 'home' | ||
PRIM_MEDIA_HEIGHT_PIXELS,512, | PRIM_MEDIA_HEIGHT_PIXELS, 512, // Height/width of media texture will be | ||
PRIM_MEDIA_WIDTH_PIXELS,512]); | PRIM_MEDIA_WIDTH_PIXELS, 512]); // rounded up to nearest power of 2. | ||
} | } | ||
} | } | ||
</ | </syntaxhighlight> | ||
=== data: urls === | === data: urls === | ||
There is a special url type: | There is a special url type: <code>data:</code> that lets you send the html ''in the url''. Paste the code below into your browser's address bar. | ||
< | <syntaxhighlight lang="html"> | ||
data:text/html,<h1>This is a test</h1><h2>This is a test</h2><h3>This is a test</h3> | data:text/html,<h1>This is a test</h1><h2>This is a test</h2><h3>This is a test</h3> | ||
</ | </syntaxhighlight> | ||
=== llSetPrimMediaParams for data: urls === | === llSetPrimMediaParams for data: urls === | ||
* Thus you can build arbitrary html in your LSL script and display it on the face of the prim | * Thus, you can build arbitrary html in your LSL script and display it on the face of the prim | ||
< | <syntaxhighlight lang="lsl2"> | ||
show(string html) | show(string html) | ||
{ | { | ||
html = "data:text/html," + llEscapeURL(html); | html = "data:text/html," + llEscapeURL(html); | ||
llSetPrimMediaParams(0, | llSetPrimMediaParams(0, // Side to display the media on. | ||
[PRIM_MEDIA_AUTO_PLAY,TRUE, // Show this page immediately | [PRIM_MEDIA_AUTO_PLAY,TRUE, // Show this page immediately | ||
PRIM_MEDIA_CURRENT_URL,html, | PRIM_MEDIA_CURRENT_URL, html, // The url currently showing | ||
PRIM_MEDIA_HOME_URL,html, | PRIM_MEDIA_HOME_URL, html, // The url if they hit 'home' | ||
PRIM_MEDIA_HEIGHT_PIXELS,512, | PRIM_MEDIA_HEIGHT_PIXELS, 512, // Height/width of media texture will be | ||
PRIM_MEDIA_WIDTH_PIXELS,512]); | PRIM_MEDIA_WIDTH_PIXELS, 512]); // rounded up to nearest power of 2. | ||
} | } | ||
default | default | ||
Line 44: | Line 46: | ||
} | } | ||
} | } | ||
</ | </syntaxhighlight> | ||
=== HTTP-In === | === HTTP-In === | ||
* Scripts can become web servers via HTTP-In | * Scripts can become web servers via [[LlRequestURL|HTTP-In]] | ||
< | <syntaxhighlight lang="lsl2"> | ||
default | default | ||
{ | { | ||
Line 60: | Line 62: | ||
if (method == URL_REQUEST_GRANTED) | if (method == URL_REQUEST_GRANTED) | ||
{ | { | ||
llSay(0,"URL is: " + body); | llSay(0, "URL is: " + body); | ||
} | } | ||
else if (method == "GET") | else if (method == "GET") | ||
{ | { | ||
llSay(0,"Received page request."); | llSay(0, "Received page request."); | ||
llHTTPResponse(id,200,"OK"); | llHTTPResponse(id, 200, "OK"); | ||
} | } | ||
} | } | ||
} | } | ||
</ | </syntaxhighlight> | ||
=== llSetPrimMediaParams for data: urls that link back to HTTP-In === | === llSetPrimMediaParams for data: urls that link back to HTTP-In === | ||
* Which means you can make web pages that trigger other page views via http-in links | * Which means you can make web pages that trigger other page views via http-in links | ||
< | |||
<syntaxhighlight lang="lsl2"> | |||
show(string html) | show(string html) | ||
{ | { | ||
html = "data:text/html," + llEscapeURL(html); | html = "data:text/html," + llEscapeURL(html); | ||
llSetPrimMediaParams(0, | llSetPrimMediaParams(0, // Side to display the media on. | ||
[PRIM_MEDIA_AUTO_PLAY,TRUE, | [PRIM_MEDIA_AUTO_PLAY, TRUE, // Show this page immediately | ||
PRIM_MEDIA_CURRENT_URL,html, | PRIM_MEDIA_CURRENT_URL, html, // The url currently showing | ||
PRIM_MEDIA_HOME_URL,html, | PRIM_MEDIA_HOME_URL, html, // The url if they hit 'home' | ||
PRIM_MEDIA_HEIGHT_PIXELS,512, | PRIM_MEDIA_HEIGHT_PIXELS, 512, // Height/width of media texture will be | ||
PRIM_MEDIA_WIDTH_PIXELS,512]); | PRIM_MEDIA_WIDTH_PIXELS, 512]); // rounded up to nearest power of 2. | ||
} | } | ||
string replace_all(string src, string target, string replace) | string replace_all(string src, string target, string replace) | ||
{ | { | ||
return llDumpList2String(llParseString2List(src,[target],[]),replace); | return llDumpList2String(llParseString2List(src, [target], []), replace); | ||
} | } | ||
string get_query(key id, string name) | string get_query(key id, string name) | ||
{ | { | ||
string query = llGetHTTPHeader(id,"x-query-string"); | string query = llGetHTTPHeader(id, "x-query-string"); | ||
query = replace_all(query,"+"," "); | query = replace_all(query, "+", " "); | ||
query = llUnescapeURL(query); | query = llUnescapeURL(query); | ||
list q = llParseString2List(query,["=","&",";"],[]); | list q = llParseString2List(query, ["=", "&", ";"], []); | ||
integer i = llListFindList(q,[name]); | integer i = llListFindList(q, [name]); | ||
if (i != -1) | if (i != -1) | ||
{ | { | ||
return llList2String(q,i+1); | return llList2String(q, i + 1); | ||
} | } | ||
Line 121: | Line 124: | ||
else if (method == "GET") | else if (method == "GET") | ||
{ | { | ||
string get = get_query(id,"get"); | string get = get_query(id, "get"); | ||
if (get == "owner") | if (get == "owner") | ||
{ | { | ||
llHTTPResponse(id,200,"Owner is: " + (string)llGetOwner()); | llHTTPResponse(id, 200, "Owner is: " + (string)llGetOwner()); | ||
} | } | ||
else if (get == "object") | else if (get == "object") | ||
{ | { | ||
llHTTPResponse(id,200,"Object is: " + (string)llGetKey()); | llHTTPResponse(id, 200, "Object is: " + (string)llGetKey()); | ||
} | } | ||
else | else | ||
{ | { | ||
llHTTPResponse(id,400,"huh?"); | llHTTPResponse(id, 400, "huh?"); | ||
} | } | ||
} | } | ||
} | } | ||
} | } | ||
</ | </syntaxhighlight> | ||
=== Forms === | === Forms === | ||
* You can put forms in data: urls | * You can put forms in <code>data:</code> urls | ||
< | <syntaxhighlight lang="html"> | ||
data:text/html,<form action="http://google.com" method="GET">Search:<input type="text" name=" | data:text/html,<form action="http://google.com/search" method="GET">Search:<input type="text" name="q"><input type="submit" value="Submit"></form> | ||
</ | </syntaxhighlight> | ||
=== The Magic === | === The Magic === | ||
* You can set the script HTTP-In url as the form action to get the results of the form sent back to the script | * You can set the script HTTP-In url as the form action to get the results of the form sent back to the script | ||
< | <syntaxhighlight lang="lsl2"> | ||
string | string html base = | ||
"<h1><form action='%url%' method='GET'> | "<h1><form action='%url%' method='GET'> | ||
Floating Text:<input type='text' name='text'><br> | Floating Text:<input type='text' name='text'><br> | ||
Line 161: | Line 164: | ||
html = "data:text/html," + llEscapeURL(html) + "<span " + (string)((++r) % 10) + "/>"; | html = "data:text/html," + llEscapeURL(html) + "<span " + (string)((++r) % 10) + "/>"; | ||
llSetPrimMediaParams(0, | llSetPrimMediaParams(0, // Side to display the media on. | ||
[PRIM_MEDIA_AUTO_PLAY,TRUE, | [PRIM_MEDIA_AUTO_PLAY, TRUE, // Show this page immediately | ||
PRIM_MEDIA_CURRENT_URL,html, | PRIM_MEDIA_CURRENT_URL, html, // The url currently showing | ||
PRIM_MEDIA_HOME_URL,html, | PRIM_MEDIA_HOME_URL, html, // The url if they hit 'home' | ||
PRIM_MEDIA_HEIGHT_PIXELS,512, | PRIM_MEDIA_HEIGHT_PIXELS, 512, // Height/width of media texture will be | ||
PRIM_MEDIA_WIDTH_PIXELS,512]); | PRIM_MEDIA_WIDTH_PIXELS, 512]); // rounded up to nearest power of 2. | ||
} | } | ||
string replace_all(string src, string target, string replace) | string replace_all(string src, string target, string replace) | ||
{ | { | ||
return llDumpList2String(llParseString2List(src,[target],[]),replace); | return llDumpList2String(llParseString2List(src, [target], []), replace); | ||
} | } | ||
string get_query(key id, string name) | string get_query(key id, string name) | ||
{ | { | ||
string query = llGetHTTPHeader(id,"x-query-string"); | string query = llGetHTTPHeader(id, "x-query-string"); | ||
query = replace_all(query,"+"," "); | query = replace_all(query, "+", " "); | ||
query = llUnescapeURL(query); | query = llUnescapeURL(query); | ||
list q = llParseString2List(query,["=","&",";"],[]); | list q = llParseString2List(query, ["=", "&", ";"], []); | ||
integer i = llListFindList(q,[name]); | integer i = llListFindList(q, [name]); | ||
if (i != -1) | if (i != -1) | ||
{ | { | ||
return llList2String(q,i+1); | return llList2String(q, i + 1); | ||
} | } | ||
Line 193: | Line 196: | ||
state_entry() | state_entry() | ||
{ | { | ||
llRequestURL(); | llRequestURL(); | ||
} | } | ||
Line 203: | Line 205: | ||
url = body + "/"; | url = body + "/"; | ||
show(replace_all(html_base,"%url%",url)); | show(replace_all(html_base, "%url%", url)); | ||
} | } | ||
else if (method == "GET") | else if (method == "GET") | ||
{ | { | ||
llSetText(get_query(id,"text"),<1,1,0>,1); | llSetText(get_query(id, "text"), <1.0, 1.0, 0.0>, 1); | ||
show(replace_all(html_base,"%url%",url)); | show(replace_all(html_base, "%url%", url)); | ||
llHTTPResponse(id,200,"Loading...."); | llHTTPResponse(id, 200, "Loading...."); | ||
} | } | ||
} | } | ||
} | } | ||
</ | </syntaxhighlight> | ||
=== The Limits === | === The Limits === | ||
* 1024 bytes per url | * 1024 bytes per url | ||
* | * [[llEscapeURL]]s means non-alphanumeric characters are 3 bytes (ouch) | ||
** I'm actually not clear on if this is really needed. I seem to sometimes get blank pages if I don't but some pages render fine without it. Maybe there is a subset of symbols that must be escaped and escaping only those would ease some of the space constraints? | |||
* Must force another page view after form submission since HTTP-In can't generate HTML | * Must force another page view after form submission since HTTP-In can't generate HTML | ||
* No real way of knowing which avatar is interacting with the HTML | |||
=== The Tricks === | === The Tricks === | ||
* <base href="<http-in-url>/"> | * <syntaxhighlight lang="html"><base href="<http-in-url>/"></syntaxhighlight> | ||
** HTTP-In urls are long, especially if escaped. In a page that includes more than a single link back to the script, or more than a single form, this can save a lot of space. | |||
* Tiny urls | * Tiny urls | ||
** You can use url shortening services to create short links to long data urls. In theory this should let you get past the 1k limit quite nicely, however there is overhead in setting up the tiny url. | |||
=== The future? === | |||
I think there is a lot more potential here than what I have outlined... if you have ideas or work out great new hacks let me know! Also let me know if it is ok to share those hacks with others. :) | |||
* svg? | |||
* javascript? | |||
* ajax? | |||
=== DHTML / Javascript ({{u|Tali Rosca}}) === | |||
Tali Rosca sent me the code to render the output of HTTP-In directly. I've wrapped her magic into the <code>build_url</code> and <code>build_response</code> functions in the example below. This example renders a page that is around 3.5k bytes - well past the 1k limit of urls.<br> | |||
'''Pros''': | |||
* Navigation is much smoother and feels more natural | |||
* Only limited by script memory | |||
'''Cons''': | |||
* Links are extremely large: 296 bytes for a link to just the base http-in url. | |||
<syntaxhighlight lang="lsl2"> | |||
string url; // Our base http-in url | |||
integer r; // Used for uniqueness in PrimMedia urls | |||
integer page; // The page number. | |||
show(string html) | |||
{ | |||
html += "<span " + (string)((++r) % 10) + "/>"; | |||
llSetPrimMediaParams(0, // Side to display the media on. | |||
[PRIM_MEDIA_AUTO_PLAY, TRUE, // Show this page immediately | |||
PRIM_MEDIA_CURRENT_URL, html, // The url if they hit 'home' | |||
PRIM_MEDIA_HOME_URL, html, // The url currently showing | |||
PRIM_MEDIA_HEIGHT_PIXELS, 512, // Height/width of media texture will be | |||
PRIM_MEDIA_WIDTH_PIXELS, 512]); // rounded up to nearest power of 2. | |||
} | |||
// This creates a data: url that will render the output of the http-in url | |||
// given. | |||
string build_url(string url) | |||
{ | |||
return "data:text/html," | |||
+ llEscapeURL("<html><head><script src='" + url | |||
+ "' type='text/javascript'></script></head><body onload='init()'></body></html>"); | |||
} | |||
// This wraps the html you want to display so that it will be shown from links | |||
// made with build_url | |||
string build_response(string body) | |||
{ | |||
return "function init() {document.getElementsByTagName('body')[0].innerHTML='" + body + "';}"; | |||
} | |||
default | |||
{ | |||
state_entry() | |||
{ | |||
llRequestURL(); | |||
} | |||
http_request(key id, string method, string body) | |||
{ | |||
if (method == URL_REQUEST_GRANTED) | |||
{ | |||
url = body + "/"; | |||
show(build_url(url + "page" + (string)(page))); | |||
} | |||
else if (method == "GET") | |||
{ | |||
string path = llGetHTTPHeader(id, "x-path-info"); | |||
string content = "<h1>path: " + path + "</h1>"; | |||
page = (integer)llGetSubString(path, 5, 5); | |||
if (page > 0) content += "<a href=\"" + build_url(url + "page" + (string)(page - 1)) + "\">Previous</a> "; | |||
if (page < 9) content += "<a href=\"" + build_url(url + "page" + (string)(page + 1)) + "\">Next</a><br>"; | |||
integer k; | |||
for(;k<10;++k) | |||
{ | |||
if (k == page) | |||
content += "<br>Page " + (string)k; | |||
else | |||
content += "<br><a href=\"" + build_url(url + "page" + (string)(k)) + "\">Page " + (string)k + "</a>"; | |||
} | |||
content += "<br><br>This page is " + (string)(llStringLength(build_response(content)) + 37) + " bytes long."; | |||
llHTTPResponse(id, 200, build_response(content)); | |||
} | |||
} | |||
} | |||
</syntaxhighlight> | |||
* I'm not quite sure if it is possible to hook up a form using this method. Ideas? | |||
=== Another JavaScript boot-strapping method ({{u|Vegas Silverweb}}) === | |||
This one makes it pretty easy to build out some arbitrary length web pages, using http-in's output directly. Loading between pages is kinda slow. | |||
<syntaxhighlight lang="lsl2"> | |||
string URL; | |||
string get(string page) | |||
{ | |||
if (page == "index") | |||
{ | |||
return "<h1>Index</h1>This is the index page.<br><br><a href='page1.html'>Link to page 1</a>"; | |||
} | |||
else if (page == "page1") | |||
{ | |||
return "<h1>Page 1</h1>This is page 1!.<br><br><a href ='index.html'>Link to the index page.</a>"; | |||
} | |||
else return "Unknown page."; | |||
} | |||
string serve(string page) | |||
{ | |||
return "document.write(atob('" + llStringToBase64(get(page)) + "'));"; | |||
} | |||
integer R; | |||
load(string page) | |||
{ | |||
string content="data:text/html;base64," | |||
+ llStringToBase64("<html><head><base href='"+URL+"/'></head><body>" | |||
+ "<script src='" + page + ".js' type='text/javascript'>" | |||
+ "</script><span r='" + (string)((++R) % 10) + "</body></html>"); | |||
llSetPrimMediaParams(0,[ | |||
PRIM_MEDIA_CURRENT_URL, content, | |||
PRIM_MEDIA_HOME_URL, content, | |||
PRIM_MEDIA_AUTO_ZOOM, FALSE, | |||
PRIM_MEDIA_FIRST_CLICK_INTERACT, TRUE, | |||
PRIM_MEDIA_PERMS_INTERACT, PRIM_MEDIA_PERM_ANYONE, | |||
PRIM_MEDIA_PERMS_CONTROL, PRIM_MEDIA_PERM_NONE, | |||
PRIM_MEDIA_AUTO_PLAY, TRUE | |||
]); | |||
} | |||
default | |||
{ | |||
state_entry() | |||
{ | |||
llRequestURL(); | |||
} | |||
http_request(key id, string method, string body) | |||
{ | |||
if (method == URL_REQUEST_GRANTED) | |||
{ | |||
URL = body; | |||
load("index"); | |||
} | |||
else if (method == URL_REQUEST_DENIED) | |||
{ | |||
llOwnerSay("Unable to get url!"); | |||
} | |||
else if (method == "GET") | |||
{ | |||
string path_raw = llGetHTTPHeader(id, "x-path-info"); | |||
if (path_raw == "") | |||
{ | |||
// No path, assume index.html | |||
path_raw = "/index.html"; | |||
} | |||
list path = llParseString2List(llGetSubString(path_raw, 1, -1), ["."], []); | |||
string page = llList2String(path, 0); | |||
string type = llList2String(path, 1); | |||
if (type == "js") | |||
{ | |||
llHTTPResponse(id, 200, serve(page)); | |||
} | |||
else if (type == "html") | |||
{ | |||
llHTTPResponse(id, 100, ""); | |||
load(page); | |||
} | |||
} | |||
} | |||
} | |||
</syntaxhighlight> | |||
[[Category:LSL Library]] |
Latest revision as of 03:14, 11 June 2023
Pre-Viewer 2.0 interfacing with an LSL script is a jumble of llDialog, chats, touches and possibly external web sites. With Shared Media that all changes.
One step at a time .......
llSetPrimMediaParams
- Use llSetPrimMediaParams to set the url and various parameters on the face of a prim via LSL.
default
{
state_entry()
{
llSetPrimMediaParams(0, // Side to display the media on.
[PRIM_MEDIA_AUTO_PLAY, TRUE, // Show this page immediately
PRIM_MEDIA_CURRENT_URL, "http://google.com", // The url currently showing
PRIM_MEDIA_HOME_URL, "http://google.com", // The url if they hit 'home'
PRIM_MEDIA_HEIGHT_PIXELS, 512, // Height/width of media texture will be
PRIM_MEDIA_WIDTH_PIXELS, 512]); // rounded up to nearest power of 2.
}
}
data: urls
There is a special url type: data:
that lets you send the html in the url. Paste the code below into your browser's address bar.
data:text/html,<h1>This is a test</h1><h2>This is a test</h2><h3>This is a test</h3>
llSetPrimMediaParams for data: urls
- Thus, you can build arbitrary html in your LSL script and display it on the face of the prim
show(string html)
{
html = "data:text/html," + llEscapeURL(html);
llSetPrimMediaParams(0, // Side to display the media on.
[PRIM_MEDIA_AUTO_PLAY,TRUE, // Show this page immediately
PRIM_MEDIA_CURRENT_URL, html, // The url currently showing
PRIM_MEDIA_HOME_URL, html, // The url if they hit 'home'
PRIM_MEDIA_HEIGHT_PIXELS, 512, // Height/width of media texture will be
PRIM_MEDIA_WIDTH_PIXELS, 512]); // rounded up to nearest power of 2.
}
default
{
state_entry()
{
show("<h1>This is a test</h1><h2>This is a test</h2><h3>This is a test</h3>");
}
}
HTTP-In
- Scripts can become web servers via HTTP-In
default
{
state_entry()
{
llRequestURL();
}
http_request(key id, string method, string body)
{
if (method == URL_REQUEST_GRANTED)
{
llSay(0, "URL is: " + body);
}
else if (method == "GET")
{
llSay(0, "Received page request.");
llHTTPResponse(id, 200, "OK");
}
}
}
llSetPrimMediaParams for data: urls that link back to HTTP-In
- Which means you can make web pages that trigger other page views via http-in links
show(string html)
{
html = "data:text/html," + llEscapeURL(html);
llSetPrimMediaParams(0, // Side to display the media on.
[PRIM_MEDIA_AUTO_PLAY, TRUE, // Show this page immediately
PRIM_MEDIA_CURRENT_URL, html, // The url currently showing
PRIM_MEDIA_HOME_URL, html, // The url if they hit 'home'
PRIM_MEDIA_HEIGHT_PIXELS, 512, // Height/width of media texture will be
PRIM_MEDIA_WIDTH_PIXELS, 512]); // rounded up to nearest power of 2.
}
string replace_all(string src, string target, string replace)
{
return llDumpList2String(llParseString2List(src, [target], []), replace);
}
string get_query(key id, string name)
{
string query = llGetHTTPHeader(id, "x-query-string");
query = replace_all(query, "+", " ");
query = llUnescapeURL(query);
list q = llParseString2List(query, ["=", "&", ";"], []);
integer i = llListFindList(q, [name]);
if (i != -1)
{
return llList2String(q, i + 1);
}
return "";
}
default
{
state_entry()
{
show("<h1>This is a test</h1><h2>This is a test</h2><h3>This is a test</h3>");
llRequestURL();
}
http_request(key id, string method, string body)
{
if (method == URL_REQUEST_GRANTED)
{
show("<h1><a href='" + body + "/?get=owner'>Owner ID</a><br><br><a href='" + body + "/?get=object'>Object ID</a></h1>");
}
else if (method == "GET")
{
string get = get_query(id, "get");
if (get == "owner")
{
llHTTPResponse(id, 200, "Owner is: " + (string)llGetOwner());
}
else if (get == "object")
{
llHTTPResponse(id, 200, "Object is: " + (string)llGetKey());
}
else
{
llHTTPResponse(id, 400, "huh?");
}
}
}
}
Forms
- You can put forms in
data:
urls
data:text/html,<form action="http://google.com/search" method="GET">Search:<input type="text" name="q"><input type="submit" value="Submit"></form>
The Magic
- You can set the script HTTP-In url as the form action to get the results of the form sent back to the script
string html base =
"<h1><form action='%url%' method='GET'>
Floating Text:<input type='text' name='text'><br>
<input type='submit' value='Set'>
</form></h1>";
string url;
integer r;
show(string html)
{
html = "data:text/html," + llEscapeURL(html) + "<span " + (string)((++r) % 10) + "/>";
llSetPrimMediaParams(0, // Side to display the media on.
[PRIM_MEDIA_AUTO_PLAY, TRUE, // Show this page immediately
PRIM_MEDIA_CURRENT_URL, html, // The url currently showing
PRIM_MEDIA_HOME_URL, html, // The url if they hit 'home'
PRIM_MEDIA_HEIGHT_PIXELS, 512, // Height/width of media texture will be
PRIM_MEDIA_WIDTH_PIXELS, 512]); // rounded up to nearest power of 2.
}
string replace_all(string src, string target, string replace)
{
return llDumpList2String(llParseString2List(src, [target], []), replace);
}
string get_query(key id, string name)
{
string query = llGetHTTPHeader(id, "x-query-string");
query = replace_all(query, "+", " ");
query = llUnescapeURL(query);
list q = llParseString2List(query, ["=", "&", ";"], []);
integer i = llListFindList(q, [name]);
if (i != -1)
{
return llList2String(q, i + 1);
}
return "";
}
default
{
state_entry()
{
llRequestURL();
}
http_request(key id, string method, string body)
{
if (method == URL_REQUEST_GRANTED)
{
url = body + "/";
show(replace_all(html_base, "%url%", url));
}
else if (method == "GET")
{
llSetText(get_query(id, "text"), <1.0, 1.0, 0.0>, 1);
show(replace_all(html_base, "%url%", url));
llHTTPResponse(id, 200, "Loading....");
}
}
}
The Limits
- 1024 bytes per url
- llEscapeURLs means non-alphanumeric characters are 3 bytes (ouch)
- I'm actually not clear on if this is really needed. I seem to sometimes get blank pages if I don't but some pages render fine without it. Maybe there is a subset of symbols that must be escaped and escaping only those would ease some of the space constraints?
- Must force another page view after form submission since HTTP-In can't generate HTML
- No real way of knowing which avatar is interacting with the HTML
The Tricks
<base href="<http-in-url>/">
- HTTP-In urls are long, especially if escaped. In a page that includes more than a single link back to the script, or more than a single form, this can save a lot of space.
- Tiny urls
- You can use url shortening services to create short links to long data urls. In theory this should let you get past the 1k limit quite nicely, however there is overhead in setting up the tiny url.
The future?
I think there is a lot more potential here than what I have outlined... if you have ideas or work out great new hacks let me know! Also let me know if it is ok to share those hacks with others. :)
- svg?
- javascript?
- ajax?
DHTML / Javascript (Tali Rosca)
Tali Rosca sent me the code to render the output of HTTP-In directly. I've wrapped her magic into the build_url
and build_response
functions in the example below. This example renders a page that is around 3.5k bytes - well past the 1k limit of urls.
Pros:
- Navigation is much smoother and feels more natural
- Only limited by script memory
Cons:
- Links are extremely large: 296 bytes for a link to just the base http-in url.
string url; // Our base http-in url
integer r; // Used for uniqueness in PrimMedia urls
integer page; // The page number.
show(string html)
{
html += "<span " + (string)((++r) % 10) + "/>";
llSetPrimMediaParams(0, // Side to display the media on.
[PRIM_MEDIA_AUTO_PLAY, TRUE, // Show this page immediately
PRIM_MEDIA_CURRENT_URL, html, // The url if they hit 'home'
PRIM_MEDIA_HOME_URL, html, // The url currently showing
PRIM_MEDIA_HEIGHT_PIXELS, 512, // Height/width of media texture will be
PRIM_MEDIA_WIDTH_PIXELS, 512]); // rounded up to nearest power of 2.
}
// This creates a data: url that will render the output of the http-in url
// given.
string build_url(string url)
{
return "data:text/html,"
+ llEscapeURL("<html><head><script src='" + url
+ "' type='text/javascript'></script></head><body onload='init()'></body></html>");
}
// This wraps the html you want to display so that it will be shown from links
// made with build_url
string build_response(string body)
{
return "function init() {document.getElementsByTagName('body')[0].innerHTML='" + body + "';}";
}
default
{
state_entry()
{
llRequestURL();
}
http_request(key id, string method, string body)
{
if (method == URL_REQUEST_GRANTED)
{
url = body + "/";
show(build_url(url + "page" + (string)(page)));
}
else if (method == "GET")
{
string path = llGetHTTPHeader(id, "x-path-info");
string content = "<h1>path: " + path + "</h1>";
page = (integer)llGetSubString(path, 5, 5);
if (page > 0) content += "<a href=\"" + build_url(url + "page" + (string)(page - 1)) + "\">Previous</a> ";
if (page < 9) content += "<a href=\"" + build_url(url + "page" + (string)(page + 1)) + "\">Next</a><br>";
integer k;
for(;k<10;++k)
{
if (k == page)
content += "<br>Page " + (string)k;
else
content += "<br><a href=\"" + build_url(url + "page" + (string)(k)) + "\">Page " + (string)k + "</a>";
}
content += "<br><br>This page is " + (string)(llStringLength(build_response(content)) + 37) + " bytes long.";
llHTTPResponse(id, 200, build_response(content));
}
}
}
- I'm not quite sure if it is possible to hook up a form using this method. Ideas?
Another JavaScript boot-strapping method (Vegas Silverweb)
This one makes it pretty easy to build out some arbitrary length web pages, using http-in's output directly. Loading between pages is kinda slow.
string URL;
string get(string page)
{
if (page == "index")
{
return "<h1>Index</h1>This is the index page.<br><br><a href='page1.html'>Link to page 1</a>";
}
else if (page == "page1")
{
return "<h1>Page 1</h1>This is page 1!.<br><br><a href ='index.html'>Link to the index page.</a>";
}
else return "Unknown page.";
}
string serve(string page)
{
return "document.write(atob('" + llStringToBase64(get(page)) + "'));";
}
integer R;
load(string page)
{
string content="data:text/html;base64,"
+ llStringToBase64("<html><head><base href='"+URL+"/'></head><body>"
+ "<script src='" + page + ".js' type='text/javascript'>"
+ "</script><span r='" + (string)((++R) % 10) + "</body></html>");
llSetPrimMediaParams(0,[
PRIM_MEDIA_CURRENT_URL, content,
PRIM_MEDIA_HOME_URL, content,
PRIM_MEDIA_AUTO_ZOOM, FALSE,
PRIM_MEDIA_FIRST_CLICK_INTERACT, TRUE,
PRIM_MEDIA_PERMS_INTERACT, PRIM_MEDIA_PERM_ANYONE,
PRIM_MEDIA_PERMS_CONTROL, PRIM_MEDIA_PERM_NONE,
PRIM_MEDIA_AUTO_PLAY, TRUE
]);
}
default
{
state_entry()
{
llRequestURL();
}
http_request(key id, string method, string body)
{
if (method == URL_REQUEST_GRANTED)
{
URL = body;
load("index");
}
else if (method == URL_REQUEST_DENIED)
{
llOwnerSay("Unable to get url!");
}
else if (method == "GET")
{
string path_raw = llGetHTTPHeader(id, "x-path-info");
if (path_raw == "")
{
// No path, assume index.html
path_raw = "/index.html";
}
list path = llParseString2List(llGetSubString(path_raw, 1, -1), ["."], []);
string page = llList2String(path, 0);
string type = llList2String(path, 1);
if (type == "js")
{
llHTTPResponse(id, 200, serve(page));
}
else if (type == "html")
{
llHTTPResponse(id, 100, "");
load(page);
}
}
}
}