@muntean_andrew

This is the last devlog before shipping the project update. This has been an exciting journey and I am very satisfied with the result!
I do wish there would be a bit more time left for the event to continue so I could ship even more things but all good things must come to an end, and this one is a happy ending.
I’ve made the necessary last minute touches to make sure that everything works as it should.

Added new ways to customize the player to the user’s liking and fixed that prevented the app from reading the user_version of the database which in return made the app “update” the DB everytime it started.

YEEEEEESS, FINALLLYYYYYY, we have synced lyrics in the app.
I know it’s not the most glamorous UI at the moment, but it is still something, and the other music players don’t even do this, like at most they show the lyrics with the timestamps and that’s it, no scaling of the verse, nothing.
In future updates certainly I’ll make the UI more polished because it need a lot of it. Still I am happy that I’ve made it this far and after a bit of clean up and maybe some optimizations I’ll ship the project.

I’ve finally found the culprit that prevented me from getting the synced lyrics, now the app can read the synced lyrics from music filed. YEEEEEEE
Now the “only” thing is to make the UI for them, which I hope would be easy and fast. 😅

Trying to add lyrics to the app. But it is a bit of a mess cause in the Samsung Music and Apple Music apps these files contain time stamps for each verse and so I was thinking to read those time stamps and to highlight the verse that is played at that time, but my app doesn’t read those things and I don’t know why.
An explanation might be that those apps ping free open source databases of lyrics based on the song details, but I am not really sure.

Another day, another restructuring I guess. 😅
I’ve decided to give each album an id instead of relying on it’s name as the identifier as I did previously. Also I’ve changed the Play function to work with song ids and album ids instead of names. This is because if the name of the song or the album had any of these 2 characters: ’ or “ it would mess up with the HTML structure and the song would not play if the user clicked on it.
Not gonna lie, I think that my code now is a little spaghetti and for sure someone with more experience and knowledge on how to structure a music player would have done a much better job than me at this, but still.
The main caveat that I think could appear in the future is that the Play function can’t take numbered ids for playlists and I have to rely in the playlist’s name because the function would have no way to distinguish between them at the moment and I don’t want to make another spaghetti to fix this. 😅

In other news, I have successfully changed the backend to update the DB version for the user of the older version of the app and to add the new “lyrics” column and also the app can read the embedded lyrics from the music files.
Now the “only” thing remaining is to add the lyrics to the UI and to parse the strings and make the verses synchronize with the song and this feature would be fully implemented.

After successfully changing the song objects management under the hood from the previous devlog I now added an indicator for which song is currently playing. For now I’ve just set the background of the song to be the primary color selected by the user.
Also I’ve changed the border radius for everything to be based on one variable so that the user could change it in the settings (but didn’t yet implement the UI for that) cause everyone has their own preference for these things. The first screenshot is with the border radius set a bit higher (30px) than my default one (23px), and the second one is with the border radius set to 0.

Additionally I am changing the SQLite db in the backend to support lyrics because I want to add them to the app.

I am currently working on optimizing the code so that changes like adding songs to a playlist or liking a song update instantly across all pages because this was a flaw of my old architecture of the app cause I didn’t just have 1 list of song objects that every album and artist referenced to but instead every album and artist had their own song objects and the list of favorite songs was also composed of song object. So it was a mess of duplicate song objects.

Now I am changing things so that there is only one list of song object and albums have just a list of song ids in them so they reference the song object list, this way each change is global.

This would hopefully fix the current synchronization issues that sometimes occur in the current version.

This change would also allow me to add an indicator that a song is playing when the user looks at an album from which a song plays currently.

Additionally I want to add a listening history page where the user can see their listening activity on the app and also maybe add some rewards depending on how much time they spent listening to an artist or album to gamify the experience a little.

I added 2 new shapes that will fight for supremacy in the math world. They are the Astroid and the Reuleaux Triangle.
The Astroid is more of a sniper with long range and lots of damage, but smaller ammo.
The Reuleaux Triangle is more of a tank with a shorter range and smaller speed but tons of ammo and damage and also loads of health.
Also I added 2 new maps, one is a team mode map and another is a PVE map in which each shape has to fight to be the only one standing at the end of the match.

I added the aiming line overlay to make it easier for players to see where they are aiming. It was actually a little bit of spaghetti code involved in the making of this as I use a function to draw the match and another function calculates the last point of the line and returns it but I made it work and it does so beautifully and reliably.
I am thinking of maybe adding 1 or 2 more shapes and 1 or 2 new maps and I’d say the project is ready for another ship!

After a bit of a pause on this project because I wanted to clear my mind a little and do the Hackpad hardware project I returned and made the Game Over screen a bit nicer and so everything is beginning to tie together. I wrote Reals and Quanta so that new users will know what those icons mean.

In addition I redesigned the map selection screen to show a preview of the map before selecting it.

I am also thinking of adding an aim overview and the players just hold the arrow keys or move the right joystick on the controller.

I am glad to announce that the firmware is build and it compiles and has no errors, yeeee!!!!
I do hope that it will actually run when I get to build and flash it to the microcontroller.

Finally finished designing the case!
Because for some reason Fusion didn’t save the project (even though I clicked save multiple times) I had to redesign everything and also I added some improvements.
I had to change the PCB a little couse one of the “legs” of the rotary encoder when through the board of the microcontroller.
I tried and left everywhere a 0.2 mm gap between part and I hope that everything will work out, but some things are pretty precisely placed.😅
Now I’ll have to make the firmware of the keyboard and make QMK read my Japanese Matrix, but I already found some sources and GitHub repos so HOPEFULLY it will go smoothly (famous last words, but still I hope).

