GrabBlockee.js

GrabBlockee.js

// grab background: StreetView or uploaded
// 600 x 435 pixels
var bg = $('canvas')[1].parentNode.style.backgroundImage.substring(4);
bg = bg.substring(0, bg.length - 1);
var bgimage = new Image();
bgimage.onload = function(){

  // grab image from foreground canvas
  // 600 x 435 pixels to avoid menus
  var uppercanv = $('canvas')[1].getContext('2d').getImageData(0, 0, 600, 435);

  // paste background and foreground into a virtual canvas
  var outcanv = document.createElement('canvas');
  outcanv.width = '600';
  outcanv.height = '435';
  var outcanvctx = outcanv.getContext('2d');
  try{
    outcanvctx.drawImage(bgimage, 0, 0);
  }
  catch(e){
    console.log("Can't drawImage using images from third-party servers");
  }
  outcanvctx.putImageData(uppercanv, 0, 0);
  
  // proof of concept
  document.write('<img src="' + outcanv.toDataURL() + '"/>');
};
bgimage.src = bg;