// Open this sketch up 9 times to send video back and forth

​

let myVideo;

let allVideos = [];

let vidWidth = 160;

let vidHeight = 120;

​

​

function setup() {

  createCanvas(480, 360);

​

  myVideo = createCapture(VIDEO, gotMineConnectOthers);

  myVideo.size(vidWidth, vidHeight);

  myVideo.hide();

  allVideos['Me'] = myVideo;

}

​

function gotMineConnectOthers(myStream) {

  let p5live = new p5LiveMedia(this, "CAPTURE", myStream, "arbitraryRoomName");

  p5live.on('stream', gotOtherStream);

  p5live.on('disconnect', lostOtherStream);

}

​

function draw() {

  background(220);

  stroke(255);

  let row = 0; //for making a grid

  let col = 0;

  for (var id in allVideos) {

    let thisStream = allVideos[id];

    let x = col * vidWidth;

    let y = row * vidHeight

    image(thisStream, x, y, vidWidth, vidHeight);

    stroke(0);

    text(id, x, y + 20);

    col++;

    if (col >= width/vidWidth) {

      col = 0;

      row++;

    }

  }

}

​

// We got a new stream!

function gotOtherStream(stream, id) {

  // This is just like a video/stream from createCapture(VIDEO)

  otherVideo = stream;

  otherVideo.size(vidWidth, vidHeight);

  allVideos[id] = otherVideo;

  otherVideo.hide();

}

​

function lostOtherStream(id) {

  print("lost connection " + id)

  delete allVideos[id];

}

​

​