Commit 65c9c46d authored by Iker Hurtado's avatar Iker Hurtado
Browse files

Several UI improvements

- Results list should be as wide as the periodic table
- Space group field with dropdown to simple field (name: “Space group number”)
- Disable complex search buttons for "material name" search
parent a595f6a5
Pipeline #93797 skipped with stage
......@@ -579,12 +579,6 @@ div.title span.unfolded::before{
/* Structure type autocomplete */
.structure_type-autocomplete-multiselect-textfield input[type="text"]{
padding: 6px;
border: 1px solid #DDD;
width: 200px;
}
.structure_type-autocomplete-multiselect-dropdown{
width: 210px;
background-color: white;
......@@ -618,6 +612,11 @@ div.title span.unfolded::before{
margin-bottom: 30px;
/*background-color: white;*/
}
.filter-section-box input[type="text"]{
width: 200px;
padding: 6px;
border: 1px solid #DDD;
}
.filter-section-title{
color: white; padding: 10px 0;
......@@ -832,7 +831,7 @@ div#specialRows{margin: 30px 40px;}
.MaterialList{ width: 690px; margin: 0 auto 80px;}
.MaterialList{ /*width: 690px; margin: 0 auto 80px;*/}
/* #paginationWg erased*/
.MaterialList .formula {
......@@ -855,7 +854,7 @@ span.nextButton{ display: inline-block; cursor: pointer;}
.mat-list-container table{
margin: auto;
width: 96%;
width: 100%;/*width: 96%;*/
}
......@@ -871,7 +870,6 @@ span.nextButton{ display: inline-block; cursor: pointer;}
}
navTreeWrapper
.node-selected{
font-weight: bold;
......
......@@ -64,9 +64,16 @@ class FilterPanel {
structureGroupBox.append(crystalSystemField.element);
/* Old version
const spaceGroupField = new SpaceGroupField();
this.fields.push(spaceGroupField)
structureGroupBox.append(spaceGroupField.element);
*/
const spaceGroupField = new TextField('Space group number', 'space_group_number');
this.fields.push(spaceGroupField)
structureGroupBox.append(spaceGroupField.element);
const structureTypeField = new AutocompleteField('Structure type', 'structure_type');
this.fields.push(structureTypeField)
......@@ -230,8 +237,35 @@ class CheckboxesField{
}
/* Temporarily the select field is disabled
so that the only option to look for is "by number" */
class TextField{
constructor(name, id){
this.fieldId = id;
this.element = document.createElement('div');
this.element.className = 'filter-quantity-box';
this.element.innerHTML = `
<div class="field-title"> <span info-sys-data="${id}">${name}</span></div>
<input type="text" class="${id}-textfield" style="">
`;
this.input = this.element.querySelector('input');
}
getValues(){
let value = this.input.value;
return ( value.trim() === '' ? null : { fieldId: this.fieldId, value: [value] } );
}
highlightSelected(bool){
if (this.getValues() === null)
this.input.style.opacity = (bool ? NOT_SELECTED_OPACITY : '');
}
}
/* Not being used temporarily -> simple textfield instead
class SpaceGroupField{
constructor(){
......@@ -267,7 +301,7 @@ class SpaceGroupField{
}
}
}
}*/
class AutocompleteField{
......@@ -303,6 +337,7 @@ class AutocompleteField{
}
/* Not being used
class MassDensityField{
constructor(){
......@@ -337,7 +372,7 @@ class MassDensityField{
if (this.getValues() === null)
this.inputs[0].parentElement.style.opacity = (bool ? NOT_SELECTED_OPACITY : '')
}
}
} */
// EXPORTS
module.exports = FilterPanel;
......
......@@ -183,7 +183,9 @@ class NewSearchMod {
this.addMatNameButton.disabled = true; // Not always necessary but it simplifies the code
this.addFormulaButton.disabled = true;
});
this.elementTable.setDeselectListener(e => this.searchBox.removeElementORFormulaInSearchQuery(e));
this.elementTable.setDeselectListener(e => {
this.searchBox.removeElementORFormulaInSearchQuery(e)
});
this.formulaBox = new FormulaBox();
......@@ -315,6 +317,10 @@ class NewSearchMod {
this.currentTab = selectingTab;
// Disable/enable bool operation buttons
this.element.querySelectorAll('.bool-buttons button').forEach( button => {
button.disabled = (selectingTab === 'name');
});
/*
if (this.userGuidance){
if (selectingTab === 'element'){
......
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