title: How to resize a canvas on resizing?
body: <p>I'm using this plugin: <a href="https://codepen.io/acauamontiel/pen/mJdnw" rel="nofollow noreferrer">https://codepen.io/acauamontiel/pen/mJdnw</a></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>/*
   * requestAnimationFrame pollyfill
   */
  if (!window.requestAnimationFrame) {
   window.requestAnimationFrame = (window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.msRequestAnimationFrame || window.oRequestAnimationFrame || function (callback) {
    return window.setTimeout(callback, 1000 / 60);
   });
  }
  
  /*!
   * Mantis.js / jQuery / Zepto.js plugin for Constellation
   * @version 1.2.2
   * @author Acauã Montiel &lt;contato@acauamontiel.com.br&gt;
   * @license http://acaua.mit-license.org/
   */
  (function ($, window) {
   /**
    * Makes a nice constellation on canvas
    * @constructor Constellation
    */
   function Constellation (canvas, options) {
    var $canvas = $(canvas),
     context = canvas.getContext('2d'),
     defaults = {
      star: {
       color: 'rgba(255, 255, 255, .5)',
       width: 1,
       randomWidth: true
      },
      line: {
       color: 'rgba(255, 255, 255, .5)',
       width: 0.2
      },
      position: {
       x: 0, // This value will be overwritten at startup
       y: 0 // This value will be overwritten at startup
      },
      width: window.innerWidth,
      height: window.innerHeight,
      velocity: 0.1,
      length: 100,
      distance: 120,
      radius: 150,
      stars: []
     },
     config = $.extend(true, {}, defaults, options);
  
    function Star () {
     this.x = Math.random() * canvas.width;
     this.y = Math.random() * canvas.height;
  
     this.vx = (config.velocity - (Math.random() * 0.5));
     this.vy = (config.velocity - (Math.random() * 0.5));
  
     this.radius = config.star.randomWidth ? (Math.random() * config.star.width) : config.star.width;
    }
  
    Star.prototype = {
     create: function(){
      context.beginPath();
      context.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
      context.fill();
     },
  
     animate: function(){
      var i;
      for (i = 0; i &lt; config.length; i++) {
  
       var star = config.stars[i];
  
       if (star.y &lt; 0 || star.y &gt; canvas.height) {
        star.vx = star.vx;
        star.vy = - star.vy;
       } else if (star.x &lt; 0 || star.x &gt; canvas.width) {
        star.vx = - star.vx;
        star.vy = star.vy;
       }
  
       star.x += star.vx;
       star.y += star.vy;
      }
     },
  
     line: function(){
      var length = config.length,
       iStar,
       jStar,
       i,
       j;
  
      for (i = 0; i &lt; length; i++) {
       for (j = 0; j &lt; length; j++) {
        iStar = config.stars[i];
        jStar = config.stars[j];
  
        if (
         (iStar.x - jStar.x) &lt; config.distance &amp;&amp;
         (iStar.y - jStar.y) &lt; config.distance &amp;&amp;
         (iStar.x - jStar.x) &gt; - config.distance &amp;&amp;
         (iStar.y - jStar.y) &gt; - config.distance
        ) {
         if (
          (iStar.x - config.position.x) &lt; config.radius &amp;&amp;
          (iStar.y - config.position.y) &lt; config.radius &amp;&amp;
          (iStar.x - config.position.x) &gt; - config.radius &amp;&amp;
          (iStar.y - config.position.y) &gt; - config.radius
         ) {
          context.beginPath();
          context.moveTo(iStar.x, iStar.y);
          context.lineTo(jStar.x, jStar.y);
          context.stroke();
          context.closePath();
         }
        }
       }
      }
     }
    };
  
    this.createStars = function () {
     var length = config.length,
      star,
      i;
  
     context.clearRect(0, 0, canvas.width, canvas.height);
  
     for (i = 0; i &lt; length; i++) {
      config.stars.push(new Star());
      star = config.stars[i];
  
      star.create();
     }
  
     star.line();
     star.animate();
    };
  
    this.setCanvas = function () {
     canvas.width = config.width;
     canvas.height = config.height;
    };
  
    this.setContext = function () {
     context.fillStyle = config.star.color;
     context.strokeStyle = config.line.color;
     context.lineWidth = config.line.width;
    };
  
    this.setInitialPosition = function () {
     if (!options || !options.hasOwnProperty('position')) {
      config.position = {
       x: canvas.width * 0.5,
       y: canvas.height * 0.5
      };
     }
    };
  
    this.loop = function (callback) {
     callback();
  
     window.requestAnimationFrame(function () {
      stats.begin(); // Only for Stats
      this.loop(callback);
      stats.end(); // Only for Stats
     }.bind(this));
    };
  
    this.bind = function () {
     $canvas.on('mousemove', function(e){
      config.position.x = e.pageX - $canvas.offset().left;
      config.position.y = e.pageY - $canvas.offset().top;
     });
    };
  
    this.init = function () {
     this.setCanvas();
     this.setContext();
     this.setInitialPosition();
     this.loop(this.createStars);
     this.bind();
    };
   }
  
   $.fn.constellation = function (options) {
    return this.each(function () {
     var c = new Constellation(this, options);
     c.init();
    });
   };
  })($, window);
  
  // Init plugin
  $('canvas').constellation({
   star: {
    width: 3
   },
   line: {
    color: 'rgba(255, 0, 0, .5)'
   },
   radius: 250
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>body {
    overflow: hidden;
    background: #111;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;canvas&gt;&lt;/canvas&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>As you can see, when you resize your screen, the canvas keeps the original width and height, I would like to give the capacity to resize the window and do like a restart on the plugin to keep it fullscreen.</p>