43 |
44 |
45 |
46 |
47 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/Auto-click PDF Link/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | /* Render the first PDF when the webpage is completely loaded. */
13 | document.addEventListener('DOMContentLoaded', function() {
14 | document.getElementsByClassName("view-pdf")[0].click();
15 | })
16 |
17 | /* Function to render the file using PDF Embed API on clicking the PDF link. */
18 | function onClick(pdf, embedMode) {
19 | if (window.AdobeDC && window.AdobeDC.View) {
20 | showFile(pdf, embedMode);
21 | }
22 |
23 | /* Wait for Adobe Acrobat Services PDF Embed API to be ready. */
24 | document.addEventListener("adobe_dc_view_sdk.ready", function () {
25 | showFile(pdf, embedMode);
26 | });
27 |
28 | return false;
29 | };
30 |
31 | function showFile(pdf, embedMode) {
32 | /* Initialize the AdobeDC View object */
33 | var adobeDCView = new AdobeDC.View({
34 | /* Pass your registered client id */
35 | clientId: ""
36 | });
37 |
38 | /* Pass the embed mode option here */
39 | const viewerConfig = {
40 | embedMode: embedMode
41 | };
42 |
43 | /* Invoke the file preview API on Adobe DC View object */
44 | adobeDCView.previewFile({
45 | /* Pass information on how to access the file */
46 | content: {
47 | /* Location of file where it is hosted */
48 | location: {
49 | url: "https://acrobatservices.adobe.com/view-sdk-demo/PDFs/" + pdf,
50 | /*
51 | If the file URL requires some additional headers, then it can be passed as follows:-
52 | header: [
53 | {
54 | key: "",
55 | value: "",
56 | }
57 | ]
58 | */
59 | },
60 | },
61 | /* Pass meta data of file */
62 | metaData: {
63 | /* file name */
64 | fileName: pdf
65 | }
66 | }, viewerConfig);
67 | }
68 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/Full Window/README.md:
--------------------------------------------------------------------------------
1 | # Full Window
2 |
3 | In this sample, a separate webpage has been created to display the PDFs in full window embed mode. Clicking on any PDF link will open the PDF in this webpage by passing the PDF reference.
4 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
5 |
6 | ## Documentation
7 |
8 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/Full Window/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample - Handle Search Engine Indexing
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
48 |
49 |
50 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/Full Window/viewer.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/Full Window/viewer.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | /* Control the default view mode */
13 | const viewerConfig = {
14 | /* Allowed possible values are "FIT_PAGE", "FIT_WIDTH", "TWO_COLUMN", "TWO_COLUMN_FIT_PAGE" or "". */
15 | defaultViewMode: "",
16 | };
17 |
18 | /* Wait for Adobe Acrobat Services PDF Embed API to be ready */
19 | document.addEventListener("adobe_dc_view_sdk.ready", function () {
20 | const urlParams = new URLSearchParams(window.location.search);
21 | const pdf = urlParams.get('pdf');
22 | /* Initialize the AdobeDC View object */
23 | var adobeDCView = new AdobeDC.View({
24 | /* Pass your registered client id */
25 | clientId: "",
26 | /* Pass the div id in which PDF should be rendered */
27 | divId: "adobe-dc-view",
28 | });
29 |
30 | /* Invoke the file preview API on Adobe DC View object */
31 | adobeDCView.previewFile({
32 | /* Pass information on how to access the file */
33 | content: {
34 | /* Location of file where it is hosted */
35 | location: {
36 | url: "https://acrobatservices.adobe.com/view-sdk-demo/PDFs/" + pdf,
37 | /*
38 | If the file URL requires some additional headers, then it can be passed as follows:-
39 | headers: [
40 | {
41 | key: "",
42 | value: "",
43 | }
44 | ]
45 | */
46 | },
47 | },
48 | /* Pass meta data of file */
49 | metaData: {
50 | /* file name */
51 | fileName: pdf
52 | }
53 | }, viewerConfig);
54 | });
55 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/In Line PDF/README.md:
--------------------------------------------------------------------------------
1 | # In Line PDF
2 |
3 | In this sample, clicking on any PDF link will open the PDF in line within the same webpage.
4 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
5 |
6 | ## Documentation
7 |
8 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
9 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/In Line PDF/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample - Handle Search Engine Indexing
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
43 |
44 |
45 |
46 |
47 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/In Line PDF/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | /* Function to render the file using PDF Embed API on clicking the PDF link. */
13 | function onClick(pdf, embedMode) {
14 | document.getElementById('adobe-dc-view').setAttribute('style', 'border: 1px solid lightgrey; width: 70vw; height: 50vw; margin: 0 auto;');
15 |
16 | if (window.AdobeDC && window.AdobeDC.View) {
17 | showFile(pdf, embedMode);
18 | }
19 |
20 | /* Wait for Adobe Acrobat Services PDF Embed API to be ready. */
21 | document.addEventListener("adobe_dc_view_sdk.ready", function () {
22 | showFile(pdf, embedMode);
23 | });
24 | return false;
25 | };
26 |
27 | function showFile(pdf, embedMode) {
28 | /* Initialize the AdobeDC View object */
29 | var adobeDCView = new AdobeDC.View({
30 | /* Pass your registered client id */
31 | clientId: ""
32 | });
33 |
34 | /* Pass the embed mode option here */
35 | const viewerConfig = {
36 | embedMode: embedMode
37 | };
38 |
39 | /* Invoke the file preview API on Adobe DC View object */
40 | adobeDCView.previewFile({
41 | /* Pass information on how to access the file */
42 | content: {
43 | /* Location of file where it is hosted */
44 | location: {
45 | url: "https://acrobatservices.adobe.com/view-sdk-demo/PDFs/" + pdf,
46 | /*
47 | If the file URL requires some additional headers, then it can be passed as follows:-
48 | header: [
49 | {
50 | key: "",
51 | value: "",
52 | }
53 | ]
54 | */
55 | },
56 | },
57 | /* Pass meta data of file */
58 | metaData: {
59 | /* file name */
60 | fileName: pdf
61 | }
62 | }, viewerConfig);
63 | }
64 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/Lightbox Embed Mode/README.md:
--------------------------------------------------------------------------------
1 | # Lightbox Embed Mode
2 |
3 | In this sample, clicking on any PDF link will open the PDF on top of the same webpage using the lightbox embed mode provided by PDF Embed API. This provides a focused view of the PDF and user can exit the PDF preview to go back to the webpage.
4 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
5 |
6 | ## Documentation
7 |
8 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
9 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/Lightbox Embed Mode/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample - Handle Search Engine Indexing
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
43 |
44 |
45 |
46 |
47 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/Lightbox Embed Mode/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | /* Function to render the file using PDF Embed API on clicking the PDF link. */
13 | function onClick(pdf, embedMode) {
14 | if (window.AdobeDC && window.AdobeDC.View) {
15 | showFile(pdf, embedMode);
16 | }
17 |
18 | /* Wait for Adobe Acrobat Services PDF Embed API to be ready. */
19 | document.addEventListener("adobe_dc_view_sdk.ready", function () {
20 | showFile(pdf, embedMode);
21 | });
22 |
23 | return false;
24 | };
25 |
26 | function showFile(pdf, embedMode) {
27 | /* Initialize the AdobeDC View object */
28 | var adobeDCView = new AdobeDC.View({
29 | /* Pass your registered client id */
30 | clientId: ""
31 | });
32 |
33 | /* Pass the embed mode option here */
34 | const viewerConfig = {
35 | embedMode: embedMode
36 | };
37 |
38 | /* Invoke the file preview API on Adobe DC View object */
39 | adobeDCView.previewFile({
40 | /* Pass information on how to access the file */
41 | content: {
42 | /* Location of file where it is hosted */
43 | location: {
44 | url: "https://acrobatservices.adobe.com/view-sdk-demo/PDFs/" + pdf,
45 | /*
46 | If the file URL requires some additional headers, then it can be passed as follows:-
47 | header: [
48 | {
49 | key: "",
50 | value: "",
51 | }
52 | ]
53 | */
54 | },
55 | },
56 | /* Pass meta data of file */
57 | metaData: {
58 | /* file name */
59 | fileName: pdf
60 | }
61 | }, viewerConfig);
62 | }
63 |
--------------------------------------------------------------------------------
/More Samples/Handle Search Engine Indexing/README.md:
--------------------------------------------------------------------------------
1 | # Handle Search Engine Indexing
2 |
3 | PDFs displayed using PDF Embed API are not indexed and won't appear in search engine results by default, as PDF Embed API doesn't keep direct reference of the PDF URL in the DOM. In order to get the PDF indexed and appear in search engine results, the URL of the PDF must be available in the website DOM.
4 | We suggest an approach which will enable the indexing of PDF files displayed using PDF Embed API. The link of the PDF file should already be available in the website to enable indexing. As per the approach, website developers can trap the click of this link and open the PDF using PDF Embed API.
5 |
6 | The code samples demonstrate few of the ways to implement this approach.
7 |
8 | ### Auto-click PDF Link
9 |
10 | Auto-click on the PDF link when the website is completely loaded and open the PDF in the desired embed mode. In this sample, the PDF is displayed in sized container embed mode.
11 | To see it in action, open ```Auto-click PDF Link/index.html``` in a supported browser.
12 |
13 | ### Full Window
14 |
15 | Click on the PDF link to display the PDFs in a separate webpage in full window embed mode by passing the PDF reference.
16 | To see it in action, open ```Full Window/index.html``` in a supported browser.
17 |
18 | ### In Line PDF
19 |
20 | Click on the PDF link to open the PDF in line within the context of the webpage.
21 | To see it in action, open ```In Line PDF/index.html``` in a supported browser.
22 |
23 | ### Lightbox Embed Mode
24 |
25 | Click on the PDF link to open the PDF on top of the webpage using the lightbox embed mode provided by PDF Embed API.
26 | To see it in action, open ```Lightbox Embed Mode/index.html``` in a supported browser.
27 |
28 | ## Documentation
29 |
30 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
--------------------------------------------------------------------------------
/More Samples/Linearization/Bodea Brochure - Linearized.pdf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/adobe/pdf-embed-api-samples/e09ed4082bc8b69c6968a357ee33f582f4cf2762/More Samples/Linearization/Bodea Brochure - Linearized.pdf
--------------------------------------------------------------------------------
/More Samples/Linearization/README.md:
--------------------------------------------------------------------------------
1 | # Linearized PDF file Preview Sample
2 |
3 | This sample demonstrates how to render a linearized PDF file using the PDF Embed API.
4 | To see it in action, copy the files in the folder to your computer, open index.html in a supported browser, and select the sample PDF "Bodea Brochure - Linearized.pdf" available in this folder.
5 |
6 | ## Documentation
7 |
8 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
9 |
--------------------------------------------------------------------------------
/More Samples/Linearization/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Annotation Data Samples/README.md:
--------------------------------------------------------------------------------
1 | # Annotation Data Samples
2 |
3 | Samples of acceptable annotation data for freetext, note, reply, highlight, underline, strikeout and shape annotation types in JSON format.
4 |
5 | ## Documentation
6 |
7 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
8 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Annotation Data Samples/freetext.json:
--------------------------------------------------------------------------------
1 | {
2 | "@context": [
3 | "https://www.w3.org/ns/anno.jsonld",
4 | "https://comments.acrobat.com/ns/anno.jsonld"
5 | ],
6 | "type": "Annotation",
7 | "id": "02dcf931-d1cb-49c1-a8bc-d047892a06bc",
8 | "bodyValue": "I added a text annotation!",
9 | "motivation": "commenting",
10 | "stylesheet": {
11 | "type": "CssStylesheet",
12 | "value": "body-value-css { font: 14px Helvetica; color: #0000FF; }"
13 | },
14 | "target": {
15 | "source": "6d07d124-ac85-43b3-a867-36930f502ac6",
16 | "selector": {
17 | "node": {
18 | "index": 1
19 | },
20 | "subtype": "freetext",
21 | "boundingBox": [
22 | 306.41829735235586,
23 | 339.01199687491595,
24 | 475.729044456285,
25 | 357.0653042030006
26 | ],
27 | "styleClass": "body-value-css",
28 | "type": "AdobeAnnoSelector"
29 | }
30 | },
31 | "creator": {
32 | "type": "Person",
33 | "name": "John Smith"
34 | },
35 | "created": "2021-01-20T14:45:37Z",
36 | "modified": "2021-01-20T14:45:37Z"
37 | }
38 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Annotation Data Samples/highlight.json:
--------------------------------------------------------------------------------
1 | {
2 | "@context": [
3 | "https://www.w3.org/ns/anno.jsonld",
4 | "https://comments.acrobat.com/ns/anno.jsonld"
5 | ],
6 | "type": "Annotation",
7 | "id": "17bf889a-f170-4c13-a655-4b1e5de0bf41",
8 | "bodyValue": "I highlighted this!",
9 | "motivation": "commenting",
10 | "target": {
11 | "source": "6d07d124-ac85-43b3-a867-36930f502ac6",
12 | "selector": {
13 | "node": {
14 | "index": 3
15 | },
16 | "opacity": 0.1,
17 | "subtype": "highlight",
18 | "boundingBox": [
19 | 71.69551583223566,
20 | 325.5741406817769,
21 | 160.0787810392158,
22 | 345.3522140148074
23 | ],
24 | "quadPoints": [
25 | 71.69551583223566,
26 | 345.3522140148074,
27 | 160.0787810392158,
28 | 345.3522140148074,
29 | 71.69551583223566,
30 | 325.5741406817769,
31 | 160.0787810392158,
32 | 325.5741406817769
33 | ],
34 | "strokeColor": "#5300eb",
35 | "strokeWidth": 3,
36 | "type": "AdobeAnnoSelector"
37 | }
38 | },
39 | "creator": {
40 | "type": "Person",
41 | "name": "John Smith"
42 | },
43 | "created": "2020-02-21T14:45:37Z",
44 | "modified": "2020-02-21T07:54:10Z"
45 | }
46 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Annotation Data Samples/note.json:
--------------------------------------------------------------------------------
1 | {
2 | "@context": [
3 | "https://www.w3.org/ns/anno.jsonld",
4 | "https://comments.acrobat.com/ns/anno.jsonld"
5 | ],
6 | "type": "Annotation",
7 | "id": "079d66a4-5ec2-4703-ae9d-30ccbb1aa84c",
8 | "bodyValue": "I added a note!",
9 | "motivation": "commenting",
10 | "target": {
11 | "source": "6d07d124-ac85-43b3-a867-36930f502ac6",
12 | "selector": {
13 | "node": {
14 | "index": 1
15 | },
16 | "opacity": 0.4,
17 | "subtype": "note",
18 | "boundingBox": [
19 | 56.86196083246276,
20 | 63.51466901912244,
21 | 74.16777499886447,
22 | 80.82048318552415
23 | ],
24 | "strokeColor": "#ff0808",
25 | "strokeWidth": 3,
26 | "type": "AdobeAnnoSelector"
27 | }
28 | },
29 | "creator": {
30 | "type": "Person",
31 | "name": "John Smith"
32 | },
33 | "created": "2018-08-02T14:45:37Z",
34 | "modified": "2020-01-20T07:54:10Z"
35 | }
36 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Annotation Data Samples/reply.json:
--------------------------------------------------------------------------------
1 | {
2 | "@context": [
3 | "https://www.w3.org/ns/anno.jsonld",
4 | "https://comments.acrobat.com/ns/anno.jsonld"
5 | ],
6 | "type": "Annotation",
7 | "id": "eb46d1a9-e9c3-4e81-a6f4-ce5ba7a905e9",
8 | "bodyValue": "Reply to this",
9 | "motivation": "replying",
10 | "target": {
11 | "source": "079d66a4-5ec2-4703-ae9d-30ccbb1aa84c"
12 | },
13 | "creator": {
14 | "type": "Person",
15 | "name": "Steve Baker"
16 | },
17 | "created": "2020-02-02T14:45:37Z",
18 | "modified": "2020-02-02T07:57:03Z"
19 | }
20 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Annotation Data Samples/strikeout.json:
--------------------------------------------------------------------------------
1 | {
2 | "@context": [
3 | "https://www.w3.org/ns/anno.jsonld",
4 | "https://comments.acrobat.com/ns/anno.jsonld"
5 | ],
6 | "type": "Annotation",
7 | "id": "3adeae16-a868-4653-960e-613c048dddc5",
8 | "bodyValue": "I added a strikeout.",
9 | "motivation": "commenting",
10 | "target": {
11 | "source": "6d07d124-ac85-43b3-a867-36930f502ac6",
12 | "selector": {
13 | "node": {
14 | "index": 2
15 | },
16 | "opacity": 0.4,
17 | "subtype": "strikeout",
18 | "boundingBox": [
19 | 72.31358062389286,
20 | 307.65026172371796,
21 | 251.552370204482,
22 | 316.921233598576
23 | ],
24 | "quadPoints": [
25 | 72.31358062389286,
26 | 316.921233598576,
27 | 251.552370204482,
28 | 316.921233598576,
29 | 72.31358062389286,
30 | 307.65026172371796,
31 | 251.552370204482,
32 | 307.65026172371796
33 | ],
34 | "strokeColor": "#b80000",
35 | "strokeWidth": 3,
36 | "type": "AdobeAnnoSelector"
37 | }
38 | },
39 | "creator": {
40 | "type": "Person",
41 | "name": "John Smith"
42 | },
43 | "created": "2020-02-21T14:45:37Z",
44 | "modified": "2020-02-21T07:54:10Z"
45 | }
46 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Annotation Data Samples/underline.json:
--------------------------------------------------------------------------------
1 | {
2 | "@context": [
3 | "https://www.w3.org/ns/anno.jsonld",
4 | "https://comments.acrobat.com/ns/anno.jsonld"
5 | ],
6 | "type": "Annotation",
7 | "id": "34c2bb70-60e2-4405-be33-a3c9865791e0",
8 | "bodyValue": "I underlined this text!",
9 | "motivation": "commenting",
10 | "target": {
11 | "source": "6d07d124-ac85-43b3-a867-36930f502ac6",
12 | "selector": {
13 | "node": {
14 | "index": 4
15 | },
16 | "opacity": 0.1,
17 | "subtype": "underline",
18 | "boundingBox": [
19 | 72.31358062389286,
20 | 306.4141321404036,
21 | 256.4968885377396,
22 | 315.68510401526163
23 | ],
24 | "quadPoints": [
25 | 72.31358062389286,
26 | 315.68510401526163,
27 | 256.4968885377396,
28 | 315.68510401526163,
29 | 72.31358062389286,
30 | 306.4141321404036,
31 | 256.4968885377396,
32 | 306.4141321404036
33 | ],
34 | "strokeColor": "#008b02",
35 | "strokeWidth": 3,
36 | "type": "AdobeAnnoSelector"
37 | }
38 | },
39 | "creator": {
40 | "type": "Person",
41 | "name": "John Smith"
42 | },
43 | "created": "2020-02-21T14:45:37Z",
44 | "modified": "2020-02-21T07:54:10Z"
45 | }
46 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/CRUD APIs/README.md:
--------------------------------------------------------------------------------
1 | # Sample for PDF Annotations APIs
2 |
3 | In this sample, no existing PDF annotation is displayed. Any annotation added or updated from UI or API is not saved to the PDF buffer.
4 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
5 |
6 | ## Documentation
7 |
8 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
9 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/CRUD APIs/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Capture Events/README.md:
--------------------------------------------------------------------------------
1 | # Annotation APIs with Events Sample
2 |
3 | This sample shows how to receive annotation events when annotation APIs are enabled.
4 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
5 |
6 | ## Documentation
7 |
8 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
9 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Capture Events/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Capture Events/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | var viewerConfig = {
13 | /* Enable commenting APIs */
14 | enableAnnotationAPIs: true, /* Default value is false */
15 | };
16 |
17 | /* Wait for Adobe Acrobat Services PDF Embed API to be ready */
18 | document.addEventListener("adobe_dc_view_sdk.ready", function () {
19 | /* Initialize the AdobeDC View object */
20 | var adobeDCView = new AdobeDC.View({
21 | /* Pass your registered client id */
22 | clientId: "",
23 | /* Pass the div id in which PDF should be rendered */
24 | divId: "adobe-dc-view",
25 | });
26 |
27 | /* Invoke the file preview API on Adobe DC View object and return the Promise object */
28 | var previewFilePromise = adobeDCView.previewFile({
29 | /* Pass information on how to access the file */
30 | content: {
31 | /* Location of file where it is hosted */
32 | location: {
33 | url: "https://acrobatservices.adobe.com/view-sdk-demo/PDFs/Bodea Brochure.pdf",
34 | /*
35 | If the file URL requires some additional headers, then it can be passed as follows:-
36 | header: [
37 | {
38 | key: "",
39 | value: "",
40 | }
41 | ]
42 | */
43 | },
44 | },
45 | /* Pass meta data of file */
46 | metaData: {
47 | /* file name */
48 | fileName: "Bodea Brochure.pdf",
49 | /* file ID */
50 | id: "6d07d124-ac85-43b3-a867-36930f502ac6"
51 | }
52 | }, viewerConfig);
53 |
54 | /* Use the annotation manager interface to invoke the commenting APIs */
55 | previewFilePromise.then(function (adobeViewer) {
56 | adobeViewer.getAnnotationManager().then(function (annotationManager) {
57 | /* API to add annotations */
58 | annotationManager.addAnnotations(annotations)
59 | .then(function () {
60 | console.log("Annotations added through API successfully")
61 | })
62 | .catch(function (error) {
63 | console.log(error)
64 | });
65 |
66 | /* API to register events listener */
67 | annotationManager.registerEventListener(
68 | function (event) {
69 | console.log(event)
70 | },
71 | {
72 | /* Pass the list of events in listenOn. */
73 | /* If no event is passed in listenOn, then all the annotation events will be received. */
74 | listenOn: [
75 | /* "ANNOTATION_ADDED", "ANNOTATION_CLICKED" */
76 | ]
77 | }
78 | );
79 | });
80 | });
81 | });
82 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Handling of Annotations in PDF/README.md:
--------------------------------------------------------------------------------
1 | # Handling existing PDF Annotations Sample
2 |
3 | Sample for annotations APIs used to remove existing annotations from PDF or save some annotations to the PDF and return the updated PDF buffer.
4 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
5 |
6 | ## Documentation
7 |
8 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
9 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Handling of Annotations in PDF/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/Handling of Annotations in PDF/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | var viewerConfig = {
13 | /* Enable commenting APIs */
14 | enableAnnotationAPIs: true, /* Default value is false */
15 | /* Include existing PDF annotations and save new annotations to PDF buffer */
16 | includePDFAnnotations: true /* Default value is false */
17 | };
18 |
19 | /* Wait for Adobe Acrobat Services PDF Embed API to be ready */
20 | document.addEventListener("adobe_dc_view_sdk.ready", function () {
21 | /* Initialize the AdobeDC View object */
22 | var adobeDCView = new AdobeDC.View({
23 | /* Pass your registered client id */
24 | clientId: "",
25 | /* Pass the div id in which PDF should be rendered */
26 | divId: "adobe-dc-view",
27 | });
28 |
29 | /* Invoke the file preview API on Adobe DC View object and return the Promise object */
30 | var previewFilePromise = adobeDCView.previewFile({
31 | /* Pass information on how to access the file */
32 | content: {
33 | /* Location of file where it is hosted */
34 | location: {
35 | url: "https://acrobatservices.adobe.com/view-sdk-demo/PDFs/Bodea Brochure.pdf",
36 | /*
37 | If the file URL requires some additional headers, then it can be passed as follows:-
38 | header: [
39 | {
40 | key: "",
41 | value: "",
42 | }
43 | ]
44 | */
45 | },
46 | },
47 | /* Pass meta data of file */
48 | metaData: {
49 | /* file name */
50 | fileName: "Bodea Brochure.pdf",
51 | /* file ID */
52 | id: "6d07d124-ac85-43b3-a867-36930f502ac6"
53 | }
54 | }, viewerConfig);
55 |
56 | /* Use the annotation manager interface to invoke the commenting APIs*/
57 | previewFilePromise.then(function (adobeViewer) {
58 | adobeViewer.getAnnotationManager().then(function (annotationManager) {
59 | /* API to add annotations to PDF and return the updated PDF buffer */
60 | /* These APIs will work only when includePDFAnnotations is set to true in viewerConfig */
61 | annotationManager.addAnnotationsInPDF(annotations)
62 | .then(function (result) {
63 | console.log("Annotations added to PDF successfully and updated PDF buffer returned.", result)
64 | })
65 | .catch(function (error) {
66 | console.log(error)
67 | });
68 |
69 | /* API to remove annotations from PDF and return the updated PDF buffer along with the list of annotations */
70 | setTimeout(function() {
71 | annotationManager.removeAnnotationsFromPDF()
72 | .then(function (result) {
73 | console.log("Annotations removed from PDF successfully and updated PDF buffer and annotation list returned.", result)
74 | })
75 | .catch(function (error) {
76 | console.log(error)
77 | });
78 | }, 3000);
79 | });
80 | });
81 | });
82 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/README.md:
--------------------------------------------------------------------------------
1 | # PDF Annotation API Samples
2 |
3 | PDF viewer will render PDF file along with annotation APIs enabled. Annotation APIs can be used to add, import, export, delete and update annotations programmatically.
4 |
5 | ### CRUD APIs
6 |
7 | PDF viewer will render PDF file along with annotation tools and APIs enabled.
8 | Code in ```CRUD APIs/index.js``` shows the annotation APIs interaction with PDF Embed API.
9 | In this sample, no existing PDF annotation is displayed. Any annotation added or updated from UI or API is not saved to the PDF buffer.
10 | To see it in action, open ```CRUD APIs/index.html``` in a supported browser.
11 |
12 | ### Handling of Annotations in PDF
13 |
14 | PDF viewer will render PDF file along with annotation tools and APIs enabled.
15 | This sample show how to interact with existing annotations in PDF or add new annotations in PDF buffer.
16 | To see it in action, open ```Handling of Annotations in PDF/index.html``` in a supported browser.
17 |
18 | ### Capture Events
19 |
20 | PDF viewer will render PDF file along with annotation tools and APIs enabled and shows how to receive annotation events.
21 | To see it in action, open ```Capture Events/index.html``` in a supported browser.
22 |
23 | ### UI Configurations
24 |
25 | PDF viewer will render PDF file along with annotation tools and APIs enabled and shows how we can build our own custom comments panel UI by using various annotation APIs and events.
26 | To see it in action, open ```UI Configurations/index.html``` in a supported browser.
27 |
28 | ### Annotation Data Samples
29 |
30 | Folder ```Annotation Data Samples``` contains acceptable annotation data for freetext, note, reply, highlight, underline, strikeout and shape annotation types in JSON format.
31 |
32 | ## Documentation
33 |
34 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
35 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/UI Configurations/README.md:
--------------------------------------------------------------------------------
1 | # Annotation APIs with UI Configurations Sample
2 |
3 | This sample demonstrates how the annotation APIs can be used to apply UI configurations and perform other operations on any annotation.
4 |
5 | The right-hand comments pane has been hidden and a custom comments pane has been created. The annotation tools are also disabled and custom annotation tools have been created in the comments pane.
6 | Click on any annotation tool and it gets selected using the start annotation mode API. New annotations can be added to the PDF using these tools.
7 | The annotation added event is received and the event data is used to fetch the comment text and display it in the custom pane.
8 | There are options to edit and delete the annotation which use the update and delete annotation APIs to perform the operation.
9 | Click on any annotation in the custom pane and it gets selected using the select annotation API.
10 |
11 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
12 |
13 | ## Documentation
14 |
15 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
16 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/UI Configurations/images/tool_add_text.svg:
--------------------------------------------------------------------------------
1 |
6 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/UI Configurations/images/tool_drawing.svg:
--------------------------------------------------------------------------------
1 |
6 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/UI Configurations/images/tool_eraser.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/UI Configurations/images/tool_highlight.svg:
--------------------------------------------------------------------------------
1 |
7 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/UI Configurations/images/tool_stickynote.svg:
--------------------------------------------------------------------------------
1 |
6 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/UI Configurations/images/tool_strikethrough.svg:
--------------------------------------------------------------------------------
1 |
9 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/UI Configurations/images/tool_underline.svg:
--------------------------------------------------------------------------------
1 |
7 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/UI Configurations/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
37 |
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 |
60 |
61 |
62 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations APIs/UI Configurations/style.css:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | body {
13 | margin: 0;
14 | display: flex;
15 | height: 100vh;
16 | }
17 |
18 | .pdf-view {
19 | width: calc(100% - 400px);
20 | }
21 |
22 | .container {
23 | border-left: 1px solid #333;
24 | width: 400px;
25 | }
26 |
27 | .annotation-icon {
28 | opacity: 0.5;
29 | width: 25px;
30 | margin: 0 10px;
31 | }
32 |
33 | ul {
34 | margin: 0 5px;
35 | padding: 0;
36 | }
37 |
38 | li * {
39 | float: left;
40 | }
41 |
42 | li, h3 {
43 | clear: both;
44 | list-style: none;
45 | }
46 |
47 | input, button {
48 | outline: none;
49 | }
50 |
51 | button {
52 | background: none;
53 | border: 0px;
54 | color: #888;
55 | font-size: 15px;
56 | width: 60px;
57 | margin: 10px 0 0;
58 | font-family: Lato, sans-serif;
59 | cursor: pointer;
60 | }
61 |
62 | button:hover {
63 | color: #333;
64 | }
65 |
66 | /* Heading */
67 | h3 {
68 | color: #333;
69 | font-weight: 700;
70 | font-size: 15px;
71 | border-bottom: 1px solid #333;
72 | padding: 9px 0 14px;
73 | margin: 0;
74 | text-align: center;
75 | text-transform: uppercase;
76 | }
77 |
78 | input[type="text"] {
79 | margin: 0;
80 | font-size: 18px;
81 | line-height: 18px;
82 | height: 18px;
83 | padding: 10px;
84 | border: 1px solid #ddd;
85 | background: #fff;
86 | border-radius: 6px;
87 | font-family: Lato, sans-serif;
88 | color: #888;
89 | }
90 |
91 | input[type="text"]:focus {
92 | color: #333;
93 | }
94 |
95 | /* Annotation list */
96 | li {
97 | overflow: hidden;
98 | margin: 5px 0;
99 | padding: 10px 0;
100 | width: auto;
101 | border: 2px solid #3D85B0;
102 | }
103 |
104 | li > input[type="checkbox"] {
105 | margin: 0 10px;
106 | position: relative;
107 | top: 15px;
108 | }
109 |
110 | li > label {
111 | font-size: 18px;
112 | line-height: 40px;
113 | width: 237px;
114 | padding: 0 0 0 11px;
115 | }
116 |
117 | li > input[type="text"] {
118 | width: 226px;
119 | }
120 |
121 | li > .delete:hover {
122 | color: #CF2323;
123 | }
124 |
125 | /* Edit Annotation */
126 | ul li input[type=text] {
127 | display: none;
128 | }
129 |
130 | ul li.editMode input[type=text] {
131 | display: block;
132 | }
133 |
134 | ul li.editMode label {
135 | display: none;
136 | }
137 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations/README.md:
--------------------------------------------------------------------------------
1 | # PDF Preview with Annotation tools Sample
2 |
3 | PDF viewer will render PDF file along with annotation tools enabled.
4 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
5 |
6 | **Note**: Annotation tools are currently not supported in any mobile browser, although it is supported for tablet and iPad.
7 |
8 | ## Documentation
9 |
10 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
11 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/More Samples/PDF Annotations/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2019 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | /* Control the viewer customization. */
13 | var viewerConfig = {
14 | showAnnotationTools: true,
15 | enableFormFilling: true,
16 | };
17 |
18 | /* Wait for Adobe Acrobat Services PDF Embed API to be ready */
19 | document.addEventListener("adobe_dc_view_sdk.ready", function () {
20 | /* Initialize the AdobeDC View object */
21 | var adobeDCView = new AdobeDC.View({
22 | /* Pass your registered client id */
23 | clientId: "",
24 | /* Pass the div id in which PDF should be rendered */
25 | divId: "adobe-dc-view",
26 | });
27 |
28 | /* Invoke the file preview API on Adobe DC View object */
29 | adobeDCView.previewFile({
30 | /* Pass information on how to access the file */
31 | content: {
32 | /* Location of file where it is hosted */
33 | location: {
34 | url: "https://acrobatservices.adobe.com/view-sdk-demo/PDFs/Bodea Brochure.pdf",
35 | /*
36 | If the file URL requires some additional headers, then it can be passed as follows:-
37 | headers: [
38 | {
39 | key: "",
40 | value: "",
41 | }
42 | ]
43 | */
44 | },
45 | },
46 | /* Pass meta data of file */
47 | metaData: {
48 | /* file name */
49 | fileName: "Bodea Brochure.pdf"
50 | }
51 | }, viewerConfig);
52 |
53 | /* Define Save API Handler */
54 | var saveApiHandler = function (metaData, content, options) {
55 | console.log(metaData, content, options);
56 | return new Promise(function (resolve, reject) {
57 | /* Dummy implementation of Save API, replace with your business logic */
58 | setTimeout(function () {
59 | var response = {
60 | code: AdobeDC.View.Enum.ApiResponseCode.SUCCESS,
61 | data: {
62 | metaData: Object.assign(metaData, {updatedAt: new Date().getTime()})
63 | },
64 | };
65 | resolve(response);
66 | }, 2000);
67 | });
68 | };
69 |
70 | adobeDCView.registerCallback(
71 | AdobeDC.View.Enum.CallbackType.SAVE_API,
72 | saveApiHandler,
73 | {}
74 | );
75 | });
76 |
--------------------------------------------------------------------------------
/More Samples/React Samples/.gitignore:
--------------------------------------------------------------------------------
1 | /node_modules
2 | package-lock.json
3 |
--------------------------------------------------------------------------------
/More Samples/React Samples/.npmrc:
--------------------------------------------------------------------------------
1 | engine-strict=true
2 |
--------------------------------------------------------------------------------
/More Samples/React Samples/README.md:
--------------------------------------------------------------------------------
1 | # React Sample
2 |
3 | This is a React sample application, demonstrating how to use Adobe Acrobat Services PDF Embed API with React. To try it out, clone this folder on your computer and run the following commands:
4 |
5 | ```
6 | > npm install
7 | > npm start
8 | ```
9 |
10 | The app will be available at ```http://localhost:3000```
11 |
12 | Below are the endpoints exposed from the application to show different use cases of PDF embed API.
13 |
14 | For detailed description about each of the samples, see [README](../../README.md#running-the-samples).
15 |
16 | | Sample | Endpoint |
17 | |---|---|
18 | |Full Window Embed Mode | ```http://localhost:3000/fullWindow``` |
19 | |Sized Container Embed Mode | ```http://localhost:3000/sizedContainer``` |
20 | |In-Line Embed Mode | ```http://localhost:3000/inLine``` |
21 | |Lightbox Embed Mode | ```http://localhost:3000/lightbox``` |
22 | |PDF Preview with Annotation Tools | ```http://localhost:3000/pdfAnnotationTools``` |
23 | |Viewer Customization | ```http://localhost:3000/viewerCustomization``` |
24 | |Local PDF File Preview | ```http://localhost:3000/localPDFFilePreview``` |
25 | |PDF Preview with Events | ```http://localhost:3000/captureEvents``` |
26 |
27 |
28 | Following endpoints showcase the different PDF Annotation APIs and their use cases.
29 |
30 | For detailed description about the annotation APIs samples, see [Annotation APIs README](../PDF%20Annotations%20APIs/README.md).
31 |
32 | | Annotation API Sample | Endpoint |
33 | |---|---|
34 | |CRUD APIs | ```http://localhost:3000/annotationAPIs``` |
35 | |Handling of Annotations in PDF | ```http://localhost:3000/annotationAPIs/handlingInPDF``` |
36 | |Capture Events | ```http://localhost:3000/annotationAPIs/captureEvents``` |
37 | |UI Configurations | ```http://localhost:3000/annotationAPIs/UIConfigurations``` |
38 |
39 |
40 | **Note**: Node version >=8.10.0 is required to run this sample.
41 |
--------------------------------------------------------------------------------
/More Samples/React Samples/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "adobe-dc-view-sdk-react-sample",
3 | "version": "1.0.0",
4 | "private": false,
5 | "license": "See license in license.md",
6 | "dependencies": {
7 | "react": "^16.13.0",
8 | "react-dom": "^16.13.0",
9 | "react-router-dom": "^5.1.2",
10 | "react-scripts": "3.4.0"
11 | },
12 | "scripts": {
13 | "start": "react-scripts start"
14 | },
15 | "engines": {
16 | "node": ">=8.10.0"
17 | },
18 | "browserslist": {
19 | "development": [
20 | "last 2 Chrome versions",
21 | "last 2 Firefox versions",
22 | "last 2 Edge versions",
23 | "last 2 Safari versions"
24 | ]
25 | }
26 | }
27 |
--------------------------------------------------------------------------------
/More Samples/React Samples/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API React Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/App.css:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | .in-line-div {
13 | display: inline-block;
14 | margin: 10% 0 10% 0;
15 | width: 800px;
16 | box-shadow: 1px 1px 10px 1px #dadada;
17 | }
18 |
19 | .in-line-container {
20 | text-align: center;
21 | }
22 |
23 | .sized-container-div {
24 | margin: auto;
25 | margin-top: 5%;
26 | height: 476px;
27 | width: 600px;
28 | border: 1px solid #dadada;
29 | }
30 |
31 | .full-window-div {
32 | height: 100%;
33 | }
34 |
35 | .light-box-container {
36 | background-color: #fdfdf9;
37 | height: 100%;
38 | }
39 |
40 | .lb-view-file-btn {
41 | background-color: #1473e6;
42 | border: 1px #404040;
43 | border-radius: 5px;
44 | color: #ededed;
45 | cursor: pointer;
46 | font-family: "Arial";
47 | margin: 100px 0 0 80px;
48 | padding: 10px;
49 | width: 120px;
50 | }
51 |
52 | .lb-view-file-btn:hover {
53 | background-color: #0969df;
54 | color: white;
55 | }
56 |
57 | .file-input {
58 | display: none;
59 | }
60 |
61 | .file-picker {
62 | font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
63 | padding: 10px;
64 | border-radius: 5px;
65 | border: 1px #404040;
66 | cursor: pointer;
67 | color: #ededed;
68 | display: inline-block;
69 | background-color: #404040;
70 | box-shadow: 12px 5px 30px -12px rgba(0, 0, 0, 0.58);
71 | }
72 |
73 | .file-picker:hover {
74 | color: white;
75 | background-color: #252525;
76 | }
77 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/App.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | import React, { Component } from "react";
13 | import { BrowserRouter as Router, Route } from "react-router-dom";
14 | import FullWindow from "./samples/Embed Modes/FullWindow";
15 | import PDFAnnotationTools from "./samples/PDFAnnotationTools";
16 | import SizedContainer from "./samples/Embed Modes/SizedContainer";
17 | import InLine from "./samples/Embed Modes/InLine";
18 | import Lightbox from "./samples/Embed Modes/Lightbox";
19 | import ViewerCustomization from "./samples/ViewerCustomization";
20 | import CaptureViewSDKEvents from "./samples/CaptureViewSDKEvents";
21 | import LocalPDFFilePreview from "./samples/LocalPDFFilePreview";
22 | import CaptureEvents from "./samples/PDF Annotation APIs/CaptureEvents";
23 | import CRUDAPIs from "./samples/PDF Annotation APIs/CRUDAPIs";
24 | import HandlingAnnotationsInPDF from "./samples/PDF Annotation APIs/HandlingAnnotationsInPDF";
25 | import UIConfigurations from "./samples/PDF Annotation APIs/UIConfigurations/UIConfigurations";
26 | import "./App.css";
27 |
28 | export default class App extends Component {
29 | render() {
30 | return (
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 | );
48 | }
49 | }
50 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | import React from 'react';
13 | import ReactDOM from 'react-dom';
14 | import App from './App';
15 |
16 | ReactDOM.render(, document.getElementById("root"));
17 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/samples/CaptureViewSDKEvents.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | import React, { Component } from 'react';
13 | import ViewSDKClient from './ViewSDKClient';
14 |
15 | class CaptureViewSDKEvents extends Component {
16 | componentDidMount() {
17 | const viewSDKClient = new ViewSDKClient();
18 | viewSDKClient.ready().then(() => {
19 | /* Invoke file preview */
20 | viewSDKClient.previewFile("pdf-div", {});
21 | /* Register the callback to receive the events */
22 | viewSDKClient.registerEventsHandler();
23 | });
24 | }
25 |
26 | render() {
27 | return ;
28 | }
29 | }
30 |
31 | export default CaptureViewSDKEvents;
32 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/samples/Embed Modes/FullWindow.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | import React, { Component } from 'react';
13 | import ViewSDKClient from '../ViewSDKClient';
14 |
15 | class FullWindow extends Component {
16 | componentDidMount() {
17 | const viewSDKClient = new ViewSDKClient();
18 | viewSDKClient.ready().then(() => {
19 | /* Invoke file preview */
20 | /* By default the embed mode will be Full Window */
21 | viewSDKClient.previewFile("pdf-div", {});
22 | });
23 | }
24 |
25 | render() {
26 | return ;
27 | }
28 | }
29 |
30 | export default FullWindow;
31 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/samples/Embed Modes/InLine.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | import React, { Component } from "react";
13 | import ViewSDKClient from "../ViewSDKClient";
14 |
15 | class InLine extends Component {
16 | componentDidMount() {
17 | const viewSDKClient = new ViewSDKClient();
18 | viewSDKClient.ready().then(() => {
19 | /* Invoke file preview */
20 | viewSDKClient.previewFile("pdf-div", {
21 | /* Pass the embed mode option here */
22 | embedMode: "IN_LINE"
23 | });
24 | });
25 | }
26 |
27 | render() {
28 | return (
29 |
30 |
31 |
32 | );
33 | }
34 | }
35 |
36 | export default InLine;
37 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/samples/Embed Modes/Lightbox.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | import React, { Component } from "react";
13 | import ViewSDKClient from "../ViewSDKClient";
14 |
15 | class Lightbox extends Component {
16 | constructor() {
17 | super();
18 | this.viewSDKClient = new ViewSDKClient();
19 | }
20 |
21 | previewFile = () => {
22 | this.viewSDKClient.ready().then(() => {
23 | /* Invoke file preview */
24 | this.viewSDKClient.previewFile("", {
25 | /* Pass the embed mode option here */
26 | embedMode: "LIGHT_BOX"
27 | });
28 | });
29 | }
30 |
31 | render() {
32 | return (
33 |
34 |
37 |
38 | );
39 | }
40 | }
41 |
42 | export default Lightbox;
43 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/samples/Embed Modes/SizedContainer.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | import React, { Component } from 'react';
13 | import ViewSDKClient from '../ViewSDKClient';
14 |
15 | class SizedContainer extends Component {
16 | componentDidMount() {
17 | const viewSDKClient = new ViewSDKClient();
18 | viewSDKClient.ready().then(() => {
19 | /* Invoke file preview */
20 | viewSDKClient.previewFile("pdf-div", {
21 | /* Pass the embed mode option here */
22 | embedMode: "SIZED_CONTAINER"
23 | });
24 | });
25 | }
26 |
27 | render() {
28 | return ;
29 | }
30 | }
31 |
32 | export default SizedContainer;
33 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/samples/LocalPDFFilePreview.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | import React, { Component } from "react";
13 | import ViewSDKClient from "./ViewSDKClient";
14 |
15 | class LocalPDFFilePreview extends Component {
16 | constructor() {
17 | super();
18 | this.viewSDKClient = new ViewSDKClient();
19 | }
20 |
21 | /* Helper function to check if selected file is PDF or not. */
22 | isValidPDF = file => {
23 | if (file.type === "application/pdf") {
24 | return true;
25 | }
26 | if (file.type === "" && file.name) {
27 | const fileName = file.name;
28 | const lastDotIndex = fileName.lastIndexOf(".");
29 | if (lastDotIndex === -1 || fileName.substr(lastDotIndex).toUpperCase() !== "PDF") return false;
30 | return true;
31 | }
32 | return false;
33 | };
34 |
35 | /* Helper function to be executed on file upload
36 | * for creating Promise which resolve to ArrayBuffer of file data.
37 | **/
38 | onFileUpload = event => {
39 | event.persist();
40 | this.viewSDKClient.ready().then(() => {
41 | const files = event.target.files;
42 | if (files.length > 0 && this.isValidPDF(files[0])) {
43 | const fileName = files[0].name;
44 | const reader = new FileReader();
45 | reader.onloadend = e => {
46 | const filePromise = Promise.resolve(e.target.result);
47 | /* Helper function to render the file using PDF Embed API. */
48 | this.viewSDKClient.previewFileUsingFilePromise("pdf-div", filePromise, fileName);
49 | };
50 | reader.readAsArrayBuffer(files[0]);
51 | }
52 | });
53 | }
54 |
55 | render() {
56 | return (
57 |
69 | );
70 | }
71 | }
72 |
73 | export default UIConfigurations;
74 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/samples/PDFAnnotationTools.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | import React, { Component } from "react";
13 | import ViewSDKClient from "./ViewSDKClient";
14 |
15 | class PDFAnnotationTools extends Component {
16 | componentDidMount() {
17 | const viewSDKClient = new ViewSDKClient();
18 | viewSDKClient.ready().then(() => {
19 | /* Invoke file preview */
20 | viewSDKClient.previewFile("pdf-div", {
21 | /* Control the viewer customization. */
22 | showAnnotationTools: true,
23 | enableFormFilling: true
24 | });
25 | /* Register Save API handler */
26 | viewSDKClient.registerSaveApiHandler();
27 | });
28 | }
29 |
30 | render() {
31 | return (
32 |
33 | );
34 | }
35 | }
36 |
37 | export default PDFAnnotationTools;
38 |
--------------------------------------------------------------------------------
/More Samples/React Samples/src/samples/ViewerCustomization.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2020 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | import React, { Component } from "react";
13 | import ViewSDKClient from "./ViewSDKClient";
14 |
15 | class ViewerCustomization extends Component {
16 | /* Control the viewer customization.
17 | * It lists down all supported variables with default values.
18 | **/
19 | viewerConfig = {
20 | /* If true, tools such as sticky note, highlight, and so on appear in the quick tools menu. */
21 | showAnnotationTools: true,
22 |
23 | /* If true, form filling is enabled and users can edit fields. */
24 | enableFormFilling: true,
25 |
26 | /* If true, a download button appears in the overflow menu on the top bar. */
27 | showDownloadPDF: true,
28 |
29 | /* If true, then a print PDF option appears in the overflow menu on the top bar. */
30 | showPrintPDF: true,
31 |
32 | /* If true, the zoom controls are displayed on the right hand panel. */
33 | showZoomControl: true,
34 |
35 | /* Allowed possible values are 'FIT_PAGE', 'FIT_WIDTH', 'TWO_COLUMN', 'TWO_COLUMN_FIT_PAGE', or ''.
36 | FIT_WIDTH expands the page horizontally to the full width of the document pane.
37 | FIT_PAGE displays the entire page in the current view so that no scrolling is required.
38 | TWO_COLUMN displays two pages side-by-side in the current view.
39 | TWO_COLUMN_FIT_PAGE displays two pages side-by-side where the pages are zoomed to page level.
40 | Note that end users can toggle the view mode on the right hand panel. */
41 | defaultViewMode: ''
42 | };
43 |
44 | componentDidMount() {
45 | const viewSDKClient = new ViewSDKClient();
46 | viewSDKClient.ready().then(() => {
47 | /* Invoke file preview */
48 | viewSDKClient.previewFile("pdf-div", this.viewerConfig);
49 | });
50 | }
51 |
52 | render() {
53 | return ;
54 | }
55 | }
56 |
57 | export default ViewerCustomization;
58 |
--------------------------------------------------------------------------------
/More Samples/Save User Preferences/README.md:
--------------------------------------------------------------------------------
1 | # Save User Preferences Sample
2 |
3 | PDF Embed API does not save any user preferences by default. This sample demonstrates how certain user preferences (such as updated annotation colour, and coach mark after selecting any annotation tool) can be saved and remembered in the browser.
4 | In this example, the user preferences are saved in the local storage of the website domain.
5 |
6 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
7 |
8 | ## Documentation
9 |
10 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
11 |
--------------------------------------------------------------------------------
/More Samples/Save User Preferences/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/More Samples/Save User Preferences/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2021 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | /* Wait for Adobe Acrobat Services PDF Embed API to be ready */
13 | document.addEventListener("adobe_dc_view_sdk.ready", function () {
14 | /* Initialize the AdobeDC View object */
15 | var adobeDCView = new AdobeDC.View({
16 | /* Pass your registered client id */
17 | clientId: "",
18 | /* Pass the div id in which PDF should be rendered */
19 | divId: "adobe-dc-view",
20 | });
21 |
22 | /* Invoke the file preview API on Adobe DC View object */
23 | adobeDCView.previewFile({
24 | /* Pass information on how to access the file */
25 | content: {
26 | /* Location of file where it is hosted */
27 | location: {
28 | url: "https://acrobatservices.adobe.com/view-sdk-demo/PDFs/Bodea Brochure.pdf",
29 | /*
30 | If the file URL requires some additional headers, then it can be passed as follows:-
31 | headers: [
32 | {
33 | key: "",
34 | value: "",
35 | }
36 | ]
37 | */
38 | },
39 | },
40 | /* Pass meta data of file */
41 | metaData: {
42 | /* file name */
43 | fileName: "Bodea Brochure.pdf"
44 | }
45 | }, {});
46 |
47 | /* Handler to store the user preferences */
48 | var setUserSettingHandler = function (setting) {
49 | return new Promise(function (resolve, reject) {
50 | /* This is an example code, where the user preferences are saved in the local storage of the website domain.
51 | Replace this with your own custom implementation of saving the preferences. */
52 | console.log("Setting user preferences in local storage of website domain.")
53 | localStorage.setItem("USER_SETTINGS", JSON.stringify(setting));
54 | var response = {
55 | code: AdobeDC.View.Enum.ApiResponseCode.SUCCESS,
56 | };
57 | resolve(response);
58 | });
59 | };
60 |
61 | adobeDCView.registerCallback(
62 | AdobeDC.View.Enum.CallbackType.SET_USER_SETTING_API,
63 | setUserSettingHandler,
64 | {}
65 | );
66 |
67 | /* Handler to fetch the user preferences */
68 | var getUserSettingHandler = function () {
69 | return new Promise(function (resolve, reject) {
70 | /* This is an example code to fetch the user preferences. Replace with your own custom implementation. */
71 | console.log("Fetching user preferences from local storage of website domain.")
72 | var userSettings = localStorage.getItem("USER_SETTINGS") || "{}";
73 | userSettings = JSON.parse(userSettings);
74 | var response = {
75 | code: AdobeDC.View.Enum.ApiResponseCode.SUCCESS,
76 | data: {
77 | setting: userSettings
78 | }
79 | };
80 | resolve(response);
81 | });
82 | };
83 |
84 | adobeDCView.registerCallback(
85 | AdobeDC.View.Enum.CallbackType.GET_USER_SETTING_API,
86 | getUserSettingHandler,
87 | {}
88 | );
89 | });
90 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Attachment APIs/README.md:
--------------------------------------------------------------------------------
1 | # Sample for Attachment APIs
2 |
3 | This sample shows how to access the file attachments available in the PDF.
4 |
5 | A custom left hand pane has been created. Upload a PDF file from local storage and the attachments available in the PDF are listed in this pane.
6 | Click on any attachment link to download the particular attachment to your computer.
7 |
8 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
9 |
10 | ## Documentation
11 |
12 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
13 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Attachment APIs/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
Attachments
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Attachment APIs/style.css:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2021 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | body {
13 | margin: 0;
14 | display: flex;
15 | height: 100vh;
16 | }
17 |
18 | #adobe-dc-view {
19 | width: calc(100% - 300px);
20 | }
21 |
22 | h3 {
23 | margin-top: 40px;
24 | }
25 |
26 | #attachment-pane {
27 | border-right: 1px solid grey;
28 | font-size: 15px;
29 | float: left;
30 | padding: 15px;
31 | width: 300px;
32 | background-color: #f5f5f5;
33 | text-align: center;
34 | }
35 |
36 | ul {
37 | list-style-type: disc;
38 | text-align: left;
39 | margin: 0;
40 | }
41 |
42 | li {
43 | cursor: pointer;
44 | font-family: Lato, sans-serif;
45 | color: #777;
46 | font-size: medium;
47 | }
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Bookmark APIs/README.md:
--------------------------------------------------------------------------------
1 | # Sample for Bookmark APIs
2 |
3 | This sample shows how to fetch and open bookmarks in the PDF programmatically.
4 |
5 | A custom left hand pane has been created. Upload a PDF file from local storage and the bookmarks available in the PDF are listed in this pane.
6 | Click on any bookmark link to navigate to the particular PDF page containing that bookmark.
7 |
8 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
9 |
10 | ## Documentation
11 |
12 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
13 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Bookmark APIs/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
Bookmarks
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Bookmark APIs/style.css:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2021 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | body {
13 | margin: 0;
14 | display: flex;
15 | height: 100vh;
16 | }
17 |
18 | #adobe-dc-view {
19 | width: calc(100% - 300px);
20 | }
21 |
22 | h3 {
23 | margin-top: 40px;
24 | }
25 |
26 | #bookmark-pane {
27 | border-right: 1px solid grey;
28 | font-size: 15px;
29 | float: left;
30 | padding: 15px;
31 | width: 300px;
32 | background-color: #f5f5f5;
33 | text-align: center;
34 | }
35 |
36 | ul {
37 | list-style-type: disc;
38 | text-align: left;
39 | margin: 0;
40 | }
41 |
42 | li {
43 | cursor: pointer;
44 | font-family: Lato, sans-serif;
45 | color: #777;
46 | font-size: medium;
47 | }
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/README.md:
--------------------------------------------------------------------------------
1 | # Viewer APIs
2 |
3 | PDF Embed API provides viewer APIs for customizing the user interface and user interactions with the PDF.
4 | These samples show how these APIs can be used to perform UI customizations programmatically at run-time.
5 |
6 | ### Attachment APIs
7 |
8 | This sample shows how to access the file attachments available in the PDF.
9 | To see it in action, open ```Attachment APIs/index.html``` in a supported browser.
10 |
11 | ### Bookmark APIs
12 |
13 | This sample shows how to fetch and open bookmarks in the PDF programmatically.
14 | To see it in action, open ```Bookmark APIs/index.html``` in a supported browser.
15 |
16 | ### Search and Zoom APIs
17 |
18 | This sample shows how to perform search and zoom operations on the PDF programmatically using the Search and Zoom Viewer APIs.
19 | Search APIs will search for a term in a PDF and traverse through the search results.
20 | Zoom APIs will perform zoom operations on the PDF.
21 | To see it in action, open ```Search and Zoom APIs/index.html``` in a supported browser.
22 |
23 | ## Documentation
24 |
25 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
26 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Search and Zoom APIs/README.md:
--------------------------------------------------------------------------------
1 | # Sample for Search and Zoom APIs
2 |
3 | This sample shows how to perform search and zoom operations on the PDF programmatically using the Search and Zoom Viewer APIs.
4 |
5 | ### Search APIs
6 |
7 | A custom search bar has been created which can be used to enter any term. Click on the search button to search for that term in the PDF and traverse through the search results. Click on the Clear button to cancel the search operation.
8 |
9 | ### Zoom APIs
10 |
11 | Custom zoom controls have been created which can be used to increase and decrease the PDF zoom level.
12 | To set a particular zoom level, enter the value in the box and the page view changes according to the zoom level.
13 |
14 | To see the APIs in action, copy the files in the folder to your computer, and open index.html in a supported browser.
15 |
16 | ## Documentation
17 |
18 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
19 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Search and Zoom APIs/images/chevronnext.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Search and Zoom APIs/images/chevronprevious.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Search and Zoom APIs/images/zoom_in.svg:
--------------------------------------------------------------------------------
1 |
7 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Search and Zoom APIs/images/zoom_out.svg:
--------------------------------------------------------------------------------
1 |
7 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Search and Zoom APIs/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 | Result 0 of 0
21 |
22 |
23 |
24 |
25 |
26 | PDF Zoom Level
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
--------------------------------------------------------------------------------
/More Samples/Viewer APIs/Search and Zoom APIs/style.css:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2021 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | body {
13 | margin: 0;
14 | display: flex;
15 | height: 100vh;
16 | }
17 |
18 | .pdf-view {
19 | width: calc(100% - 300px);
20 | }
21 |
22 | .container {
23 | border-left: 1px solid #333;
24 | width: 300px;
25 | font-family: Lato, sans-serif;
26 | text-align: center;
27 | background-color: #f5f5f5;
28 | }
29 |
30 | input[type="text"] {
31 | margin: 0;
32 | font-size: 15px;
33 | line-height: 15px;
34 | height: 15px;
35 | padding: 10px;
36 | border: 1px solid #ddd;
37 | background: #fff;
38 | border-radius: 6px;
39 | font-family: Lato, sans-serif;
40 | color: #606060;
41 | width: 100%;
42 | }
43 |
44 | input[type="text"]:focus {
45 | color: #333;
46 | }
47 |
48 | .search-container {
49 | padding: 6px 10px;
50 | margin-top: 5px;
51 | margin-right: 16px;
52 | border: none;
53 | cursor: pointer;
54 | }
55 |
56 | .btn {
57 | background-color: #c3c5c3;
58 | border: none;
59 | color: black;
60 | padding: 10px 15px;
61 | text-align: center;
62 | text-decoration: none;
63 | display: inline-block;
64 | font-size: 16px;
65 | margin: 20px 5px;
66 | cursor: pointer;
67 | }
68 |
69 | #search-result {
70 | padding: 6px 10px;
71 | margin: 20px 5px;
72 | display: none;
73 | }
74 |
75 | #searchResult-num {
76 | color: #606060;
77 | position: relative;
78 | top: -2px;
79 | }
80 |
81 | .searchResult-btn {
82 | margin-left: 10px;
83 | opacity: 0.2;
84 | border: 0;
85 | background: none;
86 | cursor: pointer;
87 | }
88 |
89 | #zoom-level {
90 | position: absolute;
91 | bottom: 0;
92 | padding: 6px 10px;
93 | margin: 20px 5px;
94 | font-size: 17px;
95 | border: none;
96 | cursor: pointer;
97 | }
98 |
99 | input[id="set-zoom"] {
100 | width: 20%;
101 | margin: 5px;
102 | text-align: center;
103 | }
104 |
105 | .zoom-btn {
106 | border: 0;
107 | background: none;
108 | cursor: pointer;
109 | }
110 |
--------------------------------------------------------------------------------
/More Samples/Viewer Customization/README.md:
--------------------------------------------------------------------------------
1 | # Customize PDF Preview Sample
2 |
3 | This sample shows how to customize the PDF viewer.
4 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
5 |
6 | ## Documentation
7 |
8 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
9 |
--------------------------------------------------------------------------------
/More Samples/Viewer Customization/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/More Samples/Viewer Customization/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2019 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | /* Control the viewer customization.
13 | * It lists down all supported variables with default values.
14 | **/
15 | var viewerConfig = {
16 | showAnnotationTools: true,
17 | enableFormFilling: true,
18 | showDownloadPDF: true,
19 | showPrintPDF: true,
20 | showZoomControl: true,
21 | defaultViewMode: "", /* Allowed possible values are "FIT_PAGE", "FIT_WIDTH", "TWO_COLUMN", "TWO_COLUMN_FIT_PAGE" or "". */
22 | };
23 |
24 | /* Wait for Adobe Acrobat Services PDF Embed API to be ready */
25 | document.addEventListener("adobe_dc_view_sdk.ready", function () {
26 | /* Initialize the AdobeDC View object */
27 | var adobeDCView = new AdobeDC.View({
28 | /* Pass your registered client id */
29 | clientId: "",
30 | /* Pass the div id in which PDF should be rendered */
31 | divId: "adobe-dc-view",
32 | });
33 |
34 | /* Invoke the file preview API on Adobe DC View object */
35 | adobeDCView.previewFile({
36 | /* Pass information on how to access the file */
37 | content: {
38 | /* Location of file where it is hosted */
39 | location: {
40 | url: "https://acrobatservices.adobe.com/view-sdk-demo/PDFs/Bodea Brochure.pdf",
41 | /*
42 | If the file URL requires some additional headers, then it can be passed as follows:-
43 | headers: [
44 | {
45 | key: "",
46 | value: "",
47 | }
48 | ]
49 | */
50 | },
51 | },
52 | /* Pass meta data of file */
53 | metaData: {
54 | /* file name */
55 | fileName: "Bodea Brochure.pdf"
56 | }
57 | }, viewerConfig);
58 | });
59 |
--------------------------------------------------------------------------------
/More Samples/Work with Local File/README.md:
--------------------------------------------------------------------------------
1 | # Local PDF file Preview Sample
2 |
3 | This sample demonstrates how to render a local PDF file using the PDF Embed API. It will ask you to pick a PDF file from your computer to start the PDF file rendering using the PDF Embed API.
4 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
5 |
6 | ## Documentation
7 |
8 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
9 |
--------------------------------------------------------------------------------
/More Samples/Work with Local File/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
--------------------------------------------------------------------------------
/More Samples/Work with Local File/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2019 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | /* Helper function to render the file using PDF Embed API. */
13 | function previewFile(filePromise, fileName) {
14 | /* Initialize the AdobeDC View object */
15 | var adobeDCView = new AdobeDC.View({
16 | /* Pass your registered client id */
17 | clientId: "",
18 | /* Pass the div id in which PDF should be rendered */
19 | divId: "adobe-dc-view",
20 | });
21 |
22 | /* Invoke the file preview API on Adobe DC View object */
23 | adobeDCView.previewFile({
24 | /* Pass information on how to access the file */
25 | content: {
26 | /* pass file promise which resolve to arrayBuffer */
27 | promise: filePromise,
28 | },
29 | /* Pass meta data of file */
30 | metaData: {
31 | /* file name */
32 | fileName: fileName
33 | }
34 | }, {});
35 | }
36 |
37 | /* Helper function to check if selected file is PDF or not. */
38 | function isValidPDF(file) {
39 | if (file.type === "application/pdf") {
40 | return true;
41 | }
42 | if (file.type === "" && file.name) {
43 | var fileName = file.name;
44 | var lastDotIndex = fileName.lastIndexOf(".");
45 | return !(lastDotIndex === -1 || fileName.substr(lastDotIndex).toUpperCase() !== "PDF");
46 | }
47 | return false;
48 | }
49 |
50 | /* Helper function to listen for file upload and
51 | * creating Promise which resolve to ArrayBuffer of file data.
52 | **/
53 | function listenForFileUpload() {
54 | var fileToRead = document.getElementById("file-picker");
55 | fileToRead.addEventListener("change", function (event) {
56 | var files = fileToRead.files;
57 | if (files.length > 0 && isValidPDF(files[0])) {
58 | var fileName = files[0].name;
59 | var reader = new FileReader();
60 | reader.onloadend = function (e) {
61 | var filePromise = Promise.resolve(e.target.result);
62 | previewFile(filePromise, fileName);
63 | };
64 | reader.readAsArrayBuffer(files[0]);
65 | }
66 | }, false);
67 | }
68 |
--------------------------------------------------------------------------------
/Sized Container Embed Mode/README.md:
--------------------------------------------------------------------------------
1 | # Sized Container Embed Mode Sample
2 |
3 | PDF viewer is embedded in the sized container in slideshow and landscape mode.
4 | To see it in action, copy the files in the folder to your computer, and open index.html in a supported browser.
5 |
6 | ## Documentation
7 |
8 | For detailed documentation, please check https://www.adobe.com/go/dcviewsdk_docs.
9 |
--------------------------------------------------------------------------------
/Sized Container Embed Mode/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Adobe Acrobat Services PDF Embed API Sample
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/Sized Container Embed Mode/index.js:
--------------------------------------------------------------------------------
1 | /*
2 | Copyright 2019 Adobe
3 | All Rights Reserved.
4 |
5 | NOTICE: Adobe permits you to use, modify, and distribute this file in
6 | accordance with the terms of the Adobe license agreement accompanying
7 | it. If you have received this file from a source other than Adobe,
8 | then your use, modification, or distribution of it requires the prior
9 | written permission of Adobe.
10 | */
11 |
12 | /* Pass the embed mode option here */
13 | var viewerConfig = {
14 | embedMode: "SIZED_CONTAINER"
15 | };
16 |
17 | /* Wait for Adobe Acrobat Services PDF Embed API to be ready */
18 | document.addEventListener("adobe_dc_view_sdk.ready", function () {
19 | /* Initialize the AdobeDC View object */
20 | var adobeDCView = new AdobeDC.View({
21 | /* Pass your registered client id */
22 | clientId: "",
23 | /* Pass the div id in which PDF should be rendered */
24 | divId: "adobe-dc-view",
25 | });
26 |
27 | /* Invoke the file preview API on Adobe DC View object */
28 | adobeDCView.previewFile({
29 | /* Pass information on how to access the file */
30 | content: {
31 | /* Location of file where it is hosted */
32 | location: {
33 | url: "https://acrobatservices.adobe.com/view-sdk-demo/PDFs/Bodea Brochure.pdf",
34 | /*
35 | If the file URL requires some additional headers, then it can be passed as follows:-
36 | header: [
37 | {
38 | key: "",
39 | value: "",
40 | }
41 | ]
42 | */
43 | },
44 | },
45 | /* Pass meta data of file */
46 | metaData: {
47 | /* file name */
48 | fileName: "Bodea Brochure.pdf"
49 | }
50 | }, viewerConfig);
51 | });
52 |
--------------------------------------------------------------------------------