title: Resize canvas Objects in fabric on resize to fit canvas new size
body: <p>I need to calculate the objects scale to fit new canvas size on resize, I will explain better with pictures, for example we have this case:</p>
  
  <p><a href="https://i.stack.imgur.com/XO9C3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XO9C3.png" alt="canvas objects before applying the resize"></a></p>
  
  <p><a href="https://i.stack.imgur.com/blNDI.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/blNDI.png" alt="canvas objects after resize"></a></p>
  
  <p>another example:</p>
  
  <p><a href="https://i.stack.imgur.com/acVC2.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/acVC2.png" alt="enter image description here"></a>
  <a href="https://i.stack.imgur.com/qAmRZ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/qAmRZ.png" alt="enter image description here"></a></p>
  
  <p>So the objects needs to be resized proportionally in different screens and resolutions and I don't want to exceed/overflow the canvas size </p>
  
  <p>for example in this <a href="http://jsfiddle.net/davidtorroija/5KKQ2/809/" rel="nofollow noreferrer">fiddle</a> I need to this objects to strech and fit all the free space in the canvas.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var canvas  = new fabric.Canvas('c');
  
  var shadow = {
      color: 'rgba(0,0,0,0.6)',
      blur: 20,    
      offsetX: 10,
      offsetY: 10,
      opacity: 0.6,
      fillShadow: true, 
      strokeShadow: true 
  }
  
   var rect = new fabric.Rect({
          left: 100,
          top: 100,
          fill:  "#FF0000",
          stroke: "#000",
          width: 100,
          height: 100,
          strokeWidth: 10, 
          opacity: .8      
      });
      
    var rect1 = new fabric.Rect({
          left: 50,
          top: 100,
          fill:  "#f0ff00",
          stroke: "#000",
          width: 80,
          height: 80,
          strokeWidth: 10, 
          opacity: .8      
      });
     
  rect.setShadow(shadow);
  canvas.add(rect);
  canvas.add(rect1);</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#c{
    border:1px solid blue;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.6.4/fabric.js"&gt;&lt;/script&gt;
  &lt;canvas id="c" width="300" height="300"&gt;&lt;/canvas&gt;</code></pre>
  </div>
  </div>
  </p>