Mercurial > hg > orthanc-stone

comparison Applications/StoneWebViewer/WebApplication/index.html @ 1672:570398585b5f

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
start support of cine sequences
author Sebastien Jodogne <s.jodogne@gmail.com>
date Mon, 23 Nov 2020 15:39:27 +0100
parents 0f161841f837
children dd50f8a1a2be
comparison
equal deleted inserted replaced
1671:2c2512918a0f 1672:570398585b5f
554 <!--div style="width: 100%; height: 100%; background-color: red"></div--> 554 <!--div style="width: 100%; height: 100%; background-color: red"></div-->
555 <canvas v-bind:id="canvasId" class="viewport-canvas" 555 <canvas v-bind:id="canvasId" class="viewport-canvas"
556 style="position:absolute; left:0; top:0; width:100%; height:100%" 556 style="position:absolute; left:0; top:0; width:100%; height:100%"
557 oncontextmenu="return false"></canvas> 557 oncontextmenu="return false"></canvas>
558 558
559 <div v-if="'tags' in series" v-show="showInfo"> 559 <div v-show="showInfo">
560 <div class="wv-overlay"> 560 <div class="wv-overlay">
561 <div class="wv-overlay-topleft"> 561 <div v-if="'tags' in series" class="wv-overlay-topleft">
562 {{ series.tags['0010,0010'] }}<br/> 562 {{ series.tags['0010,0010'] }}<br/>
563 {{ series.tags['0010,0020'] }} 563 {{ series.tags['0010,0020'] }}
564 </div> 564 </div>
565 <div class="wv-overlay-topright"> 565 <div v-if="'tags' in series" class="wv-overlay-topright">
566 {{ series.tags['0008,1030'] }}<br/> 566 {{ series.tags['0008,1030'] }}<br/>
567 {{ series.tags['0008,0020'] }}<br/> 567 {{ series.tags['0008,0020'] }}<br/>
568 {{ series.tags['0020,0011'] }} | {{ series.tags['0008,103e'] }} 568 {{ series.tags['0020,0011'] }} | {{ series.tags['0008,103e'] }}
569 </div> 569 </div>
570 <div class="wv-overlay-bottomleft wvPrintExclude" 570 <div class="wv-overlay-timeline-wrapper wvPrintExclude">
571 v-show="framesCount != 0"> 571 <div style="text-align:left; padding:5px" v-show="framesCount != 0">
572 <button class="btn btn-primary" @click="DecrementFrame()"> 572 <div style="width: 12em; padding: 1em;" v-show="cineControls">
573 <i class="fa fa-chevron-circle-left"></i> 573 <label>
574 </button> 574 Frame rate
575 &nbsp;&nbsp;{{ currentFrame }} / {{ framesCount }}&nbsp;&nbsp; 575 <span class="wv-play-button-config-framerate-wrapper">
576 <button class="btn btn-primary" @click="IncrementFrame()"> 576 <input type="range" min="1" max="60" v-model="cineFramesPerSecond"
577 <i class="fa fa-chevron-circle-right"></i> 577 class="wv-play-button-config-framerate">
578 </button> 578 </span>
579 </div> 579 {{ cineFramesPerSecond }} fps
580 <div class="wv-overlay-bottomright wvPrintExclude"> 580 </label>
581 </div>
582 <button class="btn btn-primary btn-sm" @click="DecrementFrame()">
583 <i class="fa fa-chevron-circle-left"></i>
584 </button>
585 &nbsp;&nbsp;{{ currentFrame }} / {{ framesCount }}&nbsp;&nbsp;
586 <button class="btn btn-primary btn-sm" @click="IncrementFrame()">
587 <i class="fa fa-chevron-circle-right"></i>
588 </button>
589 <div class="btn-group btn-group-sm" role="group">
590 <button type="button" class="btn btn-primary" @click="CinePlay()">
591 <i class="fas fa-play fa-flip-horizontal"></i>
592 </button>
593 <button type="button" class="btn btn-primary" @click="CinePause()">
594 <i class="fas fa-pause"></i>
595 </button>
596 <button type="button" class="btn btn-primary" @click="CineBackward()">
597 <i class="fas fa-play"></i>
598 </button>
599 </div>
600 </div>
601 </div>
602 <div class="wv-overlay-bottomright wvPrintExclude" style="bottom: 0px">
581 <div v-show="quality == stone.DisplayedFrameQuality.NONE" 603 <div v-show="quality == stone.DisplayedFrameQuality.NONE"
582 style="display:block;background-color:red;width:1em;height:1em" /> 604 style="display:block;background-color:red;width:1em;height:1em" />
583 <div v-show="quality == stone.DisplayedFrameQuality.LOW" 605 <div v-show="quality == stone.DisplayedFrameQuality.LOW"
584 style="display:block;background-color:orange;width:1em;height:1em" /> 606 style="display:block;background-color:orange;width:1em;height:1em" />
585 <div v-show="quality == stone.DisplayedFrameQuality.HIGH" 607 <div v-show="quality == stone.DisplayedFrameQuality.HIGH"
597 <div v-show="status == 'pdf'" > 619 <div v-show="status == 'pdf'" >
598 <pdf-viewer v-bind:prefix="canvasId + '-pdf'" ref="pdfViewer"></pdf-viewer> 620 <pdf-viewer v-bind:prefix="canvasId + '-pdf'" ref="pdfViewer"></pdf-viewer>
599 </div> 621 </div>
600 622
601 <div v-if="status == 'video'" class="wvPaneOverlay"> 623 <div v-if="status == 'video'" class="wvPaneOverlay">
602 [ this viewer cannot play videos ] 624 [ videos are not supported yet ]
603 <!--video class="wvVideo" autoplay="" loop="" controls="" preload="auto" type="video/mp4" 625 <!--video class="wvVideo" autoplay="" loop="" controls="" preload="auto" type="video/mp4"
604 src="http://viewer-pro.osimis.io/instances/e465dd27-83c96343-96848735-7035a133-1facf1a0/frames/0/raw"> 626 src="http://viewer-pro.osimis.io/instances/e465dd27-83c96343-96848735-7035a133-1facf1a0/frames/0/raw">
605 </video--> 627 </video-->
606 </div> 628 </div>
607 629