I’m currently learning how to make games in GoDot 4.x and it’s been great so far and I even have the first tutorial game working on my PC computer.

This is great and all, but I want to share my game with other people. The first thought is to export it to HTML5 so I can just run it on my website hosted here by ICDSoft. My webhost is just an Apache based host running Linux of some sort. They do provide several cool server side stuff like php, mySQL, etc. However, the server plan I have doesn’t do node.js and things like that would allow me to run React framework. (They do have a Web App plan that lets you do that). Anyway, GoDot 4.x game export to HTML5 shouldn’t really need that. Exporting my game to a runnable web format is pretty straight forward in GoDot 4.x. Just go to Projects -> Export …

If you haven’t chosen any export presets, just click Add… at the top and then choose Web. This will create the presets you need to export to the web.

The only thing you really need to fill out is where you want the export path to be. I just have it export to a “Web” folder inside my project to keep things clean since several files will be generated by the export. Make sure that you toggle the Runnable to enable so that the game is runnable from the html file you chose.

Click Export All … to start the process.

If you go to the export folder you chose, you’ll se a bunch of files needed for your web output to run. Note that the html file just won’t run on your Chrome or FireFox browser locally without a webserver of some sort.

There are many guides on how to spin up a local server to run your GoDot 4.x project like this one:
https://github.com/TechnoLukas/Godot4-html-localy

or a nice an simple Python3 server like this one:
https://gist.github.com/opyate/6e5fcabc6f41474d248613c027373856

However, I don’t need a local server running since I already have my web host. Unfortunately, it’s actually not that simple due to this particular error when trying to run the game on my website after uploading all the exported files.

My initial thought was that maybe I can’t just run it on my web host but that’s a bit disappointing since I didn’t have problems running games made with Unity on the web. It’s a bit disappointing. I’m using GoDot 4.0.2 to be compatible with the tutorials I’m following. At the time of this post, GoDot 4.2 is the latest but it sounds like this is still an issue if your web server doesn’t have Cross Origin Isolation configured. I did a lot of web searches but there wasn’t a lot of solutions other than posting my game on itch.io.

I started reading through the GoDot help (https://docs.godotengine.org/en/stable/tutorials/export/exporting_for_web.html#) to see whether there are anything that could help me solve this problem. I came across this section about coi-serviceworker as a workaround. That could be the answer!

The link took me to a GitHub project: https://github.com/gzuidhof/coi-serviceworker and the instruction is pretty clear.

You have 2 options (pick one):
1) Download coi-serviceworker.js (6 kB)into your web export folder and add this line to your html file:

<script src="coi-serviceworker.js"></script>

2) Download coi-serviceworker.min.js (3 kB) in to your export folder and add this line to your html file:

<script src="coi-serviceworker.min.js"></script>

I tried option 2 to minimize the extra file size to include. I edited my speedy_saucer.html file and scroll to where the <script> section is and add the extra tag.

I saved the file and uploaded it along with the coi-serviceworker.min.js into my web project folder. Now I went to my website location where I uploaded the GoDot 4.x web export folder again and it worked!!!

Another way to include the script is to add it in the Head Include during the export. Make sure to have the correct corresponding coi-serviceworker js file in your project.

Maybe in the future update of GoDot 4.x this problem would be solved, but in the mean time the workaronud works great. Happy coding!

Today I tried to work on a firmware updater using the STM32 Bootloader driver. I’ll post about the program later since it took a while to figure out how to write something in C# to use the preferred STM32 Bootloader driver instead of the outdated DFU Device bootloader.

In any case, this firmware updater programer uses Intel Hex file for the firmware updating. Technically you can use Bin as well, but Intel Hex file is nicer because it already has the memory address mapped out. You need to the Bin file what memory address to start and that invites errors that could potentially brick your device. I worked with a firmware engineer who just quit recently and all he gave us for the firmware was the bin file. I do have the source code so I could technically compile a hex output from the source code, but the IDE environment and settings were not available from this engineer. So the best option is to find a way to covert this working bin firmware to hex so that I can use it to update device firmware with the program.

