Passing arguments to Javascript from Livecode

[GSA_DC]

Hi.

This isn't really iOS specific - but it is mobile-specific - I just happen to be developing an iOS app and I've come across it. My question is very simple and n00b, but it's driving me mental.

All I want to do is pass some arguments to a Javascript function. I am trying to do some work with Google Maps and I want to pass a series of latitude and longitude parameters to a Javascript function which creates a marker at this point. Here is where I am with it:

LIVECODE

Code: Select all

// Some random values for lat and lng meantime...
put random(360)-180 into lat
put random(180)-90 into lng
// Call Javascript function and pass lat lng as arguments (doesn't work)
MobileControlDo browserID, "execute", "setMarkerAt( lat, lng )"

JAVASCRIPT

Code: Select all

function setMarkerAt(lat, lng){
var markerPos=new google.maps.LatLng(lat, lng);
var marker=new google.maps.Marker({
  position:markerPos,
map:map,
  });
marker.setMap(map);
}

I can pass explicit numbers in the call to the function, but the variables don't get evaluated and are meaningless. So I'm thinking it's to do with the formatting of the script part of the function call. Can anyone help me?

Kind regards, Paul.

[Klaus]

Hi Paul,

you are passing the STRINGS "lat" and "lang" and not their values!

Try this:
...
MobileControlDo browserID, "execute", ("setMarkerAt(" && lat & "," & lng & ")")
...

Best

Klaus

[GSA_DC]

Yes indeed. Sorted. Thanks!

MobileControlDo browserID, "execute", ("setMarkerAt(" && lat & "," & lng & ")")

Wrapping the script parameter in parentheses was where I was going wrong.

[okk]

Hi,
just a silly question. Can something similar be achieved in the MacOSX desktop environment?

Thanks.

[okk]

Hi Paul,
would you be able to share your code in more detail? I tried to replicate your example on android, but when I execute:

Code: Select all

MobileControlDo browserID, "execute", ("setMarkerAt(" && lat & "," & lng & ")")

my app gets stuck. What I try to achieve is that user clicks a button of my app called "BERLIN" the map is re-centred to the coordinates of Berlin and a Marker is drawn. When user clicks a button "HELSINKI" the map re-centres at the coordinates of Helsinki etc. I have difficulties to pass the coordinates into the javascript. Thanks for any advice.

Oliver

[GSA_DC]

Just saw this - sorry! I bet it's way too late but anyways...

I call it from Livecode like this:

Code: Select all

      put specialFolderPath("engine") & "/billboards.csv" into pathToFile
      put url ("file:" & pathToFile) into tContents
      put tContents into lContents // make a copy of this data to memory for accessing when doing proximity checking
      -- set the itemDelimiter to tab -- if necessary
      repeat for each line tLine in tContents
         put item 14 of tLine into lat
         put item 13 of tLine into lng
          // Call Javascript function within the loaded map HTML page
         MobileControlDo browserID, "execute", ("setMarkerAt(" && lat & "," & lng & ")")
      end repeat

I create a Javascript function:

Code: Select all

    function setMarkerAt(lat, lng){
      var markerPos=new google.maps.LatLng(lat, lng);
      var marker=new google.maps.Marker({
        position:markerPos,
        map:map,
        });
      marker.setMap(map);
     }

Hope this helps!

I have a problem now in getting clicked markers sending messages (their name or identifier) back to Livecode! Any idea?

Kind regards, Paul.

[okk]

Thanks for posting. It's always helpful. I hope somebody can assist you with getting the clicked marker info back to livecode. I wonder if the new browser widget is changing the way livecode interacts with Google maps etc.

[rmuzzini]

I have a problem now in getting clicked markers sending messages (their name or identifier) back to Livecode! Any idea?

Kind regards, Paul.

i'm afraid you can't invoke lc from javascript.
but you can write a js function and invoke it from lc periodically (every 500 millisecs?) to get data back.
try this (just an idea):
/*LC card handlers*/

Code: Select all

local sBrowserId //your browser instance id
local sDataFromJs //a local to store data back from js, if needed
local sMessageID //a local to delete the sent message on closing card
constant kDelay = 500 //millisecs!

