csa
/
fossils


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356
							<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../../../../favicon.ico">

    <title>Dashboard Template for Bootstrap</title>

    <!-- Bootstrap core CSS -->
    <link rel="stylesheet" href="{{ static_url("css/bootstrap.min.css") }}">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css">
    <!-- Custom styles for this template -->
    <link rel="stylesheet" href="{{ static_url("css/magnifier.css") }}">
    <link rel="stylesheet" href="{{ static_url("css/dashboard.css") }}">
  </head>

  <body>
    <nav class="navbar navbar-expand-md navbar-light bg-light">
      <a class="navbar-brand navbar-text col-8" href="#">Preservation of three-dimensional anatomy in phosphatized fossil arthropods enriches evolutionary inference</a>
      <button class="navbar-toggler d-lg-none" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>

      <div class="collapse navbar-collapse" id="navbarsExampleDefault">
        <ul class="navbar-nav mr-auto">
        </ul>
        <span style="margin-left: 50px;">
        <a href="https://ufo.kit.edu/dis/index.php/project/astor/" target="_blank">
          <img src="{{ static_url("img/icon/astor.svg") }}" height="40px" width="auto"/>
        </a>
        </span>
        <span style="margin-left: 50px;">
        <a href="https://ufo.kit.edu/dis/index.php/project/nova/" target="_blank">
          <img src="{{ static_url("img/icon/nova.svg") }}" height="30px" width="auto"/>
        </a>
        </span>
      </div>
      <!--
      <div class="container">
      <div class="row">
        <div class="col-md-6">
        </div>
        <div class="col-md-6">
          <span class="pull-right">
            <a href="https://ufo.kit.edu/dis/index.php/project/astor/" target="_blank">
                <img src="{{ static_url("img/icon/astor.png") }}" height="40px" width="auto"/>
            </a>
          </span>
        </div>
    </div>
    </div>
    -->
    </nav>

    <div id="abcd"></div>
    <div class="container-fluid">
      <div id="accordion" class="row">
          <nav id="sidebar" class="col-sm-4 d-none d-sm-block bg-light sidebar">
          <ul class="nav nav-pills flex-column">
            <li class="nav-item">
              <a class="nav-link active" data-toggle="collapse" href="#collapseOverview" aria-expanded="false" aria-controls="collapseOverview">
                Overview <span class="sr-only">(current)</span>
              </a>
              <div class="collapse" id="collapseOverview">
                <div class="card card-block">
                  <table class="table table-bordered">
                      <tbody>
                        <tr>
                          <th scope="row">Resolution</th>
                          <td>2 micron per pixel</td>
                        </tr>
                        <tr>
                          <th scope="row">Contact Person</th>
                          <td>Thomas van de Kamp, thomas.vandekamp@kit.edu</td>
                        </tr>
                        <tr>
                          <th scope="row">Author</th>
                          <td>Achim H Schwermann, Tomy dos Santos Rolo, Michael S Caterino, Günter Bechly, Heiko Schmied, Tilo Baumbach, Thomas van de Kamp</td>
                        </tr>
                        <tr>
                          <th scope="row">Institution</th>
                          <td>Steinmann Institute for Geology, Mineralogy and Paleontology, University of Bonn, Bonn, Germany, ANKA/Institute for Photon Science and Synchrotron Radiation, Karlsruhe Institute of Technology, Eggenstein-Leopoldshafen, Germany, Department of Agricultural and Environmental Sciences, Clemson University, Clemson, United States, State Museum of Natural History Stuttgart, Stuttgart, Germany, Institute of Crop Science and Resource Conservation, University of Bonn, Bonn, Germany, Laboratory for Applications of Synchrotron Radiation, Karlsruhe Institute of Technology, Karlsruhe, Germany</td>
                        </tr>
                      </tbody>
                    </table>
                </div>
              </div>
            </li>
          </ul>

          <ul class="nav nav-pills flex-column">
            <li class="nav-item">
              <a class="nav-link active disabled">
                Data
              </a>
            </li>
            <li class="nav-item">
              <a class="nav-data nav-link" data-toggle="collapse" href="#nav65720" aria-expanded="false" aria-controls="nav65720">
                NRM-PZ Ar65720
              </a>
              <div class="collapse show collapse-data" id="nav65720">
                <div class="card card-block">
                  <table class="table table-bordered">
                      <tbody>
                        <tr>
                          <th scope="row">Description</th>
                          <td id="desc65720"><i>Xenomorphia resurrecta</i>, male; well-preserved, head hollow</td>
                        </tr>
                        <tr>
                          <th scope="row">Size</th>
                          <td id="size65720">1.33 GB</td>
                        </tr>
                        <tr>
                          <th scope="row">Download</th>
                          <td><img id="download" src="{{ static_url("img/icon/download.svg") }}"/></td>
                        </tr>
                      </tbody>
                    </table>
                </div>
              </div>
            </li>
            <li class="nav-item">
              <a class="nav-data nav-link" data-toggle="collapse"  href="#nav65767" aria-expanded="false" aria-controls="nav65767">
                NRM-PZ Ar65767
              </a>
              <div class="collapse collapse-data" id="nav65767">
                <div class="card card-block">
                  <table class="table table-bordered">
                      <tbody>
                        <tr>
                          <th scope="row">Description</th>
                          <td id="desc65767">Xenomorphia resurrecta , male; well-preserved, head hollow</td>
                        </tr>
                        <tr>
                          <th scope="row">Size</th>
                          <td id="size65767">1.8 GB</td>
                        </tr>
                        <tr>
                          <th scope="row">Download</th>
                          <td><img id="download" src="{{ static_url("img/icon/download.svg") }}"/></td>
                        </tr>
                      </tbody>
                    </table>
                </div>
              </div>
            </li>
            <li class="nav-item">
              <a class="nav-data nav-link" data-toggle="collapse" href="#nav65771" aria-expanded="false" aria-controls="nav65771">
                NRM-PZ Ar65771
              </a>
              <div class="collapse collapse-data" id="nav65771">
                <div class="card card-block">
                  <table class="table table-bordered">
                      <tbody>
                        <tr>
                          <th scope="row">Description</th>
                          <td id="desc65771">Xenomorphia resurrecta , male; well-preserved, head hollow</td>
                        </tr>
                        <tr>
                          <th scope="row">Size</th>
                          <td id="size65771">1.8 GB</td>
                        </tr>
                        <tr>
                          <th scope="row">Download</th>
                          <td><img id="download" src="{{ static_url("img/icon/download.svg") }}"/></td>
                        </tr>
                      </tbody>
                    </table>
                </div>
              </div>
            </li>
            <li class="nav-item">
              <a class="nav-data nav-link" data-toggle="collapse" href="#nav65772" aria-expanded="false" aria-controls="nav65772">
                NRM-PZ Ar65772
              </a>
              <div class="collapse collapse-data" id="nav65772">
                <div class="card card-block">
                  <table class="table table-bordered">
                      <tbody>
                        <tr>
                          <th scope="row">Description</th>
                          <td id="desc65772">Xenomorphia resurrecta , male; well-preserved, head hollow</td>
                        </tr>
                        <tr>
                          <th scope="row">Size</th>
                          <td id="size65772">1.8 GB</td>
                        </tr>
                        <tr>
                          <th scope="row">Download</th>
                          <td><img id="download" src="{{ static_url("img/icon/download.svg") }}"/></td>
                        </tr>
                      </tbody>
                    </table>
                </div>
              </div>
            </li>
            <li class="nav-item">
              <a class="nav-data nav-link" data-toggle="collapse" href="#nav65793" aria-expanded="false" aria-controls="nav65793">
                NRM-PZ Ar65793
              </a>
              <div class="collapse collapse-data" id="nav65793">
                <div class="card card-block">
                  <table class="table table-bordered">
                      <tbody>
                        <tr>
                          <th scope="row">Description</th>
                          <td id="desc65793">Xenomorphia resurrecta , male; well-preserved, head hollow</td>
                        </tr>
                        <tr>
                          <th scope="row">Size</th>
                          <td id="size65793">1.8 GB</td>
                        </tr>
                        <tr>
                          <th scope="row">Download</th>
                          <td><img id="download" src="{{ static_url("img/icon/download.svg") }}"/></td>
                        </tr>
                      </tbody>
                    </table>
                </div>
              </div>
            </li>
            <li class="nav-item">
              <a class="nav-data nav-link" data-toggle="collapse" href="#nav65794" aria-expanded="false" aria-controls="nav65794">
                NRM-PZ Ar65794
              </a>
              <div class="collapse collapse-data" role="tabpanel" id="nav65794">
                <div class="card card-block">
                  <table class="table table-bordered">
                      <tbody>
                        <tr>
                          <th scope="row">Description</th>
                          <td id="desc65794">Xenomorphia resurrecta , male; well-preserved, head hollow</td>
                        </tr>
                        <tr>
                          <th scope="row">Size</th>
                          <td id="size65794">1.8 GB</td>
                        </tr>
                        <tr>
                          <th scope="row">Download</th>
                          <td><img id="download" src="{{ static_url("img/icon/download.svg") }}"/></td>
                        </tr>
                      </tbody>
                    </table>
                </div>
              </div>
            </li>
          </ul>

