Skip to content

C
clinicaltrials
Commit 59b12102 authored by Romain Loth's avatar Romain Loth
Browse files
Options

new test layout

parent 01263859
Show whitespace changes
Inline Side-by-side
Showing with 215 additions and 117 deletions
explorerjs.html
View file @ 59b12102
...@@ -70,13 +70,15 @@ ...@@ -70,13 +70,15 @@
</div><!--container--> </div><!--container-->
</div><!--navbar-fixed-top--> </div><!--navbar-fixed-top-->
<!-- this is the tweakbar --> <!-- this is the tweakbar -->
<div id="defaultop" class="navbar navbar-default"> <div class="container-fluid navbar-default">
<div class="navbar-collapse collapse navbar-responsive-collapse"> <div id="defaultop" class="row">
<div id="left" style="margin:0em 2em;"> <div id="left" class="col-sm-8 col-md-8 col-lg-6" >
<ul class="nav navbar-nav">
<!-- <ul class="nav navbar-nav navbar-right">
<!--
<li> <li>
<a> <a>
<select id="aselector" onchange="console.log('salut monde')" class="selectpicker" data-style="btn btn-success btn-sm" data-width="auto"> <select id="aselector" onchange="console.log('salut monde')" class="selectpicker" data-style="btn btn-success btn-sm" data-width="auto">
...@@ -84,7 +86,8 @@ ...@@ -84,7 +86,8 @@
<option value="NGram">Keywords</option> <option value="NGram">Keywords</option>
</select> </select>
</a> </a>
</li> --> </li>
-->
<li> <li>
<a> <a>
...@@ -92,20 +95,26 @@ ...@@ -92,20 +95,26 @@
</a> </a>
</li> </li>
<li> <li>
<a> <a>
<button type="button" id="changelevel" class="btn btn-info btn-sm" disabled>Change Level</button> <button type="button" id="changelevel" class="btn btn-info btn-sm" disabled>Change Level</button>
</a> </a>
</li> </li>
<li><a>
Selector size<br>
<div id="unranged-value" class="settingslider"></div>
</a></li>
<li> <li><a>
<a> <!-- TODO fix: category0 -> category1 switching -->
<div style="margin:0em 2em;" id="unranged-value"></div> Label size<br>
<label style="margin:0em 2em;" for="unranged-value">selector size</label> <div id="slidercat0nodessize" class="settingslider"></div>
</a> </a></li>
</li>
<li><a>
Colors<div class="colorgraph_div"></div>
</a></li>
<!-- <!--
<li> <li>
...@@ -115,46 +124,27 @@ ...@@ -115,46 +124,27 @@
</li> </li>
--> -->
<!-- TODO fix: category0 -> category1 switching -->
</ul> <li><a>
Create a subgraph
<ul id="category0" class="nav navbar-nav navbar-right"> <ul id="category0" class="nav">
<li> <li><small>Nodes</small> <div id="slidercat0nodesweight" class="settingslider"></div></li>
<ul style="list-style-type: none; margin:0em 1em;"> <li><small>Edges</small> <div id="slidercat0edgesweight" class="settingslider"></div></li>
<li><div id="slidercat0nodesweight"></div></li>
<li><div id="slidercat0edgesweight"></div></li>
<li><div id="slidercat0nodessize"></div></li>
</ul>
</li>
</ul>
<ul id="filterslegend" class="nav navbar-nav navbar-right">
<li>
<ul style="list-style-type: none;">
<li>Nodes</li>
<li>Edges</li>
<li>Size</li>
</ul>
</li>
</ul> </ul>
<ul id="category1" class="nav navbar-nav navbar-right"> <ul id="category1" class="nav">
<li> <li><small>Nodes</small> <div id="slidercat1nodesweight" class="settingslider"></div></li>
<ul style="list-style-type: none; margin:0em 1em;"> <li><small>Edges</small> <div id="slidercat1edgesweight" class="settingslider"></div></li>
<li><div id="slidercat1nodesweight"></div></li>
<li><div id="slidercat1edgesweight"></div></li>
<li><div id="slidercat1nodessize"></div></li>
</ul> </ul>
</li> </a></li>
</ul> </ul>
</div><!-- /div#left -->
<div id="right" class="col-sm-3 col-md-4 col-lg-6" >
<div class="colorgraph_div"></div>
<div class="container" >
<div class='row' id="searchnav"> <div class='row' id="searchnav">
<!-- the smaller the viewport, the larger the relative search box size --> <!-- the smaller the viewport, the larger the relative search box size -->
<div class="col-sm-3 col-md-4 col-lg-6" > <div class="col-sm-9 col-md-9 col-lg-6" >
<div id="search_input_group" class="input-group input-group-sm"> <div id="search_input_group" class="input-group input-group-sm">
<span class="input-group-btn crowdsourcingModule"> <span class="input-group-btn crowdsourcingModule">
<button id="savesuggestion" <button id="savesuggestion"
...@@ -223,9 +213,9 @@ ...@@ -223,9 +213,9 @@
--> -->
</div> </div>
</div><!-- /.nav-collapse --> </div><!-- /.row#defaultop -->
</div><!-- /.navbar --> </div><!-- /.container.fluid -->
</div> <!-- £TODO wtf </div> -->
<div id="wrapper"> <div id="wrapper">
<!-- Sidebar left, new css --> <!-- Sidebar left, new css -->
...@@ -312,19 +302,16 @@ ...@@ -312,19 +302,16 @@
<!-- Sidebar right, old css --> <!-- Sidebar right, old css -->
<div id="rightcolumn"> <div id="rightcolumn">
<!-- TODO: put the video on cloud for better streaming & player -->
<video width="100%"
id="video_explanation"
src="video/AXA2015.mp4" controls="" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></video>
<button id="unselectbutton" <button id="unselectbutton"
style="color: #900;font-weight: bold;font-size: 70%;text-transform: uppercase;float:right;" style="color: #900;font-weight: bold;font-size: 70%;text-transform: uppercase;float:right;"
onClick='cancelSelection(false);' onClick='cancelSelection(false);'>
>X</button> <span class="glyphicon glyphicon-remove" alt="X"></span>
</button>
<div id="tips"></div>
<div id="names"></div> <div id="names"></div>
<br> <br>
<div id="tab-container" class='tab-container' style="display: none;"> <div id="tab-container" class='tab-container' style="display: none;">
...@@ -346,11 +333,78 @@ ...@@ -346,11 +333,78 @@
<div id="topPapers" style="display: none;"></div> <div id="topPapers" style="display: none;"></div>
<div id="information"></div> <div id="information"></div>
<!--
bottom right column as panels
open/close panel from: jsfiddle.net/KyleMit/kcpma
-->
<div class="panel-group" id="accordion">
<div class="panel panel-default" id="video_explanation">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-target="#le_tutorial"
href="#">
<span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>
&nbsp;Tutorial video
</a>
</h4>
</div>
<div class="panel-collapse collapse" id="le_tutorial">
<!-- TODO: outcloud the video for better stream+player -->
<video width="100%"
src="video/AXA2015.mp4" controls="" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></video>
</div>
</div>
<div class="panel panel-default" id="tips_panel">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-target="#tips"
href="#">
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
&nbsp;Tips
</a>
</h4>
</div>
<div class="panel-collapse collapse in" id="tips"></div>
</div>
<div class="panel panel-default" id="credits_panel">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-target="#credits"
href="#">
<span class="glyphicon glyphicon-flag" aria-hidden="true"></span>
&nbsp;Credits
</a>
</h4>
</div>
<div class="panel-collapse collapse" id="credits">
<a href="https://bigdata.iscpif.fr/" target="_blank">
<img src="https://bigdata.iscpif.fr/images/logos/BIGDATA-Logo-PoweredBy-light.jpg"
alt="Powered by Big Data at ISCPIF"
style="width:85%; ">
</a>
<a href="https://github.com/moma" target="_blank">
<img src="libs/img2/moma.png"
alt="Sciencemapping"
style="width:85%; ">
</a>
</div>
</div>
</div>
<br><br><br><br><br><br> <br><br><br><br><br><br>
</div> </div>
<!-- £TODO check </div> -->
<div id="savemodal" class="modal fade"> <div id="savemodal" class="modal fade">
<div class="modal-dialog"> <div class="modal-dialog">
......
libs/css2/custom.css
View file @ 59b12102
...@@ -28,11 +28,27 @@ ...@@ -28,11 +28,27 @@
max-height: 10%; max-height: 10%;
} }
#defaultop li{
font-family: "Josefin Sans", "Helvetica Neue", Helvetica, Arial, sans-serif ;
}
/* searchnav gets same padding as bootstrap's .navbar-nav > li > a */ /* searchnav gets same padding as bootstrap's .navbar-nav > li > a */
#defaultop div#searchnav { #defaultop div#searchnav {
padding-top: 13px; padding-top: 13px;
padding-bottom: 9px; padding-bottom: 9px;
} }
#defaultop .settingslider {
max-width: 85px;
display: inline-block ;
}
#defaultop .nav > li > a {
padding-left: 12px;
padding-right: 12px;
}
#sigma-example { #sigma-example {
width: 100%; width: 100%;
height: 300px; height: 300px;
...@@ -118,10 +134,38 @@ ...@@ -118,10 +134,38 @@
/* border: 1px solid #2e4b69;*/ /* border: 1px solid #2e4b69;*/
/*}*/ /*}*/
.panel-heading a:before {
font-family:'Glyphicons Halflings';
content:"\e114 ";
float: right;
color: blue;
}
.panel-heading a {
text-decoration: none !important;
}
.panel-heading a:hover {
border-color: blue;
color: black;
}
.panel-heading a.collapsed:before {
content:"\e114 ";
color:grey;
}
/*
#left{ #left{
display: inline-block; display: inline-block;
} }
#right{
display: inline-block;
}
*/
#credits {
text-align: center;
}
/*.modal-vertical-centered {*/ /*.modal-vertical-centered {*/
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment