We use cookies to ensure you get the best experience on our website
Home Explore Help News
Register Sign In

Scheduled service maintenance on November 22

On Friday, November 22, 2024, between 06:00 CET and 18:00 CET, GIN services will undergo planned maintenance. Extended service interruptions should be expected. We will try to keep downtimes to a minimum, but recommend that users avoid critical tasks, large data uploads, or DOI requests during this time.

We apologize for any inconvenience.

TheAxonLab
/
defacing-and-qc-trainingsession
2
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Branch: main
Branches Tags
defacing-and...
/
sub-50197_T1w.html

sub-50197_T1w.html 26 KB
Permalink History Download

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527 
  1. <?xml version="1.0" encoding="utf-8" ?>
    2. 

  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    3. 

  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    4. 

  4. <head>
    5. 

  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    6. 

  6. <meta name="generator" content="NiReports: https://www.nipreps.org/" />
    7. 

  7. <title>sub-50197_T1w :: Anatomical MRI report</title>
    8. 

  8. <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
    9. 

  9. <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
    10. 

  10. <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
    11. 

  11. 

  12. <script>
    13. 

  13. var timestamp = Date.now()
    14. 

  14. 

  15. function read_form() {
    16. 

  16.     var ds = "unknown";
    17. 

  17.     var sub = "unspecified";
    18. 

  18. 

  19.     var artifacts = [];
    20. 

  20.     $('#qcartifacts-group input:checked').each(function() {
    21. 

  21.         artifacts.push($(this).attr('name'));
    22. 

  22.     });
    23. 

  23. 

  24.     var rating = $('#qcslider').val();
    25. 

  25.     var payload = {
    26. 

  26.         'dataset': ds,
    27. 

  27.         'subject': sub,
    28. 

  28.         'rating': rating,
    29. 

  29.         'artifacts': artifacts,
    30. 

  30.         'time_sec': (Date.now() - timestamp) / 1000,
    31. 

  31.         'confidence': $('#qcextra-confidence').val(),
    32. 

  32.         'comments': $('#qcextra-comments').val()
    33. 

  33.     };
    34. 

  34. 

  35.     var file = new Blob([JSON.stringify(payload)], {type: 'text/json'});
    36. 

  36.     $('#btn-download').attr('href', URL.createObjectURL(file));
    37. 

  37.     $('#btn-download').attr('download', payload['dataset'] + "_" + payload['subject'] + ".json");
    38. 

  38.     return payload
    39. 

  39. };
    40. 

  40. 

  41. function toggle_rating() {
    42. 

  42.     if ($('#qcrating-menu').hasClass('d-none')) {
    43. 

  43.         $('#qcrating-menu').removeClass('d-none');
    44. 

  44.         $('#qcrating-toggler').prop('checked', true);
    45. 

  45.     } else {
    46. 

  46.         $('#qcrating-menu').addClass('d-none');
    47. 

  47.         $('#qcrating-toggler').prop('checked', false);
    48. 

  48.     }
    49. 

  49. };
    50. 

  50. 

  51. $(window).on('load',function(){
    52. 

  52.     var authorization = $('#btn-post').val()
    53. 

  53.     if (authorization.includes("secret_token")) {
    54. 

  54.         $('#btn-post').addClass('d-none');
    55. 

  55.     };
    56. 

  56.     timestamp = Date.now();
    57. 

  57. });
    58. 

  58. 

  59. </script>
    60. 

  60. <style type="text/css">
    61. 

  61. /* The slider itself */
    62. 

  62. .slider {
    63. 

  63.   -webkit-appearance: none;  /* Override default CSS styles */
    64. 

  64.   appearance: none;
    65. 

  65.   margin-bottom: 8px;
    66. 

  66.   margin-left: 10%;
    67. 

  67.   width: 80%;
    68. 

  68.   height: 5px; /* Specified height */
    69. 

  69.   background: #d3d3d3; /* Grey background */
    70. 

  70.   outline: none; /* Remove outline */
    71. 

  71.   opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
    72. 

  72.   -webkit-transition: .2s; /* 0.2 seconds transition on hover */
    73. 

  73.   transition: opacity .2s;
    74. 

  74. }
    75. 

  75. 

  76. /* Mouse-over effects */
    77. 

  77. .slider:hover {
    78. 

  78.   opacity: 1; /* Fully shown on mouse-over */
    79. 

  79. }
    80. 

  80. 

  81. .slider::-webkit-slider-thumb {
    82. 

  82.   -webkit-appearance: none;
    83. 

  83.   appearance: none;
    84. 

  84.   width: 25px;
    85. 

  85.   height: 25px;
    86. 

  86.   border: 0;
    87. 

  87.   background: url('https://raw.githubusercontent.com/nipreps/nireports/main/assets/slider-handle.png');
    88. 

  88.   cursor: pointer;
    89. 

  89.   z-index: 2000 !important;
    90. 

  90. }
    91. 

  91. 

  92. .slider::-moz-range-thumb {
    93. 

  93.   width: 25px;
    94. 

  94.   height: 25px;
    95. 

  95.   border: 0;
    96. 

  96.   background: url('https://raw.githubusercontent.com/nipreps/nireports/main/assets/slider-handle.png');
    97. 

  97.   cursor: pointer;
    98. 

  98.   z-index: 2000 !important;
    99. 

  99. }
    100. 

  100. 

  101. </style>
    102. 

  102. </head>
    103. 

  103. <body style="font-family: helvetica;">
    104. 

  104. <nav class="navbar fixed-top navbar-expand-lg bg-light">
    105. 

  105. <div class="container-fluid">
    106. 

  106. <div class="collapse navbar-collapse" id="navbarSupportedContent">
    107. 

  107.     <ul class="navbar-nav me-auto mb-2 mb-lg-0">
    108. 

  108.         <li class="nav-item"><a class="nav-link" href="#Basic visual report">Basic visual report</a></li>
    109. 

  109.         <li class="nav-item dropdown">
    110. 

  110.             <a class="nav-link dropdown-toggle" id="navbarAbout" role="button" data-bs-toggle="dropdown" aria-expanded="false" href="#About">
    111. 

  111.             About
    112. 

  112.             </a>
    113. 

  113.             <ul class="dropdown-menu">
    114. 

  114.                 <li><a class="dropdown-item" href="#errors">Errors</a></li>
    115. 

  115.                 <li><a class="dropdown-item" href="#meta-about-metadata">Reproducibility and provenance information</a></li>
    116. 

  116.             </ul>
    117. 

  117.         </li>
    118. 

  118.     </ul>
    119. 

  119. </div>
    120. 

  120. </div>
    121. 

  121. <div class="d-flex flex-row-reverse">
    122. 

  122. <div class="form-check form-switch align-self-center flex-fill me-4">
    123. 

  123. <input class="form-check-input" type="checkbox" id="qcrating-toggler"></input>
    124. 

  124. <label class="form-check-label" style="width: 100pt;" for="qcrating-toggler">Rating widget</label>
    125. 

  125. </div>
    126. 

  126. </div>
    127. 

  127. </nav>
    128. 

  128. <noscript>
    129. 

  129.     <h1 class="text-danger"> The navigation menu uses Javascript. Without it this report might not work as expected </h1>
    130. 

  130. </noscript>
    131. 

  131. 

  132.     <div id="Basic visual report" class="mt-5">
    133. 

  133.     <h1 class="sub-report-title pt-5 ps-4">Basic visual report</h1>
    134. 

  134.         <div id="datatype-figures_desc-zoomed_subject-50197_suffix-T1w" class="ps-4 pe-4 mb-2">
    135. 

  135. <h3 class="run-title mt-3">Zoomed-in mosaic view of the brain</h3><p class="elem-caption">This panel shows a mosaic of the brain. This mosaic is the most suitable to screen head-motion intensity inhomogeneities, global/local noise, signal leakage (for example, from the eyeballs and across the phase-encoding axis), etc.</p>                    <div class="reportlet">
    136. 

  136. <img class="svg-reportlet" src="./sub-50197/figures/sub-50197_desc-zoomed_T1w.svg" style="width: 100%" />
    137. 

  137. </div>
    138. 

  138. <small>Get figure file: <a href="./sub-50197/figures/sub-50197_desc-zoomed_T1w.svg" target="_blank">sub-50197/figures/sub-50197_desc-zoomed_T1w.svg</a></small>
    139. 

  139. 

  140.         </div>
    141. 

  141.         <div id="datatype-figures_desc-background_subject-50197_suffix-T1w" class="ps-4 pe-4 mb-2">
    142. 

  142. <h3 class="run-title mt-3">View of the background of the anatomical image</h3><p class="elem-caption">This panel shows a mosaic enhancing the background around the head. Artifacts usually unveil themselves in the air surrounding the head, where no signal sources are present.</p>                    <div class="reportlet">
    143. 

  143. <img class="svg-reportlet" src="./sub-50197/figures/sub-50197_desc-background_T1w.svg" style="width: 100%" />
    144. 

  144. </div>
    145. 

  145. <small>Get figure file: <a href="./sub-50197/figures/sub-50197_desc-background_T1w.svg" target="_blank">sub-50197/figures/sub-50197_desc-background_T1w.svg</a></small>
    146. 

  146. 

  147.         </div>
    148. 

  148.     </div>
    149. 

  149.     <div id="About" class="mt-5">
    150. 

  150.     <h1 class="sub-report-title pt-5 ps-4">About</h1>
    151. 

  151.         <div id="errors" class="ps-4 pe-4 mb-2">
    152. 

  152. <h2 class="sub-report-group mt-4">Errors</h2>                    <p class="alert alert-success" role="alert">No errors to report!</p>
    153. 

  153.         </div>
    154. 

  154.         <div id="meta-about-metadata" class="ps-4 pe-4 mb-2">
    155. 

  155. <h2 class="sub-report-group mt-4">Reproducibility and provenance information</h2><p class="elem-caption">Thanks for using <em>MRIQC</em>. The following information may assist in
    156. 

  156. reconstructing the provenance of the corresponding derivatives.
    157. 

  157. </p>                    <div class="accordion accordion-flush" id="about-metadata">
    158. 

  158. 

  159. 

  160.   <div class="accordion-item">
    161. 

  161.     <h2 class="accordion-header" id="about-metadata-0">
    162. 

  162.       <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#about-metadata-0-collapse" aria-controls="about-metadata-0-collapse">
    163. 

  163.         Provenance Information
    164. 

  164.       </button>
    165. 

  165.     </h2>
    166. 

  166.     <div id="about-metadata-0-collapse" class="accordion-collapse collapse" aria-labelledby="about-metadata-0-heading" data-bs-parent="#about-metadata-0">
    167. 

  167.       <div class="accordion-body metadata-table">
    168. 

  168.       <table id="about-metadata-table-0" class="table table-sm table-striped">
    169. 

  169. <tr><td colspan=2>Execution environment</td><td>singularity</td></tr>
    170. 

  170. <tr><td colspan=2>Input filename</td><td><BIDS root>/sub-50197/anat/sub-50197_T1w.nii.gz</td></tr>
    171. 

  171. <tr><td>Versions</td><td>MRIQC</td><td>23.1.0</td></tr>
    172. 

  172. <tr><td>Versions</td><td>NiPype</td><td>1.8.6</td></tr>
    173. 

  173. <tr><td>Versions</td><td>TemplateFlow</td><td>0.8.1</td></tr>
    174. 

  174. <tr><td colspan=2>md5sum</td><td>53e5f1afa745d3bee311d71c5eefb89a</td></tr>
    175. 

  175. <tr><td>warnings</td><td>large_rot_frame</td><td>True</td></tr>
    176. 

  176. <tr><td>warnings</td><td>small_air_mask</td><td>False</td></tr>
    177. 

  177. </table>
    178. 

  178. 

  179.       </div>
    180. 

  180.     </div>
    181. 

  181.   </div>
    182. 

  182. 

  183. 

  184.   <div class="accordion-item">
    185. 

  185.     <h2 class="accordion-header" id="about-metadata-1">
    186. 

  186.       <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#about-metadata-1-collapse" aria-controls="about-metadata-1-collapse">
    187. 

  187.         Dataset Information
    188. 

  188.       </button>
    189. 

  189.     </h2>
    190. 

  190.     <div id="about-metadata-1-collapse" class="accordion-collapse collapse" aria-labelledby="about-metadata-1-heading" data-bs-parent="#about-metadata-1">
    191. 

  191.       <div class="accordion-body metadata-table">
    192. 

  192.       None
    193. 

  193.       </div>
    194. 

  194.     </div>
    195. 

  195.   </div>
    196. 

  196. 

  197. 

  198.   <div class="accordion-item">
    199. 

  199.     <h2 class="accordion-header" id="about-metadata-2">
    200. 

  200.       <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#about-metadata-2-collapse" aria-controls="about-metadata-2-collapse">
    201. 

  201.         Extracted Image quality metrics (IQMs)
    202. 

  202.       </button>
    203. 

  203.     </h2>
    204. 

  204.     <div id="about-metadata-2-collapse" class="accordion-collapse collapse" aria-labelledby="about-metadata-2-heading" data-bs-parent="#about-metadata-2">
    205. 

  205.       <div class="accordion-body metadata-table">
    206. 

  206.       <table id="about-metadata-table-2" class="table table-sm table-striped">
    207. 

  207. <tr><td colspan=3>cjv</td><td>0.9089250877103829</td></tr>
    208. 

  208. <tr><td colspan=3>cnr</td><td>0.9472444170035004</td></tr>
    209. 

  209. <tr><td colspan=3>efc</td><td>0.6765849136995841</td></tr>
    210. 

  210. <tr><td colspan=3>fber</td><td>1914.337091437475</td></tr>
    211. 

  211. <tr><td>fwhm</td><td colspan=2>avg</td><td>3.702786666666667</td></tr>
    212. 

  212. <tr><td>fwhm</td><td colspan=2>x</td><td>3.38865</td></tr>
    213. 

  213. <tr><td>fwhm</td><td colspan=2>y</td><td>4.05081</td></tr>
    214. 

  214. <tr><td>fwhm</td><td colspan=2>z</td><td>3.6689</td></tr>
    215. 

  215. <tr><td>icvs</td><td colspan=2>csf</td><td>0.2551838173915759</td></tr>
    216. 

  216. <tr><td>icvs</td><td colspan=2>gm</td><td>0.3765228978921606</td></tr>
    217. 

  217. <tr><td>icvs</td><td colspan=2>wm</td><td>0.3682932847162635</td></tr>
    218. 

  218. <tr><td>inu</td><td colspan=2>med</td><td>0.879051148891449</td></tr>
    219. 

  219. <tr><td>inu</td><td colspan=2>range</td><td>0.9973569989204398</td></tr>
    220. 

  220. <tr><td>qi</td><td colspan=2>1</td><td>0.0</td></tr>
    221. 

  221. <tr><td>qi</td><td colspan=2>2</td><td>0.002743221561746363</td></tr>
    222. 

  222. <tr><td>rpve</td><td colspan=2>csf</td><td>5.690685000561035</td></tr>
    223. 

  223. <tr><td>rpve</td><td colspan=2>gm</td><td>5.535460850495038</td></tr>
    224. 

  224. <tr><td>rpve</td><td colspan=2>wm</td><td>5.6716505528300765</td></tr>
    225. 

  225. <tr><td>size</td><td colspan=2>x</td><td>172</td></tr>
    226. 

  226. <tr><td>size</td><td colspan=2>y</td><td>256</td></tr>
    227. 

  227. <tr><td>size</td><td colspan=2>z</td><td>256</td></tr>
    228. 

  228. <tr><td>snr</td><td colspan=2>csf</td><td>2.2847527593503814</td></tr>
    229. 

  229. <tr><td>snr</td><td colspan=2>gm</td><td>3.3053159919141835</td></tr>
    230. 

  230. <tr><td>snr</td><td colspan=2>total</td><td>3.751964089550233</td></tr>
    231. 

  231. <tr><td>snr</td><td colspan=2>wm</td><td>5.665823517386135</td></tr>
    232. 

  232. <tr><td>snrd</td><td colspan=2>csf</td><td>7.253699955290667</td></tr>
    233. 

  233. <tr><td>snrd</td><td colspan=2>gm</td><td>10.309718771692152</td></tr>
    234. 

  234. <tr><td>snrd</td><td colspan=2>total</td><td>10.569363026142907</td></tr>
    235. 

  235. <tr><td>snrd</td><td colspan=2>wm</td><td>14.1446703514459</td></tr>
    236. 

  236. <tr><td>spacing</td><td colspan=2>x</td><td>1.0</td></tr>
    237. 

  237. <tr><td>spacing</td><td colspan=2>y</td><td>1.0</td></tr>
    238. 

  238. <tr><td>spacing</td><td colspan=2>z</td><td>1.0</td></tr>
    239. 

  239. <tr><td>summary</td><td>bg</td><td>k</td><td>130.08743092549113</td></tr>
    240. 

  240. <tr><td>summary</td><td>bg</td><td>mad</td><td>0.0</td></tr>
    241. 

  241. <tr><td>summary</td><td>bg</td><td>mean</td><td>15.633944576767224</td></tr>
    242. 

  242. <tr><td>summary</td><td>bg</td><td>median</td><td>0.0</td></tr>
    243. 

  243. <tr><td>summary</td><td>bg</td><td>n</td><td>2953840.0</td></tr>
    244. 

  244. <tr><td>summary</td><td>bg</td><td>p05</td><td>0.0</td></tr>
    245. 

  245. <tr><td>summary</td><td>bg</td><td>p95</td><td>90.49488416686654</td></tr>
    246. 

  246. <tr><td>summary</td><td>bg</td><td>stdv</td><td>42.129382106776156</td></tr>
    247. 

  247. <tr><td>summary</td><td>csf</td><td>k</td><td>0.06971224563099021</td></tr>
    248. 

  248. <tr><td>summary</td><td>csf</td><td>mad</td><td>171.6397659144976</td></tr>
    249. 

  249. <tr><td>summary</td><td>csf</td><td>mean</td><td>462.7798638553188</td></tr>
    250. 

  250. <tr><td>summary</td><td>csf</td><td>median</td><td>466.45843080058694</td></tr>
    251. 

  251. <tr><td>summary</td><td>csf</td><td>n</td><td>490668.7200176879</td></tr>
    252. 

  252. <tr><td>summary</td><td>csf</td><td>p05</td><td>127.9766157977283</td></tr>
    253. 

  253. <tr><td>summary</td><td>csf</td><td>p95</td><td>800.0114554055035</td></tr>
    254. 

  254. <tr><td>summary</td><td>csf</td><td>stdv</td><td>204.16123957485863</td></tr>
    255. 

  255. <tr><td>summary</td><td>gm</td><td>k</td><td>1.053476293347627</td></tr>
    256. 

  256. <tr><td>summary</td><td>gm</td><td>mad</td><td>111.56584784442343</td></tr>
    257. 

  257. <tr><td>summary</td><td>gm</td><td>mean</td><td>669.0200562560728</td></tr>
    258. 

  258. <tr><td>summary</td><td>gm</td><td>median</td><td>662.979620039463</td></tr>
    259. 

  259. <tr><td>summary</td><td>gm</td><td>n</td><td>723980.1107082111</td></tr>
    260. 

  260. <tr><td>summary</td><td>gm</td><td>p05</td><td>341.1181447505951</td></tr>
    261. 

  261. <tr><td>summary</td><td>gm</td><td>p95</td><td>1004.6135684363544</td></tr>
    262. 

  262. <tr><td>summary</td><td>gm</td><td>stdv</td><td>200.57966130612726</td></tr>
    263. 

  263. <tr><td>summary</td><td>wm</td><td>k</td><td>0.6366295660146548</td></tr>
    264. 

  264. <tr><td>summary</td><td>wm</td><td>mad</td><td>112.58549001817292</td></tr>
    265. 

  265. <tr><td>summary</td><td>wm</td><td>mean</td><td>901.1150111516595</td></tr>
    266. 

  266. <tr><td>summary</td><td>wm</td><td>median</td><td>909.5910744853318</td></tr>
    267. 

  267. <tr><td>summary</td><td>wm</td><td>n</td><td>708156.1693449472</td></tr>
    268. 

  268. <tr><td>summary</td><td>wm</td><td>p05</td><td>624.6382156647742</td></tr>
    269. 

  269. <tr><td>summary</td><td>wm</td><td>p95</td><td>1152.6492149233818</td></tr>
    270. 

  270. <tr><td>summary</td><td>wm</td><td>stdv</td><td>160.5398455262541</td></tr>
    271. 

  271. <tr><td>tpm</td><td>overlap</td><td>csf</td><td>0.23518949600203165</td></tr>
    272. 

  272. <tr><td>tpm</td><td>overlap</td><td>gm</td><td>0.5175712955890341</td></tr>
    273. 

  273. <tr><td>tpm</td><td>overlap</td><td>wm</td><td>0.5274460992051624</td></tr>
    274. 

  274. <tr><td colspan=3>wm2max</td><td>0.34497674216406554</td></tr>
    275. 

  275. </table>
    276. 

  276. 

  277.       </div>
    278. 

  278.     </div>
    279. 

  279.   </div>
    280. 

  280. 

  281. </div>
    282. 

  282.         </div>
    283. 

  283.     </div>
    284. 

  284. 

  285. <div id="qcrating-menu" class="card position-fixed d-none" style="width: 30%; top: 100px; left: 65%;">
    286. 

  286. <div class="card-header m-0">
    287. 

  287.     Rating widget
    288. 

  288.     <button type="button" class="btn-close position-absolute top-0 end-0" aria-label="Close" id="close-qcrating-menu" onclick="toggle_rating()" style="margin: 10px 10px 0 0"></button>
    289. 

  289. </div>
    290. 

  290. <div class="card-body">
    291. 

  291. <div class="accordion">
    292. 

  292.   <div class="accordion-item">
    293. 

  293.     <h2 class="accordion-header" id="qcslider-head">
    294. 

  294.       <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#qcslider-collapse" aria-expanded="true" aria-controls="qcslider-collapse">Overall Quality Rating</button>
    295. 

  295.     </h2>
    296. 

  296.     <div id="qcslider-collapse" class="accordion-collapse collapse show" aria-labelledby="qcslider-head">
    297. 

  297.       <div class="accordion-body">
    298. 

  298.         <input type="range" min="1.0" max="4.0" step="0.05" value="2.5" id="qcslider" class="slider">
    299. 

  299.         <ul class="list-group list-group-horizontal slider-labels" style="width: 100%">
    300. 

  300.             <li class="list-group-item list-group-item-danger small" style="font-size: 0.7em; width: 25%; text-align:center">Exclude</li>
    301. 

  301.             <li class="list-group-item list-group-item-warning small" style="font-size: 0.7em; width: 25%; text-align:center">Poor</li>
    302. 

  302.             <li class="list-group-item list-group-item-primary small" style="font-size: 0.7em; width: 25%; text-align:center">Acceptable</li>
    303. 

  303.             <li class="list-group-item list-group-item-success small" style="font-size: 0.7em; width: 25%; text-align:center">Excellent</li>
    304. 

  304.         </ul>
    305. 

  305.       </div>
    306. 

  306.     </div>
    307. 

  307.   </div>
    308. 

  308. 

  309.   <div class="accordion-item">
    310. 

  310.     <h2 class="accordion-header" id="qcartifacts-head">
    311. 

  311.       <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#qcartifacts-collapse" aria-expanded="false" aria-controls="qcartifacts-collapse">
    312. 

  312.         Record specific artifacts
    313. 

  313.       </button>
    314. 

  314.     </h2>
    315. 

  315.     <div id="qcartifacts-collapse" class="accordion-collapse collapse" aria-labelledby="qcartifacts-head">
    316. 

  316.       <div class="accordion-body">
    317. 

  317.         <fieldset id="qcartifacts-group" class="form-group">
    318. 

  318.             <div class="form-check form-switch small">
    319. 

  319.                 <input class="form-check-input" type="checkbox" name="head-motion" id="qcartifacts-item-0" />
    320. 

  320.                 <label class="form-check-label" for="qcartifacts-item-0">Head motion artifacts</label>
    321. 

  321.             </div>
    322. 

  322.             <div class="form-check form-switch small">
    323. 

  323.                 <input class="form-check-input" type="checkbox" name="eye-spillover" id="qcartifacts-item-1" />
    324. 

  324.                 <label class="form-check-label" for="qcartifacts-item-1">Eye spillover through <abbr title="phase-encoding">PE</abbr> axis</label>
    325. 

  325.             </div>
    326. 

  326.             <div class="form-check form-switch small">
    327. 

  327.                 <input class="form-check-input" type="checkbox" name="noneye-spillover" id="qcartifacts-item-2" />
    328. 

  328.                 <label class="form-check-label" for="qcartifacts-item-2">Non-eye spillover through <abbr title="phase-encoding">PE</abbr> axis</label>
    329. 

  329.             </div>
    330. 

  330.             <div class="form-check form-switch small">
    331. 

  331.                 <input class="form-check-input" type="checkbox" name="coil-failure" id="qcartifacts-item-3" />
    332. 

  332.                 <label class="form-check-label" for="qcartifacts-item-3">Coil failure</label>
    333. 

  333.             </div>
    334. 

  334.             <div class="form-check form-switch small">
    335. 

  335.                 <input class="form-check-input" type="checkbox" name="noise-global" id="qcartifacts-item-4" />
    336. 

  336.                 <label class="form-check-label" for="qcartifacts-item-4">Global noise</label>
    337. 

  337.             </div>
    338. 

  338.             <div class="form-check form-switch small">
    339. 

  339.                 <input class="form-check-input" type="checkbox" name="noise-local" id="qcartifacts-item-5" />
    340. 

  340.                 <label class="form-check-label" for="qcartifacts-item-5">Local noise</label>
    341. 

  341.             </div>
    342. 

  342.             <div class="form-check form-switch small">
    343. 

  343.                 <input class="form-check-input" type="checkbox" name="em-perturbation" id="qcartifacts-item-6" />
    344. 

  344.                 <label class="form-check-label" for="qcartifacts-item-6"><abbr title="electromagnetic">EM</abbr> interference/perturbation</label>
    345. 

  345.             </div>
    346. 

  346.             <div class="form-check form-switch small">
    347. 

  347.                 <input class="form-check-input" type="checkbox" name="wrap-around" id="qcartifacts-item-7" />
    348. 

  348.                 <label class="form-check-label" for="qcartifacts-item-7">Problematic <abbr title="field-of-view">FoV</abbr> prescription / wrap-around</label>
    349. 

  349.             </div>
    350. 

  350.             <div class="form-check form-switch small">
    351. 

  351.                 <input class="form-check-input" type="checkbox" name="ghost-aliasing" id="qcartifacts-item-8" />
    352. 

  352.                 <label class="form-check-label" for="qcartifacts-item-8">Aliasing ghosts</label>
    353. 

  353.             </div>
    354. 

  354.             <div class="form-check form-switch small">
    355. 

  355.                 <input class="form-check-input" type="checkbox" name="ghost-other" id="qcartifacts-item-9" />
    356. 

  356.                 <label class="form-check-label" for="qcartifacts-item-9">Other ghosts (for example, <abbr title="radiofrequency">RF</abbr> spoiling)</label>
    357. 

  357.             </div>
    358. 

  358.             <div class="form-check form-switch small">
    359. 

  359.                 <input class="form-check-input" type="checkbox" name="inu" id="qcartifacts-item-10" />
    360. 

  360.                 <label class="form-check-label" for="qcartifacts-item-10">Intensity non-uniformity (B<sub>1</sub> bias)</label>
    361. 

  361.             </div>
    362. 

  362.             <div class="form-check form-switch small">
    363. 

  363.                 <input class="form-check-input" type="checkbox" name="field-variation" id="qcartifacts-item-11" />
    364. 

  364.                 <label class="form-check-label" for="qcartifacts-item-11">Temporal B<sub>1</sub> field non-uniformity variation</label>
    365. 

  365.             </div>
    366. 

  366.             <div class="form-check form-switch small">
    367. 

  367.                 <input class="form-check-input" type="checkbox" name="processing" id="qcartifacts-item-12" />
    368. 

  368.                 <label class="form-check-label" for="qcartifacts-item-12">Processing such as denoising, defacing or resamplings happened</label>
    369. 

  369.             </div>
    370. 

  370.             <div class="form-check form-switch small">
    371. 

  371.                 <input class="form-check-input" type="checkbox" name="uncategorized" id="qcartifacts-item-13" />
    372. 

  372.                 <label class="form-check-label" for="qcartifacts-item-13">Other uncategorized artifact(s)</label>
    373. 

  373.             </div>
    374. 

  374.         </fieldset>
    375. 

  375.       </div> <!-- accordion-body -->
    376. 

  376.     </div> <!-- accordion-collapse -->
    377. 

  377.   </div> <!-- accordion-item -->
    378. 

  378.   <div class="accordion-item">
    379. 

  379.     <h2 class="accordion-header" id="qcextra-head">
    380. 

  380.       <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#qcextra-collapse" aria-expanded="false" aria-controls="qcextra-collapse">
    381. 

  381.         Extra details
    382. 

  382.       </button>
    383. 

  383.     </h2>
    384. 

  384.     <div id="qcextra-collapse" class="accordion-collapse collapse" aria-labelledby="qcextra-head">
    385. 

  385.       <div class="accordion-body">
    386. 

  386.         <div class="input-group">
    387. 

  387.           <span class="input-group-text">Comments</span>
    388. 

  388.           <textarea class="form-control" aria-label="Comments" id="qcextra-comments"></textarea>
    389. 

  389.         </div>
    390. 

  390. 

  391.         <p style="margin-top: 20px; font-weight: bold">Rater confidence</p>
    392. 

  392.         <input type="range" min="0.0" max="4.0" step="0.05" value="3.5" id="qcextra-confidence" class="slider" style="margin-left: 22%;width: 56%;">
    393. 

  393.         <ul class="list-group list-group-horizontal slider-labels" style="width: 100%">
    394. 

  394.             <li class="list-group-item list-group-item-warning small" style="width: 50%; text-align:center">Doubtful</li>
    395. 

  395.             <li class="list-group-item list-group-item-success bg-success text-white small" style="width: 50%; text-align:center">Confident</li>
    396. 

  396.         </ul>
    397. 

  397.        </div> <!-- accordion-body -->
    398. 

  398.     </div> <!-- accordion-collapse -->
    399. 

  399.   </div> <!-- accordion-item -->
    400. 

  400. </div>
    401. 

  401. <div style="margin-top: 10px">
    402. 

  402. <a class="btn btn-primary disabled" id="btn-download" href="">Download</a>
    403. 

  403. </div>
    404. 

  404. <script type="text/javascript">
    405. 

  405. var MINIMUM_RATING_TIME = 10
    406. 

  406. $('#qcslider').on('input', function() {
    407. 

  407. 

  408.     if ( (Date.now() - timestamp) / 1000 > MINIMUM_RATING_TIME) {
    409. 

  409.         $('#btn-download').removeClass('disabled');
    410. 

  410.         $('#btn-download').removeAttr('aria-disabled');
    411. 

  411.         $('#btn-post').removeAttr('disabled');
    412. 

  412.     };
    413. 

  413. 

  414.     $('#qcslider-collapse .list-group-item').removeClass(function(index, classname) {
    415. 

  415.         return (classname.match(/(^|\s)bg-\S+/g) || []).join(' ');
    416. 

  416.     });
    417. 

  417.     $('#qcslider-collapse .list-group-item').removeClass(function(index, classname) {
    418. 

  418.         return (classname.match(/(^|\s)text-\S+/g) || []).join(' ');
    419. 

  419.     });
    420. 

  420. 

  421.     if ( $(this).val() < 1.5 ) {
    422. 

  422.         $('#qcslider-collapse .list-group-item-danger').addClass('bg-danger text-white');
    423. 

  423.     } else if ( $(this).val() > 3.5 ) {
    424. 

  424.         $('#qcslider-collapse .list-group-item-success').addClass('bg-success text-white');
    425. 

  425.     } else if ( $(this).val() < 2.5 ) {
    426. 

  426.         $('#qcslider-collapse .list-group-item-warning').addClass('bg-warning text-dark');
    427. 

  427.     } else {
    428. 

  428.         $('#qcslider-collapse .list-group-item-primary').addClass('bg-primary text-white');
    429. 

  429.     };
    430. 

  430. 

  431.     var payload = read_form();
    432. 

  432. });
    433. 

  433. 

  434. $('#qcextra-confidence').on('input', function() {
    435. 

  435.     if ( (Date.now() - timestamp) / 1000 > MINIMUM_RATING_TIME) {
    436. 

  436.         $('#btn-download').removeClass('disabled');
    437. 

  437.         $('#btn-download').removeAttr('aria-disabled');
    438. 

  438.         $('#btn-post').removeAttr('disabled');
    439. 

  439.     };
    440. 

  440. 

  441.     $('#qcextra-collapse .list-group-item').removeClass(function(index, classname) {
    442. 

  442.         return (classname.match(/(^|\s)bg-\S+/g) || []).join(' ');
    443. 

  443.     });
    444. 

  444.     $('#qcextra-collapse .list-group-item').removeClass(function(index, classname) {
    445. 

  445.         return (classname.match(/(^|\s)text-\S+/g) || []).join(' ');
    446. 

  446.     });
    447. 

  447. 

  448.     if ( $(this).val() < 2.0 ) {
    449. 

  449.         $('#qcextra-collapse .list-group-item-warning').addClass('bg-warning text-dark');
    450. 

  450.     } else {
    451. 

  451.         $('#qcextra-collapse .list-group-item-success').addClass('bg-success text-white');
    452. 

  452.     };
    453. 

  453. 

  454.     var payload = read_form();
    455. 

  455. });
    456. 

  456. 

  457. 

  458. $('#qcextra-comments').bind('input propertychange', function() {
    459. 

  459.     if ( (Date.now() - timestamp) / 1000 > MINIMUM_RATING_TIME) {
    460. 

  460.         $('#btn-download').removeClass('disabled');
    461. 

  461.         $('#btn-download').removeAttr('aria-disabled');
    462. 

  462.         $('#btn-post').removeAttr('disabled');
    463. 

  463.     };
    464. 

  464. });
    465. 

  465. 

  466. $( '#btn-post' ).click( function() {
    467. 

  467.     var payload = read_form();
    468. 

  468.     var md5sum = "unspecified";
    469. 

  469.     var params = {
    470. 

  470.         'rating': payload['rating'],
    471. 

  471.         'md5sum': md5sum,
    472. 

  472.         'name': "",
    473. 

  473.         'comment': JSON.stringify(payload['artifacts'])
    474. 

  474.     };
    475. 

  475. 

  476.     // disable development releases
    477. 

  477.     var authorization = $(this).val();
    478. 

  478.     var ratingReq = new XMLHttpRequest();
    479. 

  479.     ratingReq.open("POST", "https://localhost:8000/");
    480. 

  480.     ratingReq.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
    481. 

  481.     ratingReq.setRequestHeader("Authorization", authorization);
    482. 

  482.     ratingReq.onload = function () {
    483. 

  483.         status = ratingReq.status;
    484. 

  484.         $('#btn-post').removeClass('btn-primary');
    485. 

  485.         $('#btn-post').attr('disabled', true);
    486. 

  486.         $('#btn-post').attr('aria-disabled', true);
    487. 

  487.         $('#btn-post').prop('disabled');
    488. 

  488.         $('#btn-post').addClass('disabled');
    489. 

  489.         $('#btn-post').removeClass('active');
    490. 

  490.         if (status === "201") {
    491. 

  491.             $('#btn-post').addClass('btn-success');
    492. 

  492.             $('#btn-post').html('Posted!');
    493. 

  493.         } else {
    494. 

  494.             $('#btn-post').addClass('btn-danger');
    495. 

  495.             $('#btn-post').html('Failed');
    496. 

  496.         };
    497. 

  497.     };
    498. 

  498.     ratingReq.send(JSON.stringify(params));
    499. 

  499. });
    500. 

  500. 

  501. $( 'body' ).on( 'click', '#qcartifacts-group input', function(e) {
    502. 

  502.     if ( (Date.now() - timestamp) / 1000 > MINIMUM_RATING_TIME) {
    503. 

  503.         $('#btn-download').removeClass('disabled');
    504. 

  504.         $('#btn-download').removeAttr('aria-disabled');
    505. 

  505.         $('#btn-post').removeAttr('disabled');
    506. 

  506.     };
    507. 

  507.     
    508. 

  508.     var payload = read_form();
    509. 

  509. });
    510. 

  510. 

  511. $( 'body' ).on( 'click', '#qcrating-toggler', function(e) {
    512. 

  512.     toggle_rating();
    513. 

  513. });
    514. 

  514. </script>
    515. 

  515. </div>
    516. 

  516. 

  517. <script type="text/javascript">
    518. 

  518. function toggle(id) {
    519. 

  519.     var element = document.getElementById(id);
    520. 

  520.     if(element.style.display == 'block')
    521. 

  521.         element.style.display = 'none';
    522. 

  522.     else
    523. 

  523.         element.style.display = 'block';
    524. 

  524. }
    525. 

  525. </script>
    526. 

  526. </body>
    527. 

  527. </html>
    528.