Skip to content

Feature/text matching #180

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 6 commits into from
Oct 1, 2024
Merged

Feature/text matching #180

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
208e199
add textmatching logic
LaviniaStiliadou Sep 18, 2024
c88637c
add deployment logic
LaviniaStiliadou Sep 29, 2024
7ed8e69
fix layouting, add pattern graph button
LaviniaStiliadou Sep 30, 2024
6b74271
fix endpoints
LaviniaStiliadou Sep 30, 2024
1599ee1
linting
mbeisel Oct 1, 2024
f11b1c8
adapt linting rules
mbeisel Oct 1, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .eslintrc.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ module.exports = {
'max-classes-per-file': 'off',

// ORIGINAL tslint.json -> "max-line-length": [true, 140],
'max-len': ['error', {code: 160}],
// 'max-len': ['error', {code: 160}],

// ORIGINAL tslint.json -> "member-access": false,
'@typescript-eslint/explicit-member-accessibility': 'off',
Expand Down
2 changes: 2 additions & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@
"core-js": "2.6.3",
"d3": "^5.9.2",
"file-saver": "^2.0.5",
"jquery": "^3.6.1",
"keyword-extractor": "0.0.25",
"lodash": "^4.17.21",
"madr": "2.1.2",
Expand All @@ -49,6 +50,7 @@
"rxjs": "6.5.5",
"simplemde": "1.11.2",
"tslib": "^1.10.0",
"whatwg-fetch": "^3.6.2",
"zone.js": "~0.10.3"
},
"devDependencies": {
Expand Down
164 changes: 104 additions & 60 deletions src/app/core/component/textmatcher/textmatcher.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,73 +1,117 @@
<button mat-icon-button class="close-button" (click)="closeDialog2()">
<mat-icon class="close-icon" >close</mat-icon>
<mat-icon class="close-icon">close</mat-icon>
</button>

<div mat-dialog-content>
<mat-form-field id="type-field" class="action-button-with-margin" [floatLabel]="'always'">
<mat-label>Input the known Information</mat-label>
<textarea matInput placeholder="Type in information" [formControl]="inputfield" cdkFocusInitial></textarea>
<mat-form-field id="type-field" class="action-button-with-margin" [floatLabel]="'always'">
<mat-label>Describe your context</mat-label>
<textarea
matInput
placeholder="Type in information"
[formControl]="inputfield"
cdkFocusInitial
class="styled-textarea"></textarea>
</mat-form-field>

<div *ngIf="showRephrasedInput">
<p>Rephrased input: {{rephrasedInput}}</p>
</div>

<div *ngIf="showMatchingResults">
<p>The best matching algorithm with cosine similarity is
<span class="resultLink" (click)="openLink()">{{resultAlgorithm.name}}</span>.
</p>
<p>The Cosine Similarity is
<span class="similarityvalue">{{resultAlgorithm.cosineSimilarity}}</span>
</p>
</div>

<div *ngIf="showMatchingResults">
<mat-table #table [dataSource]="tabledata">
<ng-container matColumnDef="name">
<mat-header-cell *matHeaderCellDef> Name </mat-header-cell>
<mat-cell *matCellDef="let result">
<span class="resultLink" (click)="openLink2(result.name)">{{result.name}}</span>
</mat-cell>
</ng-container>
<ng-container matColumnDef="cosineSimilarity">
<mat-header-cell *matHeaderCellDef> Cosine similarity </mat-header-cell>
<mat-cell *matCellDef="let result"> {{result.cosineSimilarity}} </mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="columnsToDisplay"></mat-header-row>
<mat-row *matRowDef="let row; columns: columnsToDisplay"></mat-row>
</mat-table>
</div>

<!-- Progress bar for aggregation -->
<mat-progress-bar *ngIf="isAggregating" mode="determinate" [value]="progressValue"></mat-progress-bar>
<p *ngIf="isAggregating">Aggregation in progress... {{ progressValue }}%</p>
</div>
<div mat-dialog-content *ngIf="showRephrasedInput">
<p>Rephrased input: {{rephrasedInput}} </p>
</div>
<div mat-dialog-content *ngIf="showMatchingResults">
<p>The best matching algorithm with cosine similarity is <span class="resultLink"(click)="openLink()">{{resultAlgorithm.name}}</span>. </p>
<p>The Cosine Similarity is <span class="similarityvalue">{{resultAlgorithm.cosineSimilarity}}</span> </p>
</div>
<div>
<mat-form-field *ngIf="showMatchingResults">
<mat-label>Number of displayed algorithms</mat-label>
<mat-select [(value)]="selectednumber" (selectionChange)="numberChanged()">
<mat-option *ngFor="let number of numbers" [value]="number">{{number}}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div>
<mat-table #table [dataSource]="tabledata" *ngIf="showMatchingResults">
<ng-container matColumnDef="name">
<mat-header-cell *matHeaderCellDef> Name </mat-header-cell>
<mat-cell *matCellDef="let result"> <span class="resultLink"(click)="openLink2(result.name)">{{result.name}}</span> </mat-cell>
</ng-container>
<ng-container matColumnDef="cosineSimilarity">
<mat-header-cell *matHeaderCellDef> Cosine similarity </mat-header-cell>
<mat-cell *matCellDef="let result"> {{result.cosineSimilarity}} </mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="columnsToDisplay"></mat-header-row>
<mat-row *matRowDef="let row; columns: columnsToDisplay"></mat-row>
</mat-table>
</div>

<div mat-dialog-actions>
<button class="action-button-with-margin" (click)="closeDialog2()" mat-raised-button >
<i class="material-icons"></i> close
</button>
<button class="action-button-with-margin" (click)="extractInformation(false) "mat-raised-button>
<i class="material-icons"></i> start textmatching
</button>
<button class="action-button-with-margin" (click)="extractInformation(true) "mat-raised-button>
<i class="material-icons"></i> start textmatching with rake
</button>
<section class="testsection">
<input type="checkbox" class="example-margin" [checked]="checked" (change)="checkboxClicked($event)">rephrase Problem using OpenAI
</section>
<button class="action-button-with-margin" (click)="extractInformation(false)" mat-raised-button>
<i class="material-icons"></i> Identify Patterns
</button>

<button class="action-button-with-margin" *ngIf="fulltabledata && fulltabledata.length > 0"
(click)="openGraphDialog()" mat-raised-button>
Show Pattern Graph
</button>

<button class="action-button-with-margin" *ngIf="fulltabledata && fulltabledata.length > 0" (click)="aggregateSolutions()" mat-raised-button>
Aggregate Solutions
</button>

<button class="action-button-with-margin" *ngIf="isAggregationComplete && (fulltabledata && fulltabledata.length > 0)" (click)="deploySolution()"
mat-raised-button>
Deploy Solution
</button>
</div>

<!-- Styling -->
<style>
.resultLink {
cursor: pointer;
color: blue;
}
.resultLink {
cursor: pointer;
color: blue;
}

.resultLink:hover {
opacity: 0.9;
color: pink;
text-decoration: underline;
}

.similarityvalue {
color: red;
}

.example-margin:hover {
color: blue;
}

.resultLink:hover {
opacity: 0.9;
color: pink;
text-decoration: underline;
}
.action-button-with-margin {
margin-right: 10px;
}

.similarityvalue {
color: red;
}
.styled-textarea {
height: 100px;
border-radius: 5px;
padding: 10px;
border: 1px solid #ccc;
transition: border-color 0.3s;
}

.example-margin:hover {
color: blue;
}
.styled-textarea:focus {
border-color: #3f51b5;
outline: none;
}

.graph-container {
width: 100%;
height: 400px;
overflow: auto;
border: 1px solid #ccc;
margin-top: 20px;
padding: 10px;
}
</style>
Loading
Loading