Refactor .options to .values for OptionsService

This commit is contained in:
SondreB 2023-01-19 10:54:12 +01:00
parent 7cce43d649
commit 61d182afbc
No known key found for this signature in database
GPG Key ID: D6CC44C75005FDBF
21 changed files with 84 additions and 65 deletions

View File

@ -154,7 +154,7 @@
<div class="scrolling-content" infiniteScroll (scrollAction)="onInfiniteScroll()">
<router-outlet></router-outlet>
</div>
<app-media-player *ngIf="options.options.showMediaPlayer"></app-media-player>
<app-media-player *ngIf="options.values.showMediaPlayer"></app-media-player>
<!-- <div class="scrolling-content" appDetectScroll (onScroll)="onScroll($event)" [bottomOffset]="300" [topOffset]="300">
<router-outlet></router-outlet>

View File

@ -19,11 +19,11 @@
<mat-panel-description>{{ activeOptions() }}</mat-panel-description>
</mat-expansion-panel-header>
<!-- <p>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.options.flatfeed" (ngModelChange)="optionsUpdated()">Flat Feed (turn off threads)</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.options.ascending" (ngModelChange)="optionsUpdated()">Oldest first</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.options.paused">Pause feed</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.options.hideSpam" (ngModelChange)="optionsUpdated()">Hide spam</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.options.hideInvoice" (ngModelChange)="optionsUpdated()">Hide LN invoices</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.values.flatfeed" (ngModelChange)="optionsUpdated()">Flat Feed (turn off threads)</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.values.ascending" (ngModelChange)="optionsUpdated()">Oldest first</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.values.paused">Pause feed</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.values.hideSpam" (ngModelChange)="optionsUpdated()">Hide spam</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.values.hideInvoice" (ngModelChange)="optionsUpdated()">Hide LN invoices</mat-slide-toggle>
</p> -->
</mat-expansion-panel>
</mat-accordion>

View File