After doing a bit of search on how to convert bin to hex, I found that SRecord is the best tool to do this. You can download the appropriate installer for your desired OS here: https://srecord.sourceforge.net/download.html

For my use case, I went with the Windows version. It’s actually quite easy to use once you figured out what to do. I mentioned how Bin file doesn’t have the memory address while hex does. If you just do the simple convert like the examples around the web show:

srec_cat.exe "firmware.bin" -binary -output "firmware.hex" -Intel

This didn’t work too well for STM32 since the firmware main program address doesn’t start at 0x00000000 because that’s where the boot loader firmware starts. The actual application memory address starts at 0x08000000. Therefore, we need to shift the data from the binary file to that address. This is easy to do using SRecord. Use the following command instead:

srect_cat.exe "firmware.bin" -binary -offset 0x08000000 -output "firmware.hex" -Intel

Now your newly created .hex file should be useable on STM32Cube Programmer as well.

TreeSheets is a great free productivity tool created by Wouter van Oortmerssen (Creator of Sim City, Borderlands 2, etc.). This is a great tool for storing information in a hybrid text and spreadsheet method. The nice thing about it is that the file size is tiny, and it’s quite efficient at storing the information. You can also open your saved file on all the platforms running TreeSheets.

The installer (https://strlen.com/treesheets/) works great on PC (tested on Windows 10/11) and Linux (tested on Ubuntu 22.04.1 LTS). Unfortunately, my Macbook Pro M1 running macOS 12.6 doesn’t quite work due to this warning:

Fortunately, there’s a way to get around this warning. Go to System Preferences -> Security & Privacy –> General Tab. You’ll see a message that TreeSheets.app was blocked from use because it is not from an identified developer. Click “Open Anyway”

Another dialog window will pop up. Choose “Open” again to keep going.

Now you should have TreeSheets running on your macOS

Follow the tutorial to get familiar with how TreeSheets work. Once you are proficient at using it, you won’t want to go back to using a text pad or anything else. Enjoy!

P.S. Another way of installing TreeSheets on MacOS with M1 is to use Brew. In a Terminal window, type in the following command:

brew install --cask treesheets

If you don’t have brew enabled on your system, then follow the installation guide on the Homebrew Documentation site: https://docs.brew.sh/Installation

After the installation is done, a TreeSheets.app will be available in your launcher. Unfortunately, it will not launch the first time you run it because of a permission error. To overcome this, permit the app to be accessed using the following command in a Terminal window:

sudo chmod +x "/Applications/TreeSheets.app/Contents/MacOS/TreeSheets"

Now the app should be able to launch, but then you would run into the problem mentioned at the beginning of this article. Follow the same steps, and you should have TreeSheets running on your macOS system.

After installing Flutter and Android Studio on Windows, you run the following command:

flutter doctor

A common problem you might encounter after installing Android Studio is that Android Studio is not found. This is fixed by setting the Android Studio Directory with this command (assuming the default install path):

flutter config --android-studio-dir="C:\Program Files\Android\Android Studio"

Afterward, you might be asked to accept the Android license.

You can do so with this command:

flutter doctor --android-licenses

What you will now encounter after running the license acceptance would be the exception error.

Choose the SDK Tools tab and check the “Android SDK Command-line Tools (latest)”. Click OK.

Run flutter doctor command again and now everything should be good.

Enjoy Flutter!

As of this writing, I’m using 64-bit Rocky Linux 8.4 that came with GNOME by default.

Since this version already has the GUI that is GNOME, this will mainly work for the settings I have. I know there are issues if you use other GUI packages.

Setup EPEL Repository

First, become the root user since the setup requires superuser privileges.

su -

Run update to make sure your install is up-to-date

yum update

Run the following command to install EPEL Repository

yum install epel-release

Install and Enable XRDP

Now you can enable EPEL Repository and install Xrdp server using the following command

dnf --enablerep=epel -y install xrdp

systemctl enable xrdp --now

Firewall Configuration

Also, let xrpd go through the firewall. Assign the correct port if you are not using the default 3389 for TCP.

firewall-cmd --add-port=3389/tcp

Make the rule permanent using the following command

firewall-cmd --runtime-to-permanent

Connect Using Windows RDP

Now you should be able to connect to Rocky Linux using Windows RDP. Make sure that the user you are using for login is not already logged in on the server or the RDP session won’t connect.

Enjoy!

Hyper-V is a virtual machine module from Microsoft similar to Sun/Oracle VirtualBox or VMWare ESX. Hyper-V is a Type 1 Hypervisor that runs directly on the host machine’s hardware rather. This is different from Type 2 Hypervisor which the virtual machine’s commands are managed through the host running the virtual machine.

Why use Hyper-V?

If you are already running Windows 10 Pro or Windows Server, Hyper-V is free to use and it’s very easy to install. For the setup to run Rocky Linux 8.4 in this article, I’m using Hyper-V on Windows 10 Pro since I don’t have access to a Windows Server machine. Windows 10 Home doesn’t allow Hyper-V, unfortunately.

Download Rocky Linux (8.4)

At the time of this writing, Rocky Linux 8.4 is the latest stable release. Rocky Linux is likely going to be the chosen replacement for Centos OS 8 as the upgrade path now that Red Hat has officially killed the Centos project. Red Hat doesn’t want Centos to compete with RHEL anymore so it moved to CentOS Stream. CentOS Stream is a continuously updating distribution which is a problematic upgrade because there’s no more stable release. Although CentOS Stream continuously updates, it’s staying within the confine of the RHEL major version release.

Unfortunately, CentOS Stream is being treated as a development branch of RHEL which means that it’ll see all the bugs first before RHEL. Most users use CentOS because it’s tracking AFTER a stable release of RHEL.

Back to Rocky Linux, it’s emerging as the main replacement for CentOS. It’s started by CentOS co-founder and a the hardcore veteran Gregory Kurtzer. He and thousands of developers took the lessons learned from CentOS and its demise to create Rocky Linux. Hopefully, we won’t suffer the same fate that Red Hat dealt with CentOS because it had a conflict of interest. Mainly money-grabbing, but who knows?

Head over to Rocky Download page: https://rockylinux.org/download/

Select the x86_64 DVD distribution to get the iso we need to run on Hyper-V. The minimal package runs into problems when trying to install in a virtual machine.

Installation

First you must enable Hyper-V in Windows 10. There are a couple of ways to do it, but using Windows Shell is pretty straightforward. Launch Windows Shell as an Administrator.

Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Hyper-V -All

A restart will be required to get Hyper-V working. Select Y to restart your computer after Hyper-V is enabled.

After Windows restarted, type in the search bar “Hyper-V” and select “Hype-V Quick Create”. This will launch a Create Virtual Machine module.

Uncheck the “This virtual machine will run Windows (enables Windows Secure Boot)”.

Click on the “Change Installation source” and select the Rocky Linux iso we downloaded earlier. Click “Create Virtual Machine” after the iso file is chosen.

Depending on your computer’s specs, the installation could be very fast. On my system, it only took a few seconds for the new virtual machine to be created.

Click “Edit settings …” to edit our new VM. It’s very important to make sure that the allocated RAM is at least 4 Gigabytes or you’ll have problems running Rocky Linux on the VM. By default, the new VM is only created with 2GB or RAM allocated.

You can also locate the virtual machine media in a different location. By default, it’s putting the image in your user profile which is not an ideal location. Click on the Hard Drive option on the menu bar on the left. Click “New” under the virtual hard disk option and then follow the steps to create your new virtual hard drive media location.

Connect To VM

Now that everything is ready to go, click on the “Connect” button to connect to our VM. Click the “Start” button on the screen to launch the VM.

After a few seconds, the Rocky Linux 8 install option should show up. Make sure you either disable the firewall or letting the Hyper-V VM go through the firewall to get it running. Select “Install Rocky Linux 8” option and hit Enter to start.

If it runs correctly, you should be presented with the Rocky Linux 8 Installation. Go through the setup steps

I won’t cover all the installation details here since everyone has his/her own preferences for the server. Let the installation run and you’ll have a Rocky Linux 8.4 Server on Hyper-V in no time.

I had to shutdown the VM when the automatic reboot seems to be stuck. After shutting down and re-starting the VM again, it lets me complete the configuration of the server and then accept the license.

All done! Enjoy!

One issue that you may encounter while running the new server is no internet connection. The issue is that the “Default Switch” might not be configured for the external internet connection. When you first created the VM, if you chose the switch to be “Default Switch”, it’d likely have an Internal network connection.

First, suspend and shut down your VM so you can make modifications to the settings. You can add a new switch by opening up Hyper-V Manager. Click on the “Virtual Switch Manager …” from the Actions menu on the right.

Select “New virtual network switch” option and make sure you choose “External” as the type then click “Create Virtual Switch” button.

I named the switch “INTERNET” to quickly differentiate it from the default switch. Make sure that you check the box for “Allow management operating system to share this network adapter”.

Click OK to accept the changes. Select “Settings …” for your vm from the Hyper-V Manager.

Choose the Network Adapter option from the left menu and change the Virtual Switch option to the newly created “INTERNET” switch. Click OK on Apply to accept the change.

Now you can start your vm again and check whether you now have an internet connection in your Hyper-V. Also make sure that your connection is enabled. Click “Connect” if your connection was off.

One thing I noticed on my 4k resolution monitor is that the Hyper-V window containing Rocky Linux is running is a much lower resolution than I want. Since this is GNOME by default, we can increase the resolution using the following command:

grubby –update-kernel=ALL –args=”video=hyperv_fb:1920×1080″

You then need to reboot for this new resolution to take effect.

reboot

This is much better in my opinion.

Due to the Covid-19 situation, face masks are very difficult to find. Thanks to a craft sites like this one (https://www.craftpassion.com/face-mask-sewing-pattern/ ) we have a way to make your own mask.

To make it easier for other people to make this mask, I’ve made a PDF (Link Here) and InkScape SVG (Link Here) of the mask patterns. I added the X-large size to the pattern so that people with a larger face also has an option.

In Windows 7, you could be in a File Explorer window and hold Shift + Right click to bring up the “Open Command Window Here” in the context menu. It’s very hand when I want to just be in the correct directory to do stuff without having to go through all the paths to get there.

This feature is disabled in Windows 10 and you have “Open PowerShell window here” instead. I don’t (but should someday) use Power Shell. For now, I just want my good old command window.

There are instruction online to do a bunch of permission change via RegEdit and changing the flag of the cmd folder registry. It was pretty involved and in the end I couldn’t really get it to work. I then stumbled upon somebody’s comment on an easier way.

Basically, just save this script as a .Reg file and then run it. It’ll automatically add the registry key that allows the right click context that we need. You might want to close all the File Explorer windows to get it to work.

Windows Registry Editor Version 5.00

[HKEY_CLASSES_ROOT\Directory\Background\shell\normal_cmd]
@="@shell32.dll,-8506"
"Icon"="cmd.exe,0"

[HKEY_CLASSES_ROOT\Directory\Background\shell\normal_cmd\command]
@="cmd.exe /s /k pushd \"%V\""

[HKEY_CLASSES_ROOT\Directory\shell\normal_cmd]
@="@shell32.dll,-8506"
"Icon"="cmd.exe,0"

[HKEY_CLASSES_ROOT\Directory\shell\normal_cmd\command]
@="cmd.exe /s /k pushd \"%V\""

Now when you Shift + Right click in a File Explorer, you’ll have “Open Command Window Here” back.

Sometimes when you want to use TKinter or other GUI dialog but you don’t want to use the generic default icon. You also might not want to have the *.ico or *.png file included in the same folder as your script. Wouldn’t it be nice to just have the icon data embedded in your code?

It’s actually not too difficult to do in Python. I’m working with Python 3.x here so you might have to adjust the code for Python 2.x. We’ll use Tkinter dialog as an example here. Let’s try putting this example books.icon or any icon you would like to use in code. If you need icons to play with, you can get a great set of open-sourced icons from here:
https://sourceforge.net/projects/openiconlibrary/

The icon I’m using is from the icon pack and once you extract the archive, it’s in ../ico/16×16/others/books.ico. You can also just download the icon file here: books.ico

The trick is to converting the icon file data into string representation of hex data that we can store in the program. This is actually surprisingly easy to do using repr() function to generate string of the object. In this case, we are converting the icon image data into string hex values. The following code will print out the data for the icon file in the almost correct format for you to use. Make sure the icon file is in the same location as your script when running this code.

with open("books.ico", "rb") as image:
     a = image.read()
print(repr(a))

I said almost a correct format because you’ll end up with a really long string hex data dump and it’s in a single line. This could be used as-is but you’ll end up with a really long line in your python file that you’ll have to scroll right very far to see the entire thing. I’m truncating here so we don’t fill up the whole page.

b'\x00\x00\x01\x00\x01\x00\x10\x10\x00\x00\x00\x00\x00\x00h\x04\x00\x00\x16\x00\x00\x00(\x00\x00\x00\x10\x00\x00\x00 \x00\x00\x00\x01\x00 
... 
f00\x00\xf0\x03\x00\x00\xfe\x1f\x00\x00\xff\xff\x00\x00'

For the sake of readability in our code, we’ll format it into a nicer format by breaking every 16th hex values into its own line. Here’s the previous code updated with a formatting code below:

with open("books.ico", "rb") as image:
    a = image.read()
data = (repr(a))

data = data[2:]  #trim out the b'
data = data[:-1]  #trim out the last '

dataList = data.split('\\x')  #split by hex unit
dataList = dataList[1:] #remove the blank  value at the beginning

totalLen = len(dataList)

i = 0
hexline = ''
lenCount = 0
groupCount = 0
for hex in dataList:
    if(lenCount == totalLen-1):
        hexline += '\\x' + hex
        print('b\'' + hexline + '\'')
    if(i == 16):  #change number of grouping here       
        print('b\'' + hexline + '\'')
        i=0
        hexline = ''
        groupCount += 1

    hexline += '\\x' + hex
    i+=1         
    lenCount += 1

This should now give us the format we can just cut and paste from the output window into our code for the Icon data. For every 16th hex value, a new line is created with b’ at the beginning of the line to represent byte code representation using string. Again I truncated the data to save space.

b'\x00\x00\x01\x00\x01\x00\x10\x10\x00\x00\x00\x00\x00\x00h\x04\x00'
b'\x16\x00\x00\x00(\x00\x00\x00\x10\x00\x00\x00 \x00\x00\x00\x01\x00 '
...
b'\x00\x00\xc0\x01\x00\x00\x80\x01\x00\x00\x00\x07\x00\x00\x00\x07'
b'\x00\x00\x01\x00\x00\xc0\x01\x00\x00\xc0\x01\x00\x00\xc0\x01\x00'

Now we’ll do an example of a TKInter window with the embedded icon data. Use the full icon data from the output generated by the code. The data shown in the code below is truncated in this code example.

import tkinter
import tempfile

ICON = (b'\x00\x00\x01\x00\x01\x00\x10\x10\x00\x00\x00\x00\x00\x00h\x04\x00'
b'\x16\x00\x00\x00(\x00\x00\x00\x10\x00\x00\x00 \x00\x00\x00\x01\x00 '
...
b'\x00\x00\xc0\x01\x00\x00\x80\x01\x00\x00\x00\x07\x00\x00\x00\x07'
b'\x00\x00\x01\x00\x00\xc0\x01\x00\x00\xc0\x01\x00\x00\xc0\x01\x00')

_, ICON_PATH = tempfile.mkstemp()
with open(ICON_PATH, 'wb') as icon_file:
    icon_file.write(ICON)

root = tk.Tk()
root.iconbitmap(default=ICON_PATH)

tk.mainloop()

If you cut and paste the data value into the ICON correctly, you should see a blank tk window with the icon that had the generated the data.

Here are the complete codes for the data generator and the tk example. You need to rename the file extension to .py. This server doesn’t allow .py extension to be viewed.

IconData.txt
Tkinter_IconData_example.txt