Skip to content
Lauri-Matti Parppei edited this page May 23, 2023 · 4 revisions

NOTE: THIS PAGE IS EXPIRED. Previews no longer rely on HTML roundtrip. Further information will follow soon.

A live preview of the document is being created in the background when the user has stopped typing for a couple of seconds. You can access the preview data, either as-is, or by listening to when preview has been created.

Preview object

const preview = Beat.preview

preview.htmlString — HTML output used to display the preview
preview.previewUpdated — check if the latest preview has been finished and validated (true/false)
preview.paginator — access the paginator used by the preview

Listening to preview creation

Beat.onPreviewFinished({ 
    // Do something
})

Access the preview pagination

Further reading: Paginator

This example returns the page number of a given line.

let pageNumberOfLine = -1
Beat.onPreviewFinished(function () { 
    const lineInEditor = Beat.lines()[11] // Some random line

    const pages = Beat.preview.paginator.pages
    for (const page of pages) {
        for (const line of page) {
            if (lineInEditor.uuid == line.uuid) {
                // This line matches to a line in editor.
                // Return the page number (not index)
                pageNumberOfLine = pages.indexOf(page) + 1 
                return
            }
        }
    }
})