HC3 QuickApps coding - tips and tricks

[Martin F. 0]

On 1/7/2024 at 1:45 AM, Juzio999 said:

thx, it didn't help, but i noticed is that it returns such "unformated" strings for my curtain motor devices, but for some other the sniffer (same QAPP) returns the expected dps codes. So it seems that for some devices commands are coded diffrently. I hope it helps somebody.. 

I had a similar problem. I had the IP address swapped for two curtain motor devices.

[jgab 1,983]

So the capricious QA UI view is not always easy to understand....

Ex. If we have a slider where we can change a value between 0-100.

Then we also have a button that sets the same slider to the value 50 with self:updateView('slider','value','50')

 

The problem is:

1. We press button, slide sets to 50

2. We move the slider to another value, ex 25

3. We press the button again to reset the slider value to 50, nothing happens.

 

The reason seems to be that self:updateView maintains some sort of cache so if we call self:updateView with the same values for an UI element it will not update.

Which probably makes sense, as we don't want to call out to update the Web/App UI unnecessarily...

However, when we manipulate elements like the slider in the webUI it doesn't seem to update the cache, so when we press the button the second time and call self:updateView('slider','value','50') it thinks the value is already 50 and don't update the Web/App UI...

 

We could code around that by making sure that the onReleased function for the slider called self:updateView('slider','value',tostring(ev.values[1])), because that would update the cache with the new value.

With the new UI elements, select and switch, we seem to have the same problem. But even more as the switch has issues updating itself (toggle) without help...

 

So, a generalised fix for (some of) the issues is to add the code below to the QA (while we wait for Fibaro to fix it properly).

For the UI elements that can change state we call self:updateView to make sure that the QA and the UI are in sync.

For the switch it also seems to fix the Web dashboard glitch that the switch doesn't toggle.

Haven't tested the Yubi app UI.

Please login or register to see this code.

 

Issues that still remain:

-select and switch in the QA builder view isn't updated with self:updateView (or they seem to be updated but the builder view don't update).

Edited January 13 by jgab
Forgot to initialise variable 'typ'

[Juzio999 0]

On 9/7/2023 at 4:35 PM, tinman said:

 

TUYA app itself connects first over clound, and if device is in local network it does swich do local. My implementation is pure local only. Both local and cloud way shows the status of the device, as long the device is mains powered wifi device. For zigbee/thread one need "hub between", same for battery powered devcies, the "hub between" collects all the data and one can get the status of them from there (and of course control those which can be controlled)

maybe it will help the others, maybe you will be able to adjust the sniffer: i noticed that in case of gateway hub (needed for bluetooth devices) there is addtional parameter needed in any request: CID. And when you ask with the devID and devKey of the gatewate CID is the UID of the bluetooth device (connected to gateway, to be taken also from tuya IOT). I tried first different commbinations with the gwID and devID (and UID & devKey) and only when i added CID to payload I could get the proper DP_Query response. And this would be prefectly fine however I still can't make any commands. I know what DPS to use and I tried with CID but still the command didn't work (no effect)

 

I tried the node-red integration with tuya (and communicate with Fibaro over rest API) and this works for me (and I could send succefully processed commands to gateway) with devID/devKey of gateway but node-red is not stable for me. However what I can share is the msg payload before conversion:  "operation": "set", dps: "number", "set": "operation like true or open", "t":"timestamp", "cid":"cid" with devKey and devID and IP of the gateway (all three).

 

 

[jgab 1,983]

Here is a QA that carries with it its own icons (in code) and install them at startup.

2 icons included, 128x128 in B&W takes ~1kb each. Icon data hex coded.

If you run a desktop Lua environment you can use this to generate the hex code for a png

Please login or register to see this code.

Some additional clever housekeeping is probably needed to not install icons already installed.

If one , like in the example, has the icons defined in a separate QA file, the file could be deleted after the icons are installed, thus saving space.

Note, different types of devices needs different number of icons - binarySwitch like in the example needs 2.

WebUI needs to be refreshed after loaded.

Could probably be evolved to a QA that installs icons for other QAs...

Please login or register to see this attachment.

Improvements appreciated...

 

Edited January 22 by jgab

[jgab 1,983]

So, alternatively, this could work.

create a QA file named 'icons'

Please login or register to see this code.

At startup this will install the icons and then remove the QA file and restart. Kind of an automatic way to install icons at installation - and remove any trace of the icon data...

 

Edited January 23 by jgab
delete file needs to be done in callback....

[tinman 1,025]

On 1/15/2024 at 12:11 AM, Juzio999 said:

maybe it will help the others, maybe you will be able to adjust the sniffer:

 

tuya sniffer is generic thing

 

On 1/15/2024 at 12:11 AM, Juzio999 said:

i noticed that in case of gateway hub (needed for bluetooth devices) there is addtional parameter needed in any request: CID. And when you ask with the devID and devKey of the gatewate CID is the UID of the bluetooth device (connected to gateway, to be taken also from tuya IOT).

 

that's right, for all kind of devices connected to gateway one need to specify the gw and cid

 

