comparison Applications/StoneWebViewer/WebApplication/index.html @ 1652:fa9e6bf84958

integrating pdf.js into Stone Web viewer
author Sebastien Jodogne <s.jodogne@gmail.com>
date Mon, 16 Nov 2020 20:47:53 +0100
parents c476b0d5e59c
children 39137da83b0b
comparison
equal deleted inserted replaced
1651:00674f3695f2 1652:fa9e6bf84958
584 </div> 584 </div>
585 585
586 <div v-if="status == 'waiting'" class="wvPaneOverlay"> 586 <div v-if="status == 'waiting'" class="wvPaneOverlay">
587 [ drop a series here ] 587 [ drop a series here ]
588 </div> 588 </div>
589
590 <div v-if="status == 'pdf'" >
591 <pdf-viewer v-bind:prefix="canvasId + '-pdf'"></pdf-viewer>
592 </div>
589 593
590 <!--div v-if="status == 'video'" class="wvPaneOverlay"> 594 <!--div v-if="status == 'video'" class="wvPaneOverlay">
591 <video class="wvVideo" autoplay="" loop="" controls="" preload="auto" type="video/mp4" 595 <video class="wvVideo" autoplay="" loop="" controls="" preload="auto" type="video/mp4"
592 src="http://viewer-pro.osimis.io/instances/e465dd27-83c96343-96848735-7035a133-1facf1a0/frames/0/raw"> 596 src="http://viewer-pro.osimis.io/instances/e465dd27-83c96343-96848735-7035a133-1facf1a0/frames/0/raw">
593 </video> 597 </video>
604 </div> 608 </div>
605 </div> 609 </div>
606 </script> 610 </script>
607 611
608 612
613 <script type="text/x-template" id="pdf-viewer">
614 <div style="position:absolute; left:0; top:0; width:100%; height:100%;">
615 <!-- "line-height: 0px" to fit height: https://stackoverflow.com/a/12616341/881731 -->
616 <div v-bind:id="prefix + '-container'"
617 style="position: absolute; left: 0; top: 0; width:100%;height:100%;overflow:auto;line-height: 0px;">
618 <canvas v-bind:id="prefix + '-canvas'"
619 style="position: absolute; top:0px; left:0px;"></canvas>
620 </div>
621
622 <div class="wv-overlay">
623 <div class="wv-overlay-bottomleft wvPrintExclude">
624 <button class="btn btn-primary" @click="FitWidth()"><i class="fas fa-text-width"></i></button>
625 <button class="btn btn-primary" @click="FitHeight()"><i class="fas fa-text-height"></i></button>
626 <button class="btn btn-primary" @click="ZoomIn()"><i class="fas fa-search-plus"></i></button>
627 <button class="btn btn-primary" @click="ZoomOut()"><i class="fas fa-search-minus"></i></button>
628 <button class="btn btn-primary" @click="PreviousPage()">
629 <i class="fa fa-chevron-circle-left"></i>
630 </button>
631 &nbsp;&nbsp;{{currentPage}} / {{countPages}}&nbsp;&nbsp;
632 <button class="btn btn-primary" @click="NextPage()">
633 <i class="fa fa-chevron-circle-right"></i>
634 </button>
635 </div>
636 </div>
637 </div>
638 </script>
639
640
641
609 <script src="js/jquery-3.4.1.min.js"></script> 642 <script src="js/jquery-3.4.1.min.js"></script>
610 <script src="js/bootstrap.min.js"></script> 643 <script src="js/bootstrap.min.js"></script>
611 <script src="js/vue.min.js"></script> 644 <script src="js/vue.min.js"></script>
612 <script src="js/axios.min.js"></script> 645 <script src="js/axios.min.js"></script>
646 <script src="js/pdf.js"></script>
613 647
614 <script src="ua-parser.js"></script> 648 <script src="ua-parser.js"></script>
615 649
616 <script src="stone.js"></script> 650 <script src="stone.js"></script>
651 <script src="pdf-viewer.js"></script> <!-- Must be before inclusion of "app.js" -->
617 <script src="app.js"></script> 652 <script src="app.js"></script>
618 <script src="print.js"></script> 653 <script src="print.js"></script>
619 </body> 654 </body>
620 </html> 655 </html>