Mercurial > hg > orthanc-stone

comparison Applications/StoneWebViewer/WebApplication/index.html @ 1681:f2e8b3ac1dcd

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
handling multiple windowing presets in the Stone web viewer
author Sebastien Jodogne <s.jodogne@gmail.com>
date Tue, 24 Nov 2020 18:08:07 +0100
parents 51bab5188a13
children 84fe7089ccaa
comparison
equal deleted inserted replaced
1680:03afa09cfcf1 1681:f2e8b3ac1dcd
365 </div> 365 </div>
366 366
367 <div class="ng-scope inline-object"> 367 <div class="ng-scope inline-object">
368 <button class="wvButton--underline text-center" 368 <button class="wvButton--underline text-center"
369 data-toggle="tooltip" data-title="Change windowing" 369 data-toggle="tooltip" data-title="Change windowing"
370 id="windowing-popover"> 370 id="windowing-popover"
371 v-on:click="ToggleWindowing()">
371 <i class="fa fa-sun"></i> 372 <i class="fa fa-sun"></i>
372 </button> 373 </button>
374 </div>
375
376 <div id="windowing-content" v-show="showWindowing"
377 class="popover wvToolbar__windowingPresetConfigPopover"
378 style="position: absolute; display: block"
379 >
380 <div class="arrow"></div>
381 <h3 class="popover-title">Change windowing</h3>
382 <div class="popover-content">
383
384 <!--p class="wvToolbar__windowingPresetConfigNotice">
385 Click on the button to toggle the windowing tool or apply a preset to the selected viewport.
386 </p-->
387
388 <ul class="wvToolbar__windowingPresetList">
389 <li v-for="preset in windowingPresets" class="wvToolbar__windowingPresetListItem">
390 <a href="#" v-on:click="SetWindowing(preset.center, preset.width)">
391 {{ preset.name }} <small>({{ preset.info }})</small>
392 </a>
393 </li>
394 <li class="wvToolbar__windowingPresetListItem">
395 <a href="#" v-on:click="SetWindowing(-400, 1600)">
396 CT Lung <small>(C -400, W 1600)</small>
397 </a>
398 </li>
399 <li class="wvToolbar__windowingPresetListItem">
400 <a href="#" v-on:click="SetWindowing(300, 1500)">
401 CT Abdomen <small>(C 300, W 1500)</small>
402 </a>
403 </li>
404 <li class="wvToolbar__windowingPresetListItem">
405 <a href="#" v-on:click="SetWindowing(40, 80)">
406 CT Bone <small>(C 40, W 80)</small>
407 </a>
408 </li>
409 <li class="wvToolbar__windowingPresetListItem">
410 <a href="#" v-on:click="SetWindowing(40, 400)">
411 CT Brain <small>(C 40, W 400)</small>
412 </a>
413 </li>
414 <li class="wvToolbar__windowingPresetListItem">
415 <a href="#" v-on:click="SetWindowing(-400, 1600)">
416 CT Chest <small>(C -400, W 1600)</small>
417 </a>
418 </li>
419 <li class="wvToolbar__windowingPresetListItem">
420 <a href="#" v-on:click="SetWindowing(300, 600)">
421 CT Angio <small>(C 300, W 600)</small>
422 </a>
423 </li>
424 </ul>
425 </div>
373 </div> 426 </div>
374 427
375 <div class="ng-scope inline-object"> 428 <div class="ng-scope inline-object">
376 <button class="wvButton--underline text-center" 429 <button class="wvButton--underline text-center"
377 data-toggle="tooltip" data-title="Flip horizontally" 430 data-toggle="tooltip" data-title="Flip horizontally"
462 v-bind:height="viewport4Height" 515 v-bind:height="viewport4Height"
463 v-bind:show-info="showInfo" 516 v-bind:show-info="showInfo"
464 v-bind:active="activeViewport==4"></viewport> 517 v-bind:active="activeViewport==4"></viewport>
465 </div> 518 </div>
466 </div> 519 </div>
467 520 </div>
468 </div> 521 </div>
469 </div>
470 </div> 522 </div>
471 523
472
473
474 <script type="text/x-template" id="windowing-content">
475 <p class="wvToolbar__windowingPresetConfigNotice">
476 Click on the button to toggle the windowing tool or apply a preset to the selected viewport.
477 </p>
478
479 <ul class="wvToolbar__windowingPresetList">
480 <li class="wvToolbar__windowingPresetListItem">
481 <a href="#" onclick="app.SetPresetWindowing()">
482 Preset
483 </a>
484 </li>
485 <li class="wvToolbar__windowingPresetListItem">
486 <a href="#" onclick="app.SetWindowing(-400, 1600)">
487 CT Lung <small>(L -400, W 1,600)</small>
488 </a>
489 </li>
490 <li class="wvToolbar__windowingPresetListItem">
491 <a href="#" onclick="app.SetWindowing(300, 1500)">
492 CT Abdomen <small>(L 300, W 1,500)</small>
493 </a>
494 </li>
495 <li class="wvToolbar__windowingPresetListItem">
496 <a href="#" onclick="app.SetWindowing(40, 80)">
497 CT Bone <small>(L 40, W 80)</small>
498 </a>
499 </li>
500 <li class="wvToolbar__windowingPresetListItem">
501 <a href="#" onclick="app.SetWindowing(40, 400)">
502 CT Brain <small>(L 40, W 400)</small>
503 </a>
504 </li>
505 <li class="wvToolbar__windowingPresetListItem">
506 <a href="#" onclick="app.SetWindowing(-400, 1600)">
507 CT Chest <small>(L -400, W 1,600)</small>
508 </a>
509 </li>
510 <li class="wvToolbar__windowingPresetListItem">
511 <a href="#" onclick="app.SetWindowing(300, 600)">
512 CT Angio <small>(L 300, W 600)</small>
513 </a>
514 </li>
515 </ul>
516 </script>
517 524
518
519 <script type="text/x-template" id="viewport-template"> 525 <script type="text/x-template" id="viewport-template">
520 <div v-bind:id="canvasId + '-container'" 526 <div v-bind:id="canvasId + '-container'"
521 v-bind:style="{ padding:'2px', 527 v-bind:style="{ padding:'2px',
522 position:'absolute', 528 position:'absolute',
523 left: left, 529 left: left,