Commit 8f23277e authored by David Hoksza's avatar David Hoksza

rename to recursive exploration, docs update

parent e5cecc5b
Pipeline #7933 passed with stage
in 30 seconds
......@@ -2,6 +2,8 @@
Plugin enabling to explore a map in a more single-gene-centric and focused way.
Find detailed user documentation <a href="docs">here</a>.
To compile the plugin run:
- ```npm install```
......
#ceExplorationDiv .col-md-12{
padding-left: 3px;
padding-right: 3px;
}
.ceOptionsShowHideButton {
width:100%;
}
#rowOptions {
padding-top: 3px;
}
#rowOptions .col-md-2, #rowOptions .col-md-8 {
padding-left: 3px;
padding-right: 3px;
}
#ceExplorationDiv {
float: right;
width:30%;
height:100%;
position: relative;
overflow: hidden;
}
#ceSplitBarDiv {
background-color:black;
height:100%;
float:right;
width:2px;
cursor: col-resize;
}
/*#ceMain {*/
/*float: left;*/
/*width: 550px;*/
/*}*/
#ceSidebar {
float: right;
width: 100px;
}
#ceLeftsidebar {
float: left;
width: 100px;
height: 600px;
}
#ceSequence {
width: 600px;
height: 70px;
}
#ceSequence text, #ceLegend text {
font-weight: 600;
fill: #fff;
}
.ceChart {
height:100%;
}
.ceChart svg {
width: 100%;
height: 100%;
}
.ceSvg, .ceSvgOverlayRect {
width:100%;
height:100%;
}
.ceSvgOverlayRect{
fill: none;
pointer-events: all;
}
/******************************************************************************
Tree visualization
*******************************************************************************/
.ce-node {
cursor: pointer;
}
.ce-node circle {
/*stroke: steelblue;*/
stroke-width: 1px;
}
.ce-node circle.ce-leaf {
fill: white;
}
.ce-node circle.ce-inner {
fill: steelblue;
}
.ce-spawned circle{
stroke: black;
stroke-width: 3px;
}
.ce-node text.ce-species {
font: 10px sans-serif;
pointer-events: none;
}
.ce-node text.complex {
font-weight: bold;
}
.ce-link {
fill: none;
stroke: #ccc;
stroke-width: 1.5px;
}
.ce-path-link {
stroke-dasharray: 5;
stroke-width: 3.5px;
stroke: #cc0000;
}
#ceLegend {
width: 100%;
padding-top: 3px;
}
.ce-legend-trees {
display: table;
table-layout: fixed;
width: 100%;
}
.ce-legend-trees-row {
display: table-row;
}
.ce-legend-tree-cell {
display: table-cell;
}
.ce-legend-tree-label {
text-align: center;
color: rgb(242, 243, 244);
font-weight: bold;
cursor: pointer;
}
.ce-legend-tree-label:first-child {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.ce-legend-tree-label:last-child {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
#ceOptionsExport {
width: 100%;
margin-top: 5px;
margin-bottom: 5px;
}
#ceSearchBarContainers{
position: absolute;
bottom: 0;
width: 100%;
margin-bottom: 3px;
/*margin-left: 5px;*/
/*margin-right: 5px;*/
}
.ce-search-bar-container {
margin-right: 3px;
}
.ce-search-bar-container.last {
margin-right: 0px;
}
.ce-search-bar-input-group .input-group-addon{
/*background: white !important;*/
background-color: rgba(160, 160, 160, 0.09);
}
.ce-search-bar-container .form-control{
box-shadow:0 0 0;
border-color:#ccc;
background-color: rgba(160, 160, 160, 0.09);
}
.ce-search-bar-container button{
border:0;
background:transparent;
position:absolute;
top:0;
width: 100%;
height: 100%;
}
/******************************************************************************
General
*******************************************************************************/
.ce-cursor-glass {
cursor: zoom-in;
}
.ce-hidden {
display:none;
}
.row.no-gutter {
margin-right:0;
margin-left:0;
}
.row.no-gutter > [class*='col-'] {
padding-right:0;
padding-left:0;
}
/******************************************************************************
Tooltips / on-demand menus
******************************************************************************/
#ceTooltip, #ceNodeMenu, #ceMenu {
position: absolute;
width: auto;
/*height: auto;*/
padding: 10px;
background-color: rgba(256, 256, 256, 0.8);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
z-index: 100;
font-size: 12px;
}
#ceTooltip {
pointer-events: none;
}
#ceNodeMenu div, #ceMenu div {
cursor: pointer;
}
#ceTooltip.hidden, #ceNodeMenu.hidden {
display: none;
}
.ce-tooltip-species {
text-align: center;
/*text-decoration: underline;*/
font-weight: bold;
margin-bottom: 3px;
}
.ce-tooltip-list-header {
font-weight: bold;
}
.ce-tooltip-bioentities {
margin-bottom: 5px;
}
.ce-tooltip-bioentity {
border-bottom-style: dotted;
border-bottom-width: 1px;
margin-left: 5px;
}
.ce-legend-box {
border-radius: 5px;
margin: 3px;
padding-left: 5px;
}
/******************************************************************************
Structure viewer
******************************************************************************/
#ceLitemolApp {
position: relative;
height: 100%;
float: left;
width: 80%;
/*border-width: 1px;*/
/*border-style: dotted;*/
/*order: 1px solid green;*/
/*margin: 0 0 0 302px;*/
}
.ce-structure-viewer {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color: white;
overflow-x: hidden;
transition: 0.5s;
/*padding-top: 60px;*/
/*overflow: auto;*/
}
.ce-structure-viewer .ce-records-list {
float: left;
width: 20%;
/*width: 300px;*/
height:100%;
overflow-y: auto;
/*border: 1px solid red;*/
}
.ce-structure-viewer .ce-closebtn {
position: absolute;
bottom: 0;
right: 20px;
font-size: 36px;
color: whitesmoke;
/*background-color: whitesmoke;*/
opacity: 0.7;
z-index:100;
/*margin-left: 50px;*/
}
.ce-structure-viewer .ce-pdb-record-info {
width:100%;
background-color: #000000;
opacity: 0.8;
color: #F8F8FF;
margin-bottom: 1px;
cursor: pointer;
}
.ce-pdb-record-info-attribute {
text-align: right;
}
.ce-pdb-record-info-value {
text-align: left;
}
.ce-pdb-record-info-link {
text-align: center;
font-weight: bold;
margin-bottom: 5px;
margin-top: 5px;
}
.ce-molecule-record {
border-left: 0;
}
.ce-molecule-record .panel-body {
padding: 0;
}
.ce-molecule-record .panel-group {
margin-bottom: 1px;
}
.ce-molecule-record .panel-heading {
font-weight: bold;
text-align: center;
cursor: pointer;
}
.ceceFullExpansionMaxCountGroup {
padding-bottom: 5px;
}
\ No newline at end of file
......@@ -103,6 +103,20 @@ to a specific position in the map - **localized exploration**.
![PRKN](img/prkn3.png)
#### Recursive exploration
Context menu (right click) of any node provides also access to the *recursive exploration*
functionality which allows to **recursively explore neighbors of a node**, i.e.
after generating nodes for all neighbors of the starting node, the procedure
repeats recursively for every of those neighbors. Since this can lead
to creation of thousands of nodes, which would significantly slow down the browser,
the procedure stops after retrieving given number of nodes. This threshold
can be set in the *Setttings* (see bellow). Please note, that **a web browser
can without problems handle only several thousands of elements** and thus setting
the value of this threshold to a value higher then about 10.000 (depending
on your hardware configuration) will probably have
a significant impact on the responsiveness of the whole application.
#### Spawning multiple trees
If at some point the user is interested what are neighbors of an encountered bioentity anywhere in the map,
......@@ -215,5 +229,8 @@ exploration. Changing this does not impact the existing exploration state.
Thus, for this change to take effect, one needs to restart the exploration (either by clicking
on the restart or *Explore** button).
- *Locate on expansion*: if checked, when a node is expanded, the newly shown nodes are located in the map.
- *Max. elements in full expansion*: when full expansion is selected from a node's context menu,
at most *Max. elements in full expansion* nodes will be retrieved and expansion will
be stopped after reaching this threshold
- *Backtrack depth*: If set, the backtracking procedure will go only given number of levels back.
- *Highlight by icon/surface*: sets the way of how encountered entities are highlighted in the map.
......@@ -255,4 +255,8 @@ Tooltips / on-demand menus
border-radius: 5px;
margin: 3px;
padding-left: 5px;
}
.ceFullExpansionMaxCountGroup {
padding-bottom: 5px;
}
\ No newline at end of file
......@@ -184,9 +184,9 @@ function initMainPageStructure() {
<input type="checkbox" id="ceLocateOnExpansion"> Locate on expansion
</label>
</div>
<div class="input-group ceceFullExpansionMaxCountGroup" title="Maximum number of nodes to be retrieved during full expension (please note that showing more than few thousand of nodes can cause significant slowdown of the broser).">
<div class="input-group ceFullExpansionMaxCountGroup" title="Maximum number of nodes to be retrieved during full expension (please note that showing more than few thousand of nodes can cause significant slowdown of the broser).">
<input type="number" name="ceFullExpansionMaxCount" class="form-control" min="1" value=${settings.maxFullExapnd}>
<span class="input-group-addon">Max. elements in full expansion</span>
<span class="input-group-addon">Max. elements in recursive exploration</span>
</div>
<div class="input-group">
<input type="number" id="ceBacktrackMaxDepth" class="form-control" min="1">
......@@ -1358,7 +1358,7 @@ function nodeClickRight(node) {
let parentG = this.parentNode;
let linkTexts = [];
const fullExpansionDef = [`FULL EXPANSION (${pluginContainer.find('input[name="ceFullExpansionMaxCount"]').val()} nodes limit)`, "full_exp"];
const fullExpansionDef = [`RECURSIVE EXPLORATION (${pluginContainer.find('input[name="ceFullExpansionMaxCount"]').val()} nodes limit)`, "full_exp"];
if (!isNotCompartmentNodeData(node.data)) {
linkTexts = [/*["EXPAND/COLAPSE", "exp"],*/ ["LOCATE SUBTREE", "locate_subtree"], fullExpansionDef];
}
......@@ -1676,7 +1676,6 @@ function getLeaves(node) {
function expandNodeFull(currentLeaves, ixRoot, newNodes ) {
let maxLeafs = pluginContainer.find('input[name="ceFullExpansionMaxCount"]').val();
newNodes = newNodes.concat(currentLeaves);
console.log(newNodes.length, maxLeafs)
if (newNodes.length < maxLeafs && currentLeaves.length > 0) {
const promises = currentLeaves.map(l => expandNode(l, ixRoot));
return Promise.all(promises).then(rvs => {
......
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