title: How to render a pdf file using pdf.js?
body: <p>I created an html file with content as below
  <strong>index.html</strong></p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;script type="text/javascript" src="./pdf.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="./hello.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;canvas id="the-canvas" style="border:1px solid black;"/&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>hello.js</strong> with content</p>
  
  <pre><code>PDFJS.disableWorker = true;
  var pf = PDFJS.getDocument('./helloworld.pdf')
  pf.then(function(pdf) {
    pdf.getPage(1).then(function(page) {
      var scale = 1.5;
      var viewport = page.getViewport(scale);
  
      //
      // Prepare canvas using PDF page dimensions
      //
      var canvas = document.getElementById('the-canvas');
      var context = canvas.getContext('2d');
      canvas.height = viewport.height;
      canvas.width = viewport.width;
  
      //
      // Render PDF page into canvas context
      //
      var renderContext = {
        canvasContext: context,
        viewport: viewport
      };
      page.render(renderContext);
    });
  });
  </code></pre>
  
  <p>But the pdf is not shown correctly when I point the browser to index.html.
  I want the user to be able to select a pdf file on his computer and show that pdf in browser window.</p>