Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
@zheminzhou
zheminzhou committed Jul 10, 2017
1 parent 4f5a14c commit 52b6361
Show file tree
Hide file tree
Showing 2 changed files with 47 additions and 18 deletions.
63 changes: 46 additions & 17 deletions MSTree_holder.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@

<head>
<link rel="stylesheet" href='static/js/jquery-ui-1.11.4/jquery-ui.min.css'>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="static/css/bootstrap.min.css">
<style>
body{
width:100%;
Expand Down Expand Up @@ -135,17 +135,43 @@
.slick-row.even {
background: #ccffcc;
}
.slick-cell {
border-right: 1px solid silver;
}
.navbar-nav > li > a {
padding-top: 5px;
height: 30px;
}
.slick-column-name {
color: #505050;
}
.navbar {
min-height:30px;
margin-bottom:0px
}
.grid-canvas >.odd >.uneditable-cell {
background: #e5e5b7;
}
.grid-canvas >.even >.uneditable-cell {
background: #b7e5b7;
}

</style>
<div id = 'metadata-div' style='width:600px;height:600px;position:absolute;top:10%;left:50%;z-index:2;background-color:#f1f1f1;display:none'>
<div id='handler' style="background-color:#f1f1f1;width:100%;height:20px;border-radius:5px;border: 0px solid #b0f2f2;">
<span title='Close The Window' id = 'metadata-close' class='glyphicon glyphicon-remove show-tooltip'style='top:-6px;float:right;margin-right:10px'></span>
<span title='Download This Table' id = 'metadata-download' class='glyphicon glyphicon-download show-tooltip'></span>&nbsp;&nbsp;
<span title='Add A New Category' id="metadata-add-icon" class='glyphicon glyphicon-plus show-tooltip'></span>&nbsp;&nbsp;&nbsp;&nbsp;
<input type="checkBox" id="metadata-filter" checked><span title='Show Filtering Bar?' class='glyphicon glyphicon-filter show-tooltip'></span>&nbsp;&nbsp;&nbsp;&nbsp;
<input type="checkBox" id="hypo-filter" ><span title='Show hypothetical nodes?' class='glyphicon glyphicon-screenshot show-tooltip'></span>
<nav id="handler" class="navbar navbar-default ui-draggable-handle">
<div class="container-fluid" style="padding-right:10px;padding-left:10px">
<ul class="nav navbar-nav">
<li><a href="#"><span title="Download This Table" id="metadata-download" class="glyphicon glyphicon-download show-tooltip"><label style="font-family:Arial">Download</label></span></a></li>
<li><a href="#"><span title="Add A New Category" id="metadata-add-icon" class="glyphicon glyphicon-plus show-tooltip"><label style="font-family:Arial">Add Category</label></span></a></li>
<li><a href="#"><input type="checkBox" id="metadata-filter" checked=""><span title="Show Filtering Bar?" class="glyphicon glyphicon-filter show-tooltip"><label style="font-family:Arial">Filter</label></span></a></li>
<li><a href="#"><input type="checkBox" id="hypo-filter"><span title="Show hypothetical nodes?" class="glyphicon glyphicon-screenshot show-tooltip"><label style="font-family:Arial">Hypo nodes</label></span></a></li>
</ul>
<div style="margin-top:1px;float:right;margin-right:0px"><span class="help-icon glyphicon glyphicon-question-sign" style="margin-right:5px"></span>
<span title="Close The Window" id="metadata-close" class="glyphicon glyphicon-remove show-tooltip" style="float:right;top:2.5px"></span>
</div>
<div id="myGrid" style="width:100%;height:580px"></div>
</div>
</nav>
<div id="myGrid" style="width:100%;height:580px"></div>
<div title='replace all the cells in the selection' id='replace-div' style='height:30px;width:30px;background-color:#ffffff;z-index:3;opacity:0.8'>
<input id='replace-tag' style='height:100%;width:100%'>
<span title='Confirm' id='replace-confirm' class='glyphicon glyphicon-ok show-tooltip' style='top:0px;left:100%;float:right;position:absolute'></span>
Expand Down Expand Up @@ -330,10 +356,10 @@ <h3 id="headertag" style="font-family: times, serif; font-size:12pt; font-style:
<button id ="center-graph-button">Centre Tree</button>
<hr>
<p align = 'center'>
<div id="rotation-div"><label> Drag to Rotate:&nbsp;</label>
<div id="rotation-div"><label> Drag Icon to Rotate:&nbsp;</label>
<span id="rotation-icon" class="glyphicon glyphicon-refresh"></span>
</div>
<label>Zoom:&nbsp;</label>
<label>&nbsp;&nbsp;Zoom:&nbsp;</label>
<span onclick= "javascript:the_tree.setScale(1.1,true)" class=' zoom-icon glyphicon glyphicon-zoom-in'></span>
<span onclick= "javascript:the_tree.setScale(0.9,true)"class='zoom-icon glyphicon glyphicon-zoom-out'></span>
</p>
Expand Down Expand Up @@ -534,7 +560,7 @@ <h3 id="headertag" style="font-family: times, serif; font-size:12pt; font-style:
}
var var1 = parseInt("{{dhdhdhdh}}");
var all_files=null;
var metatdata_file_name;
var metadata_file_name;
var waiting_spinner= null;
var waitingDialog = null;
var the_tree = null;
Expand Down Expand Up @@ -638,7 +664,7 @@ <h3 id="headertag" style="font-family: times, serif; font-size:12pt; font-style:
tooltip_div.html(msg)
.style("left", (e.pageX) + "px")
.style("top", (e.pageY - 28) + "px");
setTimeout(hideToolTip, 2500);
setTimeout(hideToolTip, 2000);
}

