title: Displaying/Converting PDF Documents and Google Apps Script
body: <p>I have been trying to learn google apps script in an attempt to reduce my reliance on excel due to macros. I have been trying to learn it by creating something. I have half created a double entry accounting system using spreadsheets so I can automatically create invoices, record expenses and reconcile against bank transactions.</p>
  
  <p>The bit where I am a bit stuck is importing expense receipts. I have been using the google drive app on my phone to scan receipts which produces a pdf and uploads to google drive. It is a handy app as it is very easy to resize, rename and upload.</p>
  
  <p>What I want is to is to create a script which will pick up a file (image or pdf) from a folder and display the file on one side of the screen and then have fields such as date, category, amount etc so I can read them and input the data all on one screen. Images are easy enough but I can't figure out how to do it with a pdf. Here is what I tried:</p>
  
  <p>1) Open the pdf as an image in UiApp</p>
  
  <pre><code>function openPdfAsImage(pdfUrl) {
    var app = UiApp.createApplication();
  
    app.add(app.createImage(pdfUrl));
  
    ss.show(app); // Display the app
  }
  </code></pre>
  
  <p>This didn't work as fair enough it is not an image. Trying to convert it to a blob and then to an image didn't work either as I can't convert a pdf blob to an image blob.</p>
  
  <p>PS as a side note, I found (thanks to stackoverflow) that I need to use the drive address eg "<a href="https://drive.google.com/a/appsaccount.com/fileIdNumberOrWhatever" rel="noreferrer">https://drive.google.com/a/appsaccount.com/fileIdNumberOrWhatever</a>", but as I am an apps for business user, is there any way to get this address via script rather than hard coding it?
  Answer: if anyone reads this you can get the url from:</p>
  
  <pre><code> var downloadUrl = DriveApp.getFilesById('YourFileId').getDownloadUrl();
  </code></pre>
  
  <p>2) I then tried to embed the document as there is an option from the viewer to get code for an iFrame. I tried this:</p>
  
  <pre><code>function openPdfAsImage(pdfUrl) {
    var ss = SpreadsheetApp.getActiveSpreadsheet(); 
    var app = UiApp.createApplication();
    app.add(app.createHTML('&lt;iframesrc="https://docs.google.com/a/appsaccount.com/file/d/0BxQjxnVa4KJffHaFBDsTzVUNCTDQ/preview" width="640" height="480"&gt;&lt;/iframe&gt;'));
    ss.show(app); // Display the app
  }
  </code></pre>
  
  <p>But alas this didn't work either as it doesn't seem to allow iframes</p>
  
  <p>3) I then tried to convert the pdf to a google document, then open the document and extract the images, display them. This works via the web when you force it to open a pdf as a document, it converts the pdf to a google doc and has the image on the first page and tries to reconstruct the text on the second page. I tried:</p>
  
  <pre><code>function getImagesFromPdf(pdfId) {
    // Open the pdf as a document, I hoped this would convert the file and put an
    // image into the google doc the same as if you open it via the web browser
  
    var pdfAsDoc = DocumentApp.openById(pdfId); // Instead it causes an error
  
    // Get the images out of the document
    var docImages = pdfAsDoc.getBody().getImages();
  
    return docImages;
  }
  </code></pre>
  
  <p>But not even this works, it just causes an error when you try and open a pdf. Even if it did work, I would then have to save the image back to google drive, get the google drive version of the URL so that it can be displayed in UiApp. Not sure why I can't pass an Image object to the UiApp.</p>
  
  <p>My options seem to be:</p>
  
  <ol>
  <li>Don't use google drive app on my phone to create the scans as this
  creates pdfs. I could just take photos instead but they don't look
  as good and are harder to manipulate. But even then sometimes I can't avoid having pdf receipts</li>
  <li>Use the google drive app but there is no way to set it to convert
  the pdf scans to google documents like there is the option for
  uploads on the web. Once they are on the web I can't find any way to
  convert them  to google docs using script, I can't even convert
  several files at the same time. The only way I have found is to
  download them all, then upload them and set it to convert to google
  docs. This seems like a very inefficient way of doing it when I am
  trying to create something using all google products</li>
  <li>Instead of using UiApp, create it using HTMLService so then I can
  use the iframe, but I know absolutely nothing about html and I don't
  really have a desire to learn it just to do this.</li>
  </ol>
  
  <p>Am I doing something wrong above? Or is there a simpler solution that I'm missing? It is very frustrating as all the functionality seems to exist, just not via script. Or as the answer doesn't seem to exist on here, does it mean I'm trying to use it in a way that was not intended?</p>
  
  <p>Any help/guidance/suggestions are much appreciated.</p>