On 1/15/2024 at 12:11 AM, Juzio999 said:

 

I tried first different commbinations with the gwID and devID (and UID & devKey) and only when i added CID to payload I could get the proper DP_Query response. And this would be prefectly fine however I still can't make any commands. I know what DPS to use and I tried with CID but still the command didn't work (no effect)

 

that actually should work, played in the past with tuya wifi gw and devices sonnected to it. Can't test it now, don't have TUYA wifi gw anymore

 

[Juzio999 0]

On 8/28/2022 at 1:09 AM, tinman said:

 

TUYA over cloud is nice (easier to recognize device type/class), however i prefer to use local access. Attached TUYA QuickApp, for Näve Divora (Wisdom) lamps (CW/WW) and NEO Smart Bulb RGBW E27 (RGBW-WW).

 

For local access you need the obtain the key and id from your device, so the "long way" over tuya dev portal, free account and dev local_key readout over web console is necessary.

The good thing about tuya, once you get these keys, your subsripton can expire, the local_key never expires once generated and stored on device (whch happens during registration of device in the app itself).

 

I will post soon other tuya QuickApps, and cloud maual (updated, that picture below is year old or so), but for now for these who knows how to use (or who wish to cry about my code hehe).

 

 

Please login or register to see this link.

 

Please login or register to see this attachment.

 

Please login or register to see this attachment.

 

 

 

 

EDIT: this is really dirty implementation, but of course working. The best way to work with TUYA is to read device template / information over cloud api, filter the included classes, types and conversions, assign then matching BUI element and create such child QA. But that means, one need still, at leat at time of creation, cloud acces, and when this is offline, one would be unable to create anything. So my implementation (wrote some of them for tuya) is always hardcoded for specific device, lot of them will match one of the other QA, but for others one need to change part of the code.

 

EDIT2: When trying to implement / change the QuickAps above, to support your specific tuya device, you might use the attached tuya sniffer:

 

Please login or register to see this attachment.

 

How to use it:

- instal the sniffer QA

- ensure non of your mobile devices has TUYA app opened, if so, close them

- set IP, device id and device key and save

