Proper way of applying multiple changes with Camanjs

Question

On CamanJS there is an example of adding some effects and new layer:

Caman("#image", function () {
  // We can call any filter before the layer
  this.exposure(-10);

  // Create the layer
  this.newLayer(function () {
    // Change the blending mode
    this.setBlendingMode("multiply");

    // Change the opacity of this layer
    this.opacity(80);

    // Now we can *either* fill this layer with a
    // solid color...
    this.fillColor('#6899ba');

    // ... or we can copy the contents of the parent
    // layer to this one.
    this.copyParent();

    // Now, we can call any filter function though the
    // filter object.
    this.filter.brightness(10);
    this.filter.contrast(20);
  });

  // And we can call more filters after the layer
  this.clip(10);
  this.render();
});

It works ok. I've tried to add second layer by calling this code again with other parameters to image i've added layer before, but than the first layer dissapears.

On the website there are also examples how to add single effects. They are great, but they call only one filter at a time.

What i would like to acomplish is to, based on user settings, add for example one layer, two layers, or apply opacity and new layer.

And also i would like it to work every time on the base image, not the image effect from last filtering.

So, what is the proper way to change base image with multiple filters and layers according to user settings using CamanJS?

Answer 1

You probably figured this out by now, but you can call "this.revert(false)" after render to make sure you are editing the base image.

You can add multiple effects by calling all effects in the process and using if/then statements to determine user input. For example=

when button is clicked, x+=1 if (x%2===0){this.yourfilter();}

I'm just getting started though.