Add the NOT operator functionality to the search box component and implement...

Add the NOT operator functionality to the search box component and implement its mapping (in certain cases) to optimade query

client/src/search-mod/NewSearchMod.js

@@ -82,7 +82,7 @@ class NewSearchMod {
           </div>
           <div class="bool-buttons" style="width: 28%; display: inline-block" >
             OR <span id="and-or-switch" ></span> AND
-            <button >NOT</button>
+            <button class="not-button">NOT</button>
             <button class="open-parentheses" >(</button>
             <button class="close-parentheses">)</button>
             <!--<input type="checkbox" name="and-or" class="not-symbol-btn" />NOT-->
@@ -148,6 +148,11 @@ class NewSearchMod {
       this.searchBox.setBoolOperator( e ? 'AND' : 'OR');
     });
 
+    this.notButton = this.element.querySelector('.not-button');
+    this.notButton.addEventListener( 'click', e => {
+      this.searchBox.addNOT();
+    });
+
     this.openParenthButton = this.element.querySelector('.open-parentheses');
     this.closeParenthButton = this.element.querySelector('.close-parentheses');
     this.openParenthButton.addEventListener( 'click', e => {

client/src/search-mod/SearchBox.view.js

@@ -121,7 +121,7 @@ class SearchBox{
           
           subquery.forEach( (item, i) => { // For every item in the subquery
             if ( isElement(item) ){
-              optimadeQuery += ` elements HAS "${item}"`
+              optimadeQuery += `elements HAS "${item}"`
 
             }else if ( item === 'AND' ||  item === 'NOT'){
               optimadeQuery += ' '+item+' ';
@@ -132,8 +132,8 @@ class SearchBox{
             }
           });
 
-        }else{ // Exclusive search
-          
+        }else{ // Exclusive search. For now only one formula or elements subqueries supported. Operator NOT doesn't make sense here
+
           if (subquery.length === 1 && !isElement(subquery[0])){  // Only one formula
             optimadeQuery += `formula="${subquery[0]}"`;
 
@@ -155,7 +155,7 @@ class SearchBox{
       }
 
 
-      function getOptimadeExclusiveANDSubquery(subquery){ // this subquery is supposed to be form only for elements
+      function getOptimadeExclusiveANDSubquery(subquery){ // this subquery is supposed to be form only for elements and ANDs separating
         let optSubquery = 'elements HAS ONLY ';
         subquery.forEach( (item) => {
           if (isElement(item)){//item !== 'AND'){ // check if element isntead ? 
@@ -174,9 +174,10 @@ class SearchBox{
     function isQueryWellFormed(searchQuery){
       const openingParIndex = searchQuery.indexOf('(')
       const closingParIndex = searchQuery.indexOf(')')
-      return (openingParIndex < 0) || // there are no paratheses or
+      return searchQuery[searchQuery.length-1] !== 'NOT' && 
+        ((openingParIndex < 0) || // there are no paratheses or
         // they are in right position
-        (openingParIndex >= 0 && openingParIndex < closingParIndex+1)      
+        (openingParIndex >= 0 && openingParIndex < closingParIndex+1)) 
     }
   }
 
@@ -213,7 +214,8 @@ class SearchBox{
     if (type === 'E' && this.searchQuery.indexOf(tag) >= 0) return;
 
     if ( this.searchQuery.length > 0
-          && this.searchQuery[this.searchQuery.length-1] !== '(')
+          && this.searchQuery[this.searchQuery.length-1] !== '('
+          && this.searchQuery[this.searchQuery.length-1] !== 'NOT' )
       this.addItemInSearchQuery(this.currentOperator, 'S');
     this.addItemInSearchQuery(tag, type);
     this.updateSearchQuery();
@@ -238,22 +240,50 @@ class SearchBox{
   }
 
 
+  addNOT(){
+
+    if ( this.searchQuery.length > 0)
+      this.addItemInSearchQuery(this.currentOperator, 'S');
+    this.addItemInSearchQuery( 'NOT', 'S');
+    this.updateSearchQuery();
+  }
+
+
   removeElementORFormulaInSearchQuery(item){
     //console.log(" removeElementORFormulaInSearchQuery item: ",item, this.searchQuery.indexOf(item));
-    let isMaterialName = (this.queryTypes[0] === 'MN');
-    // Travese the array removing the item and the bool operator related
+    
+    // NOT being used  let isMaterialName = (this.queryTypes[0] === 'MN');
+     
+    // spot the item and remove the item and the bool operator(s) related
     let itemIndex = this.searchQuery.indexOf(item);
     if (itemIndex >= 0){
       let i, elementsToRemove;
-      if (this.queryTypes[itemIndex+1] === 'S'){ // bool operator on the left
-        i = itemIndex; elementsToRemove = 2;
-      }else if (this.queryTypes[itemIndex-1] === 'S'){ // bool operator on the right
-        i = itemIndex-1; elementsToRemove = 2;
+      /*
+      if (this.queryTypes[itemIndex+1] === 'S'){ // bool operator on the right
+        console.log('itemIndex', itemIndex, this.searchQuery[itemIndex+1])
+        if (this.searchQuery[itemIndex-1] === 'NOT'){
+           i = itemIndex-1; elementsToRemove = 3;
+        }else{  i = itemIndex; elementsToRemove = 2; }
+
+      }else*/
+      if (this.queryTypes[itemIndex-1] === 'S'){ // bool operator on the left
+        // console.log('itemIndex', itemIndex, this.searchQuery[itemIndex-1])
+        if (this.searchQuery[itemIndex-1] === 'NOT'){
+          i = itemIndex-2; elementsToRemove = 3;
+        }else{ i = itemIndex-1; elementsToRemove = 2; }
+        
       }else{ // case: (item)
         i = itemIndex; elementsToRemove = 1;
       }
-      this.searchQuery.splice(i, elementsToRemove);
-      this.queryTypes.splice(i, elementsToRemove);
+      
+      removeItemsFromSearchQuery(this, i, elementsToRemove); 
+    }
+
+    // Remove the symbols before the first element/formula
+    if (this.queryTypes[0] === 'S') { // AND , OR
+      let elementsToRemove = 1;
+      if (this.queryTypes[1] === 'S') elementsToRemove = 2; // NOT
+      removeItemsFromSearchQuery(this, 0, elementsToRemove);
     }
 
     // Travese the array removing the unnecessary parethesis (only tested for one level nested)
@@ -262,8 +292,7 @@ class SearchBox{
       for (let i = 0; i < this.searchQuery.length; i++) { // dangerous: modifing a array being traversed
         if ( this.searchQuery[i] === '(' ){
           if ( this.searchQuery[i+1] === ')'){ // '()' case
-            this.searchQuery.splice(i, 2);
-            this.queryTypes.splice(i, 2);
+            removeItemsFromSearchQuery(this, i, 2);// this.searchQuery.splice(i, 2);   this.queryTypes.splice(i, 2);
           }else if (this.searchQuery[i+2] === ')'){ // '(item)' case
             this.searchQuery.splice(i, 3, this.searchQuery[i+1]);
             this.queryTypes.splice(i, 3, this.queryTypes[i+1]);
@@ -283,6 +312,12 @@ class SearchBox{
     }
 
     return true;
+
+
+    function removeItemsFromSearchQuery(self, start, delCount){
+      self.searchQuery.splice(start, delCount);
+      self.queryTypes.splice(start, delCount);
+    }
   }