Skip to content

Commit

Permalink
Fix academic citation, improve similarity-sort toasts
Browse files Browse the repository at this point in the history
  • Loading branch information
KastanDay committed Jul 8, 2024
2 parents be807b6 + 2f6f84e commit 532c7c3
Show file tree
Hide file tree
Showing 6 changed files with 36 additions and 48 deletions.
2 changes: 1 addition & 1 deletion src/app/api/mmli-backend/v1/model/molecule.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@
export interface Molecule {
id: number;
flagged: boolean;
atom_count: number;
doc_no: string;
atom_count: number;
file_path: string;
page_no: string;
name?: string;
Expand Down
6 changes: 3 additions & 3 deletions src/app/app.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ <h3>Welcome to our initial release</h3>
</header>

<div class="page_container tool_header">
<p-toast position="bottom-center" style="word-break: break-all;" life="15000"></p-toast>
<p-toast position="bottom-center" [ngStyle]="{'word-break': 'break-word'}" life="15000"></p-toast>

<div class="container">
<div class="clean_logo">ChemScraper</div>
Expand Down Expand Up @@ -118,8 +118,8 @@ <h3>Welcome to our initial release</h3>
prediction using contrastive learning. Science. (2023)</u></a></p> -->
<p><span class="bolded">Cite As: </span> <a href="https://arxiv.org/abs/2311.12161" target="_blank"><u>
Shah A. K., Amador B. M., Dey A., Creekmore M., Ocampo B., Denmark S., and Zanibbi R.
ChemScraper: Graphics Extraction,
Molecular Diagram Parsing, and Annotated Data Generation for PDF Images (2023)</u></a></p>
ChemScraper: Leveraging PDF Graphics Instructions for Molecular Diagram Parsing (2024)</u></a>
</p>
</div>
</div>
</cite>
Expand Down
8 changes: 4 additions & 4 deletions src/app/chemscraper.service.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ export class ChemScraperService {

private jobsService: JobsService,
private filesService: FilesService,
private chemscraperService: ChemScraperApiService
public chemscraperService: ChemScraperApiService
) { }

getExampleResponse(dataLabel: string): Observable<PostResponse> {
Expand All @@ -47,9 +47,9 @@ export class ChemScraperService {
return this.filesService.uploadFileBucketNameUploadPost('chemscraper', fileData, jobID);
}

getResultStatus(jobID: string): Observable<Job> {
console.log('in getResultStatus, jobID', jobID);
return this.jobsService.getJobByTypeAndJobIdAndRunIdJobTypeJobsJobIdRunIdGet('chemscraper', jobID, '0');
getResultStatus(jobID: string): Observable<Array<Job>> {
return this.jobsService.listJobsByTypeAndJobIdJobTypeJobsJobIdGet('chemscraper', jobID);
//return this.jobsService.getJobByTypeAndJobIdAndRunIdJobTypeJobsJobIdRunIdGet('chemscraper', jobID, '0');
}

getResult(jobID: string): Observable<Molecule[]> {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ <h6 style="font-weight: 600; padding-top: 20px; padding-bottom: 20px;">Document
<p-button (click)="viewFile(i)" style="font-weight: 600;"
styleClass="custom-view-button">View</p-button> -->
<p-button (click)="deleteFile(i)" styleClass="p-button-text p-button-xs"
style="color: #6C757D">Delete</p-button>
[ngStyle]="{'color': '#6C757D'}">Delete</p-button>
<p-button (click)="viewFile(i)"
styleClass="p-button-text p-button-xs"><strong>View</strong></p-button>
</td>
Expand Down
8 changes: 4 additions & 4 deletions src/app/components/chemscraper/results/results.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -190,7 +190,7 @@ <h3>
</td>
<td class="svg-column" [innerHTML]="molecule.structure | safe:'html'"></td>
<td>
<chemscraper-pdf-context-viewer *ngIf="pdfURLs.length > 0" pdfUrl="{{currentPDF}}"
<chemscraper-pdf-context-viewer *ngIf="pdfURLs.length > 0" [pdfUrl]="currentPDF"
[startX]="molecule.minX" [startY]="molecule.minY" [width]="molecule.width"
[height]="molecule.height" [pageNumber]="molecule.page_no"
[showContext]="false"></chemscraper-pdf-context-viewer>
Expand Down Expand Up @@ -278,7 +278,7 @@ <h3>
<div class="original-structure-container">
<p>Original Structure</p>
<div class="bordered-div">
<chemscraper-pdf-context-viewer *ngIf="pdfURLs.length > 0" pdfUrl="{{currentPDF}}"
<chemscraper-pdf-context-viewer *ngIf="pdfURLs.length > 0" [pdfUrl]="currentPDF"
[startX]="molecule.minX" [startY]="molecule.minY" [width]="molecule.width"
[height]="molecule.height" [pageNumber]="molecule.page_no"
[showContext]="false"></chemscraper-pdf-context-viewer>
Expand All @@ -305,7 +305,7 @@ <h3>
</div>

<div class="bordered-div">
<chemscraper-pdf-context-viewer *ngIf="pdfURLs.length > 0" pdfUrl="{{currentPDF}}"
<chemscraper-pdf-context-viewer *ngIf="pdfURLs.length > 0" [pdfUrl]="currentPDF"
[startX]="molecule.minX" [startY]="molecule.minY" [width]="molecule.width"
[height]="molecule.height" [pageNumber]="molecule.page_no"
[showContext]="true"></chemscraper-pdf-context-viewer>
Expand Down Expand Up @@ -343,4 +343,4 @@ <h3>Right Sidebar</h3>
styleClass="p-button-primary"></p-button>
</ng-template>
</p-dialog>
</div>
</div>
58 changes: 23 additions & 35 deletions src/app/components/chemscraper/results/results.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import {
import { ChemScraperService } from 'src/app/chemscraper.service';
import { PdfViewerComponent } from '../pdf-viewer/pdf-viewer.component';
import { Table } from 'primeng/table';
import { JobsService, Molecule } from "@api/mmli-backend/v1";
import { JobsService, Configuration, Molecule } from "@api/mmli-backend/v1";
import { PdfViewerDialogServiceComponent } from '../pdf-viewer-dialog-service/pdf-viewer-dialog-service.component';
import { DialogService, DynamicDialogRef } from 'primeng/dynamicdialog';
import { OverlayPanel } from 'primeng/overlaypanel';
Expand All @@ -47,7 +47,7 @@ export class ResultsComponent {
failedJob: boolean = false;
jobID: string | undefined;
downloadRows: string[][] = [['Identifier', 'Predicted EC Number']];
statusResponse: Job;
statusResponse?: Job;
useExample: boolean = false;
preComputedMessage: Message[];
jobFailedMessage: Message[];
Expand Down Expand Up @@ -186,8 +186,8 @@ export class ResultsComponent {
this.similaritySort(value)
}

showMessage(severity: string, summary: string, detail: string) {
this.messageService.add({ severity: severity, summary: summary, detail: detail, life: 15000 });
showMessage(severity: string, summary: string, detail: string, life: number = 15000) {
this.messageService.add({ severity: severity, summary: summary, detail: detail, life: life });
}

flagMolecule(molecule: Molecule, event: Event) {
Expand Down Expand Up @@ -307,21 +307,23 @@ export class ResultsComponent {
else if (jobID) {
console.log("Starting timer to fetch results for jobID:", jobID);
timer(0, 10000).pipe(
switchMap(() => {
console.log("in results.component, Fetching result status for jobID:", jobID);
return this._chemScraperService.getResultStatus(jobID ? jobID : "example_PDF");
}),
takeWhile(() => {
console.log("Polling condition, this.pollForResult:", this.pollForResult);
return this.pollForResult;
})
switchMap(() => this._chemScraperService.getResultStatus(jobID ? jobID : "example_PDF")),
takeWhile(() => this.pollForResult),
).subscribe(
(jobStatus) => {
this.statusResponse = jobStatus;
// console.log("Received job status:", jobStatus); // Log detailed job status
// this.showMessage('info', 'Info', `Got results for job ${jobID}. Data: ${JSON.stringify(jobStatus)}`);
(jobs: Array<Job>) => {
const firstMatch = jobs?.find(() => true);
this.statusResponse = firstMatch;
console.log(firstMatch);

if (jobStatus.phase == "completed") {
if (!firstMatch || firstMatch?.phase == "error") {
if (jobID)
this._chemScraperService.getError(jobID).subscribe(
(response) => {
console.log(response);
this.pollForResult = false;
}
);
} else if (firstMatch?.phase == "completed") {
this.updateStatusStage(1);
this.pollForResult = false;
if (jobID)
Expand Down Expand Up @@ -356,20 +358,7 @@ export class ResultsComponent {
},
(error) => {
console.error(`Failed to fetch results for job ${jobID}. Error: ${error}`);
this.showMessage('error', 'Error', `Failed to fetch results for job ${jobID}. Error: ${error}`);
}
);
} else if (jobStatus.phase == "error") {
if (jobID)
this._chemScraperService.getError(jobID).subscribe(
(response) => {
this.showMessage('info', 'Info', `Fetching jobStatus error ${jobID}. Response: ${response}`);
console.log("Fetching jobStatus error:", response);
this.pollForResult = false;
},
(error) => {
console.error(`Failed to fetch error details for job ${jobID}. Error: ${error}`);
this.showMessage('error', 'Error', `Failed to fetch error details for job ${jobID}. Error: ${error}`);
this.showMessage('error', `Failed to fetch results for job ${jobID}.`, `Error: ${error}`);
}
);
} else {
Expand All @@ -381,13 +370,12 @@ export class ResultsComponent {
if (jobID)
this._chemScraperService.getError(jobID).subscribe(
(response) => {
console.log("Fetching jobStatus error:", response);
this.showMessage('info', 'Error status', `Attempting to fetch reason for error: ${response}`);
this.showMessage('info', 'Error details', `${response}`);
this.pollForResult = false;
},
(error) => {
console.error(`Failed to fetch error details for job ${jobID}. Error: ${error}`);
this.showMessage('error', 'Error', `Failed to fetch error details for job ${jobID}. Error: ${error}`);
this.showMessage('error', 'Failed to fetch error details', `Error: ${JSON.stringify(error)}`);
}
);

Expand Down Expand Up @@ -555,7 +543,7 @@ export class ResultsComponent {
},
error: (error) => {
console.debug("No similarity match found. Err: ", error);
this.showMessage('error', 'Similarity Sort Error', 'No similarity matches could be found for the provided SMILE: ' + smile);
this.showMessage('info', `No exact matches found for '${smile}'`, 'The molecules are sorted by similarity, but no exact matches found for SMILE: ' + smile, 4000);
}
});
}
Expand Down

0 comments on commit 532c7c3

Please sign in to comment.