68 lines
1.5 KiB
HTML
Executable file
68 lines
1.5 KiB
HTML
Executable file
{{ $url := .Get "src" }}
|
|
{{ $hidePaginator := .Get "hidePaginator" | default "false" }}
|
|
{{ $hideLoader := .Get "hidePaginator" | default "false" }}
|
|
{{ $pageNum := .Get "renderPageNum" | default "1"}}
|
|
|
|
<div
|
|
class="pdf-viewer"
|
|
data-url="{{ $url }}"
|
|
data-hide-paginator="{{ $hidePaginator }}"
|
|
data-hide-loader="{{ $hideLoader }}"
|
|
data-page-num="{{ $pageNum }}"
|
|
>
|
|
<div class="paginator">
|
|
<button class="prev">Previous</button>
|
|
<button class="next">Next</button>
|
|
<span>Page: <span class="page-num"></span> / <span class="page-count"></span></span>
|
|
</div>
|
|
|
|
<div class="embed-pdf-container">
|
|
<div class="loading-wrapper">
|
|
<div class="loading"></div>
|
|
</div>
|
|
<canvas class="pdf-canvas"></canvas>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Finally, make the canvas more beautiful -->
|
|
<style>
|
|
.pdf-viewer canvas {
|
|
border: 1px solid black;
|
|
direction: ltr;
|
|
width: 100%;
|
|
height: auto;
|
|
display: none;
|
|
}
|
|
|
|
.pdf-viewer .paginator {
|
|
display: none;
|
|
text-align: center;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.pdf-viewer .loading-wrapper {
|
|
display: none;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 350px;
|
|
}
|
|
|
|
.pdf-viewer .loading {
|
|
display: inline-block;
|
|
width: 50px;
|
|
height: 50px;
|
|
border: 3px solid #d2d0d0;;
|
|
border-radius: 50%;
|
|
border-top-color: #383838;
|
|
animation: spin 1s ease-in-out infinite;
|
|
-webkit-animation: spin 1s ease-in-out infinite;
|
|
}
|
|
|
|
@keyframes spin {
|
|
to { -webkit-transform: rotate(360deg); }
|
|
}
|
|
@-webkit-keyframes spin {
|
|
to { -webkit-transform: rotate(360deg); }
|
|
}
|
|
</style>
|