142
142
} ) ;
143
143
} ) ( document ) ;
144
144
</ script >
145
- {{ $pdfjsVersion := .Site.Params.pdfjsVersion }}
146
- {{ $pdfjsCDN := .Site.Params.pdfjsCDN }}
147
- {{ if not ($.Page.Scratch.Get "pdfjs-loaded") }}
148
- {{ $.Page.Scratch.Set "pdfjs-loaded" 1 }}
149
- < link rel ="stylesheet " type ="text/css " href ="/css/pdf-viewer.css ">
150
- < link rel ="stylesheet " type ="text/css " href ="{{ $pdfjsCDN }}/pdf.js/{{ $pdfjsVersion }}/pdf_viewer.min.css ">
151
- < script src ="{{ $pdfjsCDN }}/pdf.js/{{ $pdfjsVersion }}/pdf.min.js "> </ script >
152
- {{ end }}
153
-
154
- {{ if not ($.Page.Scratch.Get "pdf-viewer-index") }}
155
- {{ $.Page.Scratch.Set "pdf-viewer-index" 1 }}
156
- {{ else }}
157
- {{ $.Page.Scratch.Set "pdf-viewer-index" (add ($.Page.Scratch.Get "pdf-viewer-index") 1) }}
158
- {{ end }}
159
-
160
- {{ $pdf_viewer_index := $.Page.Scratch.Get "pdf-viewer-index" }}
161
- {{ $url := .Get "url" }}
162
- {{ $page := .Get "page" | default 1 }}
163
- {{ $title := .Get "title" }}
164
-
165
- < div class ="pdf-viewer-container " id ="pdf-viewer-container-{{ $pdf_viewer_index }} ">
166
- < div class ="pdf-viewer-canvas-container " id ="pdf-viewer-canvas-container-{{ $pdf_viewer_index }} ">
167
- < div class ="pdf-viewer-loading-wrapper " id ="pdf-viewer-loading-wrapper-{{ $pdf_viewer_index }} ">
168
- < svg xmlns ="http://www.w3.org/2000/svg " xmlns:xlink ="http://www.w3.org/1999/xlink " class ="pdf-viewer-loading " id ="pdf-viewer-loading-{{ $pdf_viewer_index }} " width ="64px " height ="64px " viewBox ="0 0 100 100 " preserveAspectRatio ="xMidYMid ">
169
- < path fill ="none " stroke ="currentColor " stroke-width ="8 " stroke-dasharray ="153.95335693359377 102.63557128906248 " d ="M24.3 30C11.4 30 5 43.3 5 50s6.4 20 19.3 20c19.3 0 32.1-40 51.4-40 C88.6 30 95 43.3 95 50s-6.4 20-19.3 20C56.4 70 43.6 30 24.3 30z " stroke-linecap ="round " style ="transform:scale(1);transform-origin:50px 50px ">
170
- < animate attributeName ="stroke-dashoffset " repeatCount ="indefinite " dur ="1.25s " keyTimes ="0;1 " values ="0;256.58892822265625 "> </ animate >
171
- </ path >
172
- </ svg >
173
- </ div >
174
- < canvas class ="pdf-viewer-canvas " id ="pdf-viewer-canvas-{{ $pdf_viewer_index }} "> </ canvas >
175
- </ div >
176
- < div class ="pdf-viewer-controls-container " id ="pdf-viewer-controls-container-{{ $pdf_viewer_index }} ">
177
- < div class ="pdf-viewer-controls-left ">
178
- < span class ="pdf-viewer-title " id ="pdf-viewer-title-{{ $pdf_viewer_index }} "> {{ $title }}</ span >
179
- </ div >
180
- < div class ="pdf-viewer-controls-center ">
181
- < svg class ="pdf-viewer-button pdf-viewer-button-prev-page " id ="pdf-viewer-button-prev-page-{{ $pdf_viewer_index }} " viewBox ="0 0 24 24 "> < path fill ="currentColor " d ="M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z " /> </ svg >
182
- < span class ="pdf-viewer-page-num ">
183
- < span id ="pdf-viewer-current-page-{{ $pdf_viewer_index }} "> </ span > / < span id ="pdf-viewer-total-page-{{ $pdf_viewer_index }} "> </ span >
184
- </ span >
185
- < svg class ="pdf-viewer-button pdf-viewer-button-next-page " id ="pdf-viewer-button-next-page-{{ $pdf_viewer_index }} " viewBox ="0 0 24 24 "> < path fill ="currentColor " d ="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z " /> </ svg >
186
- </ div >
187
- < div class ="pdf-viewer-controls-right ">
188
- < a href ="{{ $url }} " {{ if $title }}download ="{{ $title }}.pdf "{{ else }}download{{ end}} > < svg class ="pdf-viewer-button pdf-viewer-button-download " id ="pdf-viewer-button-download-{{ $pdf_viewer_index }} " viewBox ="0 0 24 24 "> < path fill ="currentColor " d ="M5,20H19V18H5M19,9H15V3H9V9H5L12,16L19,9Z " /> </ svg > </ a >
189
- </ div >
190
- </ div >
191
- </ div >
192
-
193
- < script type ="text/javascript ">
194
- ( function ( d ) {
195
- var url = '{{ $url }}' ;
196
- var pdfjsLib = window [ 'pdfjs-dist/build/pdf' ] ;
197
- pdfjsLib . GlobalWorkerOptions . workerSrc = '{{ $pdfjsCDN }}/pdf.js/{{ $pdfjsVersion }}/pdf.worker.js' ;
198
-
199
- var pageNum = { { $page } } ;
200
- var pageRendering = false ;
201
- var pagePendingNum = null ;
202
- var scale = 1.5 ;
203
- var canvas = d . getElementById ( 'pdf-viewer-canvas-{{ $pdf_viewer_index }}' ) ;
204
- var context = canvas . getContext ( '2d' ) ;
205
- var loadingWrapper = d . getElementById ( 'pdf-viewer-loading-wrapper-{{ $pdf_viewer_index }}' ) ;
206
- var controlsContainer = d . getElementById ( 'pdf-viewer-controls-container-{{ $pdf_viewer_index }}' ) ;
207
- var prevPage = d . getElementById ( 'pdf-viewer-button-prev-page-{{ $pdf_viewer_index }}' ) ;
208
- var nextPage = d . getElementById ( 'pdf-viewer-button-next-page-{{ $pdf_viewer_index }}' ) ;
209
-
210
- function showContent ( ) {
211
- loadingWrapper . style . display = 'none' ;
212
- canvas . style . display = 'block' ;
213
- controlsContainer . style . display = 'flex' ;
214
- }
215
-
216
- function showLoader ( ) {
217
- loadingWrapper . style . display = 'flex' ;
218
- canvas . style . display = 'none' ;
219
- controlsContainer . style . display = 'none' ;
220
- }
221
-
222
- showLoader ( ) ;
223
-
224
- pdfjsLib . getDocument ( url ) . promise . then ( function ( pdf ) {
225
- var pdfNumPages = pdf . numPages ;
226
-
227
- if ( pageNum > pdfNumPages ) {
228
- pageNum = pdfNumPages ;
229
- }
230
-
231
- d . getElementById ( 'pdf-viewer-total-page-{{ $pdf_viewer_index }}' ) . textContent = pdfNumPages ;
232
- d . getElementById ( 'pdf-viewer-button-prev-page-{{ $pdf_viewer_index }}' ) . addEventListener ( 'click' , onPrevPage ) ;
233
- d . getElementById ( 'pdf-viewer-button-next-page-{{ $pdf_viewer_index }}' ) . addEventListener ( 'click' , onNextPage ) ;
234
-
235
- renderPage ( pageNum ) ;
236
-
237
- function renderPage ( pageNum ) {
238
- pdf . getPage ( pageNum ) . then ( function ( page ) {
239
- var viewport = page . getViewport ( { scale : scale } ) ;
240
- canvas . height = viewport . height ;
241
- canvas . width = viewport . width ;
242
-
243
- var renderContext = {
244
- canvasContext : context ,
245
- viewport : viewport
246
- } ;
247
- var renderTask = page . render ( renderContext ) ;
248
-
249
- renderTask . promise . then ( function ( ) {
250
- pageRendering = false ;
251
- showContent ( ) ;
252
-
253
- if ( pagePendingNum !== null ) {
254
- renderPage ( pagePendingNum )
255
- pagePendingNum = null ;
256
- }
257
- } ) ;
258
- } ) ;
259
-
260
- d . getElementById ( 'pdf-viewer-current-page-{{ $pdf_viewer_index }}' ) . textContent = pageNum ;
261
- }
262
-
263
- function queueRenderPage ( pageNum ) {
264
- if ( pageRendering ) {
265
- pagePendingNum = pageNum ;
266
- } else {
267
- renderPage ( pageNum ) ;
268
- }
269
- }
270
-
271
- function onPrevPage ( ) {
272
- if ( pageNum > 1 ) {
273
- pageNum -- ;
274
- queueRenderPage ( pageNum ) ;
275
- }
276
- }
277
-
278
- function onNextPage ( ) {
279
- if ( pageNum < pdfNumPages ) {
280
- pageNum ++ ;
281
- queueRenderPage ( pageNum ) ;
282
- }
283
- }
284
- } , function ( reason ) {
285
- console . error ( reason ) ;
286
- } ) ;
287
- } ) ( document ) ;
288
- </ script >
0 commit comments