141 lines
5.2 KiB
JavaScript
141 lines
5.2 KiB
JavaScript
// @link WebViewerInstance: https://www.pdftron.com/api/web/WebViewerInstance.html
|
|
// @link UI.loadDocument: https://www.pdftron.com/api/web/UI.html#loadDocument__anchor
|
|
|
|
// @link DocumentViewer: https://www.pdftron.com/api/web/Core.DocumentViewer.html
|
|
|
|
// @link AnnotationManager: https://www.pdftron.com/api/web/Core.AnnotationManager.html
|
|
// @link AnnotationManager.addAnnotations: https://www.pdftron.com/api/web/Core.AnnotationManager.html#addAnnotations__anchor
|
|
// @link AnnotationManager.deleteAnnotations: https://www.pdftron.com/api/web/Core.AnnotationManager.html#deleteAnnotations__anchor
|
|
// @link AnnotationManager.selectAnnotations: https://www.pdftron.com/api/web/Core.AnnotationManager.html#selectAnnotations__anchor
|
|
// @link AnnotationManager.getAnnotationsList: https://www.pdftron.com/api/web/Core.AnnotationManager.html#getAnnotationsList__anchor
|
|
|
|
// @link Annotations: https://www.pdftron.com/api/web/Annotations.html
|
|
|
|
// @link Document: https://www.pdftron.com/api/web/Core.Document.html
|
|
// @link Document.loadPageText: https://www.pdftron.com/api/web/Core.Document.html#loadPageText__anchor
|
|
// @link Document.getTextPosition: https://www.pdftron.com/api/web/Core.Document.html#getTextPosition__anchor
|
|
|
|
const viewerElement = document.getElementById('viewer');
|
|
WebViewer(
|
|
{
|
|
path: '../../../lib',
|
|
|
|
initialDoc: 'https://pdftron.s3.amazonaws.com/downloads/pl/legal-contract.pdf',
|
|
},
|
|
viewerElement
|
|
).then(instance => {
|
|
samplesSetup(instance);
|
|
const { documentViewer, annotationManager, Annotations } = instance.Core;
|
|
|
|
const renderCheckBoxes = pageCount => {
|
|
const pagesDiv = document.getElementById('pages');
|
|
let pageNumber;
|
|
const checkboxes = [];
|
|
|
|
for (pageNumber = 1; pageNumber <= pageCount; pageNumber++) {
|
|
const input = document.createElement('input');
|
|
/* eslint-disable prefer-template */
|
|
input.id = `page-${pageNumber}`;
|
|
input.type = 'checkbox';
|
|
input.checked = false;
|
|
input.value = pageNumber;
|
|
|
|
checkboxes.push(input);
|
|
|
|
const label = document.createElement('label');
|
|
label.htmlFor = `page-${pageNumber}`;
|
|
label.innerHTML = `Page ${pageNumber}`;
|
|
|
|
const lineBreak = document.createElement('br');
|
|
|
|
pagesDiv.appendChild(input);
|
|
pagesDiv.appendChild(label);
|
|
pagesDiv.appendChild(lineBreak);
|
|
}
|
|
|
|
return checkboxes;
|
|
};
|
|
|
|
const highlightText = (searchText, pageNumber) => {
|
|
const doc = documentViewer.getDocument();
|
|
|
|
// gets all text on the requested page
|
|
// see https://pdftron.com/api/web/Core.Document.html#loadPageText__anchor
|
|
doc.loadPageText(pageNumber).then(text => {
|
|
let textStartIndex = 0;
|
|
let textIndex;
|
|
const annotationPromises = [];
|
|
|
|
// find the position of the searched text and add text highlight annotation at that location
|
|
while ((textIndex = text.indexOf(searchText, textStartIndex)) > -1) {
|
|
textStartIndex = textIndex + searchText.length;
|
|
// gets quads for each of the characters from start to end index. Then,
|
|
// resolve the annotation and return.
|
|
// see https://pdftron.com/api/web/Core.Document.html#getTextPosition__anchor
|
|
const annotationPromise = doc.getTextPosition(pageNumber, textIndex, textIndex + searchText.length).then(quads => {
|
|
const annotation = new Annotations.TextHighlightAnnotation();
|
|
annotation.Author = annotationManager.getCurrentUser();
|
|
annotation.PageNumber = pageNumber;
|
|
annotation.Quads = quads;
|
|
annotation.StrokeColor = new Annotations.Color(0, 255, 255);
|
|
return annotation;
|
|
});
|
|
annotationPromises.push(annotationPromise);
|
|
}
|
|
|
|
// Wait for all annotations to be resolved.
|
|
Promise.all(annotationPromises).then(annotations => {
|
|
annotationManager.addAnnotations(annotations);
|
|
annotationManager.selectAnnotations(annotations);
|
|
});
|
|
});
|
|
};
|
|
|
|
const removeHighlightedText = pageNumber => {
|
|
const annotations = annotationManager.getAnnotationsList().filter(annotation => {
|
|
return annotation.PageNumber === pageNumber;
|
|
});
|
|
annotationManager.deleteAnnotations(annotations);
|
|
};
|
|
|
|
documentViewer.addEventListener('documentLoaded', () => {
|
|
const textInput = document.getElementById('text');
|
|
const checkboxes = renderCheckBoxes(documentViewer.getPageCount());
|
|
|
|
checkboxes.forEach(checkbox => {
|
|
checkbox.addEventListener('change', () => {
|
|
const pageNumber = Number(checkbox.value);
|
|
|
|
if (checkbox.checked && textInput.value) {
|
|
highlightText(textInput.value, pageNumber);
|
|
} else {
|
|
removeHighlightedText(pageNumber);
|
|
}
|
|
});
|
|
});
|
|
|
|
textInput.addEventListener(
|
|
'input',
|
|
// debounce loaded elsewhere
|
|
// eslint-disable-next-line
|
|
debounce(() => {
|
|
checkboxes.forEach(checkbox => {
|
|
const pageNumber = Number(checkbox.value);
|
|
|
|
if (checkbox.checked) {
|
|
removeHighlightedText(pageNumber);
|
|
|
|
if (textInput.value) {
|
|
highlightText(textInput.value, pageNumber);
|
|
}
|
|
}
|
|
});
|
|
}, 200)
|
|
);
|
|
|
|
// highlight search text in the first page by default
|
|
checkboxes[0].checked = true;
|
|
highlightText(textInput.value, 1);
|
|
});
|
|
});
|