Web page, Yocto-Visualization, and actuators (continued)

Three weeks ago, we showed you how to integrate code on a web page that manages Yoctopuce actuators while using Yocto-Visualization (for web). But there was one limitation: we couldn't use the DeviceArrival and DeviceRemoval callbacks because they were already used by Yocto-Visualization (for web), so the code was a bit rickety when it came to checking whether the actuators concerned were connected or not. As this was a bit of a problem for us, we've slightly improved Yocto-Visualization (for web)...

Arrival and Removal callbacks in YWebPage

YWebPage is the static class that describes the Yocto-Visualization (for web) instance. We've added to it RegisterDeviceArrivalCallback and RegisterDeviceRemovalCallback functions, which behave exactly like those in YAPI. When you use them, Yocto-Visualization (for web) first does its work on the modules concerned, then calls your callback. So, if we go back to our Init function, we can get rid of the dreadful testRelay() function and register our callbacks instead.

 async function init()

 {

    if (await YAPI.InitAPI(YAPI.DETECT_NONE,errmsg) == YAPI.SUCCESS)

     {

        relay = YRelay.FindRelay("ONOFF");

        input.disabled = !(await relay.isOnline());

        input.addEventListener('change', inputChanged)

        relay.registerValueCallback(relayStateChanged)

        YWebPage.RegisterDeviceArrivalCallback(arrival);

        YWebPage.RegisterDeviceRemovalCallback(removal);

     } else document.write(errmsg.msg);

}

Note that to make the YWebPage class accessible, you must remember to add it to the list of imports

import {YAPI,YErrorMsg,YWebPage} from "./yv4web-full.min.js";

Usage

So we replace our testRelay() function with the processing of our two callbacks. Here's a little trick we've probably never told you about, even though we often use it in our own programs. We're trying to find out when our "ONOFF" relay is connected, but the callback parameter is of type YModule. This is epected, since the callback is used to warn of the arrival of a module. So how do we know if our relay is one of them? Answer: by using the functions

you can easily write code that finds a module function based on its type and name. For example, the function below returns the full hardware name of a function if it finds a function of type ftype, named fname in a module. fname can just as easily be a logical name as a hardware name.

async function findFunction(m, ftype, fname)

 {

   for (var i=0;i< await m.functionCount();i++)

    {

      if (await m.functionType(i)==ftype)

      {

        if (await m.functionName(i)==fname) // test logical name

          return await m.get_serialNumber()+". "+ await m.functionId(i);

        if (await m.functionId(i)==fname) // test hardware name

          return await m.get_serialNumber()+". "+ await m.functionId(i);

      }

    }

   return "";

 }

We now have all the building blocks we need to cleanly manage the connection and disconnection of our relay using callbacks.

async function arrival(m)

 {

   if (await findFunction(m, "Relay", "ONOFF") != "") input.disabled =false;

 }

async function removal(m)

 {

   if (!await relay.isOnline()) input.disabled =true;

 }

You'll find the full code here, but for it to work, you'll need version 56436 or later of Yocto-Visualization (for web).

That's all for this week. If you'd like to know more about the little secrets of Yocto-Visualization (for web), here's a list of links to help you delve deeper.