Lecture 4 - GUI does not load

mood_organ

I'm on a Bela Gem Multi & looking at Lecture 4.
The GUI does not load at all for me in:

sine-slider
wavetable-slider
the "sliders" example file under GUI

I see two 404 errors in the Chrome dev console:

api/read/file/wavetable-slider%2Fsketch.js:1
api/read/file/wavetable-slider%2Fmain.html:1

mood_organ

Here is my Chrome console when I try to run the "sliders" example:

Socket opened on ws://bela.local:5555/gui_data

BelaWebSocket.js:67 Socket opened on ws://bela.local:5555/gui_control

BelaControl.js:125 _____NEW_CONNECTION_____
BelaControl.js:127 Project name: bela-example-tmp-fe5176f3-ff01-4406-981c-d75097888357
2BelaControl.js:142 ____SET CONTROLLER____
jquery.js:8708  HEAD http://bela.local/api/read/file/bela-example-tmp-fe5176f3-ff01-4406-981c-d75097888357%2Fsketch.js 404 (Not Found)
send @ jquery.js:8708
ajax @ jquery.js:8138
selectGui @ GuiHandler.js:148
(anonymous) @ GuiHandler.js:91
Promise.then
selectProject @ GuiHandler.js:88
GuiHandler @ GuiHandler.js:42
BelaControl @ BelaControl.js:46
Bela @ Bela.js:17
(anonymous) @ gui/:28Understand this error
GuiHandler.js:206 ____LOADED____
7BelaControl.js:70 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'contentDocument')
    at BelaControl.addGui (BelaControl.js:70:79)
    at BelaControl.js:115:11
addGui @ BelaControl.js:70
(anonymous) @ BelaControl.js:115
await in (anonymous)
onData @ BelaControl.js:122
onMessage @ BelaWebSocket.js:94Understand this error
utils.js:43  GET http://bela.local/projects/bela-example-tmp-fe5176f3-ff01-4406-981c-d75097888357/main.html 404 (Not Found)
(anonymous) @ utils.js:43
getHtml @ utils.js:30
selectGui @ GuiHandler.js:175
await in selectGui
(anonymous) @ GuiHandler.js:91
Promise.then
selectProject @ GuiHandler.js:88
GuiHandler @ GuiHandler.js:42
BelaControl @ BelaControl.js:46
Bela @ Bela.js:17
(anonymous) @ gui/:28Understand this error
utils.js:39 request rejected
GuiHandler.js:188 HTML not loaded...
GuiHandler.js:189 ... try loading script

giuliomoro

I think I fixed it now. Update the board via the IDE's update procedure and try again.

mood_organ

Great, thank you!
I verified that the Sliders example is working now.
FWIW there are some 404 errors in the console - I'm pasting them here in case that's of use. Thanks again.

`Socket opened on ws://bela.local:5555/gui_data

BelaWebSocket.js:67 Socket opened on ws://bela.local:5555/gui_control

BelaControl.js:122 __NEW_CONNECTION__
BelaControl.js:124 Project name: bela-example-tmp-085c4c88-f49b-45aa-9662-3a6f7a880633
BelaControl.js:139 _SET CONTROLLER_
api/read/file/bela-example-tmp-085c4c88-f49b-45aa-9662-3a6f7a880633%2Fsketch.js:1 Failed to load resource: the server responded with a status of 404 (Not Found)
GuiHandler.js:206 _LOADED_
projects/bela-example-tmp-085c4c88-f49b-45aa-9662-3a6f7a880633/main.html:1 Failed to load resource: the server responded with a status of 404 (Not Found)
utils.js:39 request rejected
GuiHandler.js:188 HTML not loaded...
GuiHandler.js:189 ... try loading script
poppins-regular-webfont.woff2:1 Failed to load resource: the server responded with a status of 404 (Not Found)
poppins-regular-webfont.woff:1 Failed to load resource: the server responded with a status of 404 (Not Found)`

giuliomoro

Yes those are more or less expected. Loading sketch.js and main.html fails because those are optional and are loaded via XMLHttpRequest(), which I think always prints to console if it fails. The font is not really expected to fail but also not that important.

mood_organ

Understood. The important part: sliders are back!