From ab5a0bd7cee9366dabf4ce40bde89b67730da2a5 Mon Sep 17 00:00:00 2001 From: mehekj Date: Thu, 14 Apr 2022 18:06:34 -0400 Subject: auto transcribes on grouping --- src/client/views/InkTranscription.tsx | 50 +++++++++++++++-------------------- 1 file changed, 22 insertions(+), 28 deletions(-) (limited to 'src/client/views/InkTranscription.tsx') diff --git a/src/client/views/InkTranscription.tsx b/src/client/views/InkTranscription.tsx index 4957446dc..ea5d5a1ec 100644 --- a/src/client/views/InkTranscription.tsx +++ b/src/client/views/InkTranscription.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import { Doc } from '../../fields/Doc'; import { InkData, InkField } from "../../fields/InkField"; import { Cast, NumCast, StrCast } from '../../fields/Types'; -import { Docs } from "../documents/Documents"; +import { DocumentType } from "../documents/DocumentTypes"; import './InkTranscription.scss'; export class InkTranscription extends React.Component { @@ -15,8 +15,7 @@ export class InkTranscription extends React.Component { @observable _mathRef: any; @observable _textRegister: any; @observable _textRef: any; - private addDocument?: (doc: Doc | Doc[]) => boolean; - private bounds: { x: number, y: number, width: number, height: number } = { x: 0, y: 0, width: 0, height: 0 }; + private currGroup?: Doc; constructor(props: Readonly<{}>) { super(props); @@ -27,9 +26,6 @@ export class InkTranscription extends React.Component { componentWillUnmount() { this._mathRef.removeEventListener('exported', (e: any) => this.exportInk(e, this._mathRef)); this._textRef.removeEventListener('exported', (e: any) => this.exportInk(e, this._textRef)); - - this._mathRef.removeEventListener('changed', (e: any) => this.callExport(this._mathRef)); - this._textRef.removeEventListener('changed', (e: any) => this.callExport(this._textRef)); } @action @@ -58,15 +54,11 @@ export class InkTranscription extends React.Component { } } } - }, - triggers: { - exportContent: 'DEMAND' } }) : null; } r.addEventListener('exported', (e: any) => this.exportInk(e, this._mathRef)); - r.addEventListener('changed', (e: any) => this.callExport(this._mathRef)); return this._mathRef = r; } @@ -97,22 +89,22 @@ export class InkTranscription extends React.Component { } } } - }, - triggers: { - exportContent: 'DEMAND' } }) : null; } r.addEventListener('exported', (e: any) => this.exportInk(e, this._textRef)); - r.addEventListener('changed', (e: any) => this.callExport(this._textRef)); return this._textRef = r; } - transcribeInk = (inkdocs: Doc[], math: boolean, bounds: { x: number, y: number, width: number, height: number }, addDocument?: (doc: Doc | Doc[]) => boolean) => { + transcribeInk = (groupDoc: Doc | undefined, inkDocs: Doc[], math: boolean) => { + if (!groupDoc) return; + + const validInks = inkDocs.filter(s => s.type === DocumentType.INK); + const strokes: InkData[] = []; - inkdocs.filter(i => Cast(i.data, InkField)).forEach(i => { + validInks.filter(i => Cast(i.data, InkField)).forEach(i => { // TODO: interpolate missing times stamps const d = Cast(i.data, InkField, null); const left = Math.min(...d?.inkData.map(pd => pd.X) ?? [0]); @@ -120,8 +112,7 @@ export class InkTranscription extends React.Component { strokes.push(d.inkData.map(pd => ({ X: pd.X + NumCast(i.x) - left, Y: pd.Y + NumCast(i.y) - top, time: pd.time }))); }); - this.addDocument = addDocument; - this.bounds = bounds; + this.currGroup = groupDoc; const pointerData = { "events": strokes.map(stroke => this.inkJSON(stroke)) }; // console.log(JSON.stringify(pointerData)); @@ -135,12 +126,6 @@ export class InkTranscription extends React.Component { } } - callExport(ref: any) { - if (ref.editor.canExport) { - ref.editor.export_(); - } - } - inkJSON = (stroke: InkData) => { return { "pointerType": "PEN", @@ -159,15 +144,24 @@ export class InkTranscription extends React.Component { const latex = exports['application/x-latex']; console.log(latex); - this.addDocument?.(Docs.Create.EquationDocument({ title: latex, x: this.bounds.x + this.bounds.width, y: this.bounds.y, _width: this.bounds.width, _height: this.bounds.height })); + if (this.currGroup) { + this.currGroup.text = latex; + this.currGroup.title = latex; + } + + ref.editor.clear(); } else if (exports['text/plain']) { const text = exports['text/plain']; console.log(text); - this.addDocument?.(Docs.Create.TextDocument(text, { title: text, x: this.bounds.x + this.bounds.width, y: this.bounds.y, _width: this.bounds.width, _height: this.bounds.height })); - } - ref.editor.clear(); + if (this.currGroup) { + this.currGroup.text = text; + this.currGroup.title = text; + } + + ref.editor.clear(); + } } } -- cgit v1.2.3-70-g09d2