mirror of
https://github.com/block-core/blockcore-notes.git
synced 2024-09-29 06:20:42 +00:00
Add a basic and rudimentary integration of Tidal
This commit is contained in:
parent
1a04262e0d
commit
f20c032c1a
@ -11,6 +11,7 @@ export interface Options {
|
||||
showLines: boolean;
|
||||
showMediaPlayer?: boolean;
|
||||
enableSpotify?: boolean;
|
||||
enableTidal?: boolean;
|
||||
hideSideLabels?: boolean;
|
||||
primaryRelay?: string;
|
||||
peopleDisplayType: number;
|
||||
|
@ -6,7 +6,6 @@
|
||||
</ng-template>
|
||||
<ng-template matTabContent>
|
||||
<div class="page">
|
||||
|
||||
<app-relays [relays]="relayService.items2"></app-relays>
|
||||
|
||||
<!-- <mat-accordion class="example-headers-align" multi>
|
||||
@ -59,10 +58,9 @@
|
||||
<!-- <button mat-stroked-button (click)="toggle()"><span *ngIf="!open">Expand All</span><span *ngIf="open">Collapse All</span></button>
|
||||
<br /> -->
|
||||
<button mat-flat-button color="primary" (click)="getRelays()">Append from extension</button><button mat-flat-button color="primary" (click)="getDefaultRelays()">Append from app</button>
|
||||
<br>
|
||||
<br />
|
||||
<button mat-flat-button (click)="dataService.publishContactsAndRelays()">Publish relay (and following) list</button><br /><br />
|
||||
<button mat-flat-button color="warn" (click)="deleteRelays()">Delete all relays</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
@ -99,9 +97,14 @@
|
||||
<br />
|
||||
|
||||
<mat-card>
|
||||
<mat-card-header>
|
||||
<mat-card-title>Media widgets</mat-card-title>
|
||||
<mat-card-subtitle>Control how content are rendered</mat-card-subtitle>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<p>Enable this to allow the app to render Spotify widgets when URLs linked to Spotify is seen in notes.</p>
|
||||
<mat-slide-toggle class="options-slider" (change)="optionsService.save()" [(ngModel)]="optionsService.values.enableSpotify">Enable Spotify integration</mat-slide-toggle>
|
||||
<p>Enable this to allow the app to render music widgets when URLs linked to the services is seen in notes.</p>
|
||||
<mat-slide-toggle class="options-slider" (change)="optionsService.save()" [(ngModel)]="optionsService.values.enableSpotify">Enable Spotify</mat-slide-toggle>
|
||||
<mat-slide-toggle class="options-slider" (change)="optionsService.save()" [(ngModel)]="optionsService.values.enableTidal">Enable Tidal</mat-slide-toggle>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
|
@ -8,9 +8,7 @@
|
||||
</div>
|
||||
|
||||
<ng-template [ngIf]="spotify">
|
||||
|
||||
<!-- {{spotify | json}} -->
|
||||
|
||||
<iframe
|
||||
*ngFor="let song of spotify"
|
||||
style="border-radius: 12px"
|
||||
@ -24,6 +22,21 @@
|
||||
></iframe>
|
||||
</ng-template>
|
||||
|
||||
<ng-template [ngIf]="tidal">
|
||||
<!-- {{spotify | json}} -->
|
||||
<iframe
|
||||
*ngFor="let song of tidal"
|
||||
style="border-radius: 12px"
|
||||
[src]="song"
|
||||
width="100%"
|
||||
height="152"
|
||||
frameborder="0"
|
||||
allowfullscreen=""
|
||||
allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture"
|
||||
loading="lazy"
|
||||
></iframe>
|
||||
</ng-template>
|
||||
|
||||
<!-- <div id="embed-iframe"></div> -->
|
||||
|
||||
<!-- <div class="container-16-9">
|
||||
|
@ -25,11 +25,13 @@ export class ContentComponent {
|
||||
images: SafeResourceUrl[] = [];
|
||||
videos: SafeResourceUrl[] = [];
|
||||
spotify: SafeResourceUrl[] = [];
|
||||
tidal: SafeResourceUrl[] = [];
|
||||
|
||||
static regexpImage = /(?:(?:https?)+\:\/\/+[a-zA-Z0-9\/\._-]{1,})+(?:(?:jpe?g|png|gif|webp))/gi;
|
||||
static regexpVideo = /(?:https?:\/\/)?(?:www\.)?youtu\.?be(?:\.com)?\/?.*(?:watch|embed)?(?:.*v=|v\/|\/)([\w-_]+)/gim;
|
||||
static regexpThisIsTheWay = /(?:thisistheway.gif)/g;
|
||||
static regexpSpotify = /((http|https?)?(.+?\.?)(open.spotify.com)(.+?\.?)?)/gi;
|
||||
static regexpTidal = /((http|https?)?(.+?\.?)(tidal.com)(.+?\.?)?)/gi;
|
||||
static regexpUrl = /([\w+]+\:\/\/)?([\w\d-]+\.)*[\w-]+[\.\:]\w+([\/\?\=\&\#.]?[\w-]+)*\/?/gi;
|
||||
|
||||
// static regexpVideo = /^((?:https?:)?\/\/)?((?:www|m)\.)?((?:youtube\.com|youtu.be))(\/(?:[\w\-]+\?v=|embed\/|v\/)?)([\w\-]+)(\S+)?$/g;
|
||||
@ -91,8 +93,19 @@ export class ContentComponent {
|
||||
content = content.replaceAll(ContentComponent.regexpVideo, '');
|
||||
content = content.replaceAll(ContentComponent.regexpThisIsTheWay, '');
|
||||
|
||||
if (this.optionsService.values.enableTidal) {
|
||||
// After doing image, video and known memes, get all URLs and handle Tidal.
|
||||
const urls = [...content.matchAll(ContentComponent.regexpUrl)];
|
||||
const tidalUrl = urls.filter((url) => url[0].indexOf('tidal.com') > -1);
|
||||
this.tidal = tidalUrl.map((i) => this.utilities.sanitizeUrlAndBypassFrame(i[0].replace('tidal.com/track', 'embed.tidal.com/tracks')));
|
||||
|
||||
for (let index = 0; index < tidalUrl.length; index++) {
|
||||
content = content.replace(tidalUrl[index][0], '');
|
||||
}
|
||||
}
|
||||
|
||||
if (this.optionsService.values.enableSpotify) {
|
||||
// After doing image, video and known memes, get all URLs and handle spotify.
|
||||
// After doing image, video and known memes, get all URLs and handle Spotify.
|
||||
const urls = [...content.matchAll(ContentComponent.regexpUrl)];
|
||||
const spotifyUrl = urls.filter((url) => url[0].indexOf('open.spotify.com') > -1);
|
||||
this.spotify = spotifyUrl.map((i) => this.utilities.sanitizeUrlAndBypassFrame(i[0].replace('open.spotify.com/', 'open.spotify.com/embed/')));
|
||||
|
Loading…
Reference in New Issue
Block a user