Skip to content

Camanjs event system

meltingice edited this page Feb 28, 2011 · 2 revisions

Caman Events

Currently CamanJS has three different events you can listen for, and it is very simple to add new events if you need to.
  • processStart
    • fired when a single image filter begins manipulating an image
  • processComplete
    • fired when a single image filter finishes manipulating an image
  • renderFinished
    • fired when all image filters are done and an image is finished being rendered

To listen for events from any Caman process:

Caman.listen("processStart", function (e) {
  console.log(e.id); // ID of canvas
  console.log(e.start); // process that's starting
});

You can also target a specific Caman process and listen to events from only that one process:

var camanTest = Caman("#test", function () {
  this.brightness(5).render();
});

Caman.listen(camanTest, "processStart", function (e) {
  console.log(e);
});

You may also find this extremely handy:

Caman('img/example.jpg', '#image-caman', function () {
  this.contrast(25);
  this.hue(5);
  this.colorize('#AF3D15', 25);
  this.saturation(-30);
  this.brightness(5);
  
  // Callback to render() fires when this image is done rendering.
  this.render(function () {
    console.log("Image finished rendering!");
  });
});

Clone this wiki locally