on letsStart
   sendData "writeTracking", "myData"
   send "checkData" to me in kDelay millisecs
   put the result into sIDMessage
end letsStart

command checkData
   put getData("readTracking()") into sDataFromJs
   if sDataFromJs is not empty then
      doMyStuff
   end if
   send "checkData" to me in kDelay millisecs //or not, if sDataFromJs <> empty and you're already happy
   put the result into sIDMessage
end checkData

command sendData pFunction, pMsg
   local tResult
   //i.e. string pFunction = "writeTracking", a js function ; string pMsg = the data to send, ex.: "data1||data2||data3"
   if sBrowserId is not an integer then exit sendData
   if environment() = "mobile" then
      //run js script to send data
      mobileControlDo sBrowserId, "execute", pFunction & "('" & pMsg & "')"
      put the result into tResult
   else
      get revBrowserExecuteScript(sBrowserId, pFunction & "('" & pMsg & "')")
      //or
      //get revBrowserCallScript(sBrowserId, pFunction, pMsg)
      put it into tResult
   end if
   //eventualy check tResult for error code, if provided
end sendData

function getData pFunction
   local tResult
   //i.e. string pFunction = "readTracking()" , a js function returning data
   if sBrowserId is not an integer then exit getData
   if environment() = "mobile" then
      //run js script to get data back
      mobileControlDo sBrowserId, "execute", pFunction
      put the result into tResult
   else
      //run js script to get data back
      get revBrowserExecuteScript(sBrowserId, "result="& pFunction)
      put it into tResult
   end if
   return tResult
end getData

on closeCard
   if "checkData" is in the pendingmessages then delete sMessageID
end closeCard

/*JAVASCRIPT STUFF */

Code: Select all

function readTracking() {
	//send data
	var tracking = '<the data you stored somewhere waiting for the LC request>'; 		
	return tracking;		
}

function writeTracking(tracking) {
	//get data	
	var tracking = tracking.split('||');
	track_data1 = tracking[0].split(',');
	track_data2 = tracking[1].split(',');
	track_data3 = tracking[2].split(',');
	/*and so on…*/
	/*do your stuff*/
	return '<good|bad status code>';
}

better ideas are welcome, of course. as usual.
regards.

[LCNeil]

It is somewhat possible to execute LC from JS by registering a Javascript Handler within your app

Please see the attached stack where a marker can be clicked on a google map. This then executes the appropriate LC scripts which displays an answer dialog and navigates to another card.

Example.livecode.zip

(2.17 KiB) Downloaded 498 times

Kind Regards,

Neil Roger
--
LiveCode Support Team ~ http://www.livecode.com
--

[rmuzzini]

neat, indeed…
[btw, i never heard of revBrowserAddJavaScriptHander… sic! pretty simple, and simpler than the method i used for years… :->]

[tomcam]

Neil, thanks for that Example.livecode stack showing how to call LC from a Javascript function. I downloaded it, it works great--and I can't for the life of me figure out where the Javascript code is and how you attached it to the widget. Clearly something's happening because you have to click a pin on the map for this to work, but you commented out all the old-style revBrowser calls. Where can I find that Javascript you injected?

[rmuzzini]

Where can I find that Javascript you injected?

it's the stack custom property "cHTML"
look at the "setWidget" button script.

[rmuzzini]

It is somewhat possible to execute LC from JS by registering a Javascript Handler within your app

Please see the attached stack where a marker can be clicked on a google map. This then executes the appropriate LC scripts which displays an answer dialog and navigates to another card.

--

At a second glance, i changed my mind: this works for desktop only (like the old "revBrowserAddJavaScriptHandler").
on iPad, both on simulator and real device) it happens to work 1 time each 10. i mean: i keep on tapping on the marker, but just 1 time the LC handler was called. i never had that luck a second time. i close the app, reopen it, no way. i made a new html page with a (very) big button, just to be sure and: nothing, nada, rien. on desktop, working well. on iPad: unreliable.

tried with LC 8.1 DP3 on iOS 9.3.5.

[JonathanLynch]

Has the ability to send data from JavaScript to livecode in iOS been resolved? I think this is an essential requirement for a working browser object.