feat: Oscillator GUI (#9)

Waveshape and volume implemented. Added Signal drawing

Todo: explore possibility to separate ui and applying state changes

Co-authored-by: HiveBeats <e1lama@protonmail.com>
Reviewed-on: #9

.gitignore

@@ -2,4 +2,5 @@
 .DS_Store
 /Debug/
 *.wav
-*.dSYM
+*.dSYM
+/lib

.vscode/settings.json

@@ -3,7 +3,11 @@
         "readability/casting"
     ],
     "files.associations": {
-        "algorithm": "c"
+        "algorithm": "c",
+        "__bit_reference": "c",
+        "bitset": "c",
+        "chrono": "c",
+        "unordered_map": "c"
     },
     "FSharp.suggestGitignore": false,
 }

main.c

@@ -11,11 +11,28 @@
 #include "export.h"
 
 #include "raylib.h"
+#define RAYGUI_IMPLEMENTATION
+#include "raygui.h"
 
 //------------------------------------------------------------------------------------
 // Synth
 //------------------------------------------------------------------------------------
 
+typedef struct OscillatorUI {
+    float volume;
+    float freq;//todo: remove or change to pitch shift
+    OscillatorType waveshape;
+    bool is_dropdown_open;
+    Rectangle shape_dropdown_rect;
+} OscillatorUI;
+
+typedef struct Synth {
+    OscillatorArray oscillators;
+    OscillatorUI* ui_oscillators;
+    Note current_note;
+    SynthSound* out_signal;
+} Synth;
+
 static int get_semitone_shift_internal(char* root_note, char* target_note) {
     char* pitch_classes[12] =
         { "C", "C#", "D", "D#", "E", "F", "F#", "G", "G#", "A", "A#", "B" };
@@ -68,38 +85,40 @@ int get_semitone_shift(char* target_note) {
     return get_semitone_shift_internal("A4", target_note);
 }
 
-SynthSound note(int semitone, float beats) {
+static OscillatorArray init_osc_array() {
-    float hz = get_hz_by_semitone(semitone);
+    Oscillator first = {
-    float duration = beats * BEAT_DURATION;
-
-    OscillatorParameter first = {
         .osc = Square,
-        .freq = hz
+        .freq = 440.f,
+        .volume = VOLUME
     };
 
-    OscillatorParameter second = {
+    Oscillator* oscArray = malloc(sizeof(Oscillator*) * 1);
-        .osc = Saw,
+    oscArray[0] = first;
-        .freq = hz + 0.5
-    };
 
-    OscillatorParameter third = {
+    OscillatorArray oscillators = {
-        .osc = Saw,
-        .freq = hz - 1.f
-    };
-
-    OscillatorParameter oscArray[] = { first/*, second, third */};
-    OscillatorParameterList parameters = {
         .array = oscArray,
         .count = 1
     };
 
-    return freq(duration, parameters);
+    return oscillators;
 }
 
-SynthSound get_note_sound(Note input) {
+SynthSound note(Synth* synth, int semitone, float beats) {
+    float hz = get_hz_by_semitone(semitone);
+    float duration = beats * BEAT_DURATION;
+    
+    // will change after oscillator starts to be more autonomous
+    for (size_t i = 0; i < synth->oscillators.count; i++) {
+        synth->oscillators.array[i].freq = hz;
+    }
+
+    return freq(duration, synth->oscillators);
+}
+
+SynthSound get_note_sound(Synth* synth, Note input) {
     float length = 1.f / input.length;
     int semitone_shift = get_semitone_shift(input.name);
-    return note(semitone_shift, length);
+    return note(synth, semitone_shift, length);
 }
 //-------------------------------------------------------
 
@@ -137,6 +156,151 @@ size_t detect_note_pressed(Note* note) {
     return is_pressed;
 }
 
+//------------------------------------------------------------------------------------
+// GUI
+//------------------------------------------------------------------------------------
+
+void DrawUi(Synth *synth) {
+    const int panel_x_start = 0;
+    const int panel_y_start = 0;
+    const int panel_width = OSCILLATOR_PANEL_WIDTH;
+    const int panel_height = WINDOW_HEIGHT;
+    
+    bool is_shape_dropdown_open = false;
+    int shape_index = 0;
+    
+    
+    GuiPanel((Rectangle){
+                 panel_x_start,
+                 panel_y_start,
+                 panel_width,
+                 panel_height
+             }, 
+            "");
+    
+    bool click_add_oscillator = GuiButton((Rectangle){
+                                              panel_x_start + 10,
+                                              panel_y_start + 10,
+                                              panel_width - 20,
+                                              25
+                                          }, "Add Oscillator");
+    if (click_add_oscillator)
+    {
+        // synth->ui_oscillator_count += 1;
+        // // Set defaults:
+        // UiOscillator *ui_osc = synth->ui_oscillator + (synth->ui_oscillator_count - 1);
+        // ui_osc->shape = WaveShape_SINE;
+        // ui_osc->freq = BASE_NOTE_FREQ;
+        // ui_osc->amplitude_ratio = 0.1f;
+        // ui_osc->shape_parameter_0 = 0.5f;
+    }
+
+    // Draw Oscillators
+    float panel_y_offset = 0;
+    //synth->ui_oscillator_count = 1
+    for (int ui_osc_i = 0; ui_osc_i < synth->oscillators.count; ui_osc_i++)
+    {
+        OscillatorUI* ui_osc = &synth->ui_oscillators[ui_osc_i];
+        Oscillator* osc = &synth->oscillators.array[ui_osc_i];
+        const bool has_shape_param = (ui_osc->waveshape == Square);
+        
+        // Draw Oscillator Panel
+        const int osc_panel_width = panel_width - 20;
+        const int osc_panel_height = has_shape_param ? 130 : 100;
+        const int osc_panel_x = panel_x_start + 10;
+        const int osc_panel_y = panel_y_start + 50 + panel_y_offset;
+        panel_y_offset += osc_panel_height + 5;
+        GuiPanel((Rectangle){
+                     osc_panel_x,
+                     osc_panel_y,
+                     osc_panel_width,
+                     osc_panel_height
+                 },
+                "");
+        
+        const float slider_padding = 50.f;
+        const float el_spacing = 5.f;
+        Rectangle el_rect = {
+            .x = osc_panel_x + slider_padding + 30,
+            .y = osc_panel_y + 10,
+            .width = osc_panel_width - (slider_padding * 2),
+            .height = 25
+        };
+        
+        // Volume slider
+        float decibels = (20.f * log10f(osc->volume));
+        char amp_slider_label[32];
+        sprintf(amp_slider_label, "%.1f dB", decibels);
+        decibels = GuiSlider(el_rect, 
+                             amp_slider_label, 
+                             "", 
+                             decibels, 
+                             -60.0f, 
+                             0.0f
+                             );
+        ui_osc->volume = powf(10.f, decibels * (1.f/20.f));
+        osc->volume = ui_osc->volume;
+
+        el_rect.y += el_rect.height + el_spacing;
+        
+        // Defer shape drop-down box.
+        ui_osc->shape_dropdown_rect = el_rect;
+        el_rect.y += el_rect.height + el_spacing;
+        /*
+        Rectangle delete_button_rect = el_rect;
+        delete_button_rect.x = osc_panel_x + 5;
+        delete_button_rect.y -= el_rect.height + el_spacing;
+        delete_button_rect.width = 30;
+        bool is_delete_button_pressed = GuiButton(delete_button_rect, "X");
+        if (is_delete_button_pressed)
+        {
+            memmove(
+                    synth->ui_oscillator + ui_osc_i, 
+                    synth->ui_oscillator + ui_osc_i + 1, 
+                    (synth->ui_oscillator_count - ui_osc_i) * sizeof(UiOscillator)
+                    );
+            synth->ui_oscillator_count -= 1;
+        }
+        */
+    }
+
+    // DRAW OSCILLATOR SHAPE INPUTS
+    for (int ui_osc_i = 0; ui_osc_i < synth->oscillators.count; ui_osc_i += 1)
+    {
+        OscillatorUI* ui_osc = &synth->ui_oscillators[ui_osc_i];
+        Oscillator* osc = &synth->oscillators.array[ui_osc_i];
+        // Shape select
+        int shape_index = (int)(ui_osc->waveshape);
+        bool is_dropdown_click = GuiDropdownBox(ui_osc->shape_dropdown_rect, 
+                                                WAVE_SHAPE_OPTIONS, 
+                                                &shape_index, 
+                                                ui_osc->is_dropdown_open
+                                                );
+        
+        if (is_dropdown_click)
+        {
+            ui_osc->is_dropdown_open = !ui_osc->is_dropdown_open;
+            ui_osc->waveshape = (OscillatorType)(shape_index);
+            // APPLY STATE TO REAL OSC
+            osc->osc = (OscillatorType)(shape_index);
+        }
+        if (ui_osc->is_dropdown_open) break;
+    }
+}
+
+void DrawSignal(Synth* synth) {
+    GuiGrid((Rectangle){0, 0, WINDOW_WIDTH, WINDOW_HEIGHT}, "", WINDOW_HEIGHT / 8, 2);
+    Vector2* signal_points = malloc(sizeof(Vector2) * synth->out_signal->sample_count);
+    const float screen_vertical_midpoint = (WINDOW_HEIGHT/2);
+    for (int point_idx = 0; point_idx < synth->out_signal->sample_count; point_idx++)
+    {
+        signal_points[point_idx].x = (float)point_idx + OSCILLATOR_PANEL_WIDTH;
+        signal_points[point_idx].y = screen_vertical_midpoint + (int)(synth->out_signal->samples[point_idx] * 300);
+    }
+    DrawLineStrip(signal_points, synth->out_signal->sample_count, RED);
+}
+
+
 //------------------------------------------------------------------------------------
 // Main
 //------------------------------------------------------------------------------------
@@ -145,19 +309,35 @@ int main(int argc, char **argv) {
     InitWindow(WINDOW_WIDTH, WINDOW_HEIGHT, "SeeSynth - v0.1");
     SetTargetFPS(60);
 
-    Note current_note = {
+    //todo: move that variables to Synth declaration
+    Note g_current_note = {
         .length = 1,
         .name = malloc(sizeof(char) * 3)
     };
 
-    SynthSound sound = {
+    SynthSound g_sound = {
         .sample_count = 0
     };
+
+    Synth synth = {
+        .current_note = g_current_note,
+        .out_signal = &g_sound,
+        .oscillators = init_osc_array()
+    };
+    //todo: move somewhere in initialization
+    synth.ui_oscillators = malloc(sizeof(OscillatorUI) * synth.oscillators.count);
+    for (size_t i = 0; i < synth.oscillators.count; i++)
+    {
+        OscillatorUI* ui = &synth.ui_oscillators[i];
+        ui->freq = synth.oscillators.array[i].freq;
+        ui->waveshape = synth.oscillators.array[i].osc;
+        ui->volume = synth.oscillators.array[i].volume;
+    }
+    
     int sound_played_count = 0;
     float temp_buffer[STREAM_BUFFER_SIZE];
     RingBuffer ring_buffer = ring_buffer_init(STREAM_BUFFER_SIZE);
 
-
     InitAudioDevice();
     SetMasterVolume(SYNTH_VOLUME);
     SetAudioStreamBufferSizeDefault(STREAM_BUFFER_SIZE);
@@ -172,25 +352,26 @@ int main(int argc, char **argv) {
         // Update Audio states
         //----------------------------------------------------------------------------------
         // Fill ring buffer from current sound
+        SynthSound* sound = synth.out_signal;
         size_t size_for_buffer = 0;
-        if (!ring_buffer.is_full && sound.sample_count != sound_played_count) {
+        if (!ring_buffer.is_full && sound->sample_count != sound_played_count) {
             write_log("[INFO] IsFull:%d Samples:%zu Played:%zu\n", 
                 ring_buffer.is_full, 
-                sound.sample_count, 
+                sound->sample_count, 
                 sound_played_count);
             
             // how many samples need write
             size_t size_to_fill = 0;
             
-            if ((sound.sample_count - sound_played_count) > ring_buffer.size) {
+            if ((sound->sample_count - sound_played_count) > ring_buffer.size) {
                 size_to_fill = ring_buffer.size;
             } else {
-                size_to_fill = sound.sample_count - sound_played_count;
+                size_to_fill = sound->sample_count - sound_played_count;
             }
 
             write_log("[INFO] SizeToFill:%zu\n", size_to_fill);
             for (size_t i = 0; i < size_to_fill; i++) {
-                temp_buffer[i] = sound.samples[i];
+                temp_buffer[i] = sound->samples[i];
             }
             
             ring_buffer_write(&ring_buffer, temp_buffer, size_to_fill);
@@ -207,7 +388,7 @@ int main(int argc, char **argv) {
                 // can try the SetAudioStreamCallback
                 UpdateAudioStream(synth_stream, temp_buffer, size_to_read);
                 // can overwrite the ring buffer to avoid that
-                if (sound.sample_count == sound_played_count) {
+                if (sound->sample_count == sound_played_count) {
                     ring_buffer_reset(&ring_buffer);
                 }
         }
@@ -215,8 +396,9 @@ int main(int argc, char **argv) {
         
         // Update On Input
         //----------------------------------------------------------------------------------
+        Note current_note = synth.current_note;
         if (detect_note_pressed(&current_note)) {
-            sound = get_note_sound(current_note);
+            *sound = get_note_sound(&synth, current_note);
             sound_played_count = 0;
             write_log("Note played: %s\n", current_note.name);
         }
@@ -227,8 +409,10 @@ int main(int argc, char **argv) {
         BeginDrawing();
  
             ClearBackground(RAYWHITE);
-            DrawText("Congrats! You created your first window!", 190, 200, 20, LIGHTGRAY);
+            DrawUi(&synth);
-            DrawFPS(0,0);
+            DrawSignal(&synth);
+            //DrawText("Congrats! You created your first window!", 190, 200, 20, LIGHTGRAY);
+            //DrawFPS(0,0);
  
         EndDrawing();
         //----------------------------------------------------------------------------------
@@ -242,7 +426,7 @@ int main(int argc, char **argv) {
     SynthSound* sounds = malloc(sizeof(SynthSound) * note_array.count);
     for (size_t i = 0; i < note_array.count; i++) {
         Note note = note_array.notes[i];
-        sounds[i] = get_note_sound(note);
+        sounds[i] = get_note_sound(&synth, note);
     }
 
     SynthSound song = concat_sounds(sounds, note_array.count);

oscillator.c

@@ -46,19 +46,19 @@ static float sawosc(float hz, float x) {
 float multiosc(OscillatorGenerationParameter param) {
     float osc_sample = 0.f;
     for (size_t i = 0; i < param.oscillators.count; i++) {
-        OscillatorParameter osc = param.oscillators.array[i];
+        Oscillator osc = param.oscillators.array[i];
         switch (osc.osc) {
             case Sine:
-                osc_sample += sineosc(osc.freq, param.sample);
+                osc_sample += sineosc(osc.freq, param.sample) * osc.volume;
                 break;
             case Triangle:
-                osc_sample += triangleosc(osc.freq, param.sample);
+                osc_sample += triangleosc(osc.freq, param.sample) * osc.volume;
                 break;
             case Square:
-                osc_sample += squareosc(osc.freq, param.sample);
+                osc_sample += squareosc(osc.freq, param.sample) * osc.volume;
                 break;
             case Saw:
-                osc_sample += sawosc(osc.freq, param.sample);
+                osc_sample += sawosc(osc.freq, param.sample) * osc.volume;
                 break;
         }
     }
@@ -66,7 +66,7 @@ float multiosc(OscillatorGenerationParameter param) {
     return osc_sample;
 }
 
-SynthSound freq(float duration, OscillatorParameterList osc) {
+SynthSound freq(float duration, OscillatorArray osc) {
     SynthSound samples = get_init_samples(duration);
     // SynthSound attack = get_attack_samples();
 
@@ -77,7 +77,7 @@ SynthSound freq(float duration, OscillatorParameterList osc) {
             .oscillators = osc,
             .sample = sample
         };
-        output[i] = multiosc(param) * VOLUME;
+        output[i] = multiosc(param);
     }
 
     // create attack and release

oscillator.h

@@ -2,7 +2,7 @@
 #define OSCILLATOR_H
 
 #include "utils.h"
-
+#define WAVE_SHAPE_OPTIONS "Sine;Triangle;Sawtooth;Square"
 typedef enum {
     Sine,
     Triangle,
@@ -10,23 +10,24 @@ typedef enum {
     Square
 } OscillatorType;
 
-typedef struct OscillatorParameter {
+typedef struct Oscillator {
     OscillatorType osc;
     float freq;
-} OscillatorParameter;
+    float volume;
+} Oscillator;
 
-typedef struct OscillatorParameterList {
+typedef struct OscillatorArray {
-    OscillatorParameter* array;
+    Oscillator* array;
     size_t count;
-} OscillatorParameterList;
+} OscillatorArray;
 
 typedef struct OscillatorGenerationParameter {
-    OscillatorParameterList oscillators;
+    OscillatorArray oscillators;
     float sample;
 } OscillatorGenerationParameter;
 
 float multiosc(OscillatorGenerationParameter param);
-SynthSound freq(float duration, OscillatorParameterList osc);
+SynthSound freq(float duration, OscillatorArray osc);
 
 
 

settings.h

@@ -14,5 +14,6 @@
 
 #define WINDOW_WIDTH 640
 #define WINDOW_HEIGHT 480
+#define OSCILLATOR_PANEL_WIDTH 200
 
 #endif