Share
Explore

Full PDF Document Preview

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
and
.
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
This link can't be embedded.
Open
2
Stream It: Deception
Stream It_ Deception.pdf
This link can't be embedded.
Open
3
Stream It: Vehicle Geo-fencing
Stream It Geo Fencing Brochure 20200309.pdf
This link can't be embedded.
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.