Skip to content

Commit

Permalink
fix(octra): transcr-overview shows wrong errors
Browse files Browse the repository at this point in the history
  • Loading branch information
@julianpoemp
julianpoemp committed Nov 29, 2024
1 parent 8c5864a commit 2b97a97
Show file tree
Hide file tree
Showing 7 changed files with 128 additions and 128 deletions.
6 changes: 6 additions & 0 deletions apps/octra/src/app/core/component/transcr-editor/config/te.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,4 +19,10 @@ export class TranscrEditorConfig {
boundary: false,
};
public highlightingEnabled = false;

constructor(partial?: Partial<TranscrEditorConfig>) {
if (partial) {
Object.assign(partial);
}
}
}
43 changes: 25 additions & 18 deletions apps/octra/src/app/core/component/transcr-editor/transcr-editor.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import {
HostListener,
Input,
OnChanges,
OnDestroy,
OnInit,
Output,
Renderer2,
Expand Down Expand Up @@ -57,12 +58,12 @@ declare let document: any;
selector: 'octra-transcr-editor',
templateUrl: './transcr-editor.component.html',
styleUrls: ['./transcr-editor.component.scss'],
providers: [TranscrEditorConfig],
providers: [],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class TranscrEditorComponent
extends DefaultComponent
implements OnChanges, AfterViewInit, OnInit
implements OnChanges, AfterViewInit, OnInit, OnDestroy
{
@Output() loaded: EventEmitter<boolean> = new EventEmitter<boolean>();
@Output() onkeyup: EventEmitter<any> = new EventEmitter<any>();
Expand Down Expand Up @@ -654,10 +655,10 @@ export class TranscrEditorComponent
this.subscriptionManager.removeByTag('typing_change');
this.subscribe(
this.internalTyping,
(status) => {
async (status) => {
if (status === 'stopped') {
this.validate();
this.initPopover();
await this.validate();
await this.initPopover();
}

this.typing.emit(status);
Expand All @@ -667,13 +668,18 @@ export class TranscrEditorComponent
}

ngOnInit() {
this.subscriptionManager.removeByTag('afterInit');
this.subscribe(this.annotationStoreService.guidelines$, {
next: (guidelines) => {
this.guidelines = guidelines?.selected?.json;
},
});
}

override ngOnDestroy() {
super.ngOnDestroy();
}

async ngOnChanges(obj: SimpleChanges) {
let renew = false;
if (
Expand Down Expand Up @@ -705,7 +711,7 @@ export class TranscrEditorComponent
obj['transcript'].currentValue !== undefined &&
!obj['transcript'].firstChange
) {
await this.setTranscript(obj['transcript'].currentValue);
//await this.setTranscript(obj['transcript'].currentValue);
}

if (
Expand Down Expand Up @@ -1134,8 +1140,8 @@ export class TranscrEditorComponent
let code = this._rawText;
// insert selection placeholders
if (!focusAtEnd) {
const startMarker = '[[[sel-start]]][[[/sel-start]]]';
const endMarker = '[[[sel-end]]][[[/sel-end]]]';
const startMarker = '[[[sel-start/]]]';
const endMarker = '[[[sel-end/]]]';
code =
this.lastCursorPosition!.endMarker !== undefined &&
this._textSelection.end >= this._textSelection.start
Expand All @@ -1148,23 +1154,21 @@ export class TranscrEditorComponent
code = insertString(code, this._textSelection.start, startMarker);
}

code = this.annotationStoreService.underlineTextRed(
code,
this.annotationStoreService.validate(code)
);
const validation = this.annotationStoreService.validate(code);
code = this.annotationStoreService.underlineTextRed(code, validation);
code = await this.annotationStoreService.rawToHTML(code);

if (!focusAtEnd) {
code = code.replace(
/([\s ]+)(<sel-start><\/sel-start><sel-end><\/sel-end><\/p>)?$/g,
/([\s ]+)(<sel-start \/?><sel-end \/?><\/p>)?$/g,
'&nbsp;$2'
);
code = code.replace(
/<sel-start><\/sel-start>/g,
/<sel-start ?\/?>/g,
this.lastCursorPosition!.startMarker
);
code = code.replace(
/<sel-end><\/sel-end>/g,
/<sel-end ?\/?>/g,
this.lastCursorPosition!.endMarker
? this.lastCursorPosition!.endMarker
: ''
Expand Down Expand Up @@ -1435,8 +1439,12 @@ export class TranscrEditorComponent

this.joditComponent.jodit.value =
await this.annotationStoreService.rawToHTML(rawText);
this.validate();
this.initPopover();
this.subscribe(timer(500), {
next: async () => {
await this.validate();
await this.initPopover();
},
});

this.asr = {
status: 'inactive',
Expand Down Expand Up @@ -1726,7 +1734,6 @@ export class TranscrEditorComponent
}

onAfterInit = () => {
this.subscriptionManager.removeByTag('afterInit');
this.subscribe(
timer(200),
() => {
Expand Down
1 change: 1 addition & 0 deletions ...rc/app/core/component/transcr-editor/validation-popover/validation-popover.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
position: absolute;
z-index: 100;
display: none;
font-size: 0.85rem;
}

.card {
Expand Down
3 changes: 3 additions & 0 deletions apps/octra/src/app/core/component/transcr-overview/transcr-overview.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -156,13 +156,16 @@ <h4 [hidden]="!showTranscriptionTable">{{ 'g.transcript' | transloco }}</h4>
<div>
<octra-transcr-editor
#transcrEditor
[settings]="editorConfig"
[height]="60"
[validationEnabled]="appStorage.useMode !== 'url' && (appStorage.useMode! === 'demo' || settingsService.projectsettings?.octra?.validationEnabled)"
[markers]="
annotationStoreService.guidelines !== undefined
? annotationStoreService.guidelines.markers
: undefined
"
[easymode]="true"
[transcript]="transcript"
[audiochunk]="textEditor.audioChunk"
[(font)]="appStorage.editorFont"
(enterKeyPressed)="onEnterPressed(i)"
Expand Down
57 changes: 15 additions & 42 deletions apps/octra/src/app/core/component/transcr-overview/transcr-overview.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ import {
} from '../../shared/service';
import { AppStorageService } from '../../shared/service/appstorage.service';
import { AnnotationStoreService } from '../../store/login-mode/annotation/annotation.store.service';
import { TranscrEditorComponent } from '../transcr-editor';
import { TranscrEditorComponent, TranscrEditorConfig } from '../transcr-editor';
import { ValidationPopoverComponent } from '../transcr-editor/validation-popover/validation-popover.component';

declare const validateAnnotation: (transcript: string, guidelines: any) => any;
Expand All @@ -51,13 +51,21 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
return this._textEditor;
}

editorConfig: TranscrEditorConfig = new TranscrEditorConfig({
btnPopover: false
});

@ViewChild('transcrEditor', { static: false })
transcrEditor?: TranscrEditorComponent;

public selectedError: any = '';
public shownSegments: {
transcription: {
html: string;
text: string;
};
}[] = [];
public transcript = "";

@Input() currentLevel?: OctraAnnotationAnyLevel<
OctraAnnotationSegment<ASRContext>
Expand All @@ -69,9 +77,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {

@Output() segmentclicked: EventEmitter<number> = new EventEmitter<number>();

@ViewChild('transcrEditor', { static: false })
transcrEditor?: TranscrEditorComponent;

private subscrmanager: SubscriptionManager<Subscription>;

public playAllState: {
Expand Down Expand Up @@ -150,9 +155,8 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
let resultStr = '';
for (let i = 0; i < this.shownSegments.length; i++) {
resultStr += this.shownSegments[i].transcription.html;
found += (this.shownSegments[i].transcription.html.match(/<span class='val-error'/) || []).length;
}

found = (resultStr.match(/<span class='val-error'/) || []).length;
}

return found;
Expand All @@ -172,10 +176,9 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
public audio: AudioService,
public sanitizer: DomSanitizer,
private cd: ChangeDetectorRef,
public appStorage: AppStorageService,
private settingsService: SettingsService,
private uiService: UserInteractionsService,
private elementRef: ElementRef
protected appStorage: AppStorageService,
protected settingsService: SettingsService,
private uiService: UserInteractionsService
) {
this.subscrmanager = new SubscriptionManager();
}
Expand Down Expand Up @@ -289,24 +292,9 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.audio.audiomanagers[0].addChunk(audiochunk);
this.textEditor.audioChunk = audiochunk;

this.cd.markForCheck();
this.cd.detectChanges();

if (!this.transcrEditor) {
return;
}

this.transcrEditor.settings.btnPopover = false;
this.transcrEditor.validationEnabled =
this.appStorage.useMode !== 'url' &&
(this.appStorage.useMode! === 'demo' ||
this.settingsService.projectsettings?.octra?.validationEnabled ===
true);
this.transcrEditor.initialize();

this.transcrEditor.transcript =
this.transcript =
segment.getFirstLabelWithoutName('Speaker')?.value ?? '';
this.transcrEditor.focus();
// this.transcrEditor.focus();
}
}
}
Expand All @@ -325,7 +313,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.annotationStoreService.validateAll();

this.cd.markForCheck();
this.cd.detectChanges();

await this.updateSegments();

Expand All @@ -334,7 +321,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.textEditor.selectedSegment = -1;
this.audio.audiomanagers[0].removeChunk(this.textEditor.audioChunk!);
this.cd.markForCheck();
this.cd.detectChanges();

const startSample =
i > 0
Expand Down Expand Up @@ -544,7 +530,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.playAllState.icon = 'bi bi-play-fill';

this.cd.markForCheck();
this.cd.detectChanges();
} else {
console.log(`playAll failed`);
}
Expand All @@ -556,7 +541,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
? 'bi bi-stop-fill'
: 'bi bi-play-fill';
this.cd.markForCheck();
this.cd.detectChanges();

const playpos = this.audio.audioManager.createSampleUnit(0);

Expand Down Expand Up @@ -593,7 +577,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
'bi bi-play-fill';

this.cd.markForCheck();
this.cd.detectChanges();

this.uiService.addElementFromEvent(
'mouseclick',
Expand Down Expand Up @@ -629,15 +612,13 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.playStateSegments[segmentNumber].state = 'started';
this.playStateSegments[segmentNumber].icon = 'bi bi-stop-fill';
this.cd.markForCheck();
this.cd.detectChanges();

const startSample =
segmentNumber > 0 ? level.items[segmentNumber - 1].time.samples : 0;

this.playAllState.currentSegment = segmentNumber;

this.cd.markForCheck();
this.cd.detectChanges();
this.audio.audiomanagers[0].playPosition =
this.audio.audiomanagers[0].createSampleUnit(startSample);
this.audio.audiomanagers[0]
Expand All @@ -654,13 +635,11 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.playStateSegments[segmentNumber].icon = 'bi bi-play-fill';
this.playAllState.currentSegment = -1;
this.cd.markForCheck();
this.cd.detectChanges();

this.subscrmanager.add(
timer(100).subscribe({
next: () => {
this.cd.markForCheck();
this.cd.detectChanges();

resolve();
},
Expand All @@ -680,7 +659,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.playAllState.currentSegment = -1;

this.cd.markForCheck();
this.cd.detectChanges();

resolve();
})
Expand All @@ -701,7 +679,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.stopPlayback()
.then(() => {
this.cd.markForCheck();
this.cd.detectChanges();

const startSample =
segmentNumber > 0
Expand Down Expand Up @@ -735,7 +712,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.playSegment(segmentNumber)
.then(() => {
this.cd.markForCheck();
this.cd.detectChanges();
})
.catch((error) => {
console.error(error);
Expand Down Expand Up @@ -779,7 +755,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.playAllState.icon = 'bi bi-play-fill';
this.playAllState.currentSegment = -1;
this.cd.markForCheck();
this.cd.detectChanges();
this.playAllState.currentSegment = -1;
})
.catch((error) => {
Expand All @@ -796,7 +771,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.annotationStoreService.validateAll();
await this.updateSegments();
this.cd.markForCheck();
this.cd.detectChanges();
}

toggleSkipCheckbox() {
Expand All @@ -811,7 +785,6 @@ export class TranscrOverviewComponent implements OnInit, OnDestroy, OnChanges {
this.playStateSegments[this.playAllState.currentSegment].icon =
'bi bi-play-fill';
this.cd.markForCheck();
this.cd.detectChanges();
}
this.audio.audiomanagers[0].stopPlayback().then(resolve).catch(reject);
});
Expand Down
Loading

0 comments on commit 2b97a97

Please sign in to comment.