Share
Explore

icon picker
Full PDF Document Preview

​
Bill French
When we think of including PDF documents in a Coda app, the typical reaction is — ... this user experience is not helpful.
⁠
image.png
⁠
⁠

What would be better?

Well, this is the requirements bar we set at Stream It:
Must provide full in-line PDF document preview with scrolling.
Must support expanded larger view with one click.
Dynamic preview sizing in tables.
Drag-and-drop additions; no custom or document-dependent formula edits.
The number-one requirement from users I've spoken with is the ability to scroll (or swipe) in the preview thumbnail because that's how users find specific passages. Lacking the ability to perform a full text search, this is obviously the next best thing.
Coda checks all of these boxes if you know how to extract the URL of a Coda-bound file and embed it in a Canvas field. This document exposes these details.

Extracting the Coda URL for PDF Files

This is achieved with a formula in the hidden field PDF URL. It’s a little tricky but highly useful.
ParseJson(_Merge(thisRow.[PDF File]) + "", "#/publicUrl")

Embedding in a Canvas

With the URL for each file, it’s now possible to embed the document into a canvas field.
Embed(thisRow.[PDF URL])
In this example, I’ve embedded the formula in each canvas item for demonstration purposes, but at Stream It, we tend to use canvas templates in cases like this. There’s a good discussion of templating canvasses
here
⁠
and
here
⁠
.
In-line Previews
image.png
⁠
⁠
⁠
Expanded In-line View
image.png
⁠
⁠


Preview PDF Files
0
Name
PDF File
Canvas
1
Stream It & Human Trafficking
Stream It TLAHT Initiative.pdf
⁠
Loading…
⁠
⁠
Open
2
Stream It: Deception
Stream It_ Deception.pdf
⁠
Loading…
⁠
⁠
Open
3
Stream It: Vehicle Geo-fencing
Stream It Geo Fencing Brochure 20200309.pdf
⁠
Loading…
⁠
⁠
Open
There are no rows in this table
⁠

Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.