Merge pull request #8990 from pixelexel/fix-#8951
Added component example for single page viewer
This commit is contained in:
		
						commit
						e3873b29fd
					
				
							
								
								
									
										51
									
								
								examples/components/singlepageviewer.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										51
									
								
								examples/components/singlepageviewer.html
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,51 @@ | |||||||
|  | <!DOCTYPE html> | ||||||
|  | <!-- | ||||||
|  | Copyright 2014 Mozilla Foundation | ||||||
|  | 
 | ||||||
|  | Licensed under the Apache License, Version 2.0 (the "License"); | ||||||
|  | you may not use this file except in compliance with the License. | ||||||
|  | You may obtain a copy of the License at | ||||||
|  | 
 | ||||||
|  |     http://www.apache.org/licenses/LICENSE-2.0 | ||||||
|  | 
 | ||||||
|  | Unless required by applicable law or agreed to in writing, software | ||||||
|  | distributed under the License is distributed on an "AS IS" BASIS, | ||||||
|  | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||||||
|  | See the License for the specific language governing permissions and | ||||||
|  | limitations under the License. | ||||||
|  | --> | ||||||
|  | <html dir="ltr" mozdisallowselectionprint moznomarginboxes> | ||||||
|  | <head> | ||||||
|  |   <meta charset="utf-8"> | ||||||
|  |   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> | ||||||
|  |   <meta name="google" content="notranslate"> | ||||||
|  |   <title>PDF.js Single Page Viewer using built components</title> | ||||||
|  | 
 | ||||||
|  |   <style> | ||||||
|  |     body { | ||||||
|  |       background-color: #808080; | ||||||
|  |       margin: 0; | ||||||
|  |       padding: 0; | ||||||
|  |     } | ||||||
|  |     #viewerContainer { | ||||||
|  |       overflow: auto; | ||||||
|  |       position: absolute; | ||||||
|  |       width: 100%; | ||||||
|  |       height: 100%; | ||||||
|  |     } | ||||||
|  |   </style> | ||||||
|  | 
 | ||||||
|  |   <link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css"> | ||||||
|  | 
 | ||||||
|  |   <script src="../../node_modules/pdfjs-dist/build/pdf.js"></script> | ||||||
|  |   <script src="../../node_modules/pdfjs-dist/web/pdf_viewer.js"></script> | ||||||
|  | </head> | ||||||
|  | 
 | ||||||
|  | <body tabindex="1"> | ||||||
|  |   <div id="viewerContainer"> | ||||||
|  |     <div id="viewer" class="pdfViewer"></div> | ||||||
|  |   </div> | ||||||
|  | 
 | ||||||
|  |   <script src="singlepageviewer.js"></script> | ||||||
|  | </body> | ||||||
|  | </html> | ||||||
							
								
								
									
										68
									
								
								examples/components/singlepageviewer.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										68
									
								
								examples/components/singlepageviewer.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,68 @@ | |||||||
|  | /* Copyright 2014 Mozilla Foundation | ||||||
|  |  * | ||||||
|  |  * Licensed under the Apache License, Version 2.0 (the "License"); | ||||||
|  |  * you may not use this file except in compliance with the License. | ||||||
|  |  * You may obtain a copy of the License at | ||||||
|  |  * | ||||||
|  |  *     http://www.apache.org/licenses/LICENSE-2.0
 | ||||||
|  |  * | ||||||
|  |  * Unless required by applicable law or agreed to in writing, software | ||||||
|  |  * distributed under the License is distributed on an "AS IS" BASIS, | ||||||
|  |  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||||||
|  |  * See the License for the specific language governing permissions and | ||||||
|  |  * limitations under the License. | ||||||
|  |  */ | ||||||
|  | 
 | ||||||
|  | 'use strict'; | ||||||
|  | 
 | ||||||
|  | if (!PDFJS.PDFSinglePageViewer || !PDFJS.getDocument) { | ||||||
|  |   alert('Please build the pdfjs-dist library using\n' + | ||||||
|  |         '  `gulp dist-install`'); | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // The workerSrc property shall be specified.
 | ||||||
|  | //
 | ||||||
|  | PDFJS.workerSrc = '../../node_modules/pdfjs-dist/build/pdf.worker.js'; | ||||||
|  | 
 | ||||||
|  | // Some PDFs need external cmaps.
 | ||||||
|  | //
 | ||||||
|  | // PDFJS.cMapUrl = '../../node_modules/pdfjs-dist/cmaps/';
 | ||||||
|  | // PDFJS.cMapPacked = true;
 | ||||||
|  | 
 | ||||||
|  | var DEFAULT_URL = '../../web/compressed.tracemonkey-pldi-09.pdf'; | ||||||
|  | var SEARCH_FOR = ''; // try 'Mozilla';
 | ||||||
|  | 
 | ||||||
|  | var container = document.getElementById('viewerContainer'); | ||||||
|  | 
 | ||||||
|  | // (Optionally) enable hyperlinks within PDF files.
 | ||||||
|  | var pdfLinkService = new PDFJS.PDFLinkService(); | ||||||
|  | 
 | ||||||
|  | var pdfSinglePageViewer = new PDFJS.PDFSinglePageViewer({ | ||||||
|  |   container: container, | ||||||
|  |   linkService: pdfLinkService, | ||||||
|  | }); | ||||||
|  | pdfLinkService.setViewer(pdfSinglePageViewer); | ||||||
|  | 
 | ||||||
|  | // (Optionally) enable find controller.
 | ||||||
|  | var pdfFindController = new PDFJS.PDFFindController({ | ||||||
|  |   pdfViewer: pdfSinglePageViewer | ||||||
|  | }); | ||||||
|  | pdfSinglePageViewer.setFindController(pdfFindController); | ||||||
|  | 
 | ||||||
|  | container.addEventListener('pagesinit', function () { | ||||||
|  |   // We can use pdfSinglePageViewer now, e.g. let's change default scale.
 | ||||||
|  |   pdfSinglePageViewer.currentScaleValue = 'page-width'; | ||||||
|  | 
 | ||||||
|  |   if (SEARCH_FOR) { // We can try search for things
 | ||||||
|  |     pdfFindController.executeCommand('find', {query: SEARCH_FOR}); | ||||||
|  |   } | ||||||
|  | }); | ||||||
|  | 
 | ||||||
|  | // Loading document.
 | ||||||
|  | PDFJS.getDocument(DEFAULT_URL).then(function (pdfDocument) { | ||||||
|  |   // Document loaded, specifying document for the viewer and
 | ||||||
|  |   // the (optional) linkService.
 | ||||||
|  |   pdfSinglePageViewer.setDocument(pdfDocument); | ||||||
|  | 
 | ||||||
|  |   pdfLinkService.setDocument(pdfDocument, null); | ||||||
|  | }); | ||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user