- disable wifi ony you mobile device, open the TUYA app (TUYA can handle only ONE connection locally, that's why)

- click on "connect" button from this QuickApp (if the QuickApp is crashing, won't connect, click few times on disconect, and try again to connect)

- click / select this you wish to sniff, e.g. you wish to know what need to be send to turn light on, cick "On" in the TUYA app

- watch the console window on your HC3, you should see some messages:

 

-- CB: 9 CMD: HEART_BEAT -> these are just "pings", the QuickApp need to ping the TUYA device from time to time

-- CB: 10 CMD: DP_QUERY -> these are queries, showing your TUYA device current state, e.g.

 

 {"dps":{"23":736,"20":true,"22":467,"21":"white"},"devId":"f4326db31e606356632c"}

 

dps -> is command set, it contains number:value, where number is the TUYA command and value the current value

from above this means, TUYA command 23 is set to 736, 20 to true, 22 to 467, 21 to "white". From developer portal you might check what these command are representing, 20 is on/off, 23 (in this class) warm/cold white value * 10, 22 is brightness * 10 and so on. However, there is as well bit older set, e.g. 1 is o/off, 2 is mode, 3 is intensity/level of 2, etc. So  just don't worry if the QuickApp is showing different things as you might expect from API docummentation (you simply reading wrong one).

 

devID: is your TUYA device id

 

-- CB: 8 CMD: STATUS, followed by e.g.

 

  {"t":1665264639,"dps":{"20":false},"devId":"f4326db31e606356632c"}

 

t is unix time timestamp, dps is again TUYA command, which the sniffer have seen while you did something in the TUYA app. In this case i turned light off

devID: is your TUYA device id

 

These TUYA command are of course defined in TUYA API, one might get crazy however if the device is combination of two or more devices, e.g. ceiling fan with light - the turn on/off is for the major device, ceiling fan, not for light But as said above, with the sniffer one can check every function within few minutes.

 

Having all the TUYA command (and values) information it's easy to wrie own function, e.g

 

local chandata = {
                ['20'] = true
        }

self:sendCommand(chandata)

 

will send TUYA Command 20 with value "true"

 

You might see other CBx CMD:yyy messages as well, they are more or less docummented on TUYA dev page (or in the QuickApp itself, tuyaAPI file)

 

 

 

 

 

 

 

 

I see that 

Please login or register to see this link.

 handles also tuya protocol version 3.4, any chance that the tuya sniffer could be enhanced with this (what i'd very appreciate)

 

As i can see there is not a lot of changes but significant, different payload, different encoding....(I cant port this to lua) 

 

Thx

 

 

 

 

 

 

 

Edited February 14 by Juzio999

[Christb 9]

On 4/22/2023 at 2:51 PM, jgab said:

Here is a way to have better format control over label text.

We can add to this with a generic table template

Please login or register to see this code.

 

It creates a template with tags that makes it quick and easy to modify text or attributes in the table and update our label....

Please login or register to see this link.

Here is a <

Please login or register to see this link.

> to HTML4 table and tags.

I have used your class 'Table' to create a table to describe which buttons was just pressed and all OK.
Therefor it seems that in "tab2" definition the attribute "bordercolor"=red does not work; I also tried the "bgcolor=red" attribute without success.

Is there a way to change the color of the borders and the background?

Edited February 24 by Christb

[jgab 1,983]

13 hours ago, Christb said:

I have used your class 'Table' to create a table to describe which buttons was just pressed and all OK.
Therefor it seems that in "tab2" definition the attribute "bordercolor"=red does not work; I also tried the "bgcolor=red" attribute without success.

Is there a way to change the color of the borders and the background?

bordercolor does not seem to work. bgcolor do work - at least in the web UI.

[Christb 9]

43 minutes ago, jgab said:

bordercolor does not seem to work. bgcolor do work - at least in the web UI.

Yes I have been able to change background color of one cell - I was not using the right position of the "bgcolor=#39f83c" attribute for the cell: now OK for PC and Old application in Old view.😀 

 

 

[petrkl12 206]

In case that you need to change your QA layout in mobile app and web UI to Fibaro Old UI Style:

Please login or register to see this code.

 

Edited February 25 by petrkl12

[Christb 9]

2 hours ago, petrkl12 said:

In case that you need to change your QA layout in mobile app and web UI to Fibaro Old UI Style:

Please login or register to see this code.

 

Dear petrkl12@, how and where are you able to find such informations?

Edited February 25 by Christb

[petrkl12 206]

combination of testing mobile app and changing of params in HC3

 

[jgab 1,983]

This is the easiest way to display "dynamic" graphics in the Web UI - 

With the Yubii app 2.02 it kind of works with "Use the new views in mobile application" unticked.

 

Anyway, the code is not finished yet and help to improve is welcome.

 

(Moving the sliders change colors of dots and values in text boxes)

Please login or register to see this image.

/monthly_2024_02/image.png.69084fe0085fbe2bda2ce4a015aa2de1.png" />

 

Because we can display inline SVG graphics now.

This is how the code looks like to display the map above and animate the values. (excluding the SVG library and the inline house map)

Please login or register to see this code.

Here is the fqa.

Please login or register to see this attachment.

 

Because how it's done we can't load external pictures - they all need to be inline in the code (it's a security thing)

The housemap is a png inline and takes some space, but if it was a svg it wouldn't take much space.

 

If we were allowed to display SVG object the easy way with just the <svg> tag, the sky would be the limits....  

Edited February 28 by jgab

[Christb 9]

12 hours ago, jgab said:

Please login or register to see this code.

Dear JGAB, again a super QA helping us to learn.

What type of tool are you using to get the relative positions of the "tempPos" and "indPos" into background image??

[jgab 1,983]

33 minutes ago, Christb said:

Dear JGAB, again a super QA helping us to learn.

What type of tool are you using to get the relative positions of the "tempPos" and "indPos" into background image??

None, I was shooting from the hip  
I guess it would be easy to lay an SVG coordinate system over the image?

[jgab 1,983]

15 minutes ago, jgab said:

None, I was shooting from the hip  
I guess it would be easy to lay an SVG coordinate system over the image?

This adds a coordinate system to the image step 50... Need to add as last element so it sits on top of the rest of the image

Please login or register to see this code.

 

[Christb 9]

2 hours ago, jgab said:

Please login or register to see this code.

I am getting this error at launch in the hC3 QA :

[QUICKAPP523]: QuickApp crashed[28.02.2024] [11:47:00] [ERROR] [QUICKAPP523]: svg.lua:1: attempt to call a nil value (global 'Group')

Do I have to define Group{} first?

 

Btw, I have loaded in VScode your my 3 QA files with the changes and all is working perfectly, I have the grid dispayed as below.

Please login or register to see this image.

/monthly_2024_02/image.png.82dd6921ee802f8d5a2b0714f66adef2.png" />

Edited February 28 by Christb

[jgab 1,983]

2 hours ago, Christb said:

I am getting this error at launch in the hC3 QA :

[QUICKAPP523]: QuickApp crashed[28.02.2024] [11:47:00] [ERROR] [QUICKAPP523]: svg.lua:1: attempt to call a nil value (global 'Group')

Do I have to define Group{} first?

Group is a "global" function defined in another QA file.

You need to create the Group (raster) inside

function QuickApp:createMap()

[Christb 9]

4 hours ago, jgab said:

Group is a "global" function defined in another QA file.

You need to create the Group (raster) inside

function QuickApp:createMap()

Yes, Group is there... and im.root:add(raster) in QuickApp:createMap().

What is very strange: to get back to the original QA, I put in comment --[[ ]] -- all added lines and save but I still got the error about local raster = Group{}.

So I did supress all the lines added for creation  of the grid, save and I get back the QA working without the grid (expected).

I wrote the new lines at the same places than before and Miracle! it is now working.

How this can happen? HC3 keeping in memory the last entry☹️?

 

I will try to make smaller grid to be more precise for positionning info and I will also try to have doted lines for the grid; will let you know if I succeed.