index2.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>{{ slug }}</title>
  6. <meta name="description" content="Institute for Data Processing and Electronics">
  7. <meta name="author" content="Nicholas Tan Jerome">
  8. <link rel="stylesheet" href="{{ static_url("css/jquery-ui.min.css") }}">
  9. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
  10. <link rel="stylesheet" href="{{ static_url("css/style.css") }}">
  11. <!--[if lt IE 9]>
  12. <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
  13. <![endif]-->
  14. </head>
  15. <body>
  16. <div id="header">
  17. <div id="header-text">
  18. Data repository
  19. </div>
  20. <div id="header-icon">
  21. <div>
  22. <a href="https://ufo.kit.edu/dis/index.php/project/astor/" target="_blank">
  23. <img src="{{ static_url("img/icon/astor.svg") }}" height="50px" width="auto"/>
  24. </a>
  25. </div>
  26. <div>
  27. <a href="https://ufo.kit.edu/dis/index.php/project/nova/" target="_blank">
  28. <img src="{{ static_url("img/icon/nova3.svg") }}" style="padding:6px" height="50px" width="auto"/>
  29. </a>
  30. </div>
  31. </div>
  32. </div>
  33. <div class="clearfix"></div>
  34. <hr>
  35. <div class="container-fluid">
  36. <div class="row">
  37. <nav class="col-sm-3 col-md-2 d-none d-sm-block bg-light sidebar">
  38. <ul class="nav nav-pills flex-column">
  39. <li class="nav-item">
  40. <a class="nav-link active" href="#">Overview <span class="sr-only">(current)</span></a>
  41. </li>
  42. <li class="nav-item">
  43. <a class="nav-link" href="#">Reports</a>
  44. </li>
  45. <li class="nav-item">
  46. <a class="nav-link" href="#">Analytics</a>
  47. </li>
  48. <li class="nav-item">
  49. <a class="nav-link" href="#">Export</a>
  50. </li>
  51. </ul>
  52. <ul class="nav nav-pills flex-column">
  53. <li class="nav-item">
  54. <a class="nav-link" href="#">Nav item</a>
  55. </li>
  56. <li class="nav-item">
  57. <a class="nav-link" href="#">Nav item again</a>
  58. </li>
  59. <li class="nav-item">
  60. <a class="nav-link" href="#">One more nav</a>
  61. </li>
  62. <li class="nav-item">
  63. <a class="nav-link" href="#">Another nav item</a>
  64. </li>
  65. </ul>
  66. <ul class="nav nav-pills flex-column">
  67. <li class="nav-item">
  68. <a class="nav-link" href="#">Nav item again</a>
  69. </li>
  70. <li class="nav-item">
  71. <a class="nav-link" href="#">One more nav</a>
  72. </li>
  73. <li class="nav-item">
  74. <a class="nav-link" href="#">Another nav item</a>
  75. </li>
  76. </ul>
  77. </nav>
  78. <main class="col-sm-9 ml-sm-auto col-md-10 pt-3" role="main">
  79. <h1>Dashboard</h1>
  80. <section class="row text-center placeholders">
  81. <div class="col-6 col-sm-3 placeholder">
  82. <img src="data:image/gif;base64,R0lGODlhAQABAIABAAJ12AAAACwAAAAAAQABAAACAkQBADs=" width="200" height="200" class="img-fluid rounded-circle" alt="Generic placeholder thumbnail">
  83. <h4>Label</h4>
  84. <div class="text-muted">Something else</div>
  85. </div>
  86. <div class="col-6 col-sm-3 placeholder">
  87. <img src="data:image/gif;base64,R0lGODlhAQABAIABAADcgwAAACwAAAAAAQABAAACAkQBADs=" width="200" height="200" class="img-fluid rounded-circle" alt="Generic placeholder thumbnail">
  88. <h4>Label</h4>
  89. <span class="text-muted">Something else</span>
  90. </div>
  91. <div class="col-6 col-sm-3 placeholder">
  92. <img src="data:image/gif;base64,R0lGODlhAQABAIABAAJ12AAAACwAAAAAAQABAAACAkQBADs=" width="200" height="200" class="img-fluid rounded-circle" alt="Generic placeholder thumbnail">
  93. <h4>Label</h4>
  94. <span class="text-muted">Something else</span>
  95. </div>
  96. <div class="col-6 col-sm-3 placeholder">
  97. <img src="data:image/gif;base64,R0lGODlhAQABAIABAADcgwAAACwAAAAAAQABAAACAkQBADs=" width="200" height="200" class="img-fluid rounded-circle" alt="Generic placeholder thumbnail">
  98. <h4>Label</h4>
  99. <span class="text-muted">Something else</span>
  100. </div>
  101. </section>
  102. <h2>Section title</h2>
  103. <div class="table-responsive">
  104. <table class="table table-striped">
  105. <thead>
  106. <tr>
  107. <th>#</th>
  108. <th>Header</th>
  109. <th>Header</th>
  110. <th>Header</th>
  111. <th>Header</th>
  112. </tr>
  113. </thead>
  114. <tbody>
  115. <tr>
  116. <td>1,001</td>
  117. <td>Lorem</td>
  118. <td>ipsum</td>
  119. <td>dolor</td>
  120. <td>sit</td>
  121. </tr>
  122. <tr>
  123. <td>1,002</td>
  124. <td>amet</td>
  125. <td>consectetur</td>
  126. <td>adipiscing</td>
  127. <td>elit</td>
  128. </tr>
  129. <tr>
  130. <td>1,003</td>
  131. <td>Integer</td>
  132. <td>nec</td>
  133. <td>odio</td>
  134. <td>Praesent</td>
  135. </tr>
  136. <tr>
  137. <td>1,003</td>
  138. <td>libero</td>
  139. <td>Sed</td>
  140. <td>cursus</td>
  141. <td>ante</td>
  142. </tr>
  143. <tr>
  144. <td>1,004</td>
  145. <td>dapibus</td>
  146. <td>diam</td>
  147. <td>Sed</td>
  148. <td>nisi</td>
  149. </tr>
  150. <tr>
  151. <td>1,005</td>
  152. <td>Nulla</td>
  153. <td>quis</td>
  154. <td>sem</td>
  155. <td>at</td>
  156. </tr>
  157. <tr>
  158. <td>1,006</td>
  159. <td>nibh</td>
  160. <td>elementum</td>
  161. <td>imperdiet</td>
  162. <td>Duis</td>
  163. </tr>
  164. <tr>
  165. <td>1,007</td>
  166. <td>sagittis</td>
  167. <td>ipsum</td>
  168. <td>Praesent</td>
  169. <td>mauris</td>
  170. </tr>
  171. <tr>
  172. <td>1,008</td>
  173. <td>Fusce</td>
  174. <td>nec</td>
  175. <td>tellus</td>
  176. <td>sed</td>
  177. </tr>
  178. <tr>
  179. <td>1,009</td>
  180. <td>augue</td>
  181. <td>semper</td>
  182. <td>porta</td>
  183. <td>Mauris</td>
  184. </tr>
  185. <tr>
  186. <td>1,010</td>
  187. <td>massa</td>
  188. <td>Vestibulum</td>
  189. <td>lacinia</td>
  190. <td>arcu</td>
  191. </tr>
  192. <tr>
  193. <td>1,011</td>
  194. <td>eget</td>
  195. <td>nulla</td>
  196. <td>Class</td>
  197. <td>aptent</td>
  198. </tr>
  199. <tr>
  200. <td>1,012</td>
  201. <td>taciti</td>
  202. <td>sociosqu</td>
  203. <td>ad</td>
  204. <td>litora</td>
  205. </tr>
  206. <tr>
  207. <td>1,013</td>
  208. <td>torquent</td>
  209. <td>per</td>
  210. <td>conubia</td>
  211. <td>nostra</td>
  212. </tr>
  213. <tr>
  214. <td>1,014</td>
  215. <td>per</td>
  216. <td>inceptos</td>
  217. <td>himenaeos</td>
  218. <td>Curabitur</td>
  219. </tr>
  220. <tr>
  221. <td>1,015</td>
  222. <td>sodales</td>
  223. <td>ligula</td>
  224. <td>in</td>
  225. <td>libero</td>
  226. </tr>
  227. </tbody>
  228. </table>
  229. </div>
  230. </main>
  231. </div>
  232. </div>
  233. <!--
  234. <div id="title">
  235. <p>{{ title }}</p>
  236. </div>
  237. <div id="authors">
  238. <p>
  239. {% for author in authors %}
  240. {{ author }},
  241. {% end %}
  242. </p>
  243. </div>
  244. <div id="institute">
  245. <p>
  246. {% for institute in institutes %}
  247. {{ institute }},
  248. {% end %}
  249. </p>
  250. </div>
  251. <div id="subheader">
  252. <span>Sample:</span>
  253. <select class="target">
  254. {% for sample in data_list %}
  255. {% if sample[1] == name %}
  256. <option value={{ sample[0] }} selected>{{ sample[1] }}</option>
  257. {% else %}
  258. <option value={{ sample[0] }}>{{ sample[1] }}</option>
  259. {% end %}
  260. {% end %}
  261. </select>
  262. <img class="icon" id="download" src="{{ static_url("img/icon/download.svg") }}"/>
  263. <span id="size">({{ data_size }} GB)</span>
  264. </div>
  265. -->
  266. <!--
  267. <div id="image-container" class="clearfix">
  268. <div id="img-left">
  269. <div class="cont">
  270. <span id="image-text">Overview (Volume Rendering)</span>
  271. </div>
  272. <div class="photowrapper">
  273. <img id="img-preview" width="100%" height="100%" src="img?id={{ index }}&name={{ name }}&type=preview&counter=0"/>
  274. <div id="text-desc">
  275. <p id="description"><span>Description</span>
  276. {% for text_desc in desc %}
  277. {% if text_desc['type'] == "i" %}
  278. <i>{{ text_desc['text'] }}</i>
  279. {% else %}
  280. {{ text_desc['text'] }}
  281. {% end %}
  282. {% end %}
  283. </p>
  284. </div>
  285. </div>
  286. </div>
  287. <div id="img-right">
  288. <div id="photowrapper-front" class="photowrapper">
  289. <div class="cont">
  290. <img id="front-left" class="icon" src="{{ static_url("img/icon/left-arrow.svg") }}"/>
  291. <span id="image-text">Front: <span id="front-text">1</span>&nbsp;&nbsp;&nbsp;&nbsp;<span id="front-quality-text"></span></span>
  292. <img id="front-right" class="icon" src="{{ static_url("img/icon/right-arrow.svg") }}"/>
  293. </div>
  294. <img id="img-front" width="100%" height="100%" src="img?id={{ index }}&name={{ name }}&type=front-resized&counter=0"/>
  295. <div id="slider-right"></div><div class="slice-count" id="front-count">{{ front_count }}</div>
  296. </div>
  297. </div>
  298. <div id="img-center">
  299. <div id="photowrapper-top" class="photowrapper">
  300. <div class="cont">
  301. <img id="top-left" class="icon" src="{{ static_url("img/icon/left-arrow.svg") }}"/>
  302. <span id="image-text">Top: <span id="top-text">1</span>&nbsp;&nbsp;&nbsp;&nbsp;<span id="top-quality-text"></span></span>
  303. <img id="top-right" class="icon" src="{{ static_url("img/icon/right-arrow.svg") }}"/>
  304. </div>
  305. <img id="img-top" width="100%" height="100%" src="img?id={{ index }}&name={{ name }}&type=top-resized&counter=0" data-zoom-image="img?id={{ index }}&name={{ name }}&type=top-resized&counter=0" />
  306. <div id="slider-center"></div><div class="slice-count" id="top-count">{{ top_count }}</div>
  307. </div>
  308. <div id="photowrapper-left" class="photowrapper">
  309. <div class="cont">
  310. <img id="left-left" class="icon" src="{{ static_url("img/icon/left-arrow.svg") }}"/>
  311. <span id="image-text">Left: <span id="left-text">1</span>&nbsp;&nbsp;&nbsp;&nbsp;<span id="left-quality-text"></span></span>
  312. <img id="left-right" class="icon" src="{{ static_url("img/icon/right-arrow.svg") }}"/>
  313. </div>
  314. <img id="placeholder-left" width="100%" height="100%" src="img?id={{ index }}&name={{ name }}&type=left-resized&counter=0"/>
  315. <div id="slider-left"></div><div class="slice-count" id="left-count">{{ left_count }}</div>
  316. </div>
  317. </div>
  318. </div>
  319. -->
  320. <hr>
  321. <div id="footer">&copy;2017 A service provided by Ultra-fast Online Processing for Data-intensive Sciences group (<a href="https://ufo.kit.edu/" target="_blank">UFO</a>)</div>
  322. <script src="{{ static_url("js/jquery-1.12.4.min.js") }}"></script>
  323. <script src="{{ static_url("js/jquery-ui.min.js") }}"></script>
  324. <script src="{{ static_url("js/jquery.ez-plus.js") }}"></script>
  325. <script src="{{ static_url("js/jquery.fullscreenslides.js") }}"></script>
  326. <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
  327. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
  328. <script src="{{ static_url("js/script.js") }}"></script>
  329. </body>
  330. </html>