Finally made an ok version of the bottom part of the case. I’m new to CAD in general and holding the right click in Fusion being mapped to some kind of drawing feature instead of rotating the camera seemed annoying and I still don’t really get it. I want to make the bottom plate the one with the screw holes, so the macropad screws in from the bottom, and I want the screws to sit flush with the case, this way it has a more “premium” feel.
I’m sorry I didn’t record the PCB design process because I didn’t know that for the hackpad I had to record the design process. I had to reroute the traces of my PCB a few times to get it to a “good enough” point, but I still think it is a little messy, but still much better than the first routing.

These past days I am trying to figure out how to implement the IPC (inter process communication) between Python (where the AI model will be made) and the C++ “megaclient” that acts as 10 clients that connect to the game server. From what I’ve seen one of the easiest ways to implement it is through binary standard streams because I’ll have to move 14KB of data per frame, and because I will unlock the speed of the server physics simulation, it will be like thousands of frames per second, which will add up pretty fast. But the problem isn’t the actual size of data, but the latency, if I would just save it into a txt file my SSD will be hit with thousands of requests every second, so keeping everything in the RAM is why I chose to try and implement the IPC through binary standard streams.
But I didn’t yet get it working and my brain hurts a little cause for the first time since the beginning of this project I have absolutely no idea what to do or how to actually solve this issue and I kinda feel lost and a bit demotivated, that’s why this week I managed a bit over 1hr of coding per day.
But at the same time I’ve been watching more and more videos about how to build AI models and for the first version I’ll build a standard Backprop model as I’ve read in a paper that Predictive Coding approximates Backprop. The problem is this will have to come after the IPC is implemented successfully, which currently it is not.

If anyone sees and reads this I would happily accept any suggestions on how to implement the IPC between Python and C++.

I’m starting the development of an Predictive Coding AI model that would play my game as a bot.
I’ll make it in Python so I can learn a new language and as it is the standard language used in AI development.
Currently I’m building a kind of “mega client” which acts as 10 client that connect to the server and it displays the whole map on the screen with all the players.
After this I will link the Python project with the “Mega Client” through standard streams as ENet on Python isn’t really a modern supported thing and this will cut down network bandwidth and I think will decrease the CPU overhead while the model trains.
When the link between the Python and C++ program is finished then I’ll start the development of the actual AI model, which will involve reading through some scientific papers on the topic. Right now I have 2 of them bookmarked, but you never know when something new may pop up.

I designed kinda a rough sketch of how the icons for the game currencies could look like.
The sine waves are drawn in Raylib and they are static, as well as the circle and the border.

The “R” and “i” in the reals and imaginaries’ icon are font characters. Initially I thought about drawing everything, but then I saw a video about game optimization and that it’s very inefficient for the GPU to render small triangles, which eliminated the drawing in Raylib option, and also it would have been a hassle and a half. So this left 2 choices, load the R and i as a font or an image. I chose to load them as fonts because this allows better scalability, as a font isn’t made of pixels. But I didn’t know how much time I will spend making the font implementation to work.

First I had to find the fonts that had my desired characters, which was a little tedious having to download or scroll through the list of characters for each font. For this I had to install Font Forge so I could view every character in the font. After that I had to create a new font and to replace the i and R characters of the font with my special characters and then hook it up to Raylib.
After loading up my special font I had to tell Raylib whicch characters to import, and I had to measure the characters visual height so I could align them properly in the icon.

Each icon is drawn using their specific function, but I am thinking of combining them into one function in the future.

Currently I’m focusing on UI refinement, currency introduction and “trophy” road implementation.

I introduced to the game:

Reals - the basic currency of the game (kinda like coins in any other game), you win them after a match and they can be used to buy shapes and upgrades. If it wasn’t obvious, the name comes from the set of real numbers.
Imaginaries - they are the “premium” currency in the game which can be used to buy reals. At the moment the game doesn’t really use them or display them.😅
It’s a work in progress so yeah.

Quanta - these are the equivalent of trophies, they would determine the skill of the player. You gain then winning matches and also lose them losing matches.
At the end of the match (or when the player is eliminated) the server transmits a packet in which is specified the amount of reals and quanta received by the player.

At the moment the amount of currency a player has is stored in a txt file in the game directory for simplicity. In the future I think that maybe it could be encrypted somehow with a key given by the server so the player won’t just be able to modify it.

In addition to this, I changed the UI for the main screen, the shape selection screen and introduces the ability to see the shape, it’s level, stats, and to upgrade it.
I’ll be honest that I took a bit of “inspiration” from the Brawl Stars layout, but tried to change some things, and my UI is still not in it’s final form.
Everything is done in Raylib, I still don’t use any PNG textures because I want everything to be vectors cause they are not limited by resolution (which maybe is worse for optimisation) and frankly because I don’t know how and I’m a little afraid to try. 😅

The settings and map selection menu still remained the same, maybe I’ll work on the map selection menu but idk about the settings menu cause it technically works and as the saying goes “if it works, don’t touch it”, and I’m a little afraid of touching it.

Also I’m thinking of introducing a scale variable for text, like the UI elements are defined by the width and height of the window, but the font size of the text is it plain pixels, so I’m thinking of making the text scale based on how it looks at 1080p and if the resolution is lower or higher the font size will multiply with the scale that will be the players resolution height divided by 1080.

After the UI layout is “done”, which hopefully will happen till the end of the week, I’m starting the development and training of the Predictive Coding AI model that will play my game as a bot.

P.S.: I’m trying to make longer devlogs as that was suggested numerous times in the reviews of the first ship.