Section:

Users and permissions

This JavaScript sample demonstrates how you can apply permissions to users viewing your PDF, DOCX, XLSX, or PPTX document (no other external dependencies required). In this specific example you define how a user interacts with annotations in the PDF viewer. One common use case is removing a user’s ability to add annotation by providing them read-only access. Another example would be defining the types of annotations a user sees on a document – they can see highlighted text from another user but not the sticky notes they added. For other users you can give them the ability to respond to comments or give administrative rights to delete annotations. This sample works on all browsers (including IE11) and mobile devices without using plug-ins. To see an example visit our WebViewer User Permission demo. Learn more about our Web SDK.

1// eslint-disable-next-line no-undef
2const WebViewerConstructor = isWebComponent() ? WebViewer.WebComponent : WebViewer;
3
4WebViewerConstructor(
5  {
6    path: '../../../lib',
7    initialDoc: 'https://pdftron.s3.amazonaws.com/downloads/pl/demo-annotated.pdf',
8  },
9  document.getElementById('viewer')
10).then(instance => {
11  samplesSetup(instance);
12  const { annotationManager } = instance.Core;
13  const { openElements } = instance.UI;
14  let shouldShowAnnotFromOtherUsers = true;
15
16  const toggleVisibility = () => {
17    const currentUser = annotationManager.getCurrentUser();
18    const allAnnotations = annotationManager.getAnnotationsList().filter(annot => annot.Listable);
19    let annotationsToShow = allAnnotations;
20    annotationManager.hideAnnotations(allAnnotations);
21
22    if (!shouldShowAnnotFromOtherUsers) {
23      annotationsToShow = allAnnotations.filter(annot => annot.Author === currentUser);
24    }
25    annotationManager.showAnnotations(annotationsToShow);
26  };
27
28  annotationManager.setCurrentUser('Justin');
29  annotationManager.promoteUserToAdmin();
30  openElements(['notesPanel']);
31
32  document.getElementById('justin').onchange = () => {
33    annotationManager.setCurrentUser('Justin');
34    annotationManager.promoteUserToAdmin();
35    annotationManager.disableReadOnlyMode();
36    toggleVisibility();
37  };
38
39  document.getElementById('sally').onchange = () => {
40    annotationManager.setCurrentUser('Sally');
41    annotationManager.demoteUserFromAdmin();
42    annotationManager.disableReadOnlyMode();
43    toggleVisibility();
44  };
45
46  document.getElementById('brian').onchange = () => {
47    annotationManager.setCurrentUser('Brian');
48    annotationManager.demoteUserFromAdmin();
49    annotationManager.enableReadOnlyMode();
50    toggleVisibility();
51  };
52
53  document.getElementById('display').onchange = e => {
54    shouldShowAnnotFromOtherUsers = e.target.checked;
55    toggleVisibility();
56  };
57});

Did you find this helpful?

Trial setup questions?

Ask experts on Discord

Need other help?

Contact Support

Pricing or product questions?

Contact Sales