comparison Applications/StoneWebViewer/WebApplication/index.html @ 2010:25d269c7b753

grouping annotations into one submenu for narrow screens
author Sebastien Jodogne <s.jodogne@gmail.com>
date Fri, 02 Dec 2022 18:06:33 +0100
parents 1fa3f484008e
children dbafd535136e
comparison
equal deleted inserted replaced
2009:196684ae6206 2010:25d269c7b753
334 <div class="wvToolbar wvToolbar--top wvPrintExclude"> 334 <div class="wvToolbar wvToolbar--top wvPrintExclude">
335 <div class="ng-scope inline-object"> 335 <div class="ng-scope inline-object">
336 <div class="tbGroup"> 336 <div class="tbGroup">
337 <div class="tbGroup__toggl"> 337 <div class="tbGroup__toggl">
338 <button class="wvButton" 338 <button class="wvButton"
339 v-bind:class="{ 'wvButton--underline' : !viewportLayoutButtonsVisible }" 339 v-bind:class="{ 'wvButton--underline' : !viewportLayoutButtonsVisible, 'wvButton--border' : viewportLayoutButtonsVisible }"
340 data-toggle="tooltip" data-title="Change layout" 340 data-toggle="tooltip" data-title="Change layout"
341 @click="viewportLayoutButtonsVisible = !viewportLayoutButtonsVisible;HideAllTooltips()"> 341 @click="viewportLayoutButtonsVisible = !viewportLayoutButtonsVisible;mouseActionsVisible=false;annotationActionsVisible=false;HideAllTooltips()">
342 <i class="fa fa-th"></i> 342 <i class="fa fa-th"></i>
343 </button> 343 </button>
344 </div> 344 </div>
345 345
346 <div class="tbGroup__buttons--bottom" v-show="viewportLayoutButtonsVisible"> 346 <div class="tbGroup__buttons--bottom" v-show="viewportLayoutButtonsVisible">
371 371
372 <div class="ng-scope inline-object"> 372 <div class="ng-scope inline-object">
373 <div class="tbGroup"> 373 <div class="tbGroup">
374 <div class="tbGroup__toggl"> 374 <div class="tbGroup__toggl">
375 <button class="wvButton" 375 <button class="wvButton"
376 v-bind:class="{ 'wvButton--underline' : !mouseActionsVisible }" 376 v-bind:class="{ 'wvButton--underline' : !mouseActionsVisible, 'wvButton--border' : mouseActionsVisible }"
377 data-toggle="tooltip" data-title="Mouse actions" 377 data-toggle="tooltip" data-title="Mouse actions"
378 @click="mouseActionsVisible = !mouseActionsVisible;HideAllTooltips()"> 378 @click="viewportLayoutButtonsVisible=false;mouseActionsVisible = !mouseActionsVisible;annotationActionsVisible=false;HideAllTooltips()">
379 <i class="fa fa-mouse-pointer"></i> 379 <i class="fa fa-mouse-pointer"></i>
380 </button> 380 </button>
381 </div> 381 </div>
382 382
383 <div class="tbGroup__buttons--bottom" v-show="mouseActionsVisible"> 383 <div class="tbGroup__buttons--bottom" v-show="mouseActionsVisible">
526 v-on:click="FlipY()"> 526 v-on:click="FlipY()">
527 <i class="fas fa-exchange-alt fa-rotate-90"></i> 527 <i class="fas fa-exchange-alt fa-rotate-90"></i>
528 </button> 528 </button>
529 </div> 529 </div>
530 530
531 <div class="ng-scope inline-object"> 531
532 <button class="wvButton--underline text-center" 532 <div class="ng-scope inline-object">
533 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_LENGTH }" 533 <div class="tbGroup">
534 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_LENGTH, stone.WebViewerAction.CREATE_LENGTH)" 534 <div class="tbGroup__toggl">
535 data-toggle="tooltip" data-title="Measure length"> 535 <button class="wvButton"
536 <i class="fas fa-ruler"></i> 536 v-bind:class="{ 'wvButton--underline' : !annotationActionsVisible, 'wvButton--border' : annotationActionsVisible }"
537 </button> 537 data-toggle="tooltip" data-title="Annotations"
538 </div> 538 @click="viewportLayoutButtonsVisible=false;mouseActionsVisible=false;annotationActionsVisible = !annotationActionsVisible;HideAllTooltips()">
539 539 <i class="fas fa-pencil-ruler"></i>
540 <div class="ng-scope inline-object"> 540 </button>
541 <button class="wvButton--underline text-center" 541 </div>
542 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_ANGLE }" 542
543 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_ANGLE, stone.WebViewerAction.CREATE_ANGLE)" 543 <div class="tbGroup__buttons--bottom" v-show="annotationActionsVisible">
544 data-toggle="tooltip" data-title="Measure angle"> 544 <div class="ng-scope inline-object">
545 <i class="fas fa-drafting-compass"></i> 545 <button class="wvButton--underline text-center"
546 </button> 546 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_LENGTH }"
547 </div> 547 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_LENGTH, stone.WebViewerAction.CREATE_LENGTH)"
548 548 data-toggle="tooltip" data-title="Measure length">
549 <div class="ng-scope inline-object"> 549 <i class="fas fa-ruler"></i>
550 <button class="wvButton--underline text-center" 550 </button>
551 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_CIRCLE }" 551 </div>
552 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_CIRCLE, stone.WebViewerAction.CREATE_CIRCLE)" 552
553 data-toggle="tooltip" data-title="Measure circle"> 553 <div class="ng-scope inline-object">
554 <i class="far fa-circle"></i> 554 <button class="wvButton--underline text-center"
555 </button> 555 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_ANGLE }"
556 </div> 556 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_ANGLE, stone.WebViewerAction.CREATE_ANGLE)"
557 557 data-toggle="tooltip" data-title="Measure angle">
558 <div class="ng-scope inline-object"> 558 <i class="fas fa-drafting-compass"></i>
559 <button class="wvButton--underline text-center" 559 </button>
560 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_PIXEL_PROBE }" 560 </div>
561 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_PIXEL_PROBE, stone.WebViewerAction.CREATE_PIXEL_PROBE)" 561
562 data-toggle="tooltip" data-title="Pixel probe"> 562 <div class="ng-scope inline-object">
563 <i class="fas fa-microscope"></i> 563 <button class="wvButton--underline text-center"
564 </button> 564 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_CIRCLE }"
565 </div> 565 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_CIRCLE, stone.WebViewerAction.CREATE_CIRCLE)"
566 566 data-toggle="tooltip" data-title="Measure circle">
567 <div class="ng-scope inline-object"> 567 <i class="far fa-circle"></i>
568 <button class="wvButton--underline text-center" 568 </button>
569 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_RECTANGLE_PROBE }" 569 </div>
570 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_RECTANGLE_PROBE, stone.WebViewerAction.CREATE_RECTANGLE_PROBE)" 570
571 data-toggle="tooltip" data-title="Rectangle probe"> 571 <div class="ng-scope inline-object">
572 <i class="fas fa-plus-square"></i> 572 <button class="wvButton--underline text-center"
573 </button> 573 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_PIXEL_PROBE }"
574 </div> 574 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_PIXEL_PROBE, stone.WebViewerAction.CREATE_PIXEL_PROBE)"
575 575 data-toggle="tooltip" data-title="Pixel probe">
576 <div class="ng-scope inline-object"> 576 <i class="fas fa-microscope"></i>
577 <button class="wvButton--underline text-center" 577 </button>
578 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_ELLIPSE_PROBE }" 578 </div>
579 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_ELLIPSE_PROBE, stone.WebViewerAction.CREATE_ELLIPSE_PROBE)" 579
580 data-toggle="tooltip" data-title="Ellipse probe"> 580 <div class="ng-scope inline-object">
581 <i class="fas fa-plus-circle"></i> 581 <button class="wvButton--underline text-center"
582 </button> 582 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_RECTANGLE_PROBE }"
583 </div> 583 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_RECTANGLE_PROBE, stone.WebViewerAction.CREATE_RECTANGLE_PROBE)"
584 584 data-toggle="tooltip" data-title="Rectangle probe">
585 <div class="ng-scope inline-object"> 585 <i class="fas fa-plus-square"></i>
586 <button class="wvButton--underline text-center" 586 </button>
587 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_TEXT_ANNOTATION }" 587 </div>
588 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_TEXT_ANNOTATION, stone.WebViewerAction.CREATE_TEXT_ANNOTATION)" 588
589 data-toggle="tooltip" data-title="Add text annotation"> 589 <div class="ng-scope inline-object">
590 <i class="fas fa-comment-dots"></i> 590 <button class="wvButton--underline text-center"
591 </button> 591 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_ELLIPSE_PROBE }"
592 </div> 592 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_ELLIPSE_PROBE, stone.WebViewerAction.CREATE_ELLIPSE_PROBE)"
593 593 data-toggle="tooltip" data-title="Ellipse probe">
594 <div class="ng-scope inline-object"> 594 <i class="fas fa-plus-circle"></i>
595 <button class="wvButton--underline text-center" 595 </button>
596 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_REMOVE_MEASURE }" 596 </div>
597 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_REMOVE_MEASURE, stone.WebViewerAction.REMOVE_MEASURE)" 597
598 data-toggle="tooltip" data-title="Delete annotation"> 598 <div class="ng-scope inline-object">
599 <i class="fas fa-trash"></i> 599 <button class="wvButton--underline text-center"
600 </button> 600 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_CREATE_TEXT_ANNOTATION }"
601 </div> 601 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_CREATE_TEXT_ANNOTATION, stone.WebViewerAction.CREATE_TEXT_ANNOTATION)"
602 data-toggle="tooltip" data-title="Add text annotation">
603 <i class="fas fa-comment-dots"></i>
604 </button>
605 </div>
606
607 <div class="ng-scope inline-object">
608 <button class="wvButton--underline text-center"
609 v-bind:class="{ 'active' : mouseTool == MOUSE_TOOL_REMOVE_MEASURE }"
610 v-on:click="SetLeftMouseButtonAction(MOUSE_TOOL_REMOVE_MEASURE, stone.WebViewerAction.REMOVE_MEASURE)"
611 data-toggle="tooltip" data-title="Delete annotation">
612 <i class="fas fa-trash"></i>
613 </button>
614 </div>
615 </div>
616 </div>
617 </div>
618
602 619
603 <div class="ng-scope inline-object"> 620 <div class="ng-scope inline-object">
604 <button class="wvButton--underline text-center" 621 <button class="wvButton--underline text-center"
605 data-toggle="tooltip" data-title="Synchronized browsing" 622 data-toggle="tooltip" data-title="Synchronized browsing"
606 v-bind:class="{ 'active' : synchronizedBrowsing }" 623 v-bind:class="{ 'active' : synchronizedBrowsing }"