Add saturation effect

Resources/oscilloscope/oscilloscope.html

@@ -105,6 +105,7 @@
         mainGain : 0.0,
         brightness : 0.0,
         intensity: 0.02,
+        saturation: 1.0,
         hue : 125,
         invertXY : false,
         grid : true,
@@ -438,9 +439,17 @@
     uniform sampler2D uTexture2; //big glow
     uniform sampler2D uTexture3; //screen
     uniform float uExposure;
+    uniform float uSaturation;
     uniform vec3 uColour;
     varying vec2 vTexCoord;
     varying vec2 vTexCoordCanvas;
+    
+    vec3 desaturate(vec3 color, float factor) {
+        vec3 lum = vec3(0.299, 0.587, 0.114);
+        vec3 gray = vec3(dot(lum, color));
+        return vec3(mix(color, gray, factor));
+    }
+    
     void main (void)
     {
     	vec4 line = texture2D(uTexture0, vTexCoordCanvas);
@@ -453,7 +462,8 @@
     	float tlight = 1.0-pow(2.0, -uExposure*light);
     	float tlight2 = tlight*tlight*tlight;
     	gl_FragColor.rgb = mix(uColour, vec3(1.0), 0.3+tlight2*tlight2*0.5)*tlight;
-        gl_FragColor.a= 1.0;
+        gl_FragColor.rgb = desaturate(gl_FragColor.rgb, 1.0 - uSaturation);
+        gl_FragColor.a = 1.0;
     }
 </script>
 

Resources/oscilloscope/oscilloscope.js

@@ -165,6 +165,7 @@ var Render =
 		this.outputShader.uTexture2 = gl.getUniformLocation(this.outputShader, "uTexture2");
 		this.outputShader.uTexture3 = gl.getUniformLocation(this.outputShader, "uTexture3");
 		this.outputShader.uExposure = gl.getUniformLocation(this.outputShader, "uExposure");
+        this.outputShader.uSaturation = gl.getUniformLocation(this.outputShader, "uSaturation");
 		this.outputShader.uColour = gl.getUniformLocation(this.outputShader, "uColour");
 		this.outputShader.uResizeForCanvas = gl.getUniformLocation(this.outputShader, "uResizeForCanvas");
 
@@ -302,6 +303,7 @@ var Render =
 		var brightness = Math.pow(2, controls.brightness-2.0);
 		//if (controls.disableFilter) brightness *= Filter.steps;
 		gl.uniform1f(this.outputShader.uExposure, brightness);
+        gl.uniform1f(this.outputShader.uSaturation, controls.saturation);
 		gl.uniform1f(this.outputShader.uResizeForCanvas, this.lineTexture.width/1024);
 		var colour = this.getColourFromHue(controls.hue);
 		gl.uniform3fv(this.outputShader.uColour, colour);
@@ -677,6 +679,7 @@ function doScriptProcessor(bufferBase64) {
 			controls.brightness = settings.brightness;
 			controls.intensity = settings.intensity;
 			controls.persistence = settings.persistence;
+            controls.saturation = settings.saturation;
 			controls.hue = settings.hue;
 			controls.disableFilter = !settings.upsampling;
 			let numChannels = settings.numChannels;

Source/PluginProcessor.cpp

@@ -153,6 +153,7 @@ OscirenderAudioProcessor::OscirenderAudioProcessor()
     permanentEffects.push_back(visualiserParameters.intensityEffect);
     permanentEffects.push_back(visualiserParameters.persistenceEffect);
     permanentEffects.push_back(visualiserParameters.hueEffect);
+    permanentEffects.push_back(visualiserParameters.saturationEffect);
 
     for (int i = 0; i < 26; i++) {
         addLuaSlider();

Source/SosciPluginProcessor.cpp

@@ -24,6 +24,7 @@ SosciAudioProcessor::SosciAudioProcessor()
     allEffects.push_back(parameters.intensityEffect);
     allEffects.push_back(parameters.persistenceEffect);
     allEffects.push_back(parameters.hueEffect);
+    allEffects.push_back(parameters.saturationEffect);
 
     for (auto effect : allEffects) {
         for (auto effectParameter : effect->parameters) {

Source/components/VisualiserSettings.cpp

@@ -8,6 +8,7 @@ VisualiserSettings::VisualiserSettings(VisualiserParameters& parameters, int num
     addAndMakeVisible(intensity);
 	addAndMakeVisible(persistence);
     addAndMakeVisible(hue);
+    addAndMakeVisible(saturation);
     addAndMakeVisible(graticuleToggle);
     addAndMakeVisible(smudgeToggle);
     addAndMakeVisible(upsamplingToggle);
@@ -16,6 +17,7 @@ VisualiserSettings::VisualiserSettings(VisualiserParameters& parameters, int num
     intensity.setSliderOnValueChange();
     persistence.setSliderOnValueChange();
     hue.setSliderOnValueChange();
+    saturation.setSliderOnValueChange();
 }
 
 VisualiserSettings::~VisualiserSettings() {}
@@ -27,6 +29,7 @@ void VisualiserSettings::resized() {
     intensity.setBounds(area.removeFromTop(rowHeight));
     persistence.setBounds(area.removeFromTop(rowHeight));
     hue.setBounds(area.removeFromTop(rowHeight));
+    saturation.setBounds(area.removeFromTop(rowHeight));
     graticuleToggle.setBounds(area.removeFromTop(rowHeight));
     smudgeToggle.setBounds(area.removeFromTop(rowHeight));
     upsamplingToggle.setBounds(area.removeFromTop(rowHeight));
@@ -37,6 +40,7 @@ juce::var VisualiserSettings::getSettings() {
     settings->setProperty("brightness", parameters.brightnessEffect->getActualValue() - 2);
     settings->setProperty("intensity", parameters.intensityEffect->getActualValue() / 100);
     settings->setProperty("persistence", parameters.persistenceEffect->getActualValue() - 1.33);
+    settings->setProperty("saturation", parameters.saturationEffect->getActualValue());
     settings->setProperty("hue", parameters.hueEffect->getActualValue());
     settings->setProperty("graticule", parameters.graticuleEnabled->getBoolValue());
     settings->setProperty("smudges", parameters.smudgesEnabled->getBoolValue());

Source/components/VisualiserSettings.h

@@ -51,6 +51,14 @@ public:
             VERSION_HINT, 3.0, 0.0, 10.0
         )
     );
+    std::shared_ptr<Effect> saturationEffect = std::make_shared<Effect>(
+        new EffectParameter(
+            "Saturation",
+            "Controls how saturated the colours are on the oscilloscope.",
+            "saturation",
+            VERSION_HINT, 1.0, 0.0, 5.0
+        )
+    );
 };
 
 class VisualiserSettings : public juce::Component {
@@ -69,6 +77,7 @@ private:
     EffectComponent intensity{*parameters.intensityEffect};
     EffectComponent persistence{*parameters.persistenceEffect};
     EffectComponent hue{*parameters.hueEffect};
+    EffectComponent saturation{*parameters.saturationEffect};
     
     jux::SwitchButton graticuleToggle{parameters.graticuleEnabled};
     jux::SwitchButton smudgeToggle{parameters.smudgesEnabled};