@ -146,17 +146,17 @@ export class FeedPrivateComponent {
feedChanged($event: any, type: string) {
if (type === 'public') {
// If user choose public and set the value to values, we'll turn on the private.
if (!this.options.options.publicFeed) {
this.options.options.privateFeed = true;
if (!this.options.values.publicFeed) {
this.options.values.privateFeed = true;
} else {
this.options.options.privateFeed = false;
this.options.values.privateFeed = false;
}
} else {
// If user choose private and set the value to values, we'll turn on the public.
if (!this.options.options.privateFeed) {
this.options.options.publicFeed = true;
if (!this.options.values.privateFeed) {
this.options.values.publicFeed = true;
} else {
this.options.options.publicFeed = false;
this.options.values.publicFeed = false;
}
}
}
@ -176,7 +176,7 @@ export class FeedPrivateComponent {
async ngOnInit() {
this.appState.updateTitle('Following Notes');
this.options.options.privateFeed = true;
this.options.values.privateFeed = true;
this.subscriptions.push(
this.navigation.showMore$.subscribe(() => {

View File

@ -11,9 +11,9 @@
<!-- <mat-slide-toggle class="options-slider" (change)="feedChanged($event, 'private')" [(ngModel)]="settings.options.privateFeed">My feed</mat-slide-toggle>
<mat-slide-toggle class="options-slider" (change)="feedChanged($event, 'public')" [(ngModel)]="settings.options.publicFeed">Public feed</mat-slide-toggle>
<br /><br /> -->
<mat-slide-toggle class="options-slider" [(ngModel)]="options.options.paused">Pause feed</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.options.hideSpam" (ngModelChange)="optionsUpdated()">Hide spam</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.options.hideInvoice" (ngModelChange)="optionsUpdated()">Hide LN invoices</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.values.paused">Pause feed</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.values.hideSpam" (ngModelChange)="optionsUpdated()">Hide spam</mat-slide-toggle>
<mat-slide-toggle class="options-slider" [(ngModel)]="options.values.hideInvoice" (ngModelChange)="optionsUpdated()">Hide LN invoices</mat-slide-toggle>
<!-- <mat-checkbox [(ngModel)]="settings.options.hideSpam" color="primary" (ngModelChange)="optionsUpdated()"> Only </mat-checkbox>
<mat-checkbox [(ngModel)]="settings.options.hideSpam" color="primary" (ngModelChange)="optionsUpdated()"> Hide spam </mat-checkbox>

View File

@ -52,13 +52,13 @@ export class FeedPublicComponent {
activeOptions() {
let options = '';
if (this.options.options.hideSpam) {
if (this.options.values.hideSpam) {
options += ' Spam: Filtered';
} else {
options += ' Spam: Allowed';
}
if (this.options.options.hideInvoice) {
if (this.options.values.hideInvoice) {
options += ' Invoices: Hidden';
} else {
options += ' Invoices: Displayed';
@ -97,7 +97,7 @@ export class FeedPublicComponent {
this.events = [];
this.sub.on('event', (originalEvent: any) => {
if (this.options.options.paused) {
if (this.options.values.paused) {
return;
}
@ -248,17 +248,17 @@ export class FeedPublicComponent {
feedChanged($event: any, type: string) {
if (type === 'public') {
// If user choose public and set the value to values, we'll turn on the private.
if (!this.options.options.publicFeed) {
this.options.options.privateFeed = true;
if (!this.options.values.publicFeed) {
this.options.values.privateFeed = true;
} else {
this.options.options.privateFeed = false;
this.options.values.privateFeed = false;
}
} else {
// If user choose private and set the value to values, we'll turn on the public.
if (!this.options.options.privateFeed) {
this.options.options.publicFeed = true;
if (!this.options.values.privateFeed) {
this.options.values.publicFeed = true;
} else {
this.options.options.publicFeed = false;
this.options.values.publicFeed = false;
}
}
}
@ -279,7 +279,7 @@ export class FeedPublicComponent {
);
async ngOnInit() {
this.options.options.privateFeed = true;
this.options.values.privateFeed = true;
// useReactiveContext // New construct in Angular 14 for subscription.
// https://medium.com/generic-ui/the-new-way-of-subscribing-in-an-angular-component-f74ef79a8ffc

View File

@ -138,17 +138,17 @@ export class FeedComponent {
feedChanged($event: any, type: string) {
if (type === 'public') {
// If user choose public and set the value to values, we'll turn on the private.
if (!this.options.options.publicFeed) {
this.options.options.privateFeed = true;
if (!this.options.values.publicFeed) {
this.options.values.privateFeed = true;
} else {
this.options.options.privateFeed = false;
this.options.values.privateFeed = false;
}
} else {
// If user choose private and set the value to values, we'll turn on the public.
if (!this.options.options.privateFeed) {
this.options.options.publicFeed = true;
if (!this.options.values.privateFeed) {
this.options.values.publicFeed = true;
} else {
this.options.options.publicFeed = false;
this.options.values.publicFeed = false;
}
}
}
@ -164,7 +164,7 @@ export class FeedComponent {
// }
async ngOnInit() {
this.options.options.privateFeed = true;
this.options.values.privateFeed = true;
// useReactiveContext // New construct in Angular 14 for subscription.
// https://medium.com/generic-ui/the-new-way-of-subscribing-in-an-angular-component-f74ef79a8ffc

View File

@ -460,17 +460,17 @@ export class HomeComponent {
feedChanged($event: any, type: string) {
if (type === 'public') {
// If user choose public and set the value to values, we'll turn on the private.
if (!this.options.options.publicFeed) {
this.options.options.privateFeed = true;
if (!this.options.values.publicFeed) {
this.options.values.privateFeed = true;
} else {
this.options.options.privateFeed = false;
this.options.values.privateFeed = false;
}
} else {
// If user choose private and set the value to values, we'll turn on the public.
if (!this.options.options.privateFeed) {
this.options.options.publicFeed = true;
if (!this.options.values.privateFeed) {
this.options.values.publicFeed = true;
} else {
this.options.options.publicFeed = false;
this.options.values.publicFeed = false;
}
}
}
@ -486,7 +486,7 @@ export class HomeComponent {
// }
async ngOnInit() {
this.options.options.privateFeed = true;
this.options.values.privateFeed = true;
// useReactiveContext // New construct in Angular 14 for subscription.
// https://medium.com/generic-ui/the-new-way-of-subscribing-in-an-angular-component-f74ef79a8ffc

View File

@ -8,7 +8,7 @@
<mat-panel-description></mat-panel-description>
</mat-expansion-panel-header>
<p>
<mat-slide-toggle class="options-slider" (change)="optionsService.save()" [(ngModel)]="optionsService.options.showLines">Show lines</mat-slide-toggle>
<mat-slide-toggle class="options-slider" (change)="optionsService.save()" [(ngModel)]="optionsService.values.showLines">Show lines</mat-slide-toggle>
</p>
</mat-expansion-panel>
</mat-accordion>
@ -45,7 +45,7 @@
<app-event-header [pubkey]="event.pubkey"> <app-date [date]="event.created_at"> </app-date> <app-directory-icon [pubkey]="event.pubkey"></app-directory-icon></app-event-header>
<app-event-actions [event]="event" [pubkey]="event.pubkey"></app-event-actions>
</div>
<app-content class="thread-content" [ngClass]="{ 'no-lines': !optionsService.options.showLines, 'lines': optionsService.options.showLines }" [event]="event"></app-content>
<app-content class="thread-content" [ngClass]="{ 'no-lines': !optionsService.values.showLines, 'lines': optionsService.values.showLines }" [event]="event"></app-content>
<app-event-reactions class="thread-reactions" [threadEntry]="thread.getTreeEntry(thread.threadId)"></app-event-reactions>
<app-event-buttons [event]="event"></app-event-buttons>
</div>
@ -55,7 +55,7 @@
<app-event-header [pubkey]="event.pubkey"><app-date [date]="event.created_at"> </app-date> <app-directory-icon [pubkey]="event.pubkey"></app-directory-icon></app-event-header>
<app-event-actions [event]="event" [pubkey]="event.pubkey"></app-event-actions>
</div>
<app-content class="thread-content" [ngClass]="{ 'no-lines': !optionsService.options.showLines, 'lines': optionsService.options.showLines }" [event]="event"></app-content>
<app-content class="thread-content" [ngClass]="{ 'no-lines': !optionsService.values.showLines, 'lines': optionsService.values.showLines }" [event]="event"></app-content>
<app-event-reactions class="thread-reactions" [threadEntry]="thread.getTreeEntry(thread.threadId)"></app-event-reactions>
<app-event-buttons [event]="event"></app-event-buttons>
<app-event-thread [threadEntry]="thread.getTreeEntry(thread.threadId)"></app-event-thread>

View File

@ -137,13 +137,13 @@ export class NoteComponent {
// activeOptions() {
// let options = '';
// if (this.options.options.hideSpam) {
// if (this.options.values.hideSpam) {
// options += ' Spam: Filtered';
// } else {
// options += ' Spam: Allowed';
// }
// if (this.options.options.hideInvoice) {
// if (this.options.values.hideInvoice) {
// options += ' Invoices: Hidden';
// } else {
// options += ' Invoices: Displayed';

View File

@ -41,13 +41,13 @@ export class DataValidation {
}
filterEvent(event: NostrEvent) {
if (this.options.options.hideInvoice) {
if (this.options.values.hideInvoice) {
if (event.content.indexOf('lnbc') > -1) {
return null;
}
}
if (this.options.options.hideSpam) {
if (this.options.values.hideSpam) {
// If the first 200 characters does not contain a space, just filter it out.
if (event.content.substring(0, 200).indexOf(' ') == -1) {
return null;

View File

@ -88,7 +88,7 @@
// get threadedEvents$(): Observable<NostrEventDocument[]> {
// return this.events$.pipe(
// map((data) => {
// if (this.options.options.flatfeed) {
// if (this.options.values.flatfeed) {
// return data;
// // return data.filter((events) => !events.tags.find((t) => t[0] === 'e'));
// } else {

View File

@ -70,12 +70,12 @@ export class MediaService {
this.index = -1;
this.current = undefined;
this.options.options.showMediaPlayer = false;
this.options.values.showMediaPlayer = false;
this.media = [];
}
play(file: MediaItem) {
this.options.options.showMediaPlayer = true;
this.options.values.showMediaPlayer = true;
this.media = [];
this.media.push(file);
@ -86,7 +86,7 @@ export class MediaService {
enque(file: MediaItem) {
// TODO: Clean the file.source URL!
this.options.options.showMediaPlayer = true;
this.options.values.showMediaPlayer = true;
this.media.push(file);
// this.snackBar.open('Added to media queue', 'Hide', {
// duration: 1500,
@ -110,7 +110,7 @@ export class MediaService {
this.current = file;
this.options.options.showMediaPlayer = true;
this.options.values.showMediaPlayer = true;
if (!this.audio) {
this.audio = new Audio(file.source);

View File

@ -10,6 +10,7 @@ export interface Options {
ascending?: boolean;
showLines: boolean;
showMediaPlayer?: boolean;
enableSpotify?: boolean;
}
@Injectable({
@ -20,16 +21,16 @@ export class OptionsService {
this.load();
}
options: Options = { showLines: true };
values: Options = { showLines: true };
load() {
let options = localStorage.getItem('blockcore:notes:nostr:options');
if (options) {
this.options = JSON.parse(options);
this.values = JSON.parse(options);
}
}
save() {
localStorage.setItem('blockcore:notes:nostr:options', JSON.stringify(this.options));
localStorage.setItem('blockcore:notes:nostr:options', JSON.stringify(this.values));
}
}

View File

@ -69,6 +69,15 @@
<div class="dimmed">Click the button to make Blockcore Notes handle links on websites for npub, nevent and nprofile.</div>
</mat-card-content>
</mat-card>
<br />
<!-- <mat-card>
<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>
</mat-card-content>
</mat-card> -->
</div>
</ng-template>
</mat-tab>

View File

@ -10,6 +10,7 @@ import { ProfileService } from '../services/profile';
import { RelayService } from '../services/relay';
import { ThemeService } from '../services/theme';
import { AddRelayDialog, AddRelayDialogData } from '../shared/add-relay-dialog/add-relay-dialog';
import { OptionsService } from '../services/options';
@Component({
selector: 'app-settings',
@ -24,7 +25,15 @@ export class SettingsComponent {
wipedNotes = false;
open = false;
constructor(public relayService: RelayService, public dialog: MatDialog, public appState: ApplicationState, private profileService: ProfileService, public theme: ThemeService, private db: StorageService) {}
constructor(
public optionsService: OptionsService,
public relayService: RelayService,
public dialog: MatDialog,
public appState: ApplicationState,
private profileService: ProfileService,
public theme: ThemeService,
private db: StorageService
) {}
toggle() {
if (this.open) {

View File

@ -37,7 +37,7 @@ export class ContentMusicComponent {
constructor(private options: OptionsService, private profileService: ProfileService, private utilities: Utilities, public dialog: MatDialog) {}
toggleMediaPlayer() {
this.options.options.showMediaPlayer = !this.options.options.showMediaPlayer;
this.options.values.showMediaPlayer = !this.options.values.showMediaPlayer;
}
mediaConnect() {

View File

@ -38,7 +38,7 @@ export class ContentPodcastComponent {
constructor(private media: MediaService, private options: OptionsService, private profileService: ProfileService, private utilities: Utilities, public dialog: MatDialog) {}
toggleMediaPlayer() {
this.options.options.showMediaPlayer = !this.options.options.showMediaPlayer;
this.options.values.showMediaPlayer = !this.options.values.showMediaPlayer;
}
play(title: string, artist: string, file: string, artwork: string) {

View File

@ -1,4 +1,4 @@
<div class="thread-actions" [ngClass]="{ 'no-lines': !optionsService.options.showLines, 'lines': optionsService.options.showLines }">
<div class="thread-actions" [ngClass]="{ 'no-lines': !optionsService.values.showLines, 'lines': optionsService.values.showLines }">
<ng-template [ngIf]="!replyOpen">
<mat-icon class="reaction-icon toolbar-icon" (click)="isEmojiPickerVisible = !isEmojiPickerVisible;" matTooltip="Reaction to post">sentiment_satisfied</mat-icon>
<emoji-mart class="picker" *ngIf="isEmojiPickerVisible" emoji="point_up" [isNative]="true" [showPreview]="true" (emojiSelect)="addEmoji($event)" title="Choose your reaction"></emoji-mart>

View File

@ -1,4 +1,4 @@
<div class="thread-reactions" [ngClass]="{ 'no-lines': !optionsService.options.showLines, lines: optionsService.options.showLines }" *ngIf="threadEntry?.boosts || threadEntry?.reactions">
<div class="thread-reactions" [ngClass]="{ 'no-lines': !optionsService.values.showLines, lines: optionsService.values.showLines }" *ngIf="threadEntry?.boosts || threadEntry?.reactions">
<span class="thread-reaction" *ngIf="threadEntry?.boosts">🔁 {{ threadEntry?.boosts }}</span>
<span class="thread-reaction" *ngFor="let item of threadEntry!.reactions | keyvalue"> {{ item.key }} {{ item.value }} </span>
</div>

View File

@ -1,10 +1,10 @@
<div class="thread-event" [ngClass]="{ 'no-lines': !optionsService.options.showLines, lines: optionsService.options.showLines }" *ngFor="let entry of threadEntry?.children">
<div class="thread-event" [ngClass]="{ 'no-lines': !optionsService.values.showLines, lines: optionsService.values.showLines }" *ngFor="let entry of threadEntry?.children">
<span *ngIf="thread.getEvent(entry.id) as event">
<div class="events-header">
<app-event-header [pubkey]="event.pubkey"><span class="event-date">{{ event.created_at | ago }}</span> <app-directory-icon [pubkey]="event.pubkey"></app-directory-icon></app-event-header>
<app-event-actions [event]="event" [pubkey]="event.pubkey"></app-event-actions>
</div>
<app-content class="thread-content" [ngClass]="{ 'no-lines': !optionsService.options.showLines, lines: optionsService.options.showLines }" [displayRepliesTo]="false" [event]="event"></app-content>
<app-content class="thread-content" [ngClass]="{ 'no-lines': !optionsService.values.showLines, lines: optionsService.values.showLines }" [displayRepliesTo]="false" [event]="event"></app-content>
<app-event-reactions [threadEntry]="thread.getTreeEntry(entry.id)"></app-event-reactions>
<app-event-buttons [event]="event"></app-event-buttons>
<app-event-thread [threadEntry]="thread.getTreeEntry(entry.id)"> </app-event-thread>

View File

@ -381,13 +381,13 @@ export class UserComponent {
activeOptions() {
let options = '';
if (this.options.options.hideSpam) {
if (this.options.values.hideSpam) {
options += ' Spam: Filtered';
} else {
options += ' Spam: Allowed';
}
if (this.options.options.hideInvoice) {
if (this.options.values.hideInvoice) {
options += ' Invoices: Hidden';
} else {
options += ' Invoices: Displayed';