Commit c0614540 authored by Martin Kuban's avatar Martin Kuban Committed by Markus Scheidgen
Browse files

gui update for correct display of most similar materials

parent cde0f4e0
This diff is collapsed.
...@@ -914,6 +914,14 @@ navTreeWrapper ...@@ -914,6 +914,14 @@ navTreeWrapper
background-color: white; z-index: 10; background-color: white; z-index: 10;
} }
.similar-materials-panel-unfolded{
text-align: left;
border: 1px solid #DDD;
padding: 10px 12px;
border-radius: 4px;
position: absolute; top:0; left:0;
background-color: white; z-index: 10;
}
.view-reset-tooltip{ .view-reset-tooltip{
position:absolute; position:absolute;
display: none; display: none;
......
...@@ -153,22 +153,20 @@ class Overview { ...@@ -153,22 +153,20 @@ class Overview {
</div> </div>
</div> </div>
<div style="clear: both;"></div>
<div style="float: left; width: 60%; " class="similarity-finder">
</div>
<div style="clear: both;"></div> <div style="clear: both;"></div>
<div class="spin-legend" style="font-size: 0.9em; padding: 6px 30px 10px; display: none"> <div class="spin-legend" style="font-size: 0.9em; padding: 6px 30px 10px; display: block">
<svg width="15px" height="10px"> <polyline points="0,5 15,5" class="plotSpin1"/></svg> <svg width="15px" height="10px"> <polyline points="0,5 15,5" class="plotSpin1"/></svg>
Spin <span style='font-size: 1.1em'>⇧</span> &nbsp;&nbsp;&nbsp; Spin <span style='font-size: 1.1em'>⇧</span> &nbsp;&nbsp;&nbsp;
<svg width="15px" height="10px"> <polyline points="0,5 15,5" class="plotSpin2"/></svg> <svg width="15px" height="10px"> <polyline points="0,5 15,5" class="plotSpin2"/></svg>
Spin <span style='font-size: 1.1em'>⇩</span> Spin <span style='font-size: 1.1em'>⇩</span>
<div style="float: right; width: 60%; " class="similarity-finder">
<div style="clear: both;"></div>
</div>
</div> </div>
</div> </div>
<!-- <!--
<div class="footer"> <div class="footer">
......
...@@ -9,7 +9,7 @@ class SimilarityFinder { ...@@ -9,7 +9,7 @@ class SimilarityFinder {
this.element.innerHTML+=` this.element.innerHTML+=`
<div > <div >
<span style=" vertical-align: 30%; ">Similar materials</span> <span style=" vertical-align: 30%;" info-sys-data="space-group">Similar materials</span>
<img style="cursor: pointer" src="${util.IMAGE_DIR}folded.png" /> <img style="cursor: pointer" src="${util.IMAGE_DIR}folded.png" />
</div> </div>
...@@ -61,20 +61,26 @@ class SimilarityFinder { ...@@ -61,20 +61,26 @@ class SimilarityFinder {
} }
}) })
const container = document.createElement('div') const slicedData = dataAsArray.slice(0,5)
container.class='vr-download-panel-unfolded'
container.style='width: 210px;' const container = document.createElement('table')
container.setAttribute('class','similar-materials-panel-unfolded')
container.style='width: 250px;'
this.foldingPanel.appendChild(container) this.foldingPanel.appendChild(container)
const sim_table_header = document.createElement('tr')
sim_table_header.style = "padding: 5px; "
sim_table_header.innerHTML = `<th style = "text-align: left;">Formula (Space group)</th><th>:</th><th style = "text-align: left;">Tc</th>`
container.appendChild(sim_table_header)
dataAsArray.forEach(function(item) { slicedData.forEach(function(item) {
const material_id = item.key.split(':')[0] const material_id = item.key.split(':')[0]
const element = document.createElement('div') const element = document.createElement('tr')
element.style = "padding: 5px; " element.style = "padding: 5px; "
const url = `${window.location.toString().replace(/#.*$/, "")}#/material/${material_id}` const url = `${window.location.toString().replace(/#.*$/, "")}#/material/${material_id}`
console.log(url) element.innerHTML = `<td><a href="${url}" target="_${material_id}">${item.data.formula} (${item.data.space_group_number})</a></td><td>:</td> <td>${item.data.Tc.toPrecision(3)}</td>`
element.innerHTML = `<a href="${url}" target="_${material_id}">${item.data.formula}(${item.data.space_group_number}): ${item.data.Tc}</a>`
container.appendChild(element) container.appendChild(element)
}) })
} }
} // class DropDown } // class DropDown
......
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