Syphon / Processing

Syphon Implementation for Processing
Other
137 stars 33 forks source link

Mask does not appear in syphon feed. #32

Open Tenkir opened 7 years ago

Tenkir commented 7 years ago

I have an alpha mask that I'm using on the canvas. It works fine in the processing image, but when viewing the syphon feed, I only see the base layer. The mask and anything after are not rendered.

import processing.video.*;
import codeanticode.syphon.*;

PGraphics canvas;
SyphonServer server;
PImage mask;
PImage lines;
PImage backdrop;
Movie background;

void setup() {
  size(1920,1080, P3D);
  canvas = createGraphics(1920, 1080, P3D);
  mask = loadImage("alpha_mask.png");
  backdrop = loadImage("white_backdrop.png");
  background = new Movie(this, "finalimage_1.mov");
  background.loop();

  // Create syhpon server to send frames out.
  server = new SyphonServer(this, "Processing Syphon");
}

void draw() {
  canvas.beginDraw();
  canvas.background(100);
  canvas.image(background, 420, 0);
  canvas.mask(mask);
  canvas.image(backdrop, 0, 0);
  canvas.endDraw();
  image(canvas, 0, 0);
  server.sendImage(canvas);
}

void movieEvent(Movie m) {
  m.read();
}

Processing Window:

screen shot 2017-09-22 at 12 07 44 am

MadMapper:

screen shot 2017-09-22 at 12 07 55 am
vade commented 7 years ago

Ensure both apps agree on premultiplied vs unpremultiplied alpha. No idea what Processing's mask option does but my guess is your alpha is not premultiplied in Processing.

vade commented 7 years ago

Ensure your target app and destination app both use premultiplied or unpremulitplied alpha. Syphon doesn't care what you use but you do have to agree.

Sent from my iPhone

On Sep 22, 2017, at 6:07 AM, Jonathan Blair notifications@github.com wrote:

I have an alpha mask that I'm using on the canvas. It works fine in the processing image, but when viewing the syphon feed, I only see the base layer. The mask and anything after are not rendered.

import processing.video.; import codeanticode.syphon.;

PGraphics canvas; SyphonServer server; PImage mask; PImage lines; PImage backdrop; Movie background;

void setup() { size(1920,1080, P3D); canvas = createGraphics(1920, 1080, P3D); mask = loadImage("alpha_mask.png"); backdrop = loadImage("white_backdrop.png"); background = new Movie(this, "finalimage_1.mov"); background.loop();

// Create syhpon server to send frames out. server = new SyphonServer(this, "Processing Syphon"); }

void draw() { canvas.beginDraw(); canvas.background(100); //canvas.image(background, 420, 0); //canvas.mask(mask); canvas.image(backdrop, 0, 0); canvas.endDraw(); image(canvas, 0, 0); server.sendImage(canvas); }

void movieEvent(Movie m) { m.read(); } — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or mute the thread.

bangnoise commented 7 years ago

I thought this sounded like it might be a real issue, but I can't get canvas.mask() to have any effect within Processing. If you can attach a minimal sketch folder with images to demonstrate the problem, I'll take a look.

codeanticode commented 2 years ago

Revising very old issues, just for fun :-)

In this case, what's happening is that the texture that's backing the rendering surface (either onscreen or offscreen) is not updated with the output from the filter (mask() in P2D/P3D internally calls filter()), for some reason (it should, so opened a bug about this in the main processing4 repo: https://github.com/processing/processing4/issues/449).

But, it gets full updated in the next frame, so one temporary workaround is to move the server.sendImage(canvas) call to the top of the draw() function.

A shorter example demonstrating the workaround. Original code (filter output does not show up in the receiveFrames sketch)

import codeanticode.syphon.*;

PGraphics canvas;
SyphonServer server;

PShader edges;

void setup() { 
  size(400,400, P3D);
  canvas = createGraphics(400, 400, P3D);
  edges = loadShader("edges.glsl");

  // Create syhpon server to send frames out.
  server = new SyphonServer(this, "Processing Syphon");
}

void draw() {  
  canvas.beginDraw();
  canvas.background(127);
  canvas.lights();
  canvas.translate(width/2, height/2);
  canvas.rotateX(frameCount * 0.01);
  canvas.rotateY(frameCount * 0.01);  
  canvas.box(150);
  canvas.filter(THRESHOLD);
  canvas.endDraw();
  image(canvas, 0, 0);
 server.sendImage(canvas);
}

Modified code (it works as expected):

void draw() {
  server.sendImage(canvas);
  canvas.beginDraw();
  canvas.background(127);
  ...

Also worth noting that the issue affects both the filter() function that takes only predetermined filters and the one with the PShader argument.