External communication
Moderators: FourthWorld, heatherlaine, Klaus, kevinmiller, robinmiller
External communication
Hi,
just curious if the latest additions with do as javaScript will let us communicate from the stack to a Server API now. If so I would be very keen to see an example.
just curious if the latest additions with do as javaScript will let us communicate from the stack to a Server API now. If so I would be very keen to see an example.
Re: External communication
There's no reason why you shouldn't be able to use the new capability to do an XMLHttpRequest and fetch data, but I haven't yet had the opportunity to play around and see what's possible (or not).
LiveCode Open Source Team — @PeterTBBrett — peter.brett@livecode.com
-
- VIP Livecode Opensource Backer
- Posts: 2262
- Joined: Thu Feb 28, 2013 11:52 pm
- Location: Göttingen, DE
Re: External communication
Here an example that does NOT work. Throws an exception, error code -1.
Code: Select all
on mouseUp
put fld "URI" into fu
put line 10 to -1 of the script of me into js
replace cr & "--" with cr in js
replace "xxxxxxxxxx" with fu in js
put js into fld "result"
do js as "javaScript"
put the result & cr before fld "result"
end mouseUp
-- function loadXMLDoc()
-- {
-- var xmlhttp;
-- xmlhttp=new XMLHttpRequest();
-- xmlhttp.onreadystatechange=function()
-- {
-- if (xmlhttp.readyState==4 && xmlhttp.status==200)
-- {
-- return xmlhttp.responseText;
-- }
-- }
-- xmlhttp.open("GET","xxxxxxxxxx",true);
-- xmlhttp.send();
-- }
-- loadXMLDoc();
shiftLock happens
Re: External communication
I think this is failing because you are trying to do a synchronous fetch using an asynchronous API.
When you call "LoadXMLDoc()", it creates and sends the HTTP request -- and then returns to LiveCode. The result of calling "LoadXMLDoc()" is empty. A bit later, when the HTTP request completes, it calls your "onreadystatechange" function that doesn't know what to do.
What happens if you use XMLHttpRequest's deprecated synchronous mode?
When you call "LoadXMLDoc()", it creates and sends the HTTP request -- and then returns to LiveCode. The result of calling "LoadXMLDoc()" is empty. A bit later, when the HTTP request completes, it calls your "onreadystatechange" function that doesn't know what to do.
What happens if you use XMLHttpRequest's deprecated synchronous mode?
Code: Select all
var request = new XMLHttpRequest();
request.open('GET', '/bar/foo.txt', false); // `false` makes the request synchronous
request.send(null);
if (request.status == 200)
return request.responseText;
else
return "";
LiveCode Open Source Team — @PeterTBBrett — peter.brett@livecode.com
-
- VIP Livecode Opensource Backer
- Posts: 2262
- Joined: Thu Feb 28, 2013 11:52 pm
- Location: Göttingen, DE
Re: External communication
The same result in the console: -1.
I tried an external URI and, in case this is an obstacle, not only from file but also from local server.
Nevertheless:
Communication with the browser via javaScript is a great addition. A big understatement to announce that in a single line!
Thanks a lot for this big progress in the HTML5 builder.
We now only need a few working examples (given time, I'll contribute too).
p.s. Isn't jQuery already contained in the engine? Can we use that?
I tried an external URI and, in case this is an obstacle, not only from file but also from local server.
Nevertheless:
Communication with the browser via javaScript is a great addition. A big understatement to announce that in a single line!
Thanks a lot for this big progress in the HTML5 builder.
We now only need a few working examples (given time, I'll contribute too).
p.s. Isn't jQuery already contained in the engine? Can we use that?
shiftLock happens
Re: External communication
I've drafted a blog post that gives a worked example of using this new capability to manipulate the document surrounding the HTML5 app, and we're currently hoping to publish it tomorrow.
I wonder what's going on with the XMLHttpRequest? This could be a problem for anyone trying to make a liburl backend for HTML5.
I wonder what's going on with the XMLHttpRequest? This could be a problem for anyone trying to make a liburl backend for HTML5.
LiveCode Open Source Team — @PeterTBBrett — peter.brett@livecode.com
-
- VIP Livecode Opensource Backer
- Posts: 2262
- Joined: Thu Feb 28, 2013 11:52 pm
- Location: Göttingen, DE
Re: External communication
There will be less problems to load (for example via jQuery) an extern source, text or image, into a <div>.
If LC is now able to read the contents of such a <div> (text or image) into the standalone, this could be a 'workaround'.
If LC is now able to read the contents of such a <div> (text or image) into the standalone, this could be a 'workaround'.
shiftLock happens
-
- VIP Livecode Opensource Backer
- Posts: 2262
- Joined: Thu Feb 28, 2013 11:52 pm
- Location: Göttingen, DE
Re: External communication
Hi Peter.
Now you posted in LC's blog an example of how to manipulate properties of the canvas by JavaScript.
Fine. I tried to manipulate an element different from the canvas, without success:
Also a very interesting part is the other direction, the possibility to get something from the page (if not from outside) and have it available in the standalone.
I tried several very elementary things, without success, for example:
The standalone works and then crashes (returning -1 in the console).
Even your minimal example from the 9.0.0-dp2 release notes
doesn't work here. Why is 'the result' crashing the standalone?
Now you posted in LC's blog an example of how to manipulate properties of the canvas by JavaScript.
Fine. I tried to manipulate an element different from the canvas, without success:
Code: Select all
put "var MyDiv1 = document.getElementById('DIV1'); " &cr & \
"MyDiv1.innerHTML = 'Hello'; " into js
put js into fld "result"; do js as "JavaScript"
put the result & cr before fld "result"
I tried several very elementary things, without success, for example:
Code: Select all
do "return document.getElementById('DIV1').innerHTML;" as "JavaScript"
put the result into fld "result"
Even your minimal example from the 9.0.0-dp2 release notes
Code: Select all
do "document.title" as "JavaScript"
put the result into fld "result"
shiftLock happens
Re: External communication
This is very interesting -- and somewhat concerning. Does JavaScript evaluation seem to work fine, as long as you are not trying to get a result back?
LiveCode Open Source Team — @PeterTBBrett — peter.brett@livecode.com
-
- VIP Livecode Opensource Backer
- Posts: 2262
- Joined: Thu Feb 28, 2013 11:52 pm
- Location: Göttingen, DE
Re: External communication
Sadly, no. The examples from my last post above don't work at all here whether I'm asking for the result or not.peter-b wrote:Does JavaScript evaluation seem to work fine, as long as you are not trying to get a result back?
[Sorry, for my first answer I was fooled by a browser cache from testing the 'pure' javascript. That's why I repost now.]
shiftLock happens
Re: External communication
Okay, I have done some quick tests locally. Can you please confirm which edition of LiveCode 9 DP 2 you're using?
The following works fine for me (Community edition, Firefox 49.0 running on Fedora 24):
The following works fine for me (Community edition, Firefox 49.0 running on Fedora 24):
Code: Select all
if the platform is "HTML5" then
do "document.title" as "JavaScript"
put the result into field 1
end if
LiveCode Open Source Team — @PeterTBBrett — peter.brett@livecode.com
-
- VIP Livecode Opensource Backer
- Posts: 2262
- Joined: Thu Feb 28, 2013 11:52 pm
- Location: Göttingen, DE
Re: External communication
No success with LC Indy 9.0.0-dp2, Firefox 50.0 or Safari 10.01, MacOS 10.12.1.
I'll try other LC versions and platforms. Perhaps others come also in with their comfigurations and success reports?
I'll try other LC versions and platforms. Perhaps others come also in with their comfigurations and success reports?
shiftLock happens
-
- VIP Livecode Opensource Backer
- Posts: 2262
- Joined: Thu Feb 28, 2013 11:52 pm
- Location: Göttingen, DE
Re: External communication
Peter,
you really owe me a large drink (2017 in Edinburgh).
I have a HTML5 license and _thus_ am one of those, who don't have a working edition.
Hope you have soon time to repair that for the Indy edition.
All my tests from above do work in the Community edition 9.0.0-dp2 (latest Firefox or Safari or Chrome on Mac OS 10.12.1). This opens the world for HTML5 standalones.
GREAT! Thank you so much again.
So for text both directions <div> <--> standalone work as they should!!
Tomorrow I'll start with testing binary data.
@Malte
We certainly have to solve the SCORM problems with external files --- a problem that is probably not solvable by the HTML5 builder.
you really owe me a large drink (2017 in Edinburgh).
I have a HTML5 license and _thus_ am one of those, who don't have a working edition.
Hope you have soon time to repair that for the Indy edition.
All my tests from above do work in the Community edition 9.0.0-dp2 (latest Firefox or Safari or Chrome on Mac OS 10.12.1). This opens the world for HTML5 standalones.
GREAT! Thank you so much again.
So for text both directions <div> <--> standalone work as they should!!
Tomorrow I'll start with testing binary data.
@Malte
We certainly have to solve the SCORM problems with external files --- a problem that is probably not solvable by the HTML5 builder.
shiftLock happens
Re: External communication
I've filed a bug report about the problem:
http://quality.livecode.com/show_bug.cgi?id=18903
http://quality.livecode.com/show_bug.cgi?id=18903
LiveCode Open Source Team — @PeterTBBrett — peter.brett@livecode.com
-
- VIP Livecode Opensource Backer
- Posts: 2262
- Joined: Thu Feb 28, 2013 11:52 pm
- Location: Göttingen, DE
Re: External communication
Here two simplest of simple examples for those who don't know JS/HTML (and don't want/have to learn it). Just to see the interaction 'in principle'.
[1] Make a new stack, name it "javaScriptTest",
add 2 buttons and 1 field.
[2] Name one button "setDiv" and script it
[3] Name the other button "getDiv" and script it
[4] Compile the HTML5 standalone. Open the generated file javaScriptTest.html with a text editor and add near the end of it, just before "</body></html>", the line
[5] Open the file javaScriptTest.html in your browser (latest Safari or Firefox; latest Chrome and Opera work also but need a running local webserver).
[6] Now watch the text at bottomleft of the JS console and the field, and click the buttons.
[1] Make a new stack, name it "javaScriptTest",
add 2 buttons and 1 field.
[2] Name one button "setDiv" and script it
Code: Select all
-- document.getElementById('DIV1').innerHTML = 'HereComesTheSun';
on mouseUp
put the internet date into fu
put line 1 of the script of me into js
replace "-- " with empty in js
replace "HereComesTheSun" with fu in js
put js into fld 1; do js as "javaScript"
end mouseUp
Code: Select all
-- document.getElementById('DIV1').innerHTML;
on mouseUp
put line 1 of the script of me into js
replace "-- " with empty in js
put js into fld 1; do js as "javaScript"
put the result & cr before fld 1
end mouseUp
Code: Select all
<div id='DIV1'>iAmTheWalrus</div>
[6] Now watch the text at bottomleft of the JS console and the field, and click the buttons.
shiftLock happens