diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/client/views/nodes/DiagramBox.tsx | 136 | ||||
-rw-r--r-- | src/client/views/pdf/PDFViewer.tsx | 3 |
2 files changed, 3 insertions, 136 deletions
diff --git a/src/client/views/nodes/DiagramBox.tsx b/src/client/views/nodes/DiagramBox.tsx index 602bd4990..36deb2d8d 100644 --- a/src/client/views/nodes/DiagramBox.tsx +++ b/src/client/views/nodes/DiagramBox.tsx @@ -1,5 +1,3 @@ -/* eslint-disable prettier/prettier */ -/* eslint-disable jsx-a11y/control-has-associated-label */ import mermaid from 'mermaid'; import { action, computed, makeObservable, observable, reaction } from 'mobx'; import { observer } from 'mobx-react'; @@ -19,8 +17,7 @@ import { ViewBoxAnnotatableComponent } from '../DocComponent'; import { InkingStroke } from '../InkingStroke'; import './DiagramBox.scss'; import { FieldView, FieldViewProps } from './FieldView'; -import { PointData } from '../../../pen-gestures/GestureTypes'; -import { InkField } from '../../../fields/InkField'; +import { FormattedTextBox } from './formattedText/FormattedTextBox'; @observer export class DiagramBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { @@ -53,9 +50,7 @@ export class DiagramBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { mermaid.initialize({ securityLevel: 'loose', startOnLoad: true, - darkMode: true, - flowchart: { useMaxWidth: false, htmlLabels: true, curve: 'cardinal' }, - gantt: { useMaxWidth: true, useWidth: 2000 }, + flowchart: { useMaxWidth: true, htmlLabels: true, curve: 'cardinal' }, }); // when a new doc/text/ink/shape is created in the freeform view, this generates the corresponding mermaid diagram code reaction( @@ -178,7 +173,7 @@ export class DiagramBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { return '( )'; }; - renderGpt(): React.ReactNode { + render() { return ( <div className="DIYNodeBox"> <div className="DIYNodeBox-searchbar"> @@ -202,131 +197,6 @@ export class DiagramBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { </div> ); } - exampleButton = () => { - if (this.isExampleMenuOpen) { - this.isExampleMenuOpen = false; - } else { - this.isExampleMenuOpen = true; - } - }; - flowButton = () => { - this.createInputValue = `flowchart TD - A[Christmas] -->|Get money| B(Go shopping) - B --> C{Let me think} - C -->|One| D[Laptop] - C -->|Two| E[iPhone] - C -->|Three| F[fa:fa-car Car]`; - this.renderMermaidAsync(this.createInputValue); - }; - pieButton = () => { - this.createInputValue = `pie title Pets adopted by volunteers - "Dogs" : 386 - "Cats" : 85 - "Rats" : 15`; - this.renderMermaidAsync(this.createInputValue); - }; - timelineButton = () => { - this.createInputValue = `gantt - title A Gantt Diagram - dateFormat YYYY-MM-DD - section Section - A task :a1, 2014-01-01, 30d - Another task :after a1 , 20d - section Another - Task in sec :2014-01-12 , 12d - another task : 24d`; - this.renderMermaidAsync(this.createInputValue); - }; - classButton = () => { - this.createInputValue = `classDiagram - Animal <|-- Duck - Animal <|-- Fish - Animal <|-- Zebra - Animal : +int age - Animal : +String gender - Animal: +isMammal() - Animal: +mate() - class Duck{ - +String beakColor - +swim() - +quack() - } - class Fish{ - -int sizeInFeet - -canEat() - } - class Zebra{ - +bool is_wild - +run() - }`; - this.renderMermaidAsync(this.createInputValue); - }; - mindmapButton = () => { - this.createInputValue = `mindmap - root((mindmap)) - Origins - Long history - ::icon(fa fa-book) - Popularisation - British popular psychology author Tony Buzan - Research - On effectivness<br/>and features - On Automatic creation - Uses - Creative techniques - Strategic planning - Argument mapping - Tools - Pen and paper - Mermaid`; - this.renderMermaidAsync(this.createInputValue); - }; - handleInputChangeEditor = (e: React.ChangeEvent<HTMLTextAreaElement>) => { - if (typeof e.target.value === 'string') { - this.createInputValue = e.target.value; - this.renderMermaidAsync(e.target.value); - } - }; - removeWhitespace(str: string): string { - return str.replace(/\s+/g, ''); - } - autoResize(element: HTMLTextAreaElement): void { - element.style.height = '5px'; - element.style.height = element.scrollHeight + 'px'; - } - timeline = `gantt - title College Timeline - dateFormat YYYY-MM-DD - section Semester 1 - Orientation :done, des1, 2023-08-01, 2023-08-03 - Classes Start :active, des2, 2023-08-04, 2023-12-15 - Midterm Exams : des3, 2023-10-15, 2023-10-20 - End of Semester : des4, 2023-12-16, 2023-12-20 - section Semester 2 - Classes Start : des5, 2024-01-10, 2024-05-15 - Spring Break : des6, 2024-03-15, 2024-03-22 - Midterm Exams : des7, 2024-03-25, 2024-03-30 - Final Exams : des8, 2024-05-10, 2024-05-15 - section Summer Break - Internship : des9, 2024-06-01, 2024-08-31 - section Semester 3 - Classes Start : des10, 2024-09-01, 2025-12-15 - Midterm Exams : des11, 2024-11-15, 2024-11-20 - End of Semester : des12, 2025-12-16, 2025-12-20 - section Semester 4 - Classes Start : des13, 2025-01-10, 2025-05-15 - Spring Break : des14, 2025-03-15, 2025-03-22 - Midterm Exams : des15, 2025-03-25, 2025-03-30 - Final Exams : des16, 2025-05-10, 2025-05-15 - Graduation : des17, 2025-05-20, 2025-05-21`; - render() { - this.switchRenderDiv(); - return ( - <div ref={this._ref} className="DiagramBox"> - {this.renderDiv} - </div> - ); - } } Docs.Prototypes.TemplateMap.set(DocumentType.DIAGRAM, { diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index 3a2b8884e..5984905d0 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -61,7 +61,6 @@ export class PDFViewer extends ObservableReactComponent<IViewerProps> { @observable _pageSizes: { width: number; height: number }[] = []; @observable _savedAnnotations = new ObservableMap<number, (HTMLDivElement & { marqueeing?: boolean })[]>(); - @observable _savedTapes = new ObservableMap<number, HTMLDivElement[]>(); @observable _textSelecting = true; @observable _showWaiting = true; @observable Index: number = -1; @@ -580,7 +579,6 @@ export class PDFViewer extends ObservableReactComponent<IViewerProps> { return <div className={'pdfViewerDash-text' + (this._props.pointerEvents?.() !== 'none' && this._textSelecting && this._props.isContentActive() ? '-selected' : '')} ref={this._viewer} />; } savedAnnotations = () => this._savedAnnotations; - savedTapes = () => this._savedTapes; addDocumentWrapper = (doc: Doc | Doc[]) => this._props.addDocument!(doc); render() { TraceMobx(); @@ -614,7 +612,6 @@ export class PDFViewer extends ObservableReactComponent<IViewerProps> { docView={this._props.pdfBox.DocumentView!} finishMarquee={this.finishMarquee} savedAnnotations={this.savedAnnotations} - savedTapes={this.savedTapes} selectionText={this.selectionText} annotationLayer={this._annotationLayer.current} marqueeContainer={this._mainCont.current} |