Skip to content

Commit

Permalink
added config to populate the UI, added change event listeners to trig…
Browse files Browse the repository at this point in the history
…ger update call, added extra models and message classes for updating feeds
  • Loading branch information
sidequestlegend committed Jul 17, 2019
1 parent c3f3dd9 commit 51f33c5
Show file tree
Hide file tree
Showing 11 changed files with 241 additions and 129 deletions.
2 changes: 1 addition & 1 deletion frontend/src/app/app.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ export class AppComponent implements OnInit {
showBrowser: boolean = false;
resultJson = '';
modStatus = { CurrentStatus: '' };
config: BeatOnConfig = { IsCommitted: true, Config: null };
config: BeatOnConfig = { IsCommitted: true, Config: null, SyncConfig: null };
ngOnInit() {
this.checkModStatus();
}
Expand Down
11 changes: 6 additions & 5 deletions frontend/src/app/models/BeatOnConfig.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import { QuestomConfig } from './QuestomConfig';
import { SyncSaberConfig } from './SyncSaberConfig';

export interface BeatOnConfig
{
Config : QuestomConfig;
IsCommitted : boolean;
}
export interface BeatOnConfig {
Config: QuestomConfig;
IsCommitted: boolean;
SyncConfig: SyncSaberConfig;
}
9 changes: 9 additions & 0 deletions frontend/src/app/models/ClientSetBeastSaberUsername.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import { MessageBase, MessageType } from './MessageBase';

export class ClientSetBeastSaberUsername extends MessageBase {
constructor() {
super();
}
readonly Type: MessageType = MessageType.BeastSaberUsername;
BeastSaberUsername: string;
}
11 changes: 11 additions & 0 deletions frontend/src/app/models/ClientUpdateFeedReader.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import { MessageBase, MessageType } from './MessageBase';

export class ClientUpdateFeedReader extends MessageBase {
constructor() {
super();
}
readonly Type: MessageType = MessageType.UpdateFeedReader;
MaxSongs: number;
ID: string;
IsEnabled: boolean;
}
10 changes: 10 additions & 0 deletions frontend/src/app/models/FeedReader.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
export interface FeedReader {
DisplayName: string;
FeedType: number;
ID: string;
IsEnabled: boolean;
LastSyncAttempt: string;
LastSyncSuccess: string;
PlaylistID: string;
MaxSongs: number;
}
4 changes: 4 additions & 0 deletions frontend/src/app/models/MessageBase.ts
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
import { ClientSetBeastSaberUsername } from './ClientSetBeastSaberUsername';

export abstract class MessageBase {
constructor() {
this.MessageID = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
Expand Down Expand Up @@ -30,4 +32,6 @@ export enum MessageType {
MovePlaylist = <any>'MovePlaylist',
DeleteMod = <any>'DeleteMod',
ChangeColor = <any>'ChangeColor',
BeastSaberUsername = <any>'BeastSaberUsername',
UpdateFeedReader = <any>'UpdateFeedReader',
}
7 changes: 7 additions & 0 deletions frontend/src/app/models/SyncSaberConfig.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { FeedReader } from './FeedReader';

export interface SyncSaberConfig {
BeastSaberUsername: string;
CheckExistingSongsUpdated: boolean;
FeedReaders: FeedReader[];
}
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
<div class="vertical-align">
<mat-icon (click)="down()">navigate_before</mat-icon>{{maxSongs === 0 ? '∞' : maxSongs}} <mat-icon (click)="up()">navigate_next</mat-icon>
<mat-icon (click)="down()">navigate_before</mat-icon>{{reader.MaxSongs === 0 ? '∞' : reader.MaxSongs}} <mat-icon (click)="up()">navigate_next</mat-icon>
</div>
Original file line number Diff line number Diff line change
@@ -1,21 +1,25 @@
import { Component, Input, OnInit } from '@angular/core';
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { FeedReader } from '../models/FeedReader';

@Component({
selector: 'app-sync-saber-max-songs',
templateUrl: './sync-saber-max-songs.component.html',
styleUrls: ['./sync-saber-max-songs.component.scss'],
})
export class SyncSaberMaxSongsComponent implements OnInit {
@Input() maxSongs = 10;
@Input() reader: FeedReader;
@Output() update = new EventEmitter();
constructor() {}

ngOnInit() {}

down() {
this.maxSongs = this.maxSongs < 1 ? 0 : this.maxSongs - 10;
this.reader.MaxSongs = this.reader.MaxSongs < 1 ? 0 : this.reader.MaxSongs - 10;
this.update.emit();
}

up() {
this.maxSongs = this.maxSongs > 199 ? 200 : this.maxSongs + 10;
this.reader.MaxSongs = this.reader.MaxSongs > 199 ? 200 : this.reader.MaxSongs + 10;
this.update.emit();
}
}
223 changes: 107 additions & 116 deletions frontend/src/app/sync-saber/sync-saber.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,155 +12,146 @@
<div class="left-col">
<div class="right-select-all">Max Songs</div>
<h1>What's Popular

<mat-slide-toggle
class="enable-all"
[color]="color"
[checked]="checked"
[disabled]="disabled">
<mat-slide-toggle class="enable-all">
Enable All
</mat-slide-toggle>
</h1>
<hr>
<div class="left-padd-gate">
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
BeatSaver's Hot
</mat-slide-toggle>
<br><br>
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
BeatSaver's Latest
</mat-slide-toggle>
<br><br>
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
BeatSaver's Songs by Download
</mat-slide-toggle>
<br><br>
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
BeastSaber's Curator Recommended
</mat-slide-toggle>
<br><br>
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
ScoreSaber's Top Played
</mat-slide-toggle>
<br><br>
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
ScoreSaber's Trending
</mat-slide-toggle>

<div *ngIf="SyncService_BeatSaverHOT">
<app-sync-saber-max-songs class="right" [reader]="SyncService_BeatSaverHOT"
(update)="updateFeedSetting(SyncService_BeatSaverHOT)"></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_BeatSaverHOT.IsEnabled"
(change)="updateFeedSetting(SyncService_BeatSaverHOT)">
BeatSaver's Hot
</mat-slide-toggle>
<br><br>
</div>
<div *ngIf="SyncService_BeatSaverLATEST">
<app-sync-saber-max-songs class="right" [reader]="SyncService_BeatSaverLATEST"
(update)="updateFeedSetting(SyncService_BeatSaverLATEST)"></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_BeatSaverLATEST.IsEnabled"
(change)="updateFeedSetting(SyncService_BeatSaverLATEST)">
BeatSaver's Latest
</mat-slide-toggle>
<br><br>
</div>
<div *ngIf="SyncService_BeatSaverDOWNLOADS">
<app-sync-saber-max-songs class="right" [reader]="SyncService_BeatSaverDOWNLOADS"
(update)="updateFeedSetting(SyncService_BeatSaverDOWNLOADS)"></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_BeatSaverDOWNLOADS.IsEnabled"
(change)="updateFeedSetting(SyncService_BeatSaverDOWNLOADS)">
BeatSaver's Songs by Download
</mat-slide-toggle>
<br><br>
</div>
<div *ngIf="SyncService_BeastSaberCURATOR_RECOMMENDED">
<app-sync-saber-max-songs class="right" [reader]="SyncService_BeastSaberCURATOR_RECOMMENDED"
(update)="updateFeedSetting(SyncService_BeastSaberCURATOR_RECOMMENDED)"></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_BeastSaberCURATOR_RECOMMENDED.IsEnabled"
(change)="updateFeedSetting(SyncService_BeastSaberCURATOR_RECOMMENDED)">
BeastSaber's Curator Recommended
</mat-slide-toggle>
<br><br>
</div>
<div *ngIf="SyncService_ScoreSaberTOP_PLAYED">
<app-sync-saber-max-songs class="right" [reader]="SyncService_ScoreSaberTOP_PLAYED"
(update)="updateFeedSetting(SyncService_ScoreSaberTOP_PLAYED)"></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_ScoreSaberTOP_PLAYED.IsEnabled"
(change)="updateFeedSetting(SyncService_ScoreSaberTOP_PLAYED)">
ScoreSaber's Top Played
</mat-slide-toggle>
<br><br>
</div>
<div *ngIf="SyncService_ScoreSaberTRENDING">
<app-sync-saber-max-songs class="right" [reader]="SyncService_ScoreSaberTRENDING"
(update)="updateFeedSetting(SyncService_ScoreSaberTRENDING)"></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_ScoreSaberTRENDING.IsEnabled"
(change)="updateFeedSetting(SyncService_ScoreSaberTRENDING)">
ScoreSaber's Trending
</mat-slide-toggle>
</div>

</div>


<br><br><br>
<div class="right-select-all">Max Songs</div>
<h1>For a Challenge

<mat-slide-toggle
class="enable-all"
[color]="color"
[checked]="checked"
[disabled]="disabled">
<mat-slide-toggle class="enable-all">
Enable All
</mat-slide-toggle></h1>
<hr>
<div class="left-padd-gate">
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
ScoreSaber's Latest
</mat-slide-toggle>
<br><br>
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
ScoreSaber's Top Ranked
</mat-slide-toggle>
<div *ngIf="SyncService_ScoreSaberTOP_RANKED">
<app-sync-saber-max-songs class="right" [reader]="SyncService_ScoreSaberLATEST_RANKED"
(update)="updateFeedSetting(SyncService_ScoreSaberLATEST_RANKED)"></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_ScoreSaberLATEST_RANKED.IsEnabled"
(change)="updateFeedSetting(SyncService_ScoreSaberLATEST_RANKED)">
ScoreSaber's Latest
</mat-slide-toggle>
<br><br>
</div>
<div *ngIf="SyncService_ScoreSaberTOP_RANKED">
<app-sync-saber-max-songs class="right"
[reader]="SyncService_ScoreSaberTOP_RANKED"
(update)="updateFeedSetting(SyncService_ScoreSaberTOP_RANKED)"
></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_ScoreSaberTOP_RANKED.IsEnabled"
(change)="updateFeedSetting(SyncService_ScoreSaberTOP_RANKED)">
ScoreSaber's Top Ranked
</mat-slide-toggle>
</div>
</div>
</div>
<div class="right-col">
<div class="right-select-all">Max Songs</div>
<h1>For Me

<mat-slide-toggle
class="enable-all"
[color]="color"
[checked]="checked"
[disabled]="disabled">
<mat-slide-toggle class="enable-all">
Enable All
</mat-slide-toggle></h1>
<hr>

<div class="left-padd-gate">
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
BeastSaber's Following
</mat-slide-toggle>
<br><br>
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
BeastSaber's Bookmarks
</mat-slide-toggle>
<br><br>
<app-sync-saber-max-songs class="right"></app-sync-saber-max-songs>
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
BeatSaver's Authors
</mat-slide-toggle>
<div *ngIf="SyncService_BeastSaberFOLLOWING">
<app-sync-saber-max-songs class="right" [reader]="SyncService_BeastSaberFOLLOWING"
(update)="updateFeedSetting(SyncService_BeastSaberFOLLOWING)"></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_BeastSaberFOLLOWING.IsEnabled"
(change)="updateFeedSetting(SyncService_BeastSaberFOLLOWING)">
BeastSaber's Following
</mat-slide-toggle>
<br><br>
</div>
<div *ngIf="SyncService_BeastSaberBOOKMARKS">
<app-sync-saber-max-songs class="right"
[reader]="SyncService_BeastSaberBOOKMARKS"
(update)="updateFeedSetting(SyncService_BeastSaberBOOKMARKS)"
></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_BeastSaberBOOKMARKS.IsEnabled"
(change)="updateFeedSetting(SyncService_BeastSaberBOOKMARKS)">
BeastSaber's Bookmarks
</mat-slide-toggle>
<br><br>
</div>

<div *ngIf="SyncService_BeatSaverAUTHOR">
<app-sync-saber-max-songs class="right"
[reader]="SyncService_BeatSaverAUTHOR"
(update)="updateFeedSetting(SyncService_BeatSaverAUTHOR)"
></app-sync-saber-max-songs>
<mat-slide-toggle [(ngModel)]="SyncService_BeatSaverAUTHOR.IsEnabled"
(change)="updateFeedSetting(SyncService_BeatSaverAUTHOR)">
BeatSaver's Authors
</mat-slide-toggle>
</div>
</div>
<br><br><br>
<h1>My Username</h1>
<hr>
<div class="username-container">
<br><br><br>
<mat-form-field class="input-width">
<input matInput placeholder="Beast Saber Username" value="">
<input matInput placeholder="Beast Saber Username" [(ngModel)]="BeastSaberUsername" (input)="setBeastSaberUsername()">
</mat-form-field>
</div>
</div>
Expand Down
Loading

0 comments on commit 51f33c5

Please sign in to comment.