Mercurial > hg > orthanc-stone
comparison Applications/StoneWebViewer/WebApplication/index.html @ 1657:66e5fcdf5597
pdf viewer is working
author | Sebastien Jodogne <s.jodogne@gmail.com> |
---|---|
date | Wed, 18 Nov 2020 11:19:09 +0100 |
parents | 39137da83b0b |
children | 641d39cc8537 |
comparison
equal
deleted
inserted
replaced
1656:4cdc297be5a6 | 1657:66e5fcdf5597 |
---|---|
198 width="65px" height="65px" | 198 width="65px" height="65px" |
199 /> | 199 /> |
200 </div> | 200 </div> |
201 | 201 |
202 <i v-if="series[seriesIndex].type == stone.ThumbnailType.PDF" | 202 <i v-if="series[seriesIndex].type == stone.ThumbnailType.PDF" |
203 class="wvSerieslist__placeholderIcon fa fa-file-text"></i> | 203 class="wvSerieslist__placeholderIcon fa fa-file-pdf"></i> |
204 | 204 |
205 <i v-if="series[seriesIndex].type == stone.ThumbnailType.VIDEO" | 205 <i v-if="series[seriesIndex].type == stone.ThumbnailType.VIDEO" |
206 class="wvSerieslist__placeholderIcon fa fa-video-camera"></i> | 206 class="wvSerieslist__placeholderIcon fa fa-video-video"></i> |
207 | 207 |
208 | 208 |
209 <div v-if="[stone.ThumbnailType.IMAGE, stone.ThumbnailType.NO_PREVIEW].includes(series[seriesIndex].type)" | 209 <div v-if="[stone.ThumbnailType.IMAGE, stone.ThumbnailType.NO_PREVIEW].includes(series[seriesIndex].type)" |
210 class="wvSerieslist__placeholderIcon" | 210 class="wvSerieslist__placeholderIcon" |
211 v-bind:title="leftMode == 'full' ? null : '[' + series[seriesIndex].tags['0008,0060'] + '] ' + series[seriesIndex].tags['0008,103e']"> | 211 v-bind:title="leftMode == 'full' ? null : '[' + series[seriesIndex].tags['0008,0060'] + '] ' + series[seriesIndex].tags['0008,103e']"> |
522 </ul> | 522 </ul> |
523 </script> | 523 </script> |
524 | 524 |
525 | 525 |
526 <script type="text/x-template" id="viewport-template"> | 526 <script type="text/x-template" id="viewport-template"> |
527 <div v-bind:style="{ padding:'2px', | 527 <div v-bind:id="canvasId + '-container'" |
528 v-bind:style="{ padding:'2px', | |
528 position:'absolute', | 529 position:'absolute', |
529 left: left, | 530 left: left, |
530 top: top, | 531 top: top, |
531 width: width, | 532 width: width, |
532 height: height }"> | 533 height: height }"> |
544 <div class="wvSplitpane__cell" | 545 <div class="wvSplitpane__cell" |
545 v-on:click="MakeActive()"> | 546 v-on:click="MakeActive()"> |
546 <div v-show="status == 'ready'" | 547 <div v-show="status == 'ready'" |
547 style="position:absolute; left:0; top:0; width:100%; height:100%;"> | 548 style="position:absolute; left:0; top:0; width:100%; height:100%;"> |
548 <!--div style="width: 100%; height: 100%; background-color: red"></div--> | 549 <!--div style="width: 100%; height: 100%; background-color: red"></div--> |
549 <canvas v-bind:id="canvasId" | 550 <canvas v-bind:id="canvasId" class="viewport-canvas" |
550 style="position:absolute; left:0; top:0; width:100%; height:100%" | 551 style="position:absolute; left:0; top:0; width:100%; height:100%" |
551 oncontextmenu="return false"></canvas> | 552 oncontextmenu="return false"></canvas> |
552 | 553 |
553 <div v-if="'tags' in series" v-show="showInfo"> | 554 <div v-if="'tags' in series" v-show="showInfo"> |
554 <div class="wv-overlay"> | 555 <div class="wv-overlay"> |
585 | 586 |
586 <div v-if="status == 'waiting'" class="wvPaneOverlay"> | 587 <div v-if="status == 'waiting'" class="wvPaneOverlay"> |
587 [ drop a series here ] | 588 [ drop a series here ] |
588 </div> | 589 </div> |
589 | 590 |
590 <div v-if="status == 'pdf'" > | 591 <!-- Don't use "v-if" here, otherwise the tooltips of the PDF viewer are not initialized --> |
591 <pdf-viewer v-bind:prefix="canvasId + '-pdf'"></pdf-viewer> | 592 <div v-show="status == 'pdf'" > |
593 <pdf-viewer v-bind:prefix="canvasId + '-pdf'" ref="pdfViewer"></pdf-viewer> | |
592 </div> | 594 </div> |
593 | 595 |
594 <!--div v-if="status == 'video'" class="wvPaneOverlay"> | 596 <!--div v-if="status == 'video'" class="wvPaneOverlay"> |
595 <video class="wvVideo" autoplay="" loop="" controls="" preload="auto" type="video/mp4" | 597 <video class="wvVideo" autoplay="" loop="" controls="" preload="auto" type="video/mp4" |
596 src="http://viewer-pro.osimis.io/instances/e465dd27-83c96343-96848735-7035a133-1facf1a0/frames/0/raw"> | 598 src="http://viewer-pro.osimis.io/instances/e465dd27-83c96343-96848735-7035a133-1facf1a0/frames/0/raw"> |
620 oncontextmenu="return false"></canvas> | 622 oncontextmenu="return false"></canvas> |
621 </div> | 623 </div> |
622 | 624 |
623 <div class="wv-overlay"> | 625 <div class="wv-overlay"> |
624 <div class="wv-overlay-bottomleft wvPrintExclude"> | 626 <div class="wv-overlay-bottomleft wvPrintExclude"> |
625 <button class="btn btn-primary" @click="FitWidth()"><i class="fas fa-text-width"></i></button> | 627 <button class="btn btn-primary" @click="FitWidth()" |
626 <button class="btn btn-primary" @click="FitHeight()"><i class="fas fa-text-height"></i></button> | 628 data-toggle="tooltip" data-title="Fit page width"> |
627 <button class="btn btn-primary" @click="ZoomIn()"><i class="fas fa-search-plus"></i></button> | 629 <i class="fas fa-text-width"></i> |
628 <button class="btn btn-primary" @click="ZoomOut()"><i class="fas fa-search-minus"></i></button> | 630 </button> |
629 <button class="btn btn-primary" @click="PreviousPage()"> | 631 <button class="btn btn-primary" @click="FitHeight()" |
632 data-toggle="tooltip" data-title="Fit page height"> | |
633 <i class="fas fa-text-height"></i> | |
634 </button> | |
635 <button class="btn btn-primary" @click="ZoomIn()" | |
636 data-toggle="tooltip" data-title="Zoom in"> | |
637 <i class="fas fa-search-plus"></i> | |
638 </button> | |
639 <button class="btn btn-primary" @click="ZoomOut()" | |
640 data-toggle="tooltip" data-title="Zoom out"> | |
641 <i class="fas fa-search-minus"></i> | |
642 </button> | |
643 <button class="btn btn-primary" @click="PreviousPage()" | |
644 data-toggle="tooltip" data-title="Show previous page"> | |
630 <i class="fa fa-chevron-circle-left"></i> | 645 <i class="fa fa-chevron-circle-left"></i> |
631 </button> | 646 </button> |
632 {{currentPage}} / {{countPages}} | 647 {{currentPage}} / {{countPages}} |
633 <button class="btn btn-primary" @click="NextPage()"> | 648 <button class="btn btn-primary" @click="NextPage()" |
649 data-toggle="tooltip" data-title="Show next page"> | |
634 <i class="fa fa-chevron-circle-right"></i> | 650 <i class="fa fa-chevron-circle-right"></i> |
635 </button> | 651 </button> |
636 </div> | 652 </div> |
637 </div> | 653 </div> |
638 </div> | 654 </div> |