|
0
|
1 <!DOCTYPE html>
|
|
|
2 <html>
|
|
|
3 <head lang="en">
|
|
|
4 <title>FLOCK Populations Ontology</title>
|
|
|
5 <meta charset="UTF-8">
|
|
|
6 <meta HTTP-EQUIV="Pragma" CONTENT="no-cache">
|
|
|
7 <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
8 <link rel="stylesheet" href="/static/flowtools/bootstrap/css/bootstrap.css"/>
|
|
|
9 <link rel="stylesheet" href="/static/flowtools/select2/select2.min.css"/>
|
|
|
10 <link rel="stylesheet" href="/static/flowtools/css/flowCL.css"/>
|
|
|
11 <link rel="stylesheet" href="/static/flowtools/datatables/datatables.min.css"/>
|
|
|
12 <link rel="stylesheet" href="/static/flowtools/datatables/Buttons-1.1.2/css/buttons.dataTables.min.css"/>
|
|
|
13 <link rel="stylesheet" href="/static/flowtools/datatables/Select-1.1.2/css/select.dataTables.min.css"/>
|
|
|
14 <script src="/static/flowtools/jquery-1.11.3.min.js" type="text/javascript"></script>
|
|
|
15 <script src="/static/flowtools/bootstrap/js/bootstrap.js" type="text/javascript"></script>
|
|
|
16 <script src="/static/flowtools/select2/select2.full.min.js" type="text/javascript"></script>
|
|
|
17 <script src="/static/flowtools/d3/d3.min.js" type="text/javascript"></script>
|
|
|
18 <script src="/static/flowtools/datatables/datatables.min.js" type="text/javascript"></script>
|
|
|
19 <script src="/static/flowtools/js/profileCLs.js" type="text/javascript"></script>
|
|
|
20
|
|
|
21 <style>
|
|
|
22 #input{font-family:Calibri,Arial}
|
|
|
23 table.dataTable tbody td.dt-body-right {
|
|
|
24 text-align: right;
|
|
|
25 }
|
|
|
26 #div{padding:5px;width:150px;height:100px;text-align:center}
|
|
|
27 table{width:100%;border:0px solid;border-collapse:collapse;text-align:center;}
|
|
|
28 th{background-color:#3e6db0;color:#fff;padding:5px;text-align:center}
|
|
|
29 </style>
|
|
|
30 </head>
|
|
|
31
|
|
|
32 <body>
|
|
|
33 <div class="container-fluid">
|
|
|
34 <div class="row" style="padding-bottom:10px;min-height:500px;">
|
|
|
35 <div class="col-md-12" >
|
|
|
36 <ul class="nav nav-tabs tabs-main">
|
|
|
37 <li class="homeTab active" data-value="clprofiles"><a href="#clprofiles" data-toggle="tab">Populations Cell Ontologies</a></li>
|
|
|
38 <li class="homeTab" data-value="scores"><a href="#scores" data-toggle="tab">Populations Score Profiles</a></li>
|
|
|
39 </ul>
|
|
|
40
|
|
|
41 <div class="tab-content">
|
|
|
42 <div class="tab-pane active" id="clprofiles" style="min-height:500px;">
|
|
|
43 <div class="row">
|
|
|
44 <div id="clprof"/>
|
|
|
45 </div>
|
|
|
46 </div>
|
|
|
47 </div>
|
|
|
48 <div class="tab-pane" id="scores" style="height:800px;">
|
|
|
49 <div class="row">
|
|
|
50 <div id="clprof"/>
|
|
|
51 </div>
|
|
|
52 </div>
|
|
|
53 </div>
|
|
|
54 </div>
|
|
|
55 </div>
|
|
|
56 </div>
|
|
|
57
|
|
|
58
|
|
|
59 </div>
|
|
|
60 </div>
|
|
|
61
|
|
|
62
|
|
|
63 <script>
|
|
|
64 var clprofilesLoaded = false;
|
|
|
65 var scoresLoaded = false;
|
|
|
66
|
|
|
67 $().ready(function() {
|
|
|
68 $(document).on('shown.bs.tab','a[data-toggle="tab"]', function(e) {
|
|
|
69 var tab = e.target.getAttribute("href");
|
|
|
70 if (tab == '#clprofiles') {
|
|
|
71 if (clprofilesLoaded) {
|
|
|
72 return true;
|
|
|
73 }
|
|
|
74 clprofilesLoaded = true;
|
|
|
75 displayCLTable();
|
|
|
76 }
|
|
|
77 if (tab == '#scores') {
|
|
|
78 if (scoresLoaded) {
|
|
|
79 return true;
|
|
|
80 }
|
|
|
81 scoresLoaded = true;
|
|
|
82 displayScoresTable();
|
|
|
83 }
|
|
|
84 });
|
|
|
85
|
|
|
86 clprofilesLoaded = true;
|
|
|
87 displayCLTable();
|
|
|
88 });
|
|
|
89 </script>
|
|
|
90 </body>
|
|
|
91 </html>
|
