title: send p5.js image to server
body: <p>I captured an image from <code>createcapture()</code> through a webcam. Using <code>image()</code>, I got the image onto the canvas. Using <code>saveframes()</code>, and a callback, I was able to send the image to a server, but the image size is very big and I want the image to be <code>100 x 100</code> pixels every time whatever may be the size of image from <code>saveframes()</code> before sending it to server.</p>
  
  <pre><code>var x = window.innerWidth * 0.5;
  var y = window.innerHeight * 0.75;
  function setup()
  {
      cnv = createCanvas(x, y);
      videoInput = createCapture(VIDEO);
      videoInput.size(x, y);
      videoInput.hide();
  }
  function draw()
  {
      if (videoInput) {
          image(videoInput, 0, 0, x, y);
      }
  } 
  
  function image()
  {
      saveFrames('out','png',1,1,
          function(im) {
              console.log(im);
              console.log(typeof im[0]);
              // image Data is stored in im[0].imageData
              // convert the image to smaller size
              data.imageData = im[0].imageData;
              // data.imageData = Math.random();
          }
      );
      $.post('addname',data,function(result) {
          console.log("data sent", result);
      });
  }
  </code></pre>