Page 1 of 3

Wifi QR code app

Posted: Sun Mar 10, 2019 8:47 pm
by 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>

Wifi QR tile

Posted: Tue Mar 12, 2019 6:52 pm
by 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
toonwifi.png (30.79 KiB) Viewed 9044 times
Edit: Updated version. This now creates the QR code on the fly from the wifi configuration stored on the Toon.

Re: Wifi QR code app

Posted: Tue Mar 12, 2019 7:07 pm
by 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.

Re: Wifi QR code app

Posted: Tue Mar 12, 2019 7:15 pm
by 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.

Re: Wifi QR code app

Posted: Tue Mar 12, 2019 7:29 pm
by 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.

Re: Wifi QR code app

Posted: Wed Mar 13, 2019 6:18 pm
by 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?

Re: Wifi QR code app

Posted: Wed Mar 13, 2019 7:10 pm
by 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


Re: Wifi QR code app

Posted: Wed Mar 13, 2019 7:43 pm
by 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"
               }
}

Re: Wifi QR code app

Posted: Wed Mar 13, 2019 10:03 pm
by 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 ...

Re: Wifi QR code app

Posted: Thu Mar 14, 2019 12:19 am
by 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.

Re: Wifi QR code app

Posted: Thu Mar 14, 2019 12:57 pm
by Toonz
let me know if you want to have it published in the ToonStore :-).

Kind regardz,

Toonz

Re: Wifi QR code app

Posted: Fri Mar 15, 2019 11:39 am
by 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.

Re: Wifi QR code app

Posted: Fri Mar 15, 2019 12:26 pm
by TheHogNL
If you want just change the code and add to the project :-) Learning QML (javascript syntax) is not really hard.

Re: Wifi QR code app

Posted: Sat Mar 16, 2019 12:37 pm
by hvxl
marcog wrote: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.

Re: Wifi QR code app

Posted: Sat Mar 16, 2019 4:59 pm
by 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 :D

Greetz,
Jos