Hey,
some months ago I managed to run the GUI examples, but on the current 0.3.8 I only get the "In order to use the GUI functionality in Bela you need to use the GUI library" message.
maxOS 10.14.6, Safari 13.1 / Firefox / Chrome..

Am I missing steps to run these, or is building & running enough?
I don't get any error messages in the Bela (or the browser) console...

Best,
Jan

janklug changed the title to can't get GUI to do its thing .

Well, that was solved by bringing the Bela online..
Is the GUI supposed to only work with internet connection?

No that is not needed. If the problem manifests itself again, could you open the developer console for your broswer and report what errors if any show up there?

hey, thanks for answering!
yes, it keeps manifesting itself.
I share the host's internet connection via USB.
The moment that I disable Wifi, things go wrong.

Here some actions, and the resulting errors in the Web consoles:


These are reproducible steps & errors:

1) I run the Trill square-visual example; shared WIFI of Mac is on.

The GUI works.
I clear the dev-consoles of both the IDE and the GUI window.


2) I switch WIFI on the host computer OFF

on Bela console:
Bela has disconnected. Any changes you make will not be saved. Check your USB connection and reboot Bela.

on IDE dev console:

[Log] disconnect reason: – "transport error" (bundle.js, line 713)
[Log] disconnected (bundle.js, line 1368)
[Error] WebSocket network error: The operation couldn’t be completed. Socket is not connected
[Log] running on – "Bela↵" (bundle.js, line 640)

on GUI (doesn't work anymore) dev console:

[Log] Error: undefined (BelaWebSocket.js, line 52)
[Log] Event {isTrusted: true, type: "error", target: WebSocket, currentTarget: WebSocket, eventPhase: 2, …} (BelaWebSocket.js, line 53)
[Error] WebSocket network error: The operation couldn’t be completed. Socket is not connected (x2)
[Log] Error: undefined (BelaWebSocket.js, line 52)
[Log] Event {isTrusted: true, type: "error", target: WebSocket, currentTarget: WebSocket, eventPhase: 2, …} (BelaWebSocket.js, line 53)
[Error] WebSocket network error: The operation couldn’t be completed. Socket is not connected
[Log] Socket closed (BelaWebSocket.js, line 41)
[Log] Reconnecting(1)... (BelaWebSocket.js, line 45)
[Log] BelaControl {port: 5555, address: "gui_control", ip: "bela.local", ws: WebSocket, connectInterval: 1500, …} (BelaWebSocket.js, line 46)
[Log] Socket closed (BelaWebSocket.js, line 41)
[Log] Reconnecting(1)... (BelaWebSocket.js, line 45)
[Log] BelaData {port: 5555, address: "gui_data", ip: "bela.local", ws: WebSocket, connectInterval: 1500, …} (BelaWebSocket.js, line 46)
[Log] Retrying connection in 1,500 ms (BelaWebSocket.js, line 27, x2)

3) I clear the console again; switch Wifi on Host ON again:

On IDE dev console:

[Error] WebSocket network error: The operation couldn’t be completed. Socket is not connected
[Log] disconnect reason: – "transport error" (bundle.js, line 713)
[Log] disconnected (bundle.js, line 1368)
[Error] WebSocket network error: The operation couldn’t be completed. Socket is not connected
[Log] running on – "Bela↵" (bundle.js, line 640)

On GUI dev console:

[Log] Socket opened on ws://bela.local:5555/gui_control (BelaWebSocket.js, line 67)

[Log] _____NEW_CONNECTION_____ (BelaControl.js, line 113)
[Log] Project name: exampleTempProject (BelaControl.js, line 115)
[Log] ____LOADED____ (GuiHandler.js, line 174, x8)
[Log] Socket opened on ws://bela.local:5555/gui_data (BelaWebSocket.js, line 67)

