├── .gitignore
├── LICENSE
├── README.md
├── bower.json
├── demo
    ├── index.html
    └── pdf-sample.pdf
├── index.html
├── pdf-browser-viewer.html
└── test
    └── pdf-browser-viewer_test.html


/.gitignore:
--------------------------------------------------------------------------------
1 | **.DS_Store
2 | *.iml
3 | 
4 | .git/
5 | .idea/
6 | bower_components/
7 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | The MIT License (MIT)
 2 | 
 3 | Copyright (c) 2016 Ingresso Rápido Web Components
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | [![bower version](https://img.shields.io/bower/v/pdf-browser-viewer.svg)](https://libraries.io/bower/pdf-browser-viewer)
 2 | [![open issues](https://img.shields.io/github/issues/IngressoRapidoWebComponents%2Fpdf-browser-viewer.svg)](https://github.com/IngressoRapidoWebComponents/pdf-browser-viewer/issues)
 3 | [![license](https://img.shields.io/github/license/IngressoRapidoWebComponents%2Fpdf-browser-viewer.svg)](https://github.com/IngressoRapidoWebComponents/pdf-browser-viewer/blob/master/LICENSE)
 4 | 
 5 | 
 6 | # \<pdf-browser-viewer\>
 7 | 
 8 | PDF viewer using native browser object as application/pdf
 9 | 
10 | _[Demo and API docs](https://ingressorapidowebcomponents.github.io/components/pdf-browser-viewer/)_
11 | 
12 | Example:
13 | ```html
14 |     <pdf-browser-viewer id="pdfViewer" file="[[pdfUrl]]" width="100%"></pdf-browser-viewer>
15 | ```
16 | 
17 | Data Bind with Blob example:
18 | ```js
19 |     this.pdfUrl = URL.createObjectURL(blob);
20 | ```
21 | 
22 | Clear PDF container example:
23 | ```js
24 |     this.$.pdfViewer.clear();
25 | ```
26 | 
27 | Message example:
28 | ```html
29 |     <pdf-browser-viewer
30 |         file="[[pdfUrl]]"
31 |         not-supported-message="Not supported by your browser"
32 |         not-supported-link-message="see the file here!">
33 |     </pdf-browser-viewer>
34 | ```
35 | 
36 | Card example:
37 | ```html
38 |     <pdf-browser-viewer
39 |         file="[[pdfUrl]]"
40 |         card elevation="3"
41 |         download-label="Baixar">
42 |     </pdf-browser-viewer>
43 | ```


--------------------------------------------------------------------------------
/bower.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "pdf-browser-viewer",
 3 |   "description": "PDF viewer using native browser object as application/pdf",
 4 |   "version": "1.0.6",
 5 |   "homepage": "https://ingressorapidowebcomponents.github.io/components/pdf-browser-viewer",
 6 |   "authors": [
 7 |     "Andrew Willard (https://github.com/andrew-silva-movile)"
 8 |   ],
 9 |   "keywords": [
10 |     "web-components",
11 |     "web-component",
12 |     "polymer",
13 |     "pdf",
14 |     "pdf-viewer",
15 |     "pdf-object",
16 |     "pdf-render"
17 |   ],
18 |   "main": "pdf-browser-viewer.html",
19 |   "dependencies": {
20 |     "polymer": "Polymer/polymer#^1.4.0",
21 |     "paper-card": "PolymerElements/paper-card#^1.1.1",
22 |     "paper-button": "PolymerElements/paper-button#^1.0.12"
23 |   },
24 |   "devDependencies": {
25 |     "iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
26 |     "iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
27 |     "web-component-tester": "^4.0.0",
28 |     "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
29 |   }
30 | }
31 | 


--------------------------------------------------------------------------------
/demo/index.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html>
 3 |   <head>
 4 |     <title>pdf-browser-viewer demo</title>
 5 |     <meta charset="utf-8">
 6 |     <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
 7 |     <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
 8 | 
 9 |     <link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
10 |     <link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
11 | 
12 |     <link rel="import" href="../pdf-browser-viewer.html">
13 | 
14 |     <style is="custom-style" include="demo-pages-shared-styles">
15 |     </style>
16 |   </head>
17 |   <body>
18 | 
19 |     <div class="vertical-section-container">
20 |       <h3>Basic pdf-browser-viewer Demo</h3>
21 |       <demo-snippet width="100%">
22 |         <template>
23 |           <pdf-browser-viewer
24 |                   file="pdf-sample.pdf"
25 |                   width="100%">
26 |           </pdf-browser-viewer>
27 |         </template>
28 |       </demo-snippet>
29 |     </div>
30 | 
31 |   </body>
32 | </html>
33 | 


--------------------------------------------------------------------------------
/demo/pdf-sample.pdf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/IngressoRapidoWebComponents/pdf-browser-viewer/a2988fb2944f60054a3e7b3279099e90622fcb3f/demo/pdf-sample.pdf


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | 
 3 | <html>
 4 |   <head>
 5 |     <title>pdf-browser-viewer</title>
 6 |     <meta charset="utf-8">
 7 |     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 8 |     <script src="../webcomponentsjs/webcomponents-lite.js"></script>
 9 |     <link rel="import" href="../iron-component-page/iron-component-page.html">
10 |   </head>
11 |   <body>
12 |     <iron-component-page src="pdf-browser-viewer.html"></iron-component-page>
13 |   </body>
14 | </html>
15 | 


--------------------------------------------------------------------------------
/pdf-browser-viewer.html:
--------------------------------------------------------------------------------
  1 | <!--
  2 | @license
  3 | Copyright (c) 2016 The Ingresso Rápido Web Components Authors. All rights reserved.
  4 | This code may only be used under the BSD style license found at http://ingressorapidowebcomponents.github.io/LICENSE.txt
  5 | The complete set of authors may be found at http://ingressorapidowebcomponents.github.io/AUTHORS.txt
  6 | The complete set of contributors may be found at http://ingressorapidowebcomponents.github.io/CONTRIBUTORS.txt
  7 | Code distributed by Google as part of the polymer project is also
  8 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
  9 | -->
 10 | 
 11 | <link rel="import" href="../polymer/polymer.html">
 12 | <link rel="import" href="../paper-card/paper-card.html">
 13 | <link rel="import" href="../paper-button/paper-button.html">
 14 | 
 15 | <!--
 16 | 
 17 | PDF viewer using native browser object as application/pdf
 18 | 
 19 | Example:
 20 | ```html
 21 |     <pdf-browser-viewer id="pdfViewer" file="[[pdfUrl]]" width="100%"></pdf-browser-viewer>
 22 | ```
 23 | 
 24 | Data Bind with Blob example:
 25 | ```js
 26 |     this.pdfUrl = URL.createObjectURL(blob);
 27 | ```
 28 | 
 29 | Clear PDF container example:
 30 | ```js
 31 |     this.$.pdfViewer.clear();
 32 | ```
 33 | 
 34 | Message example:
 35 | ```html
 36 |     <pdf-browser-viewer
 37 |         file="[[pdfUrl]]"
 38 |         not-supported-message="Not supported by your browser"
 39 |         not-supported-link-message="see the file here!">
 40 |     </pdf-browser-viewer>
 41 | ```
 42 | 
 43 | Card example:
 44 | ```html
 45 |     <pdf-browser-viewer
 46 |         file="[[pdfUrl]]"
 47 |         card elevation="3"
 48 |         download-label="Baixar">
 49 |     </pdf-browser-viewer>
 50 | ```
 51 | 
 52 | @demo demo/index.html
 53 | -->
 54 | 
 55 | <dom-module id="pdf-browser-viewer">
 56 |     <template>
 57 | 
 58 |         <style>
 59 |             :host {
 60 |                 display: none;
 61 |             }
 62 |             :host([file]) {
 63 |                 display: inherit;
 64 |             }
 65 |         </style>
 66 | 
 67 |         <template is="dom-if" if="[[card]]">
 68 |             <paper-card heading="[[heading]]" elevation="[[elevation]]">
 69 |                 <div class="card-content">
 70 |                     <object data="[[file]]" type="application/pdf" width="[[width]]" height="[[height]]">
 71 |                         <p>
 72 |                             {{notSupportedMessage}} <a href="[[file]]">{{notSupportedLinkMessage}}</a>
 73 |                         </p>
 74 |                     </object>
 75 |                 </div>
 76 |                 <div class="card-actions">
 77 |                     <paper-button on-click="_download">[[downloadLabel]]</paper-button>
 78 |                 </div>
 79 |             </paper-card>
 80 |         </template>
 81 | 
 82 |         <template is="dom-if" if="[[!card]]">
 83 |             <object data="[[file]]" type="application/pdf" width="[[width]]" height="[[height]]">
 84 |                 <p>
 85 |                     {{notSupportedMessage}} <a href="[[file]]">{{notSupportedLinkMessage}}</a>
 86 |                 </p>
 87 |             </object>
 88 |         </template>
 89 | 
 90 |     </template>
 91 | 
 92 |     <script>
 93 |         Polymer({
 94 |             is: 'pdf-browser-viewer',
 95 | 
 96 |             properties: {
 97 |                 /**
 98 |                  * The location of the PDF file.
 99 |                  *
100 |                  * @type String
101 |                  */
102 |                 file: {
103 |                     type: String,
104 |                     value: undefined,
105 |                     reflectToAttribute: true
106 |                 },
107 |                 /**
108 |                  * The message when browser doesn't support pdf object
109 |                  *
110 |                  * @type String
111 |                  */
112 |                 notSupportedMessage: {
113 |                     type: String,
114 |                     value: 'It appears your Web browser is not configured to display PDF files. No worries, just'
115 |                 },
116 |                 /**
117 |                  * The PDF link message when browser doesn't support pdf object
118 |                  *
119 |                  * @type String
120 |                  */
121 |                 notSupportedLinkMessage: {
122 |                     type: String,
123 |                     value: 'click here to download the PDF file.'
124 |                 },
125 |                 /**
126 |                  * The height of the PDF viewer.
127 |                  *
128 |                  * @type String
129 |                  */
130 |                 height: {
131 |                     type: String,
132 |                     value: '400px'
133 |                 },
134 |                 /**
135 |                  * The width of the PDF viewer.
136 |                  *
137 |                  * @type String
138 |                  */
139 |                 width: {
140 |                     type: String,
141 |                     value: '100%'
142 |                 },
143 |                 /**
144 |                  * PDF viewer as a card with download button.
145 |                  *
146 |                  * @type Boolean
147 |                  */
148 |                 card: {
149 |                     type: Boolean,
150 |                     value: false
151 |                 },
152 |                 /**
153 |                  * Download button label.
154 |                  *
155 |                  * @type String
156 |                  */
157 |                 downloadLabel: {
158 |                     type: String,
159 |                     value: 'Download'
160 |                 },
161 |                 /**
162 |                  * The z-depth of the card, from 0-5.
163 |                  *
164 |                  * @type String
165 |                  */
166 |                 elevation: {
167 |                     type: String,
168 |                     value: '1'
169 |                 }
170 |             },
171 | 
172 |             /**
173 |              * Clear PDF container
174 |              */
175 |             clear: function() {
176 |                 this.file = undefined;
177 |             },
178 |             /**
179 |              * Downloads the pdf file
180 |              */
181 |             _download: function() {
182 |                 window.location = this.file;
183 |             }
184 |         });
185 |     </script>
186 | </dom-module>


--------------------------------------------------------------------------------
/test/pdf-browser-viewer_test.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | 
 3 | <html>
 4 |   <head>
 5 |     <title>pdf-browser-viewer test</title>
 6 |     <meta charset="utf-8">
 7 |     <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
 8 |     <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
 9 |     <script src="../../web-component-tester/browser.js"></script>
10 | 
11 |     <link rel="import" href="../pdf-browser-viewer.html">
12 |   </head>
13 |   <body>
14 | 
15 |     <test-fixture id="basic">
16 |       <template>
17 |         <pdf-browser-viewer></pdf-browser-viewer>
18 |       </template>
19 |     </test-fixture>
20 | 
21 |     <script>
22 |       suite('pdf-browser-viewer', function() {
23 | 
24 |         test('instantiating the element works', function() {
25 |           let element = fixture('basic');
26 |           assert.equal(element.is, 'pdf-browser-viewer');
27 |         });
28 | 
29 |       });
30 |     </script>
31 |   </body>
32 | </html>
33 | 


--------------------------------------------------------------------------------