Category Archives: SID

part three..

And to complete the trilogy here another bit of fractal fun (in case your PC is not equipped with a fast enough graphics accelerator you can find a video recording here: https://youtu.be/PzTwOfoZp0E):

screenshot

the beauty of numbers..

I just did a little revival of my old WebGL fractal stuff. The two below screens use the latest version of my Commodore C64 emulator to play two fitting music creations by Markus Klein.

ricemilk

clubhouse

WEBGL and fractals

Did I mention that I love fractals? In fact I do and that’s why I created the below intro:


turtles

I am using orbit trap logic that I implemented in a WEBGL fragment shader.   The add-on text scrollers/messages sport an exploding-pixels effect which is done using plain Canvas pixel operations. For good measure I added my WebAudio based SID chiptune playback (see my previous posts).

I guess that next time I’d better leave all the graphics to the GPU .. because my CPU is just getting too old. In case you are using a recent browser and if you have some sort of GPU in your computer, you might try to see the online version by clicking on the above image.

 

“hello world 3D” version 2..

On my second trip to the world of THREE.js and WEBGL I tried out yet another bunch of “new” things:

  • use of THREE.js EffectComposers and Shaders to create “glow” effects, etc
  • creating lightweight 3D text rendering by rendering a 2D font into a texture and by creating a geometry that then represents each character as two simple textured triangles
  • create THREE.ShaderMaterials (i.e. WEBGL vertex and fragement shaders) to then apply visual effects to the above 3D text (e.g. rolling the characters or exploding the text-page, etc)

 

Then I came across Felix Woitzel’s fascinating “Travelling Wavefronts” demo and I had to understand how its WEBGL shader logic is done 🙂 After some tinkering I ended up with a slightly cleaned up version of my own with some added visual effect features:

egaux2

After throwing all of the above together and and adding a bit of WebAudio based SID chiptune playback (see my previous experiment), I ended up with a little Web intro 🙂 Those with a reasonably fast GPU may see it in action here  (due to my old CPU I really like to use as much of the GPU’s power as I can..).

egaux3

WebAudio ahoy..

 

At last Firefox and Chrome seem to be making steps forward with regard to audio 🙂 .. giving me an opportunity to migrate my Flash based music player (see previous experiment) to an HTML5-only implementation.

jsid

Using Emscripten I compiled my C code into JavaScript and hooked it up to the new experimental WebAudio APIs (ScriptProcessor, etc)… what can I say.. it works (see here).

PS: Unfortunately Chrome and Firefox still don’t seem to be on the same page with regard to correct chaining of Nodes.. still some work to be done.

Joomla, jQuery, et al.

This next little experiment led me into the world of Joomla 2.59 (an open source CMS system). Since PHP and MySQL are among the few things that my web hoster is comfortable with, there wasn’t much of a choice really. Still I jumped at the opportunity to get some hands-on PHP5 experience.

TinyRSidMainAs expected a simple Joomla site was quickly setup with pre-existing building blocks like user management, commenting functionality and a simple release system to share my source code. Also it came as no surprise that the ‘point & click’ based Joomla software development approach got hairy once I needed my own custom functionalities. With hairy I mean the energy that is wasted to find the different places (e.g. via plugins, modules and component config or site templates) that need patching to rectify the “incorrect turns” that the “framework” is otherwise taking (or to just add missing hooks).
ImageTo make the music player from my previous experiment a bit easier to use I decided to put it into its own floating window and integrate it with some HTML based playlist functionality. After some failed attempts to get my floating window re-positioning code to consistently work in different web browsers (using “plain HTML”), I ended up using jQuery which solved the respective problems just fine. jQuery then also proved useful for the CSS based highlight/expand/collapse functionalities that I added and later it was the base for implementing a dynatree.js based file browser with “load on demand” and “drag & drop” functionality.
The final result (here) turned out quite as I wanted.

Still I was somewhat surprised about the “immaturities” that sometimes manifested in the above tools. With that I mean that eventhough I used these tools superficially at best I already ran into a couple of bugs which previously had gone undetected – which does not speak for thourough testing. However it was a pleasure to then witness the speediness with which these bugs got fixed once they were reported (I hope they also created a new testcase.. ). Community driven software development at its best 🙂

a blast from the past..

Commodore64

When it appeared in the early 80s, the C64 home computer was appreciated particularily for the capabilities of its SID (Sound Interface Device) audio chip.
The SID audio chip featured tree channels, each with its ADSR envelope generator, ring modulation and filter capabilities. Technically it was a small revolution for the home computer domain of the time.

In the more than 30 years since the C64 first hit the shops, countless musicians have created tens of thousands tunes with that characteristic early 80s sythesizer sound (see High Voltage SID Collection). People that grew up with the C64 will certainly still remember some of them.

With the advent of the personal computer people started to program C64 emulators and by now there is quite a selection of more or less complex ones available for different platforms.. so far (i.e. when this experiment was done in 2012) none of these was available for the web browser.

Goal of the experiment: Create a lightweight C64 emulator that allows to playback original “music files” within the web browser (i.e. multi-platform). Lightweight meaning that the program should be fast enough to execute well also on computationally weak devices like smartphones. This certainly qualifies as a technically interesting if practically irrelevant ‘just for fun’ endeavor 🙂

ImageThe diagram to the right shows what the emulator is about: Contrarry to file formats like .mp3 or .ogg, .sid music files do NOT represent a dedicated audio file format but are in fact little more than arbitrarry C64 program files.

Within those programs any official as well as any undocumented C64 feature may actually be used to influence the SID chip’s audio output. An example of an official feature might be the program’s use of the SID chip’s independent oscillator register while an undocumented feature might be one of the ways to trick the SID chip into playing a specific audio sample:

The playback of audio samples was never an official feature of the SID chip.
The tricks exploited for the respective playback therefore are usually highly timing critical: While regular audio output is handled quite independently within the SID chip, sample playback must be explicitly handled by the program code, i.e. depending on specific execution times of 6510 CPU instructions, the timing of interrupts generated by the CIA timers or the 6667 video controller chip, etc. (Not to speak of timing interferences originating from the interactions between the different chips, e.g. the VIC may block the CPU during certain tasks, etc..)

Approach: Not having any experience in electrical engineering nor owning the real hardware for analysis, I decided to build on someone else’s existing SID emulation. I picked TinySid created by Rainer Sinsch because it is more compact than the more sophisticated competitors. This choice allowed me to get my ‘proof of concept’ going quickly – however I had to realize later that the existing emulation was limited to only parts of the CPU and the SID and none of the other above building blocks… so there was quite a bit of tinkering left for me to be done.

I did my ‘proof of concept’ with Adobe Flash since I had found that I could cross-compile the existing C code using Alchemy (TinySid is written in C.) This would also give me an opportunity to play with Flash (which I had not done before).

 

Result:

Tiny'R'Sid player

With a bit of extra AS3 code for the UI, the Alchemy compiled emulator code was up and running quite quicky. (It took a while though to then locate and fix the gaps in the existing emulation logic.) You might have a look here to see the completed player in action.

I also reached my cross platform goal, since the player runs about anywhere where Flash is available (e.g. even on my old HTC HD2 smartphone – reflashed to Android.. no pun intended).

It was fun doing some AS3 for a change, but coming from a C++ and Java background, the respective Flash development tools leave a lot to be desired.  In particular when using Alchemy. It then helps to not make any programming errors.. 😉