Author Topic: Javascript access to widget functions  (Read 4703 times)

jason

  • Administrator
  • Hero Member
  • *****
  • Posts: 502
    • ioBridge.com
Javascript access to widget functions
« on: December 31, 2008, 03:09:50 AM »
We're working on a few javascript functions to give you control over your widgets.

To make the following functions work, the widget must be loaded on the webpage first (but it can be hidden, if you want)

If you want to 'execute' a widget's function in javascript, you can now use the widgetExecute function.  Use this for servo positions and X10 commands.

widgetExecute(XXXX) where XXXX is the widget ID

If you want to set the state of a digital output widget in javascript, you can now use the widgetSetState function.

widgetSetState(XXXX,Y) where XXXX is the widget ID and Y is either 0 or 1

Here is an example of using the widgetSetState function to create a pulse of a specific length on digital output pin.

I first needed to create a digital output widget with the ID of Q6Vs3RepsH6I.

Code: [Select]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Pulser</title>

<script type="text/javascript">

function Pulse(WidgetID, PulseDirection, Milliseconds){
   var date = new Date();
   var curDate = null;

   if (PulseDirection==0){

      widgetSetState(WidgetID, 0);
   
      do { curDate = new Date(); }
      while(curDate-date < Milliseconds);

      widgetSetState(WidgetID, 1);}

   else {

      widgetSetState(WidgetID, 1);
   
      do { curDate = new Date(); }
      while(curDate-date < Milliseconds);

      widgetSetState(WidgetID, 0);}     

}</script>

</head>
<body>

<a onClick="Pulse('Q6Vs3RepsH6I',1,2000)">Positive Going Pulse</a>
<br>
<br>
<a onClick="Pulse('Q6Vs3RepsH6I',0,2000)">Negative Going Pulse</a>

<div id="ioWidgets" style="display:none;">
<script type="text/javascript">document.write(unescape("%3Cscript src='" + "http://www.iobridge.com/widgets/io.js?Q6Vs3RepsH6I' type='text/javascript'%3E%3C/script%3E"));</script>
</div>

</body>
</html>

Here I made a function called Pulse which gets passed the widget ID, the pulse direction and the length of the pulse in milliseconds.  When called, it sets the first state, waits for the time specified and then sets the second state.

There is also another function that will grab the data from a widget. It is widgetGetValue.

widgetGetValue(XXXX) where XXXX is the widget ID

It's important to note that this function will only give you the data from the widget and not the module directly. The widget will need to be set to auto-refresh if you expect to get new values in subsequent calls.  If you need to get data directly from the module, use the Data Feed API.


We'll be releasing some proper documentation soon, but this should get you started!

« Last Edit: January 28, 2009, 11:53:36 PM by jason »
Jason Winters
ioBridge Developer

iobridge

  • Administrator
  • Hero Member
  • *****
  • Posts: 669
    • ioBridge Support
Re: Javascript access to widget functions
« Reply #1 on: December 31, 2008, 11:06:24 AM »
The widget ID is the string at the end of the widget code:

Code: [Select]
http://www.iobridge.com/widgets/io.js?Q6Vs3RepsH6I
                                      ------------

Q6Vs3RepsH6I is the Widget ID for the above widget.
ioBridge Support
Community Team

mrb1090

  • Newbie
  • *
  • Posts: 4
Re: Javascript access to widget functions
« Reply #2 on: January 01, 2009, 02:16:26 PM »
Thanks Jason,

Curious, to control the relay module would you use the widgetSetState or widgetExecute function?

Happy New Year,

Mike B.

jason

  • Administrator
  • Hero Member
  • *****
  • Posts: 502
    • ioBridge.com
Re: Javascript access to widget functions
« Reply #3 on: January 01, 2009, 04:14:17 PM »
Since a relay is controlled with a digital output, the widgetSetState function is the one to use.
Jason Winters
ioBridge Developer

thecapacity

  • Newbie
  • *
  • Posts: 15
    • My Blog
Re: Javascript access to widget functions
« Reply #4 on: January 10, 2009, 07:22:23 AM »
Jason,
You mention setstate should be 0 or 1 but what about for a Variable Servo Position Control Widget?

iobridge

  • Administrator
  • Hero Member
  • *****
  • Posts: 669
    • ioBridge Support
Re: Javascript access to widget functions
« Reply #5 on: March 02, 2009, 08:47:37 PM »
Here is some more detail on using JavaScript to control the widgets:

http://www.iobridge.net/wiki/api/javascript-widget-control-api
ioBridge Support
Community Team