<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Taxonomy Browser</title>
<!--
NOTE: "Bootstrap's JavaScript requires jQuery version 1.9.1 or higher, but lower than version 3"
-->
<script src="//code.jquery.com/jquery-1.12.4.min.js"></script>
<!-- <script src="//code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script> -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script type="text/javascript">
// Fix BBQ for jQuery >= 1.9 (see https://github.com/cowboy/jquery-bbq/pull/42)
if( !$.browser ) {
console.warn("Monkey-patching jQuery.browser.msie to get BBQ working");
var ua = navigator.userAgent.toLowerCase();
$.browser = { msie: /msie/.test(ua) && !/opera/.test(ua) };
}
</script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.ba-bbq/1.2.1/jquery.ba-bbq.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.5/handlebars.min.js"></script>
<!--
<link href="//cdn.jsdelivr.net/jquery.truncate/0.1/jquery.truncate.min.js"
rel="stylesheet">
<script src="https://rawgit.com/tbasse/jquery-truncate/master/jquery.truncate.js"
type="text/javascript"></script>
-->
<link href="//cdn.jsdelivr.net/npm/jquery.fancytree/dist/skin-bootstrap/ui.fancytree.min.css"
rel="stylesheet">
<!--
<link href="../../src/skin-bootstrap/ui.fancytree.css"
rel="stylesheet">
-->
<script src="//cdn.jsdelivr.net/npm/jquery.fancytree/dist/jquery.fancytree-all-deps.min.js"></script>
<!--
<script src="../../src/jquery.fancytree.js"></script>
<script src="../../src/jquery.fancytree.edit.js"></script>
<script src="../../src/jquery.fancytree.filter.js"></script>
<script src="../../src/jquery.fancytree.glyph.js"></script>
<script src="../../src/jquery.fancytree.table.js"></script>
<script src="../../src/jquery.fancytree.wide.js"></script>
-->
<link href="style.css" rel="stylesheet">
<script src="taxonomy-browser.js"></script>
</head>
<body>
<div class="page-header">
<h1>Taxonomy Browser
<!--
<small><a href="http://wwwendt.de/tech/fancytree/demo/taxonomy-browser/">home</a></small>
-->
</h1>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Search <acronym title="Global Biodiversity Information Facility">GBIF</acronym></h3>
</div>
<div class="panel-body hidden-print">
<input type="text" name="query" id="query"
autocorrect="off" autocomplete="off"
placeholder="Enter Search Phrase">
<button id="btnResetSearch" class="btn btn-default btn-sm">×</button>
<button id="btnSearch" class="btn btn-default btn-sm">Search</button>
<div class="collapse" id="searchResultPane">
<table id="searchResultTree"
class="table table-striped table-hover table-condensed table-bordered">
<colgroup>
<col width="10em"></col>
<col width="10em"></col>
<col width="*"></col>
<col width="30em"></col>
<col width="30em"></col>
<col width="30em"></col>
<col width="30em"></col>
<col width="30em"></col>
<col width="10em"></col>
<col width="10em"></col>
<col width="30em"></col>
<col width="30em"></col>
</colgroup>
<thead>
<tr>
<th class="visible-lg">Key</th>
<th class="hidden-xs">Rank</th>
<th>Scientific Name</th>
<th class="hidden-xs hidden-sm">Vernacular Names</th>
<th class="hidden-xs hidden-sm">Canonical Name</th>
<th class="visible-lg">According to</th>
<th class="hidden-xs">Status</th>
<th class="hidden-xs">Name Type</th>
<th class="hidden-xs"># Occur.</th>
<th class="hidden-xs"># Desc.</th>
<th class="visible-lg">Author</th>
<th class="visible-lg">Published in</th>
<!--
canonicalName
accordingTo
extinct
numDescendants
numOccurrences
publishedIn
synonym
-->
</tr>
</thead>
<tbody>
<tr>
<td class="visible-lg"/>
<td class="hidden-xs" />
<td/>
<td class="hidden-xs hidden-sm" />
<td class="hidden-xs hidden-sm" />
<td class="visible-lg" />
<td class="hidden-xs" />
<td class="hidden-xs" />
<td class="hidden-xs" />
<td class="hidden-xs" />
<td class="visible-lg" />
<td class="visible-lg" />
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="btn-group">
<button id="btnPin" class="btn btn-default btn-xs">Pin</button>
<button id="btnUnpin" class="btn btn-default btn-xs">Unpin</button>
</div>
<div id="taxonTree" class="fancytree-fade-expander">
</div>
</div>
<div class="col-md-8">
<!-- Breadcrumb -->
<ol class="breadcrumb">
<li class="active">Please select an element.</li>
</ol>
<span id="tmplInfoPane">
</span>
</div>
</div>
<div class="panel panel-warning">
<div class="panel-heading">
Disclaimer
</div>
<div class="panel-body">
<p>
This site accesses data from external sources, namely the
<a href="http://www.gbif.org/">Global Biodiversity Information Facility (GBIF)</a> database.
There is no guarantee, that the display is correct, complete, or
permanently available. Please refer to those original sources for
authorative information.
</p>
<p>
Copyright © 2015 Martin Wendt. Created as a demo for
<a href="https://github.com/mar10/fancytree">Fancytree</a>.
</p>
</div>
</div>
</body>
</html>