<nav aria-label="Page navigation example">
  <ul class="pagination justify-content-center">
    <li class="page-item disabled">
      <a class="page-link" href="#" tabindex="-1">Previous</a>
    </li>
    <li class="page-item"><a class="page-link" href="#">1</a></li>
    <li class="page-item"><a class="page-link" href="#">2</a></li>
    <li class="page-item"><a class="page-link" href="#">3</a></li>
    <li class="page-item">
      <a class="page-link" href="#">Next</a>
    </li>
  </ul>
</nav>
        </nav>

        <main class="col-8 pt-3 ml-auto" role="main">
        <h5 id="header_title" class="text-center">NRM-PZ Ar65720</h5>

          <section class="row text-center placeholders">
            <div class="col-6 col-sm-6 placeholder main-liner">
                <span class="text-muted">Volume Rendering</span>
                <img id="img-preview" width="100%" src="img?id={{ index }}&name={{ name }}&type=preview&counter=0"/>
                <div id="photowrapper-top">
                <div class="cont">
                    <img id="top-left" class="icon" src="{{ static_url("img/icon/left-arrow.svg") }}"/>
                    <span class="text-muted" id="image-text">Top: <span id="top-text">1</span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="text-muted" id="top-quality-text"></span></span>
                    <img id="top-right" class="icon" src="{{ static_url("img/icon/right-arrow.svg") }}"/>
                    <button type="button" id="bufferTop" class="btn btn-info">buffer</button>
                </div> 
                <div id="img-top-container">
                <img id="img-top"  width="100%" src="img?id={{ index }}&name={{ name }}&type=top&counter=0" data-zoom-image="img?id={{ index }}&name={{ name }}&type=top&counter=0" />
                </div>
                <div class="progress">
                  <div id="progress-top" class="progress-bar" role="progressbar" aria-valuenow="0"
                      aria-valuemin="0" aria-valuemax="100" style="width:0%">
                  </div>
                </div>  
                <div id="slider-center"></div><div class="slice-count" id="top-count">{{ left_count }}</div>
                </div>

                <div id="photowrapper-left">
                <div class="cont">
                    <img id="left-left" class="icon" src="{{ static_url("img/icon/left-arrow.svg") }}"/>
                    <span class="text-muted" id="image-text">Left: <span id="left-text">1</span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="text-muted" id="left-quality-text"></span></span>
                    <img id="left-right" class="icon" src="{{ static_url("img/icon/right-arrow.svg") }}"/>
                    <button type="button" id="bufferLeft" class="btn btn-info">buffer</button>
                </div> 
                <div id="img-left-container">
                    <img id="placeholder-left" width="100%" src="img?id={{ index }}&name={{ name }}&type=left&counter=0" data-zoom-image="img?id={{ index }}&name={{ name }}&type=left&counter=0"//> 
                </div>
                <div class="progress">
                  <div id="progress-left" class="progress-bar" role="progressbar" aria-valuenow="0"
                      aria-valuemin="0" aria-valuemax="100" style="width:0%">
                  </div>
                </div>  
                <div id="slider-left"></div><div class="slice-count" id="left-count">{{ top_count }}</div>
                </div>
            </div>

            <div class="col-6 col-sm-6 placeholder">
                <div id="photowrapper-front">
                <div>
                    <img id="front-left" class="icon" src="{{ static_url("img/icon/left-arrow.svg") }}"/>
                    <span class="text-muted" id="image-text">Front: <span id="front-text">1</span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="text-muted" id="front-quality-text"></span></span>
                    <img id="front-right" class="icon" src="{{ static_url("img/icon/right-arrow.svg") }}"/>
                    <button type="button" id="bufferFront" class="btn btn-info">buffer</button>
                </div>
                <div id="img-front-container">
                    <img id="img-front" width="100%" src="img?id={{ index }}&name={{ name }}&type=front&counter=0" data-zoom-image="img?id={{ index }}&name={{ name }}&type=front&counter=0"/>
                </div>
                <div class="progress">
                  <div id="progress-front" class="progress-bar" role="progressbar" aria-valuenow="0"
                      aria-valuemin="0" aria-valuemax="100" style="width:0%">
                  </div>
                </div>  
                <div id="slider-right"></div><div class="slice-count" id="front-count">{{ front_count }}</div>
                </div>
            </div>
          </section>

        </main>
      </div>
    </div>

    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script
          src="https://code.jquery.com/jquery-3.2.1.min.js"
            integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
              crossorigin="anonymous"></script>
    <script
          src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"
            integrity="sha256-eGE6blurk5sHj+rmkfsGYeKyZx3M4bG+ZlFyA7Kns7E="
              crossorigin="anonymous"></script>
    <script src="{{ static_url("js/jquery.ez-plus.js") }}"></script>      
    <script src="{{ static_url("js/popper.min.js") }}"></script>
    <script src="{{ static_url("js/bootstrap.min.js") }}"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <script src="{{ static_url("js/ie10-viewport-bug-workaround.js") }}"></script>
    <script src="{{ static_url("js/Event.js") }}"></script>
    <script src="{{ static_url("js/Magnifier.js") }}"></script>
    <script src="{{ static_url("js/script3.js") }}"></script>
  </body>
</html>