function hideToolTip(){
Expand Down Expand Up @@ -891,6 +917,7 @@ <h3 id="headertag" style="font-family: times, serif; font-size:12pt; font-style:
$("#metadata-select").val(data['initial_category']);
}
if (data['layout_data'] && data['layout_data']['nodes_links']){
if ( ! data['layout_data']['nodes_links']["node_collapsed_value"] ) data['layout_data']['nodes_links']["node_collapsed_value"] = 0.0;
setControlPanel(data['layout_data']['nodes_links'])
}
else{
Expand All @@ -901,7 +928,8 @@ <h3 id="headertag" style="font-family: times, serif; font-size:12pt; font-style:
} else {
updateMetadataTable();
}
$("#rotation-div").draggable({

$("#rotation-icon").draggable({
start: function(e) {
the_tree._dragStarted(the_tree.force_nodes[0], [$("#rotation-icon").position().left, $("#rotation-icon").position().top]);
},
Expand All @@ -913,9 +941,8 @@ <h3 id="headertag" style="font-family: times, serif; font-size:12pt; font-style:
},
revert: true,
revertDuration: 10,
helper: function() {return $("<div><label id='angle-text'></label></div>")},
});
$("#rotation-div").bind("drag", function(event, ui) {
helper: function() {return $("<div></div>")},
}).bind("drag", function(event, ui) {
var x_dif = ui.helper.position().left - $("#rotation-icon").position().left;
var y_dif = $("#rotation-icon").position().top - ui.helper.position().top;
var angle = y_dif !== 0 ? Math.atan(x_dif/y_dif)/Math.PI * 180 : (x_dif === 0 ? 0 : (x_dif > 0 ? 90 : -90));
Expand All @@ -924,7 +951,7 @@ <h3 id="headertag" style="font-family: times, serif; font-size:12pt; font-style:
} else if (x_dif < 0) {
angle = 360 + angle;
}
ui.helper.select('.angle-text').text(Math.round(angle) + '\xB0') ;
ui.helper.text(Math.round(angle) + '\xB0') ;
});

/* }catch(e){
Expand Down Expand Up @@ -1265,6 +1292,7 @@ <h3 id="headertag" style="font-family: times, serif; font-size:12pt; font-style:
});
$(window).trigger("resize");


$("#mst-download-svg").click(function(e){
var svg = the_tree.getSVG();
saveTextAsFile(svg,"MSTree.svg");
Expand Down Expand Up @@ -1491,6 +1519,7 @@ <h3 id="headertag" style="font-family: times, serif; font-size:12pt; font-style:
});
$( "#spinner-collapse-nodes" ).on("change", function(e) {
var v = parseFloat($(this).spinner('value'));
if( isNaN(v)) { v = 0.0 ; }
$("#slider-collapse-nodes").slider('value', Math.log(v)*1000);
the_tree.collapseNodes(v);
})
Expand Down
2 changes: 1 addition & 1 deletion static/js/tree/base_tree.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1030,7 +1030,7 @@ D3BaseTree.prototype._changeCategory=function(category){
var colour_count=0;
this.category_colours={};
for (var key in this.metadata){
if (this.node_map[key]) {
if (this.node_map[this.metadata[key].ID]) {
var val = this.metadata[key][category];
if (!val && val !==0){
continue;
Expand Down

0 comments on commit 52b6361

Please sign in to comment.