better parsing, added test, add wirering to status comp

This commit is contained in:
Nicolas Constant 2018-10-30 23:27:20 -04:00
parent 8d75d8a901
commit d979abc83e
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
4 changed files with 34 additions and 16 deletions

View File

@ -2,6 +2,7 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { DatabindedTextComponent } from './databinded-text.component'; import { DatabindedTextComponent } from './databinded-text.component';
import { By } from '@angular/platform-browser'; import { By } from '@angular/platform-browser';
import { isGeneratedFile } from '@angular/compiler/src/aot/util';
describe('DatabindedTextComponent', () => { describe('DatabindedTextComponent', () => {
let component: DatabindedTextComponent; let component: DatabindedTextComponent;
@ -66,7 +67,6 @@ describe('DatabindedTextComponent', () => {
expect(component.processedText).toContain('<p>Test.<br><a href class="link-httpspeertubefrvideoswatch69bb6e90ec0f49a39e2841792f4a7c5f" title="open link">peertube.fr/videos/watch/69bb6</a></p>'); expect(component.processedText).toContain('<p>Test.<br><a href class="link-httpspeertubefrvideoswatch69bb6e90ec0f49a39e2841792f4a7c5f" title="open link">peertube.fr/videos/watch/69bb6</a></p>');
}); });
it('should parse combined hashtag, mention and link', () => { it('should parse combined hashtag, mention and link', () => {
const hashtag = 'programmers'; const hashtag = 'programmers';
const hashtagUrl = 'https://test.social/tags/programmers'; const hashtagUrl = 'https://test.social/tags/programmers';
@ -84,7 +84,7 @@ describe('DatabindedTextComponent', () => {
expect(component.processedText).toContain('bla4'); expect(component.processedText).toContain('bla4');
}); });
it('should parse link - GNU social', () => { it('should parse link - GNU social in Mastodon', () => {
const sample = `bla1 <a href="https://www.lemonde.fr/planete.html?xtor=RSS-3208" rel="nofollow noopener" class="" target="_blank">https://social.bitcast.info/url/819438</a>`; const sample = `bla1 <a href="https://www.lemonde.fr/planete.html?xtor=RSS-3208" rel="nofollow noopener" class="" target="_blank">https://social.bitcast.info/url/819438</a>`;
component.text = sample; component.text = sample;
@ -92,6 +92,11 @@ describe('DatabindedTextComponent', () => {
expect(component.processedText).toContain('bla1'); expect(component.processedText).toContain('bla1');
}); });
it('shoult parse mention - Pleroma in Mastodon', () => {
const sample = `<div><span><a class="mention status-link" href="https://pleroma.site/users/kaniini" rel="noopener" target="_blank" title="kaniini@pleroma.site">@<span>kaniini</span></a></span> <span><a class="mention status-link" href="https://mastodon.social/@Gargron" rel="noopener" target="_blank" title="Gargron@mastodon.social">@<span>Gargron</span></a></span> bla1?</div>`;
component.text = sample;
expect(component.processedText).toContain('<div><span> <a href class="account--kaniini-pleroma-site" title="@kaniini@pleroma.site">@kaniini</a> <span> <a href class="account--Gargron-mastodon-social" title="@Gargron@mastodon.social">@Gargron</a> bla1?</div>');
});
}); });

View File

@ -38,7 +38,7 @@ export class DatabindedTextComponent implements OnInit {
console.warn(value); console.warn(value);
} }
} else if (section.includes('class="u-url mention"') || section.includes('class="mention"')) { } else if (section.includes('class="u-url mention"') || section.includes('class="mention"') || section.includes('class="mention status-link"')) {
try { try {
this.processUser(section); this.processUser(section);
} }
@ -68,16 +68,20 @@ export class DatabindedTextComponent implements OnInit {
} }
private processUser(section: string) { private processUser(section: string) {
let mentionClass = 'class="mention"'; // let mentionClass = 'class="mention"';
if (section.includes('class="u-url mention"')) // if (section.includes('class="u-url mention"'))
mentionClass = 'class="u-url mention"'; // mentionClass = 'class="u-url mention"';
let extractedAccountAndNext = section.split('</a></span>'); let extractedAccountAndNext = section.split('</a></span>');
let extractedAccountName = extractedAccountAndNext[0].split('@<span>')[1].replace('<span>', '').replace('</span>', ''); let extractedAccountName = extractedAccountAndNext[0].split('@<span>')[1].replace('<span>', '').replace('</span>', '');
let extractedAccountLink = extractedAccountAndNext[0].split('href="https://')[1].split('"')[0].replace(' ', '').replace('@', '').split('/'); let extractedAccountLink = extractedAccountAndNext[0].split('href="https://')[1].split('"')[0].replace(' ', '').replace('@', '').split('/');
let extractedAccount = `@${extractedAccountLink[1]}@${extractedAccountLink[0]}`;
let domain = extractedAccountLink[0];
let username = extractedAccountLink[extractedAccountLink.length - 1];
let extractedAccount = `@${username}@${domain}`;
let classname = this.getClassNameForAccount(extractedAccount); let classname = this.getClassNameForAccount(extractedAccount);
this.processedText += ` <a href class="${classname}" title="${extractedAccount}">@${extractedAccountName}</a>`; this.processedText += ` <a href class="${classname}" title="${extractedAccount}">@${extractedAccountName}</a>`;
@ -163,22 +167,19 @@ export class DatabindedTextComponent implements OnInit {
} }
private getClassNameForLink(value: string): string { private getClassNameForLink(value: string): string {
let res = value.replace(/[.,\/#?!@$%\^&\*;:{}=\+-_`~()]/g, ""); let res = value.replace(/[.,\/#?!@$%+\^&\*;:{}=\-_`~()]/g, "");
return `link-${res}`; return `link-${res}`;
} }
private selectAccount(account: string) { private selectAccount(account: string) {
console.warn(`select ${account}`);
this.accountSelected.next(account); this.accountSelected.next(account);
} }
private selectHashtag(hashtag: string) { private selectHashtag(hashtag: string) {
console.warn(`select ${hashtag}`);
this.hashtagSelected.next(hashtag); this.hashtagSelected.next(hashtag);
} }
selectText() { selectText() {
console.warn(`selectText`);
this.textSelected.next(); this.textSelected.next();
} }

View File

@ -16,7 +16,7 @@
getCompactRelativeTime(status.created_at) }}</div> getCompactRelativeTime(status.created_at) }}</div>
<!-- <div #content class="status__content" innerHTML="{{displayedStatus.content}}"></div> --> <!-- <div #content class="status__content" innerHTML="{{displayedStatus.content}}"></div> -->
<app-databinded-text class="status__content" [text]="displayedStatus.content"></app-databinded-text> <app-databinded-text class="status__content" [text]="displayedStatus.content" (accountSelected)="accountSelected($event)" (hashtagSelected)="hashtagSelected($event)" (textSelected)="textSelected()"></app-databinded-text>
<app-attachements *ngIf="hasAttachments" class="attachments" [attachments]="displayedStatus.media_attachments"></app-attachements> <app-attachements *ngIf="hasAttachments" class="attachments" [attachments]="displayedStatus.media_attachments"></app-attachements>

View File

@ -107,8 +107,20 @@ export class StatusComponent implements OnInit {
return false; return false;
} }
test(): boolean { // test(): boolean {
console.warn('heeeeyaaa!'); // console.warn('heeeeyaaa!');
return false; // return false;
// }
accountSelected(accountName: string): void {
console.warn(`status comp: accountSelected ${accountName}`);
}
hashtagSelected(hashtag: string): void {
console.warn(`status comp: hashtagSelected ${hashtag}`);
}
textSelected(): void {
console.warn(`status comp: textSelected`);
} }
} }