Wifi QR code app

[RobbieT]

Just giving this a bump.
I created a QR code to connect to my wifi. It would be nice to have this on my Toon. Only one image, the QR code. I'm not familiar with coding or whatsoever. Is there a way to get this QR code on the Toon?

<edit by TheHogNL: created a new topic for this>

[hvxl]

Nice idea! I just made a simple app that will show such a QR code on a tile. Unpack it in /HCBv2/qml/apps and store your QR image as /HCBv2/qml/images/wifi.png.

I created the QR image on a linux machine with the qrencode command, using the default of 3 pixels per dot.

This app assumes firmware 5.0.4 or higher and the tile is not expected to be on the main screen, so it doesn't deal with dim state.

toonwifi.png (30.79 KiB) Viewed 2685 times

Edit: Updated version. This now creates the QR code on the fly from the wifi configuration stored on the Toon.

[TheHogNL]

Just an idea: you can also generate the qr code on the fly with a bit of javascript: https://davidshimjs.github.io/qrcodejs/
Then you could just use the already configured wifi on the toon (the password is stored readable) to generate the qr code for each toon.

[hvxl]

I thought about that, but it requires quite a bit of code to generate a QR code. Resources already aren't abundant on the Toon and the QR code only needs to be generated once. Also, the user may want to provide credentials for a guest network with limited access, while Toon is on the main wifi network.

[TheHogNL]

True, but generation can be done only once when the app starts or on user request. An option to change the default wifi (from which the toon is using) to another one (a guest network) can also be part of the app.

[hvxl]

I found a nice small javascript library that can produce QR images as an svg string, instead of wanting to draw on an HTML5 canvas or svg item: https://www.cssscript.com/flexible-clie ... generator/

It compiles fine on the Toon (I get a qrcodegen.jsc file), but I can't figure out how to call any of its methods from a qml file. I think I need something along the lines of:

Code: Select all

import "qrcodegen.js" as QRCodegenJS

function hello() {
   var QRC = QRCodegenJS.qrcodegen.QrCode
   var qr0 = QRC.encodeText("Hello, world!", QRC.Ecc.MEDIUM);
   svg = qr0.toSvgString(4);
}


But that aborts with an error: "Cannot read property 'QrCode' of undefined".

Can anyone better versed in javascript/qml than me provide a hint on how to invoke this library?

[TheHogNL]

Just rememberd that there is already QrCode generation native in the Toon (at least in 5.0.4)
Look at this from the security panel:

Code: Select all


                        QrCode {
                                id: qrCode
                                anchors.centerIn: parent
                                width: Math.round(160 * 1.28)
                                height: width
                                content: p.verificationUrlComplete ? p.verificationUrlComplete : (p.errorState ? "error" : "")
                                color: p.errorState ? "#A8A8A8" : "#000000"
                        }


So you only set the content to the string you want.. haven't tested it myself but it seems to work. Only these are imported, not sure which one is needed for QrCode

Code: Select all

import QtQuick 2.1

import qb.components 1.0
import qb.base 1.0
import BasicUIControls 1.0
import BxtClient 1.0



[TheHogNL]

Ok this works:

Code: Select all

import QtQuick 2.1
import qb.components 1.0
import BasicUIControls 1.0

Tile {
        id: qrcodeTile
        function init() {}

      QrCode {
            id: qrCode
                anchors.centerIn: parent
                width: Math.round(160 * 1.28)
                height: width
                content: "https://www.domoticaforum.eu/viewtopic.php?f=99&t=12379"
                color: p.errorState ? "#A8A8A8" : "#000000"
               }
}

[hvxl]

Yes, that works! Very nice. (Although I still would like to learn how to use methods from a js file).
Now on to extract the wifi data from /HCBv2/config/config_hcb_netcon.xml ...

[hvxl]

I have updated the zip file on the 2nd post in this topic. The new version now creates the QR code on the fly from the wifi configuration stored on the Toon.

[Toonz]

let me know if you want to have it published in the ToonStore .

Kind regardz,

Toonz

[marcog]

This is a very nice idea. I noticed you try to show the Wifi info from the connection info of the Toon itself. It would be very appreciated to have the possibility to enter a guest wifi SSID and password aswell.

[TheHogNL]

If you want just change the code and add to the project Learning QML (javascript syntax) is not really hard.

[hvxl]

This is a very nice idea. I noticed you try to show the Wifi info from the connection info of the Toon itself. It would be very appreciated to have the possibility to enter a guest wifi SSID and password aswell.

What do you mean "try"? Does it not work?

I mentioned the desire for alternative wifi settings myself a few posts ago. But it requires quite some additional functionality: A configuration screen to enter the information, reading and saving a configuration file, and picking the data from 2 different sources.

[newwolf]

Hey,

Nice job !!!
But just testing it and there's missing something in wifi.zip
WifiApp.qml is calling WifiScreen.qml but it's not there.

Could you fix that or even better if it ready enough put it in the ToonStore

Greetz,
Jos