-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
- Loading branch information
There are no files selected for viewing
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,39 @@ | ||
| <!doctype html> | ||
| <html lang="en"> | ||
|
|
||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <link rel="stylesheet" href="./niivue.css" /> | ||
| <title>Niivue ScribblePromt</title> | ||
| <script type="module" crossorigin src="./assets/index-DDdjsjyG.js"></script> | ||
| </head> | ||
|
|
||
| <body> | ||
| <header> | ||
| <button id="segmentBtn">Segment</button> | ||
| <label for="clipCheck">Clip Plane</label> | ||
| <input type="checkbox" id="clipCheck" unchecked /> | ||
| <label for="opacitySlider0">Background Opacity</label> | ||
| <input type="range" min="0" max="255" value="255" class="slider" id="opacitySlider0" /> | ||
| | ||
| <label for="opacitySlider1">Overlay Opacity</label> | ||
| <input type="range" min="0" max="255" value="128" class="slider" id="opacitySlider1" /> | ||
| | ||
| <!-- drawing opacity slider --> | ||
| <label for="opacitySlider2">Drawing Opacity</label> | ||
| <input type="range" min="0" max="255" value="255" class="slider" id="opacitySlider2" /> | ||
| | ||
| <!-- conform checkbox --> | ||
| <label for="conform">Conform</label> | ||
| <input type="checkbox" id="conform" unchecked /> | ||
| <button id="saveImgBtn">Save segmentation</button> | ||
| | ||
| <div id="loadingCircle" class="loading-circle hidden"></div> | ||
| </header> | ||
| <main id="canvas-container"> | ||
| <canvas id="gl1"></canvas> | ||
| </main> | ||
| <footer id="intensity"> </footer> | ||
| </body> | ||
| </html> |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,130 @@ | ||
| html { | ||
| height: auto; | ||
| min-height: 100%; | ||
| margin: 0; | ||
| } | ||
| body { | ||
| display: flex; | ||
| flex-direction: column; | ||
| margin: 0; | ||
| min-height: 100%; | ||
| width: 100%; | ||
| position: absolute; | ||
| font-family: system-ui, Arial, Helvetica, sans-serif; | ||
| user-select: none; /* Standard syntax */ | ||
| color: white; | ||
| background: #303030; | ||
| } | ||
| header { | ||
| margin: 10px; | ||
| } | ||
| main { | ||
| flex: 1; | ||
| background: #000000; | ||
| position: relative; | ||
| } | ||
| footer { | ||
| margin: 10px; | ||
| } | ||
| canvas { | ||
| position: absolute; | ||
| cursor: crosshair; | ||
| } | ||
| canvas:focus { | ||
| outline: 0px; | ||
| } | ||
| div { | ||
| display: table-row; | ||
| } | ||
| .dropdown { | ||
| float: left; | ||
| overflow: hidden; | ||
| } | ||
| .dropdown .dropbtn { | ||
| font-size: 16px; | ||
| border: none; | ||
| outline: none; | ||
| color: white; | ||
| padding: 12px 12px; | ||
| background-color: #303030; | ||
| font-family: inherit; | ||
| margin: 0; | ||
| } | ||
| .dropdown:hover .dropbtn { | ||
| background-color: #9a9; | ||
| } | ||
| .dropdown-content { | ||
| display: none; | ||
| position: absolute; | ||
| background-color: #303030; | ||
| min-width: 160px; | ||
| border-radius: 5px; | ||
| box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); | ||
| z-index: 1; | ||
| } | ||
| .dropdown-content a { | ||
| float: none; | ||
| color: white; | ||
| padding: 12px 16px; | ||
| text-decoration: none; | ||
| display: block; | ||
| text-align: left; | ||
| line-height: 6px; | ||
| } | ||
| .dropdown-content a:hover { | ||
| background-color: #aba; | ||
| } | ||
| .dropdown:hover .dropdown-content { | ||
| display: block; | ||
| } | ||
| .dropdown-item-checked::before { | ||
| position: absolute; | ||
| left: 0.2rem; | ||
| content: "\2022"; /* or '✓' */ | ||
| font-weight: 600; | ||
| } | ||
| .divider { | ||
| border-top: 1px solid grey; | ||
| } | ||
| .vertical-divider { | ||
| border-left: 1px solid grey; | ||
| height: 40px; | ||
| } | ||
| .help-text { | ||
| margin: auto; | ||
| max-width: 150px; | ||
| padding: 0 10px; | ||
| } | ||
| .slidecontainer { | ||
| padding: 10px 10px; | ||
| white-space: normal; | ||
| word-break: break-word; | ||
| display: flex; | ||
| align-items: center; | ||
| flex: 0 0 auto; | ||
| } | ||
|
|
||
| div.footer { width: 100%; display: block; background: #303030;} | ||
| table.footer { width: 100%;height: 100%; table-layout: fixed;} | ||
|
|
||
| .loading-circle { | ||
| display: inline-block; | ||
| width: 20px; | ||
| height: 20px; | ||
| border: 3px solid rgba(255, 255, 255, 0.3); | ||
| border-radius: 50%; | ||
| border-top-color: #fff; | ||
| animation: spin 1s ease-in-out infinite; | ||
| margin-left: 10px; | ||
| vertical-align: middle; | ||
| } | ||
|
|
||
| @keyframes spin { | ||
| to { | ||
| transform: rotate(360deg); | ||
| } | ||
| } | ||
|
|
||
| .hidden { | ||
| display: none; | ||
| } |