Jump to content

Welcome to Smart Home Forum by FIBARO

Dear Guest,

 

as you can notice parts of Smart Home Forum by FIBARO is not available for you. You have to register in order to view all content and post in our community. Don't worry! Registration is a simple free process that requires minimal information for you to sign up. Become a part of of Smart Home Forum by FIBARO by creating an account.

 

As a member you can:

  •     Start new topics and reply to others
  •     Follow topics and users to get email updates
  •     Get your own profile page and make new friends
  •     Send personal messages
  •     ... and learn a lot about our system!

 

Regards,

Smart Home Forum by FIBARO Team


HC3 QuickApps coding - tips and tricks


jgab

Recommended Posts

  • Topic Author
  • Here is code that creates 2 funky QuickApp UIs on your HC3, "My Test1" and "My Test2"  (uses fibaroapiHC3.lua v0.44, needs HC3 credentials to be configured)

    Still some issue how to get images to scale/fit the layout.

    Please login or register to see this code.

     

    Edited by jgab
    • Thanks 2
    Link to comment
    Share on other sites

    14 hours ago, jgab said:

    I am looking to write to the space under the QuickApp name in Dashboard View

     

    From Krikroff

     

    Please login or register to see this code.

     

    • Thanks 3
    Link to comment
    Share on other sites

    I've been playing a bit with this 

     

    If you download the fqa and open it in an editor it's 'flat' as you would expect

    Please login or register to see this code.

     

    If you use json pretty print to make it more readable

    Please login or register to see this code.

     

    you can modify and upload the "pretty" version and it will upload oka

    It does perform some validation on upload so if you 'break' the json formatting it will give you an error and wont upload

     

    This is good news as it seems we can manipulate the 'layout" and re-upload - but the question is how much can we modify it 

     

    I created a simple QD with 1 button, I slider and 1 label that I have been trying to modify

    There appears to be one "components" section per QD line (and a control call back lower down) but I've had no luck modifying the width of the controls 

    The components seems have 3 parts

    1 - The control itself (button, slider, etc)

    2 - Looks like 'padding"

    3 - not sure 

    Please login or register to see this image.

    /monthly_2020_03/image.png.4f9834dcceb47f0d6cb1bd02bae71e7c.png" />

    Looking at the height

    For 3 horizontal controls this is  normally 150 (px, I assume) 

    changing it to 250 spreads the controls equally in a vertical direction giving this 

    (QD fqa attached)

     

    image.png.99cdf6f416875e4b53f65366ae7cb3fd.png

     

    I'll post any other success I have 

     

     

    Please login or register to see this attachment.

    Link to comment
    Share on other sites

    I managed to create a button and a slider on one row (issue with vertical alignment

    Please login or register to see this image.

    /monthly_2020_03/image.png.3ffcde0ddd14a6f8311ec5736742606b.png" />

     

    and a button and a label on one row

     

    image.png.3d8697f4c04f1f615077f96cc60748af.png

     

     

    Respective qfa files attached 

     

     

     

    Please login or register to see this attachment.

    Please login or register to see this attachment.

    • Like 1
    Link to comment
    Share on other sites

  • Topic Author
  • On 3/2/2020 at 10:06 AM, AutoFrank said:

    I've been playing a bit with this 

     

    If you download the fqa and open it in an editor it's 'flat' as you would expect

    If you use json pretty print to make it more readabl

     

    you can modify and upload the "pretty" version and it will upload oka

    It does perform some validation on upload so if you 'break' the json formatting it will give you an error and wont upload

     

    This is good news as it seems we can manipulate the 'layout" and re-upload - but the question is how much can we modify it 

     

    I created a simple QD with 1 button, I slider and 1 label that I have been trying to modify

    There appears to be one "components" section per QD line (and a control call back lower down) but I've had no luck modifying the width of the controls 

    The components seems have 3 parts

    1 - The control itself (button, slider, etc)

    2 - Looks like 'padding"

    3 - not sure 

    Looking at the height

    For 3 horizontal controls this is  normally 150 (px, I assume) 

    changing it to 250 spreads the controls equally in a vertical direction giving this 

    (QD fqa attached)

     

    I'll post any other success I have 

    Please login or register to see this attachment.

     

    So, I spent a lot of time in a json-formatter to decode the format allowing me to write the hc3_emulator.createQuickApp code :-) 

    So, to cram in an image (or a larger image), we would like to have one horizontal row being larger than the others - haven't figured out how to do that. The example I posted previously still cut the cat in half. Even if I do just one row and the total height like 200 - 400.

    Edited by jgab
    Link to comment
    Share on other sites

    There may be a much easier way to do this and hopefully there is, but this is what  did

     

    I started with a 2 button generic QA

    and I noticed that there was embedded 'components' section

     

    Please login or register to see this image.

    /monthly_2020_03/image.png.7d27a93f7ccd0e3e6bd8e0e6a54f7e6b.png" />

     

    I then collapsed the formattng a bit and could see the tags that represented a control

     

    image.png.1ab51c35d2896787e5d3803571eec466.png

     

    I then replaced the second button wth the equivalent for a label or a slider

    Please login or register to see this code.

    Please login or register to see this code.

    Saved the fqa and re-uploaded

     

    I'm sure we can build on this approach to create other configurations

     

     

    Link to comment
    Share on other sites

  • Topic Author
  • 11 hours ago, tinman said:

    Please login or register to see this code.

    hmm, it must be possible to modify properties.viewLayout

     

    We can add and remove UI elements in the QuickApp editor and re-save the QuickApp - and I would assume they call some /api to re-save the QuickApp - or the viewLayout. So it must be out there somewhere :-)

     

    Link to comment
    Share on other sites

    1 minute ago, jgab said:

    We can add and remove UI elements in the QuickApp editor and re-save the QuickApp - and I would assume they call some /api to re-save the QuickApp - or the viewLayout. So it must be out there somewhere :-)

     

    I agree,

    I haven't had a chance to look at the "interfaces" yet , but maybe the answer is there somewhere

    Link to comment
    Share on other sites

  • Topic Author
  • On 3/2/2020 at 10:43 AM, AutoFrank said:

    There may be a much easier way to do this and hopefully there is, but this is what  did

     

    Yes, to evolve the hc3_emulator.createQuickApp() code that I started with. Much easier format than hacking the std viewLayout.

    As soon as I figure out how to update the viewLayout on an existing QA it is easily transformed to a hc3_emulator.updateViewLayout() function

    Edited by jgab
    • Thanks 1
    Link to comment
    Share on other sites

    2 minutes ago, jgab said:

    Yes, to evolve the fibaro._createQuickApp() code that I started with. Much easier format than hacking the std viewLayout

    yes, what I did was an terrible hack ??

    Link to comment
    Share on other sites

  • Topic Author
  • On 3/2/2020 at 10:51 AM, AutoFrank said:

    yes, what I did was an terrible hack ??

    The other reason to use a tool instead of manually hacking is that we have to build the uiCallbacks structure too with the code that should be called.

    hc3_emulator.createQuickApp today add "self:<name of element>Clicked(value)" to each element and uiCallback (and it works for multi-select popups)

    The other reason for a tool is that we can't edit these "new" elements in the QuickApp editor - so we have to rely on tools to add elements and add code to them.

     

    So there is a "switch" element that I can get to display but it doesn't perform as expected. Would be nice with something like a check-box..

     

    Edited by jgab
    Link to comment
    Share on other sites

    W dniu 1.03.2020 o 12:26, tinman napisał:

    it looks that one can add extra interface to QuickApp device, however for some reason the QA behaves strange if i called self:addInterfaces({"power"}) in onInit without any check, but with small check seems to work. Now my binary switch have power property:

     

    Please login or register to see this code.

    Please login or register to see this link.

     

    Please login or register to see this link.

     

     

     

    @A.Socha anything against (from Fibaro/design point of view) calling self:addInterfaces({"power"}) in QA to add extra interface?

     

    It is nowt, we planned to show them with next release where you will be able to create thermostat and add heating and cooling interface by code commands

     

    That same with new controls like picture, slider, playlist, select or how to manage layout

    In future plan (not in next version) we will merge standard view with quick apps view so when you will chose multilevel switch (Dimmer) and you will add 2 buttons you will saw both on them in sidebar in dashbord

    Apps will use webview so

     

    Link to comment
    Share on other sites

  • Topic Author
  • New version of fibaroapiHC3.lua (v 0.45)  with support for programatically changing the viewLayout (buttons, sliders etc) of an existing QuickApp on the HC3.

    (trick was api.post("/devices/<deviceID>",{properties = { viewLayout = <new viewLayout>}})

     

    If an uiCallback exist it is kept. A third argument to hc3_emulator.updateViewLayout(id,UI,true) set to 'true' will force update with new generated uiCallbacks.

    Most of the new UI elements can't be edited anyway (for now) so in principal this doesn't matter that much.

    Please login or register to see this code.

    Attached the QuickApp with the above UI structure: 

    Please login or register to see this attachment.

    Edited by jgab
    Link to comment
    Share on other sites

    In fibaroapiHC3.lua you ask "-- Note: Should we make a smarter sleep that yields?" -> here is what I do to get a yielding sleep

     

    Please login or register to see this code.

     

    Link to comment
    Share on other sites

  • Topic Author
  • 3 hours ago, petergebruers said:

    In fibaroapiHC3.lua you ask "-- Note: Should we make a smarter sleep that yields?" -> here is what I do to get a yielding sleep

     

    Please login or register to see this code.

     

     

    Great, you have looked at the code! :-)

    Yes, so in the old HC2 emulator that I had, each scene was run as a Lua coroutine. Then, "yielding" allowed me to get some quasi parallelism between running scenes, closer to how scenes on the HC2 is run by separate Linux processes.

    fibaroapiHC3 for the moment is a single scene or QA approach.

     

    socket.select or socket.sleep stills hang the whole Lua process and all coroutines typically. There are specific socket libraries for Lua that cooperate with Lua's own coroutines but then you become OS dependant and I wanted to avoid that. 

     

    I don't have a portable setTimeout or timers library either which has made me write my own.

    The "heart" of fibaroapiHC3 is thus the "runTimers()". routine that schedules all setTimeout callbacks and is started with the Fibaro._start() call at the end of the code to get things going.

    It's more or less a busy-loop calling scheduled functions at the right times. In that loop there is a small socket.sleep(0.01) just to not eat all of my my laptop batteries in 30min :-) Still the sleep is small enough to not buff around scheduled timers too much.

     

    So, yes, good point, I will do a socket.sleep in fibaro.sleep combined with calls to my idle routine - to save batteries. However, the elegant way would be to do a coroutine yield and treat the whole QA/scene as a coroutine. Then my "other" timers would also be coroutines and be able to run (ex. I have timers that run a web GUI/API that needs to be polled regularly - handles some of the callbacks from the HC3 back to fibaroapiHC3 at the moment - for UI buttons etc.). It's pretty straightforward but the issue with that though is that you become more or less dependent on  require('mobdebug').coro()  for debugging of code inside the coroutine to work. Which is yet another dependency that I tried to stay away from - or at least not require.

     

    At the moment QuickApps and Scenes are run in the same Lua environment. I don't filter the available methods depending on type - this may be something a'm going to change as it is also quite straightforward. The philosophy with fibaroapiHC3 is that if it doesn't work on the HC3 it shouldn't work in fibaroapiHC3 either - at the moment I think fibaroapiHC3 is too forgiving :-) 

     

    Currently I'm working on making fibaroapiHC3 work completely offline, without access to a HC3 by simulating devices etc. Then I can code at work during breaks :-)

    The HC2 emulator was really complex allowing a mix of simulated and real devices, but this time I'm going for an either or model.

     

    Edit: looking at fibaro.sleep() it was buggy as it was written , but I had postponed it to when it would be available in scenes - so now it's the time to implement it right.

    Edited by jgab
    Link to comment
    Share on other sites

    Bugfixes based on v 0.50: 

    Please login or register to see this attachment.

     

    • fibaro.get no longer always returns strings like it did on HC2, removed __convertToString

    • fibaro.call now uses POST and json array. Fixes setColor on my RGBW

    • I've set a few things "local", to reduce global variable leakage, please double check... eg "-> local _EMULATED = true" and "-> local function __assert(value,errmsg)"
    Link to comment
    Share on other sites

  • Topic Author
  • 26 minutes ago, petergebruers said:

    Bugfixes based on v 0.50: 

    Please login or register to see this attachment.

     

    • fibaro.get no longer always returns strings like it did on HC2, removed __convertToString

    • fibaro.call now uses POST and json array. Fixes setColor on my RGBW

    • I've set a few things "local", to reduce global variable leakage, please double check... eg "-> local _EMULATED = true" and "-> local function __assert(value,errmsg)"

    Thanks!, I bringing in the patches. 

    I'm " modularising" the code the get a better grip on what's exported (project->analyse is my friend) (v.51 is out as soon as I killed the last bug)

    There are stuff that can be good to "leak" to the scene/QA. _EMULATED and _debugFlags where such as it is convenient to sometimes know that you are running emulated (I have such cases), and to modify the _debugFlags from the user code too. (_debugFlags are not implemented fully yet but I will focus more on better debug support...)

    I also add stuff a lot of "emulator control functions" to fibaro._* - not sure If I should continue do that or move them to a separate struct...

    Link to comment
    Share on other sites

    9 minutes ago, jgab said:

    There are stuff that can be good to "leak" to the scene/QA. _EMULATED and _debugFlags where such as it is convenient to sometimes know that you are running emulated

    Sure, I leave that up to you, I only slapped on a "local" to flag where so you could "diff" and decide "appropriate or not"

     

    11 minutes ago, jgab said:

    I also add stuff a lot of "emulator control functions" to fibaro._* - not sure If I should continue do that or move them to a separate struct...

    Thinking out loud... Maybe one "local" table to put all your private functions and variables and one global "hc3_emulator" table with everything you want to expose?

     

    That would simplify checks I run in my "check global leakage script" that I run before loading everything else. Forgot to upload the code, here it is.

    Please login or register to see this attachment.

     

     

     

    Link to comment
    Share on other sites

  • Topic Author
  • A new version of fibaroapiHC3.lua v.062.

    -Bugfixes from @petergebruers - new calling convention for fibaro.call and return handling of get values.

    -Moved fibaro._* functions and variables to hc3_emulator.* . This means new calling convention - hc3_emulator.start{...}

    -HC3 credentials moved into structure hc3_emulator.credentials.{ip=<IP<,user=<user>,pwd=<pwd>}. Set it up in the header after dofile("fibaroapiHC3") or set it up in a loaded credentials.lua file.

    -Restructured the code into "modules" -- looks nicer when folded in the IDE (ZBS F12)

    -Fixed various bugs - and probably introduced new with the restructuring.

    -Some more support for simulations without connection to a HC3... devices, variables at the moment. will improve.

    -Will probably move the fibaroapiHC3.lua discussion to another thread...

    Link to comment
    Share on other sites

    @jgab

    I want to setup set credentials in fibaroapiHC3 but it doesn't work. Could you try it? or paste working example how to add credentials to fibaroapiHC3 ?

    Thanks

    Edited by petrkl12
    Link to comment
    Share on other sites

    • jgab changed the title to SDK for remote and offline HC3 development.

    Join the conversation

    You can post now and register later. If you have an account, sign in now to post with your account.

    Guest
    Reply to this topic...

    ×   Pasted as rich text.   Paste as plain text instead

      Only 75 emoji are allowed.

    ×   Your link has been automatically embedded.   Display as a link instead

    ×   Your previous content has been restored.   Clear editor

    ×   You cannot paste images directly. Upload or insert images from URL.

    ×
    ×
    • Create New...