diff --git a/frontend/package.json b/frontend/package.json index 9a22fe62..59844632 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -52,6 +52,7 @@ "ngx-infinite-scroll": "^14.0.0", "ngx-moment": "^6.0.2", "parse-full-name": "^1.2.6", + "rtf.js": "^3.0.9", "rxjs": "~6.5.4", "tslib": "^2.0.0", "uuid": "^9.0.0", diff --git a/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.html b/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.html new file mode 100644 index 00000000..5749439a --- /dev/null +++ b/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.html @@ -0,0 +1,3 @@ +
+
+
diff --git a/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.scss b/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.scss new file mode 100644 index 00000000..e69de29b diff --git a/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.spec.ts b/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.spec.ts new file mode 100644 index 00000000..4b857216 --- /dev/null +++ b/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { RtfComponent } from './rtf.component'; + +describe('RtfComponent', () => { + let component: RtfComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ RtfComponent ] + }) + .compileComponents(); + + fixture = TestBed.createComponent(RtfComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.ts b/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.ts new file mode 100644 index 00000000..51f3ae3d --- /dev/null +++ b/frontend/src/app/components/fhir-card/datatypes/rtf/rtf.component.ts @@ -0,0 +1,47 @@ +import {Component, Input, OnInit} from '@angular/core'; +import {CommonModule} from '@angular/common'; +import {BinaryModel} from '../../../../../lib/models/resources/binary-model'; +import {EMFJS, RTFJS, WMFJS} from 'rtf.js'; + +@Component({ + standalone: true, + imports: [CommonModule], + selector: 'fhir-rtf', + templateUrl: './rtf.component.html', + styleUrls: ['./rtf.component.scss'] +}) +export class RtfComponent implements OnInit { + @Input() displayModel: BinaryModel + + constructor() { } + + ngOnInit(): void { + + let doc = new RTFJS.Document(this.stringToArrayBuffer(this.displayModel.content), null); + doc.render().then(function(htmlElements) { + const parent: HTMLElement = document.getElementById('rtfContent'); + for(let i = 0; i < htmlElements.length; i++){ + parent.appendChild(htmlElements[i]) + } + }).catch(e => { + if (e instanceof RTFJS.Error) { + console.error("Error: " + e.message); + document.getElementById('rtfContent').innerHTML = e.message; + } + else { + throw e; + } + }); + + } + + private stringToArrayBuffer(string): ArrayBuffer { + const buffer = new ArrayBuffer(string.length); + const bufferView = new Uint8Array(buffer); + for (let i = 0; i < string.length; i++) { + bufferView[i] = string.charCodeAt(i); + } + return buffer; + } + +} diff --git a/frontend/src/app/components/fhir-card/fhir-card.module.ts b/frontend/src/app/components/fhir-card/fhir-card.module.ts index add809fe..60bbfece 100644 --- a/frontend/src/app/components/fhir-card/fhir-card.module.ts +++ b/frontend/src/app/components/fhir-card/fhir-card.module.ts @@ -27,6 +27,7 @@ import {ProcedureComponent} from './resources/procedure/procedure.component'; import {FhirCardComponent} from './fhir-card/fhir-card.component'; import {FhirCardOutletDirective} from './fhir-card/fhir-card-outlet.directive'; import { EncounterComponent } from './resources/encounter/encounter.component'; +import { RtfComponent } from './datatypes/rtf/rtf.component'; @@ -45,6 +46,7 @@ import { EncounterComponent } from './resources/encounter/encounter.component'; ImgComponent, MarkdownComponent, PdfComponent, + RtfComponent, //resources AllergyIntoleranceComponent, BinaryComponent, @@ -82,6 +84,7 @@ import { EncounterComponent } from './resources/encounter/encounter.component'; ImgComponent, MarkdownComponent, PdfComponent, + RtfComponent, //resources AllergyIntoleranceComponent, BinaryComponent, diff --git a/frontend/src/app/components/fhir-card/resources/binary/binary.component.html b/frontend/src/app/components/fhir-card/resources/binary/binary.component.html index a443a132..277e230c 100644 --- a/frontend/src/app/components/fhir-card/resources/binary/binary.component.html +++ b/frontend/src/app/components/fhir-card/resources/binary/binary.component.html @@ -13,6 +13,7 @@ displayModel?.content_type == 'text/markdown' ? showMarkdown : displayModel?.content_type == 'text/plain' ? showText : displayModel?.content_type == 'application/dicom' ? showDicom : + displayModel?.content_type == 'text/rtf' ? showRtf : (displayModel?.content_type == 'text/html' || displayModel?.content_type == 'application/html') ? showHtml : (displayModel?.content_type == 'application/xml' || displayModel?.content_type == 'application/json') ? showHighlight : (displayModel?.content_type == 'image/jpeg' || displayModel?.content_type == 'image/png') ? showImg : @@ -40,6 +41,9 @@ + + + Unknown Binary content type {{displayModel?.content_type}} diff --git a/frontend/src/app/components/fhir-card/resources/binary/binary.component.ts b/frontend/src/app/components/fhir-card/resources/binary/binary.component.ts index 28753ab4..791ee9d5 100644 --- a/frontend/src/app/components/fhir-card/resources/binary/binary.component.ts +++ b/frontend/src/app/components/fhir-card/resources/binary/binary.component.ts @@ -17,6 +17,7 @@ import {DicomComponent} from "../../datatypes/dicom/dicom.component"; import {HighlightModule} from "ngx-highlightjs"; import {HttpClient, HttpClientModule} from "@angular/common/http"; import {AuthService} from "../../../../services/auth.service"; +import {RtfComponent} from '../../datatypes/rtf/rtf.component'; @Component({ standalone: true, @@ -27,6 +28,7 @@ import {AuthService} from "../../../../services/auth.service"; ImgComponent, HtmlComponent, MarkdownComponent, + RtfComponent, BinaryTextComponent, DicomComponent, HighlightModule, diff --git a/frontend/yarn.lock b/frontend/yarn.lock index b50c48b9..14f39658 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -5074,6 +5074,11 @@ codelyzer@^5.1.2: source-map "^0.5.7" sprintf-js "^1.1.2" +codepage@^1.15.0: + version "1.15.0" + resolved "https://registry.npmjs.org/codepage/-/codepage-1.15.0.tgz#2e00519024b39424ec66eeb3ec07227e692618ab" + integrity sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA== + coffeescript@^2.7.0: version "2.7.0" resolved "https://registry.npmjs.org/coffeescript/-/coffeescript-2.7.0.tgz#a43ec03be6885d6d1454850ea70b9409c391279c" @@ -10827,6 +10832,13 @@ rimraf@~2.6.2: dependencies: glob "^7.1.3" +rtf.js@^3.0.9: + version "3.0.9" + resolved "https://registry.npmjs.org/rtf.js/-/rtf.js-3.0.9.tgz#27d4f4e26372ba080b945ee48293347346de943e" + integrity sha512-I1GpDat4i548WzmeZXv27f/743984fvEeeBS8BC01/Sop17pMlUl3M7DYcdcB3PUvOZTrFIMxGZx8qw7cSMAKQ== + dependencies: + codepage "^1.15.0" + run-async@^2.4.0: version "2.4.1" resolved "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz#8440eccf99ea3e70bd409d49aab88e10c189a455"