Product: PDFTron Document Viewer - Web Viewer
Product Version: 8.7+
Please give a brief summary of your issue: Unable to disable the Annotations in Document Viewer in Edit/Non Edit mode.
Please describe your issue and provide steps to reproduce it:
We have migrated PDFTron from 7.3.2+ version to 8.7.0+ with the licensed version.
The ask is, to disable all annotations including the strikethrough in the document viewer in any of the modes. When in document viewer user is able to strike through the document and make edits. user should not be able to make any edits to the document.
Previously, 7.3.2+ version, it was just 1 line of code like below:
instance.disableFeatures([
instance.UI.Feature.Annotations
]);
Now We have rewritten to
instance.UI.disableFeatures([
instance.UI.Feature.Annotations
]);
We also tried multiple steps like:
Solution 1:
const { Tools } = instance.Core;
instance.UI.disableTools([
Tools.ToolNames.STICKY, Tools.ToolNames.MARK_REPLACE_TEXT,
Tools.ToolNames.STICKY2, Tools.ToolNames.MARK_REPLACE_TEXT2,
Tools.ToolNames.STICKY3, Tools.ToolNames.MARK_REPLACE_TEXT3,
Tools.ToolNames.STICKY4, Tools.ToolNames.MARK_REPLACE_TEXT4,
Tools.ToolNames.STRIKEOUT,
Tools.ToolNames.STRIKEOUT2,
Tools.ToolNames.STRIKEOUT3,
Tools.ToolNames.STRIKEOUT4
])
Solution 2:
Tools.AnnotationEditTool.disableTextSelection()
Solution 3:
Tools.ContentEditTool.disableTextSelection();
Solution 4:
instance.Core.Tools.TextStrikeoutCreateTool.disableAnnotationHoverCursors()
Solution 5:
instance.Core.Tools.TextStrikeoutCreateTool.disableTextSelection();
Solution 6:
instance.UI.disableReplyForAnnotations(function (annotation) {
return annotation instanceof instance.Core.Annotations.TextStrikeoutAnnotation;
});
Solution 7:
instance.Core.documentViewer.disableAnnotations();
Solution 8:
instance.Core.annotationManager.deselectAnnotation(‘strikethrough’);
Solution 9:
instance.UI.disableTools([‘AnnotationCreateSticky’, ‘AnnotationCreateFreeText’]);
// hides DOM element + disables shortcut
console.log(instance.UI.isToolDisabled(‘AnnotationCreateSticky’));
Solution 10:
instance.Core.annotationManager.enableReadOnlyMode();
Solution 11:
instance.Core.annotationManager.setReadOnly(true);
However, none of them are disabling the annotations.
Requirement Screenshot below:
Please provide a link to a minimal sample where the issue is reproducible:
We need to disable all annotations specifically these - strikethrough/annotationPopup
Your help will be appreciated!
Hello Sunethra,
Thank you for contacting WebViewer support.
If I understood correctly, your users cannot make any change on the documents and they can only open and view the files, correct? If this is the expected behavior, it is weird that your solution 10 is not working. Could you please share part of the code where you’re calling the enableReadOnlyMode?
To do this we can either call the enableReadOnlyMode as you made on solution 10 or we can set a WebViewer options called isViewOnly to true. Below are the two code snippets for your reference:
Webviewer({
...
}, document.getElementById('viewer')).then(instance => {
const { annotationManager } = instance.Core;
annotationManager.enableReadOnlyMode();
});
Webviewer({
...,
isReadOnly: true
}, document.getElementById('viewer')).then(instance => {
...
});
These are the links for their documentation:
[]PDFTron WebViewer Class: AnnotationManager
isReadOnly
Please confirm if I understood your problem and if any of these solutions worked for you.
Best Regards,
Dandara Navarro
Web Software Developer
PDFTron Systems, Inc.
Hi Dandara,
Thank you for your inputs.
However, I would like to disable the icon that will pop up when we right click from the Mouse
const { annotationManager } = instance.Core;
annotationManager.enableReadOnlyMode();
I have conditioned the code and now the strikethrough is not coming. (As expected)
But I would like the T icon (circled it in the screenshot) NOT to come up when I right click on the document. In the previous version, this did not pop up when we right clicked on the document.
Tried these as well
1.instance.Core.annotationManager.deselectAllAnnotations();
2. instance.Core.annotationManager.disableFreeTextEditing();
3. instance.UI.disableTools([‘MarkReplaceTextAnnotation’]);
4. instance.Core.Tools.MarkReplaceTextCreateTool.disableAnnotationHoverCursors();
Any Help is appreciated.
Hi Sunethra,
Could you please give a try with the code below?
instance.disableElements(['contextMenuPopup']);
Please let me know if this works for you.
Best,
Dandara Navarro
Hi Dandaro,
As per the documentation, the Annotations are now moved to instance.Core.Annotations. Hence we were trying multiple methods to disable it from Core.
However, as per your inputs, as per version 8.7 instance has been divided into 2 object - UI and Core.
I used the same string ‘contextMenuPopup’ and implemented as below and it worked!!!
Can you point me to the place/link from where you got this right string - contextMenuPopup?
instance.UI.disableElements([“contextMenuPopup”]);
But as per documentation, we need to render Annotations/contextmenus from Core. annotationManager
So a little strange strikethrough worked using enableReadOnlyMode() but not right click.
Thank you Dandara for helping in a timely manner. Appreciate it.
Hi Sunathra,
Glad to hear that it worked. Here is the documentation of how you can get the correct elements values to disable/enabled them. It’s basically using their data-element values. In the image below is a Screenshot of the element we disabled in your case.
Feel free to close this ticket if you don’t have more questions about it.
Best,
Dandara Navarro
