setup for features, fixing broken link for search

ncats · Aug 9, 2024 · e7bc486 · e7bc486
1 parent e6cb01a
commit e7bc486
Show file tree

Hide file tree

Showing 11 changed files with 77 additions and 41 deletions.
diff --git a/src/app/core/app-routing.module.ts b/src/app/core/app-routing.module.ts
@@ -126,7 +126,11 @@ const childRoutes: Routes = [
   {
     path: 'user-downloads/:id',
     component: UserDownloadsComponent
-  }
+  },
+  {
+    path: 'structure-features',
+    component: SubstanceFormComponent
+  },
 ];
 
 const routes: Routes = [

diff --git a/src/app/core/structure-editor/structure-editor.component.ts b/src/app/core/structure-editor/structure-editor.component.ts
@@ -135,7 +135,6 @@ export class StructureEditorComponent implements OnInit, AfterViewInit, OnDestro
 
 // override JSDraw for Molvec paste event. Using the JSDraw menu copy function seems to ignore this at first
   checkPaste = (event: ClipboardEvent ) => {
-    console.log('check paste');
     if ((this.jsdraw || this.ketcher )&& this.getSketcher().activated) {
      event.preventDefault();
     event.stopPropagation();
@@ -385,6 +384,10 @@ export class StructureEditorComponent implements OnInit, AfterViewInit, OnDestro
   }
 
   onDropHandler(object: any): void {
+    //rule out tiny icons / images accidentally being dragged from jsdraw UI
+    if(object.backup.size < 700) {
+      this.canvasMessage = 'The selected file is too small to be read (<700 bytes)';
+    }
     if (object.invalidFlag) {
       this.canvasMessage = 'The selected file could not be read';
     } else {
@@ -397,11 +400,8 @@ export class StructureEditorComponent implements OnInit, AfterViewInit, OnDestro
   sendToMolvec(img: string) {
     this.canvasMessage = '';
     this.loadingService.setLoading(true);
-    console.log('sending to molvec');
-    console.log(img);
     this.structureService.molvec(img).subscribe(response => {
       const mol = response.molfile;
-      console.log(response);
       if (this.ketcher && this.structureEditor === 'ketcher') {
         this.ketcher.setMolecule(mol);
           setTimeout(() => {
@@ -422,7 +422,6 @@ export class StructureEditorComponent implements OnInit, AfterViewInit, OnDestro
 
       }
       else {
-        console.log('not ketcher');
         this.jsdraw.setMolfile(mol);
         this.loadingService.setLoading(false);
         this.loadedMolfile.emit(mol);
@@ -490,7 +489,6 @@ export class StructureEditorComponent implements OnInit, AfterViewInit, OnDestro
       } else if (items[i].type === 'text/plain') {
         const text = event.clipboardData.getData('text/plain');
         if (text.indexOf('<div') === -1) {
-          console.log('plaintext'); 
           event.preventDefault();
           event.stopPropagation();
           this.canvasMessage = '';

diff --git a/src/app/core/structure/structure-post-response.model.ts b/src/app/core/structure/structure-post-response.model.ts
@@ -8,7 +8,7 @@ export interface InterpretStructureResponse {
     structure: SubstanceStructure;
     moieties: Array<SubstanceMoiety>;
     structuralUnits: Array<StructuralUnit>;
-    featureList?: Array<any>;
+    featureList?: any;
 }
 
 export interface ResolverResponse {

diff --git a/src/app/core/structure/structure.service.ts b/src/app/core/structure/structure.service.ts
@@ -91,7 +91,7 @@ export class StructureService {
   }
 
   interpretStructure(mol: string, mode?: string, standardize?: string ): Observable<InterpretStructureResponse> {
-    const url = `${this.configService.configData.apiBaseUrl}api/v1/substances/interpretStructure?mode=${mode ? mode:''}&standardize=${(standardize ? standardize:'')}`;
+    const url = `${this.configService.configData.apiBaseUrl}api/v1/substances/interpretStructure?mode=${mode ? mode:''}&standardize=${(standardize ? standardize:'')}&appendNNOFeatures=true`;
     return this.http.post<InterpretStructureResponse>(url, mol);
   }
 

diff --git a/src/app/core/substance-form/structure/substance-form-structure-card.component.html b/src/app/core/substance-form/structure/substance-form-structure-card.component.html
@@ -1,5 +1,8 @@
 <div>
   <div>
+    <div *ngIf = "featuresOnly">
+      <h4>Draw or import a structure using Ketcher. Then, if any features are detected a table will be automatically displayed under the editor.</h4>
+    </div>
     <div>
       <app-structure-editor (loadedMolfile)="molvecUpdate($event)" (editorOnLoad)="editorOnLoad($event)" (editorSwitched) = "changeEditor($event)" style="z-index: 9999">
       </app-structure-editor>
@@ -8,13 +11,13 @@
       {{userMessage}}
     </div>
   </div>
-  <div class="button-row feature-table" *ngIf = "enableStructureFeatures && features && features.length > 0" >
-   <div class = "feature-expansion">
+  <div class="button-row feature-table" *ngIf = "enableStructureFeatures && !hideFeaturesTable" >
+   <div class = "feature-expansion" *ngFor = "let feats of features">
     <mat-expansion-panel expanded="true" >
       <mat-expansion-panel-header>
-        <mat-panel-title> Structure Features </mat-panel-title>
+        <mat-panel-title> {{feats.label}} </mat-panel-title>
       </mat-expansion-panel-header>
-      <table class = "full-width" mat-table [dataSource]="sortedFeatures">
+      <table class = "full-width" mat-table [dataSource] = "feats.features">
         <ng-container matColumnDef="key">
           <th mat-header-cell  *matHeaderCellDef>Feature</th>
           <td mat-cell *matCellDef="let element" >{{element.key}}</td>

diff --git a/src/app/core/substance-form/structure/substance-form-structure-card.component.ts b/src/app/core/substance-form/structure/substance-form-structure-card.component.ts
@@ -44,6 +44,8 @@ export class SubstanceFormStructureCardComponent extends SubstanceFormBase imple
   enableStructureFeatures = true;
   sortedFeatures = new MatTableDataSource();
   displayedColumns = ['key', 'value'];
+  featuresOnly = false;
+  hideFeaturesTable = false;
   @ViewChild(StructureEditorComponent) structureEditorComponent!: StructureEditorComponent;
 
   constructor(
@@ -64,6 +66,9 @@ export class SubstanceFormStructureCardComponent extends SubstanceFormBase imple
   }
 
   ngOnInit() {
+    if(this.activatedRoute.snapshot.routeConfig.path === 'structure-features') {
+      this.featuresOnly = true;
+    }
     this.overlayContainer = this.overlayContainerService.getContainerElement();
     const definitionSubscription = this.substanceFormService.definition.subscribe(def => {
       this.substanceType = def.substanceClass;
@@ -165,35 +170,58 @@ export class SubstanceFormStructureCardComponent extends SubstanceFormBase imple
         this.processStructurePostResponse(response);
         this.structure.molfile = molfile;
         this.smiles = response.structure.smiles;
+
       });
     }
   }
 
   processStructurePostResponse(structurePostResponse?: InterpretStructureResponse): void {
     if (structurePostResponse && structurePostResponse.structure) {
-      if (structurePostResponse.featureList && structurePostResponse.featureList.length > 0) {
-        let temp = [];
-        Object.keys(structurePostResponse.featureList[0]).forEach(key => {
-          let label = key;
-          if(key === 'categoryScore'){
-            label = 'Category Score';
-          }
-          if(key === 'sumOfScores'){
-            label = 'Sum Of Scores';
+      let customSort = (array: any[]): any[] => {
+        return array.sort((a, b) => {
+          if (a.key === 'Category Score') return -1;
+          if (b.key === 'Category Score') return 1;
+          if (a.key === 'Sum Of Scores') return a.key === 'Category Score' ? 1 : -1;
+          if (b.key === 'Sum Of Scores') return b.key === 'Category Score' ? -1 : 1;
+          return a.key.localeCompare(b.key);
+        });
+      };
+
+      if (structurePostResponse.featureList) {
+        this.hideFeaturesTable = false;
+        let tempArr = [];
+        let emptyFeatures = true;
+        if (JSON. stringify(structurePostResponse.featureList) !== '{}'){
+
+        Object.keys(structurePostResponse.featureList).forEach(type => {
+          let tempObj = {'label':null, 'features': null};
+
+          tempObj.label = (type.charAt(0).toUpperCase() + type.slice(1)).replace(/([A-Z])/g, ' $1').trim();
+          let temp = [];
+
+          if(structurePostResponse.featureList[type].length > 0) {
+            emptyFeatures = false;
+            Object.keys(structurePostResponse.featureList[type][0]).forEach(key => {
+              let label = key;
+              if(key === 'categoryScore'){
+                label = 'Category Score';
+              }
+              if(key === 'sumOfScores'){
+                label = 'Sum Of Scores';
+              }
+              temp.push({'key': label,'value': structurePostResponse.featureList[type][0][key] });
+            });
           }
-          temp.push({'key': label,'value': structurePostResponse.featureList[0][key] });
+          tempObj.features = new MatTableDataSource(customSort(temp));
+          tempArr.push(tempObj);
         });
-        let customSort = (array: any[]): any[] => {
-          return array.sort((a, b) => {
-            if (a.key === 'Category Score') return -1;
-            if (b.key === 'Category Score') return 1;
-            if (a.key === 'Sum Of Scores') return a.key === 'Category Score' ? 1 : -1;
-            if (b.key === 'Sum Of Scores') return b.key === 'Category Score' ? -1 : 1;
-            return a.key.localeCompare(b.key);
-          });
-        };
-        this.features = customSort(temp);
-        this.sortedFeatures = new MatTableDataSource(this.features);
+        this.features = tempArr;
+        if (emptyFeatures) {
+          this.hideFeaturesTable = true;
+        }
+      } else {
+        this.hideFeaturesTable = true;
+      }
       } 
 
       // we should only be dealing with this stuff if the total hash changes
@@ -332,14 +360,13 @@ export class SubstanceFormStructureCardComponent extends SubstanceFormBase imple
     this.loadingService.setLoading(true);
 
     this.structureService.interpretStructure(this.structure.molfile).subscribe(response => {
-
+      this.loadingService.setLoading(false);
       const navigationExtras: NavigationExtras = {
         queryParams: {
           structure: response.structure.id
         }
       };
       if (this.configService.configData && this.configService.configData.gsrsHomeBaseUrl) {
-        console.log(this.configService.configData.gsrsHomeBaseUrl);
         let url = this.configService.configData.gsrsHomeBaseUrl + '/structure-search?structure=' + response.structure.id;
         window.open(url, '_blank');
       } else {
@@ -350,7 +377,6 @@ export class SubstanceFormStructureCardComponent extends SubstanceFormBase imple
         queryParamsHandling: 'merge',
         preserveFragment: true
       });
-      console.log(urlTree);
       window.open(urlTree.toString(), '_blank');
     }, error => {
       this.loadingService.setLoading(false);

diff --git a/src/app/core/substance-form/substance-form.component.html b/src/app/core/substance-form/substance-form.component.html
@@ -3,7 +3,8 @@
   <span class="close-out" (click)="showHidePopup()">x</span>
   <img (click)="showHidePopup()" class = "image-popped-up" appSubstanceImage [entityId]="unit && (unit.uuid || (unit._structure && unit._structure.id))">
 </div>
-<div class="top-fixed">
+
+<div class="top-fixed" *ngIf = "!featuresOnly">
   <div class="actions-container">
       <button mat-flat-button color="primary" (click)="saveDraft()">Save Draft</button>
       <button mat-flat-button color="primary" class="draft-button" (click)="showDrafts()">Show Drafts <span class="chip">{{draftCount}}</span></button>

diff --git a/src/app/core/substance-form/substance-form.component.ts b/src/app/core/substance-form/substance-form.component.ts
@@ -103,6 +103,7 @@ export class SubstanceFormComponent implements OnInit, AfterViewInit, OnDestroy
     approvalType = 'lastEditedBy';
     previousState: number;
     useApprovalAPI = false;
+    featuresOnly = false;
 
   constructor(
     private activatedRoute: ActivatedRoute,
@@ -280,6 +281,9 @@ export class SubstanceFormComponent implements OnInit, AfterViewInit, OnDestroy
 
 
   ngOnInit() {
+    if(this.activatedRoute.snapshot.routeConfig.path === 'structure-features') {
+      this.featuresOnly = true;
+    }
     this.loadingService.setLoading(true);
     if (this.configService.configData && this.configService.configData.approvalType) {
       this.approvalType = this.configService.configData.approvalType;
@@ -523,6 +527,9 @@ getDrafts() {
                   }
                 }
               }
+              if (this.featuresOnly && this.formSections[index].dynamicComponentName !== 'substance-form-structure') {
+                this.formSections[index].isHidden = true;
+              }
             setTimeout(() => {
               this.loadingService.setLoading(false);
               this.UNII = this.substanceFormService.getUNII();

diff --git a/src/app/core/substance-form/substance-form.service.ts b/src/app/core/substance-form/substance-form.service.ts
@@ -1617,7 +1617,6 @@ export class SubstanceFormService implements OnDestroy {
     return new Observable(observer => {
 
     this.adminService.updateStagingArea(id, substanceCopy).subscribe(response => {
-      console.log(response);
         observer.next(response);
           observer.complete();
       }, error => {

diff --git a/...owse/export-dialog/custom-multi-checkbox-widget/custom-multi-checkbox-widget.component.ts b/...owse/export-dialog/custom-multi-checkbox-widget/custom-multi-checkbox-widget.component.ts
@@ -24,7 +24,6 @@ export class CustomMultiCheckboxWidgetComponent  extends CheckboxWidget implemen
 
 
     this.cvService.fetchFullVocabulary(this.schema.CVDomain).subscribe(response => {
-      console.log(response);
       if (response.content && response.content.length > 0) {
         this.options = response.content[0].terms;
       }

diff --git a/...re/substances-browse/export-dialog/custom-select-widget/custom-select-widget.component.ts b/...re/substances-browse/export-dialog/custom-select-widget/custom-select-widget.component.ts
@@ -24,7 +24,6 @@ export class CustomSelectWidgetComponent extends SelectWidget implements OnInit
 
 
     this.cvService.fetchFullVocabulary(this.schema.CVDomain).subscribe(response => {
-      console.log(response);
       if (response.content && response.content.length > 0) {
         this.options = response.content[0].terms;
       }