Skip to content
Permalink
Browse files
feat(properties): ckEditor Internal Links (DEV-118) (#591)
* feat(properties): adds a button to copy the iri to the clipboard

* chore(text-value-as-html): adds appHtmlLink directive

* chore(text-value-as-html): adds outputs for internal link clicked and hovered
  • Loading branch information
mdelez committed Nov 18, 2021
1 parent 4ddbf7c commit cac988b2ddfe87e8ce7d3b64956cdc153302c483
Show file tree
Hide file tree
Showing 5 changed files with 30 additions and 6 deletions.
@@ -27,10 +27,15 @@ <h3 class="label mat-title">
</button>
<mat-menu #share="matMenu" class="res-share-menu">
<button mat-menu-item matTooltip="Copy ARK url" matTooltipPosition="above"
[cdkCopyToClipboard]="resource.res.versionArkUrl" (click)="openSnackBar()">
[cdkCopyToClipboard]="resource.res.versionArkUrl" (click)="openSnackBar('ARK URL copied to clipboard!')">
<mat-icon>content_copy</mat-icon>
Copy ARK url to clipboard
</button>
<button mat-menu-item matTooltip="Copy internal link" matTooltipPosition="above"
[cdkCopyToClipboard]="resource.res.id" (click)="openSnackBar('Internal link copied to clipboard!')">
<mat-icon>content_copy</mat-icon>
Copy internal link to clipboard
</button>
<button mat-menu-item matTooltip="Open in new tab" matTooltipPosition="above"
(click)="openResource(resource.res.id)">
<mat-icon>open_in_new</mat-icon>
@@ -358,8 +358,7 @@ export class PropertiesComponent implements OnInit, OnChanges, OnDestroy {
/**
* display message to confirm the copy of the citation link (ARK URL)
*/
openSnackBar() {
const message = 'ARK URL copied to clipboard!';
openSnackBar(message: string) {
this._notification.openSnackBar(message);
}

@@ -1,4 +1,9 @@
<div [innerHTML]="htmlFromKnora | appLinkify" class="value"></div>
<div [innerHTML]="htmlFromKnora | appLinkify"
class="value"
appHtmlLink
(internalLinkClicked)="internalLinkClicked.emit($event)"
(internalLinkHovered)="internalLinkHovered.emit($event)">
</div>
<div *ngIf="comment">
<label>{{commentLabel}}: </label><span class="comment">{{comment}}</span>
</div>
@@ -1,4 +1,4 @@
import { Component, OnInit, Pipe, PipeTransform, ViewChild } from '@angular/core';
import { Component, Directive, EventEmitter, OnInit, Output, Pipe, PipeTransform, ViewChild } from '@angular/core';
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { ReactiveFormsModule } from '@angular/forms';
import { MatInputModule } from '@angular/material/input';
@@ -18,6 +18,17 @@ class MockPipe implements PipeTransform {
}
}

@Directive({
selector: '[appHtmlLink]'
})
export class TestTextValueHtmlLinkDirective {

@Output() internalLinkClicked = new EventEmitter<string>();

@Output() internalLinkHovered = new EventEmitter<string>();

}

/**
* test host component to simulate parent component.
*/
@@ -1,4 +1,4 @@
import { Component, OnInit, Inject, Input, ElementRef } from '@angular/core';
import { Component, OnInit, Inject, Input, ElementRef, EventEmitter, Output } from '@angular/core';
import { ReadTextValueAsHtml } from '@dasch-swiss/dsp-js';
import { FormControl, FormGroup, FormBuilder } from '@angular/forms';
import { Subscription } from 'rxjs';
@@ -13,6 +13,10 @@ export class TextValueAsHtmlComponent extends BaseValueDirective implements OnIn

@Input() displayValue?: ReadTextValueAsHtml;

@Output() internalLinkClicked: EventEmitter<string> = new EventEmitter<string>();

@Output() internalLinkHovered: EventEmitter<string> = new EventEmitter<string>();

valueFormControl: FormControl;
commentFormControl: FormControl;

0 comments on commit cac988b

Please sign in to comment.