Q: When I replace text using ContentReplacer, the new text is sometimes too small (creating additional whitespace) or too large (creating overlapping text). Is there a way to have the text reflow instead, perhaps using the new ContentEdit feature in WebViewer described at Text-edit | Apryse Documentation ?
A:
Yes, here is a code sample for doing so:
Webviewer({
path: '/lib',
}, document.getElementById('viewer')).then(i => {
instance = i;
loadDocumentFromCache(instance);
instance.UI.enableFeatures([instance.UI.Feature.ContentEdit]);
const { documentViewer, Annotations, Search, ContentEdit } = instance.Core;
documentViewer.addEventListener('documentLoaded', async () => {
const searchText = "Important"; ///// YOUR SEARCH TERM HERE
const mode = Search.Mode.PAGE_STOP | Search.Mode.HIGHLIGHT;
const results = [];
const searchOptions = {
fullSearch: true,
onResult: (result) => {
// with 'PAGE_STOP' mode, the callback is invoked after each page has been searched.
if (result.resultCode === Search.ResultCode.FOUND) {
results.push(result); // getPoints will return Quad objects
}
},
onDocumentEnd: async () => {
await ContentEdit.searchAndReplaceText({
toReplace: searchText,
replaceWith: "Foxy", ///// YOUR REPLACEMENT TARGET HERE
searchResults: results,
documentViewer: documentViewer,
});
console.log('search replace ended')
},
};
console.log('search replace started')
await documentViewer.textSearchInit(searchText, mode, searchOptions);
});
});