[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (main.html, line 0)
[Log] request rejected (utils.js, line 39)
[Log] HTML not loaded... (GuiHandler.js, line 156)
[Log] ... try loading script (GuiHandler.js, line 157)
[Log] request rejected (utils.js, line 39)
[Log] HTML not loaded... (GuiHandler.js, line 156)
[Log] ... try loading script (GuiHandler.js, line 157)
[Log] request rejected (utils.js, line 39)
[Log] HTML not loaded... (GuiHandler.js, line 156)
[Log] ... try loading script (GuiHandler.js, line 157)
[Log] request rejected (utils.js, line 39)
[Log] HTML not loaded... (GuiHandler.js, line 156)
[Log] ... try loading script (GuiHandler.js, line 157)
[Log] request rejected (utils.js, line 39)
[Log] HTML not loaded... (GuiHandler.js, line 156)
[Log] ... try loading script (GuiHandler.js, line 157)
[Log] request rejected (utils.js, line 39)
[Log] HTML not loaded... (GuiHandler.js, line 156)
[Log] ... try loading script (GuiHandler.js, line 157)
[Log] request rejected (utils.js, line 39)
[Log] HTML not loaded... (GuiHandler.js, line 156)
[Log] ... try loading script (GuiHandler.js, line 157)
[Log] request rejected (utils.js, line 39)
[Log] HTML not loaded... (GuiHandler.js, line 156)
[Log] ... try loading script (GuiHandler.js, line 157)
[Log] Loading exampleTempProject ... (GuiHandler.js, line 187)
[Log] ... /projects/exampleTempProject/sketch.js loaded (GuiHandler.js, line 199)

GUI works again.


Hope this provides a hint...

Best,
Jan

Right and what if you refresh those pages while the wifi is off? I think internet sharing changes the IP address of the board, and possibly so does toggling the wifi on the host on or off (while internet sharing is enabled). When the IP changes, I'd expect to have to refresh the page so that the bela.local domain can be resolved to the new address.

On the IDE tab I see this error when refreshing the page (while Bela runs):
[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (bundle.js.map, line 0)

On the GUI page, I only see the previously mentioned GUI-absence-message, but no errors or messages in the dev console..

Possibly quite unrelated, but maybe of influence:
The only way I could get the GUI to show was to get the internet sharing running, which initially didn't work, even with the method mentioned in the wiki.
After some tinkering (which involved 'sudo sysctl -w net.inet.ip.forwarding=1', there appeared a checked toggle box that said 'use nat64' in the internet sharing preferences. I disabled that, and internet sharing worked...

just checked with another Mac on 10.13.6, and it's the same behaviour: no GUI until I share some internet...

What does the macos network preferences tab relative to the Bela connection look like? Did you specify any properties manually? Conversely, are there any customised settings on the board itself?

It happens with 0.3.8 fresh off the shelve.
The 'interfaces' config initially looks like this:

# This file describes the network interfaces available on your system
# and how to activate them. For more information, see interfaces(5).

# USB RNDIS gadget (Windows / Linux compatible)
auto usb0
iface usb0 inet static
    address 192.168.6.2
    netmask 255.255.255.0
    network 192.168.6.0

#  USB NCM gadget (macOS / Linux compatible)
auto usb1
iface usb1 inet static
    address 192.168.7.2
    netmask 255.255.255.0
    network 192.168.7.0

and the network pane like this:

alt text

In this state, I can't get the GUI to work at all.

I then modify the interfaces config to this:

# This file describes the network interfaces available on your system
# and how to activate them. For more information, see interfaces(5).

# USB RNDIS gadget (Windows / Linux compatible)
#auto usb0
#iface usb0 inet static
#    address 192.168.6.2
#    netmask 255.255.255.0
#    network 192.168.6.0

#  USB NCM gadget (macOS / Linux compatible)
auto usb1
iface usb1 inet dhcp
#    address 192.168.7.2
#    netmask 255.255.255.0
#    network 192.168.7.0

After rebooting, the Network pane looks like this (with Internet sharing enabled):

alt text

...and the GUI works.

Luckily, the Internet is indeed not needed.
Just tested setup with connection via Ethernet, and that worked fine, even when there was no Internet attached to the router.
So the problem seems related to the USB networking...

in both of the examples above, I assume you have internet sharing enabled? I would like to see the macos screenshot when the board has default settings and internet sharing is disabled.

Aha!
Seems like internet sharing is messing things up...
With a fresh install, unmodified network settings, and Internet sharing Off, the GUI suddenly works...
alt text

As soon as I switch Internet sharing on, the GUI doesn't work anymore - even if the Network settings remain the same / display the same in preferences...

    janklug With a fresh install, unmodified network settings, and Internet sharing Off, the GUI suddenly works...

    that's good and expected.

    janklug As soon as I switch Internet sharing on, the GUI doesn't work anymore - even if the Network settings remain the same / display the same in preferences...

    the network settings are not supposed to display the same IP address when doing internet sharing, though... at least the IP should change, if I remember correctly. I think this should need to change the setting on the board as explained in the wiki page. I am confused as to why even before changing those settings you can still reach the board over ssh, but the GUI doesn't work.