Mercurial > hg > orthanc-stone

comparison Applications/StoneWebViewer/WebApplication/index.html @ 2026:04148de691a7 deep-learning

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
integration mainline->deep-learning
author Sebastien Jodogne <s.jodogne@gmail.com>
date Mon, 05 Dec 2022 08:29:49 +0100
parents 963f28eb40cb e0b7b2a8b914
children a56f7ed0cdf9
comparison
equal deleted inserted replaced
2008:37d6805b80ee 2026:04148de691a7
34 assurance. 34 assurance.
35 </p> 35 </p>
36 <h3>Versions</h3> 36 <h3>Versions</h3>
37 <p> 37 <p>
38 Stone Web viewer: {{ stoneWebViewerVersion }} <br/> 38 Stone Web viewer: {{ stoneWebViewerVersion }} <br/>
39 <span v-if="orthancSystem.Version">Orthanc: {{ orthancSystem.Version }} <br/></span>
39 Emscripten compiler: {{ emscriptenVersion }} 40 Emscripten compiler: {{ emscriptenVersion }}
40 </p> 41 </p>
41 </div> 42 </div>
42 <div class="wvInfoPopupForm"> 43 <div class="wvInfoPopupForm">
43 <div v-if="globalConfiguration.ShowInfoPanelAtStartup == 'User'"> 44 <div v-if="globalConfiguration.ShowInfoPanelAtStartup == 'User'">
72 assurance. 73 assurance.
73 </p> 74 </p>
74 <h3>Versions</h3> 75 <h3>Versions</h3>
75 <p> 76 <p>
76 Stone Web viewer: {{ stoneWebViewerVersion }} <br/> 77 Stone Web viewer: {{ stoneWebViewerVersion }} <br/>
78 <span v-if="orthancSystem.Version">Orthanc: {{ orthancSystem.Version }} <br/></span>
77 Emscripten compiler: {{ emscriptenVersion }} 79 Emscripten compiler: {{ emscriptenVersion }}
78 </p> 80 </p>
79 <h3>User preferences</h3> 81 <h3>User preferences</h3>
80 </div> 82 </div>
81 <div class="wvInfoPopupForm"> 83 <div class="wvInfoPopupForm">
215 <ul class="wvSerieslist"> 217 <ul class="wvSerieslist">
216 218
217 <!-- Series without multiple multiframe instances --> 219 <!-- Series without multiple multiframe instances -->
218 <span v-for="seriesIndex in study.series"> 220 <span v-for="seriesIndex in study.series">
219 <li class="wvSerieslist__seriesItem" 221 <li class="wvSerieslist__seriesItem"
220 v-bind:class="{ highlighted : GetActiveSeries().includes(series[seriesIndex].tags[SERIES_INSTANCE_UID]), 'wvSerieslist__seriesItem--list' : leftMode != 'grid', 'wvSerieslist__seriesItem--grid' : leftMode == 'grid' }" 222 v-bind:class="{ highlighted : GetActiveSeriesInstanceUid().includes(series[seriesIndex].tags[SERIES_INSTANCE_UID]), 'wvSerieslist__seriesItem--list' : leftMode != 'grid', 'wvSerieslist__seriesItem--grid' : leftMode == 'grid' }"
221 v-on:dragstart="SeriesDragStart($event, seriesIndex)" 223 v-on:dragstart="SeriesDragStart($event, seriesIndex)"
222 v-on:click="ClickSeries(seriesIndex)" 224 v-on:click="ClickSeries(seriesIndex)"
223 v-if="series[seriesIndex].virtualSeries === null"> 225 v-if="series[seriesIndex].virtualSeries === null">
224 <div class="wvSerieslist__picture" style="z-index:0" 226 <div class="wvSerieslist__picture" style="z-index:0"
225 draggable="true" 227 draggable="true"
346 <div class="wvToolbar wvToolbar--top wvPrintExclude"> 348 <div class="wvToolbar wvToolbar--top wvPrintExclude">
347 <div class="ng-scope inline-object"> 349 <div class="ng-scope inline-object">
348 <div class="tbGroup"> 350 <div class="tbGroup">
349 <div class="tbGroup__toggl"> 351 <div class="tbGroup__toggl">
350 <button class="wvButton" 352 <button class="wvButton"
351 v-bind:class="{ 'wvButton--underline' : !viewportLayoutButtonsVisible }" 353 v-bind:class="{ 'wvButton--underline' : !viewportLayoutButtonsVisible, 'wvButton--border' : viewportLayoutButtonsVisible }"
352 data-toggle="tooltip" data-title="Change layout" 354 data-toggle="tooltip" data-title="Change layout"
353 @click="viewportLayoutButtonsVisible = !viewportLayoutButtonsVisible;HideAllTooltips()"> 355 @click="viewportLayoutButtonsVisible = !viewportLayoutButtonsVisible;mouseActionsVisible=false;annotationActionsVisible=false;HideAllTooltips()">
354 <i class="fa fa-th"></i> 356 <i class="fa fa-th"></i>
355 </button> 357 </button>
356 </div> 358 </div>
357 359
358 <div class="tbGroup__buttons--bottom" v-show="viewportLayoutButtonsVisible"> 360 <div class="tbGroup__buttons--bottom" v-show="viewportLayoutButtonsVisible">
383 385
384 <div class="ng-scope inline-object"> 386 <div class="ng-scope inline-object">
385 <div class="tbGroup"> 387 <div class="tbGroup">
386 <div class="tbGroup__toggl"> 388 <div class="tbGroup__toggl">
387 <button class="wvButton" 389 <button class="wvButton"
388 v-bind:class="{ 'wvButton--underline' : !mouseActionsVisible }" 390 v-bind:class="{ 'wvButton--underline' : !mouseActionsVisible, 'wvButton--border' : mouseActionsVisible }"
389 data-toggle="tooltip" data-title="Mouse actions" 391 data-toggle="tooltip" data-title="Mouse actions"
390 @click="mouseActionsVisible = !mouseActionsVisible;HideAllTooltips()"> 392 @click="viewportLayoutButtonsVisible=false;mouseActionsVisible = !mouseActionsVisible;annotationActionsVisible=false;HideAllTooltips()">
391 <i class="fa fa-mouse-pointer"></i> 393 <i class="fa fa-mouse-pointer"></i>
392 </button> 394 </button>
393 </div> 395 </div>
394 396
395 <div class="tbGroup__buttons--bottom" v-show="mouseActionsVisible"> 397 <div class="tbGroup__buttons--bottom" v-show="mouseActionsVisible">
538 v-on:click="FlipY()"> 540 v-on:click="FlipY()">
539 <i class="fas fa-exchange-alt fa-rotate-90"></i> 541 <i class="fas fa-exchange-alt fa-rotate-90"></i>
540 </button> 542 </button>
541 </div> 543 </div>
542 544
543 <div class="ng-scope inline-object"> 545
544 <button class="wvButton--underline text-center" 546 <div class="ng-scope inline-object">
545 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_LENGTH }" 547 <div class="tbGroup">
546 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_LENGTH, stone.WebViewerAction.CREATE_LENGTH)" 548 <div class="tbGroup__toggl">
547 data-toggle="tooltip" data-title="Measure length"> 549 <button class="wvButton"
548 <i class="fas fa-ruler"></i> 550 v-bind:class="{ 'wvButton--underline' : !annotationActionsVisible, 'wvButton--border' : annotationActionsVisible }"
549 </button> 551 data-toggle="tooltip" data-title="Annotations"
550 </div> 552 @click="viewportLayoutButtonsVisible=false;mouseActionsVisible=false;annotationActionsVisible = !annotationActionsVisible;HideAllTooltips()">
551 553 <i class="fas fa-pencil-ruler"></i>
552 <div class="ng-scope inline-object"> 554 </button>
553 <button class="wvButton--underline text-center" 555 </div>
554 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_ANGLE }" 556
555 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_ANGLE, stone.WebViewerAction.CREATE_ANGLE)" 557 <div class="tbGroup__buttons--bottom" v-show="annotationActionsVisible">
556 data-toggle="tooltip" data-title="Measure angle"> 558 <div class="ng-scope inline-object">
557 <i class="fas fa-drafting-compass"></i> 559 <button class="wvButton--underline text-center"
558 </button> 560 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_LENGTH }"
559 </div> 561 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_LENGTH, stone.WebViewerAction.CREATE_LENGTH)"
560 562 data-toggle="tooltip" data-title="Measure length">
561 <div class="ng-scope inline-object"> 563 <i class="fas fa-ruler"></i>
562 <button class="wvButton--underline text-center" 564 </button>
563 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_CIRCLE }" 565 </div>
564 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_CIRCLE, stone.WebViewerAction.CREATE_CIRCLE)" 566
565 data-toggle="tooltip" data-title="Measure circle"> 567 <div class="ng-scope inline-object">
566 <i class="far fa-circle"></i> 568 <button class="wvButton--underline text-center"
567 </button> 569 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_ANGLE }"
568 </div> 570 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_ANGLE, stone.WebViewerAction.CREATE_ANGLE)"
569 571 data-toggle="tooltip" data-title="Measure angle">
570 <div class="ng-scope inline-object"> 572 <i class="fas fa-drafting-compass"></i>
571 <button class="wvButton--underline text-center" 573 </button>
572 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_PIXEL_PROBE }" 574 </div>
573 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_PIXEL_PROBE, stone.WebViewerAction.CREATE_PIXEL_PROBE)" 575
574 data-toggle="tooltip" data-title="Pixel probe"> 576 <div class="ng-scope inline-object">
575 <i class="fas fa-microscope"></i> 577 <button class="wvButton--underline text-center"
576 </button> 578 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_CIRCLE }"
577 </div> 579 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_CIRCLE, stone.WebViewerAction.CREATE_CIRCLE)"
578 580 data-toggle="tooltip" data-title="Measure circle">
579 <div class="ng-scope inline-object"> 581 <i class="far fa-circle"></i>
580 <button class="wvButton--underline text-center" 582 </button>
581 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_RECTANGLE_PROBE }" 583 </div>
582 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_RECTANGLE_PROBE, stone.WebViewerAction.CREATE_RECTANGLE_PROBE)" 584
583 data-toggle="tooltip" data-title="Rectangle probe"> 585 <div class="ng-scope inline-object">
584 <i class="fas fa-plus-square"></i> 586 <button class="wvButton--underline text-center"
585 </button> 587 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_PIXEL_PROBE }"
586 </div> 588 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_PIXEL_PROBE, stone.WebViewerAction.CREATE_PIXEL_PROBE)"
587 589 data-toggle="tooltip" data-title="Pixel probe">
588 <div class="ng-scope inline-object"> 590 <i class="fas fa-microscope"></i>
589 <button class="wvButton--underline text-center" 591 </button>
590 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_ELLIPSE_PROBE }" 592 </div>
591 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_ELLIPSE_PROBE, stone.WebViewerAction.CREATE_ELLIPSE_PROBE)" 593
592 data-toggle="tooltip" data-title="Ellipse probe"> 594 <div class="ng-scope inline-object">
593 <i class="fas fa-plus-circle"></i> 595 <button class="wvButton--underline text-center"
594 </button> 596 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_RECTANGLE_PROBE }"
595 </div> 597 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_RECTANGLE_PROBE, stone.WebViewerAction.CREATE_RECTANGLE_PROBE)"
596 598 data-toggle="tooltip" data-title="Rectangle probe">
597 <div class="ng-scope inline-object"> 599 <i class="fas fa-plus-square"></i>
598 <button class="wvButton--underline text-center" 600 </button>
599 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_TEXT_ANNOTATION }" 601 </div>
600 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_TEXT_ANNOTATION, stone.WebViewerAction.CREATE_TEXT_ANNOTATION)" 602
601 data-toggle="tooltip" data-title="Add text annotation"> 603 <div class="ng-scope inline-object">
602 <i class="fas fa-comment-dots"></i> 604 <button class="wvButton--underline text-center"
603 </button> 605 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_ELLIPSE_PROBE }"
604 </div> 606 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_ELLIPSE_PROBE, stone.WebViewerAction.CREATE_ELLIPSE_PROBE)"
605 607 data-toggle="tooltip" data-title="Ellipse probe">
606 <div class="ng-scope inline-object"> 608 <i class="fas fa-plus-circle"></i>
607 <button class="wvButton--underline text-center" 609 </button>
608 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_REMOVE_MEASURE }" 610 </div>
609 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_REMOVE_MEASURE, stone.WebViewerAction.REMOVE_MEASURE)" 611
610 data-toggle="tooltip" data-title="Delete annotation"> 612 <div class="ng-scope inline-object">
611 <i class="fas fa-trash"></i> 613 <button class="wvButton--underline text-center"
612 </button> 614 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_TEXT_ANNOTATION }"
613 </div> 615 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_TEXT_ANNOTATION, stone.WebViewerAction.CREATE_TEXT_ANNOTATION)"
616 data-toggle="tooltip" data-title="Add text annotation">
617 <i class="fas fa-comment-dots"></i>
618 </button>
619 </div>
620
621 <div class="ng-scope inline-object">
622 <button class="wvButton--underline text-center"
623 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_REMOVE_MEASURE }"
624 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_REMOVE_MEASURE, stone.WebViewerAction.REMOVE_MEASURE)"
625 data-toggle="tooltip" data-title="Delete annotation">
626 <i class="fas fa-trash"></i>
627 </button>
628 </div>
629 </div>
630 </div>
631 </div>
632
614 633
615 <div class="ng-scope inline-object"> 634 <div class="ng-scope inline-object">
616 <button class="wvButton--underline text-center" 635 <button class="wvButton--underline text-center"
617 data-toggle="tooltip" data-title="Synchronized browsing" 636 data-toggle="tooltip" data-title="Synchronized browsing"
618 v-bind:class="{ 'active' : synchronizedBrowsing }" 637 v-bind:class="{ 'active' : synchronizedBrowsing }"
752 style="position:absolute; left:0; top:0; width:100%; height:100%" 771 style="position:absolute; left:0; top:0; width:100%; height:100%"
753 oncontextmenu="return false"></canvas> 772 oncontextmenu="return false"></canvas>
754 773
755 <div v-show="showInfo"> 774 <div v-show="showInfo">
756 <div v-if="numberOfFrames > 1" class="wvVerticalScrollbar" 775 <div v-if="numberOfFrames > 1" class="wvVerticalScrollbar"
757 v-on:click="var offset = $event.currentTarget.getClientRects()[0]; var y = $event.clientY - offset.top; var height = $event.currentTarget.offsetHeight; currentFrame = Math.min(numberOfFrames - 1, Math.floor(y * numberOfFrames / (height - 1)));"> 776 v-on:mousedown="ClickVerticalScrollbar($event)">
758 <div class="wvVerticalScrollbarHighlight" 777 <div class="wvVerticalScrollbarHighlight"
759 v-bind:style="{ top: (currentFrame / (numberOfFrames - 1) * 95.0) + '%' }"> 778 v-bind:style="{ top: (currentFrame / (numberOfFrames - 1) * 95.0) + '%' }">
760 </div> 779 </div>
761 </div> 780 </div>
762 781
763 <div class="wv-overlay"> 782 <div class="wv-overlay">
764 <div v-if="'tags' in content.series" class="wv-overlay-topleft"> 783 <div v-if="'tags' in content.series" class="wv-overlay-topleft">
765 {{ content.series.tags[PATIENT_NAME] }}<br/> 784 {{ content.series.tags[PATIENT_NAME] }}<br/>
766 {{ content.series.tags[PATIENT_ID] }}<br/> 785 {{ content.series.tags[PATIENT_ID] }}<br/>
767 {{ app.FormatDate(content.series.tags[PATIENT_BIRTH_DATE]) }} 786 {{ app.FormatDate(content.series.tags[PATIENT_BIRTH_DATE]) }} -
787 {{ content.series.tags[PATIENT_SEX] }}
768 </div> 788 </div>
769 <div v-if="'tags' in content.series" class="wv-overlay-topright" 789 <div v-if="'tags' in content.series" class="wv-overlay-topright"
770 v-bind:class="{ 'wvInfoRightMargin' : numberOfFrames > 1 }"> 790 v-bind:class="{ 'wvInfoRightMargin' : numberOfFrames > 1 }">
771 {{ content.series.tags[STUDY_DESCRIPTION] }}<br/> 791 {{ content.series.tags[STUDY_DESCRIPTION] }}<br/>
772 <span v-if="contentDate !== undefined && contentDate != ''">{{ app.FormatDate(contentDate) }} <span v-show="contentTime != ''">{{ app.FormatTime(contentTime) }}</span><br/></span> 792 <span v-if="contentDate !== undefined && contentDate != ''">{{ app.FormatDate(contentDate) }} <span v-show="contentTime != ''">{{ app.FormatTime(contentTime) }}</span><br/></span>
808 <button class="btn btn-primary" @click="stone.GoToLastFrame(canvasId)"> 828 <button class="btn btn-primary" @click="stone.GoToLastFrame(canvasId)">
809 <i class="fas fa-fast-forward"></i> 829 <i class="fas fa-fast-forward"></i>
810 </button> 830 </button>
811 </div> 831 </div>
812 <div class="btn-group btn-group-sm" role="group"> 832 <div class="btn-group btn-group-sm" role="group">
813 <button type="button" class="btn btn-primary" @click="CinePlay()"> 833 <button type="button" class="btn btn-primary" @click="CineBackward()">
814 <i class="fas fa-play fa-flip-horizontal"></i> 834 <i class="fas fa-play fa-flip-horizontal"></i>
815 </button> 835 </button>
816 <button type="button" class="btn btn-primary" @click="CinePause()"> 836 <button type="button" class="btn btn-primary" @click="CinePause()">
817 <i class="fas fa-pause"></i> 837 <i class="fas fa-pause"></i>
818 </button> 838 </button>
819 <button type="button" class="btn btn-primary" @click="CineBackward()"> 839 <button type="button" class="btn btn-primary" @click="CinePlay()">
820 <i class="fas fa-play"></i> 840 <i class="fas fa-play"></i>
821 </button> 841 </button>
822 </div> 842 </div>
823 </span> 843 </span>
824 </div> 844 </div>