Mastodon
/
Sengi-Windows-MacOS-Linux
mirror of https://github.com/NicolasConstant/sengi
1
0
Fork 0
Code Issues Releases Wiki Activity

fix #80

This commit is contained in:
Nicolas Constant 2019-04-07 20:34:33 -04:00
parent 1e8e3201df
commit c42d23cd35
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
3 changed files with 84 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/components/floating-column/manage-account/my-account/my-account.component.html
View File

@ -1,7 +1,8 @@
<div class="my-account__body flexcroll">
<h4 class="my-account__label">add column:</h4>
<a class="my-account__link my-account__blue" href *ngFor="let stream of availableStreams" (click)="addStream(stream)">
{{ stream.name }}
<a class="my-account__link my-account__blue" href *ngFor="let stream of availableStreams"
(click)="addStream(stream)" title="{{ stream.isAdded ? '' : 'add stream'}}" [class.my-account__link--disabled]="stream.isAdded">
{{ stream.name }} <fa-icon class="my-account__link--icon" *ngIf="stream.isAdded" [icon]="faCheckSquare"></fa-icon>
</a>
<h4 class="my-account__label my-account__margin-top">remove account from sengi:</h4>
<a class="my-account__link my-account__red" href (click)="removeAccount()">

34
src/app/components/floating-column/manage-account/my-account/my-account.component.scss
View File

@ -20,18 +20,6 @@
margin-left: 5px;
color: $font-color-secondary;
}
&__link {
text-decoration: none;
display: block; // width: calc(100% - 20px);
width: 100%; // height: 30px;
padding: 5px 10px; // border: solid 1px black;
&:not(:last-child) {
margin-bottom: 5px;
}
}
&__margin-top {
margin-top: 25px;
}
&__blue {
background-color: $color-primary;
color: #fff;
@ -47,4 +35,26 @@
background-color: lighten($red-button-color, 15);
}
}
&__link {
text-decoration: none;
display: block; // width: calc(100% - 20px);
width: 100%; // height: 30px;
padding: 5px 10px; // border: solid 1px black;
&:not(:last-child) {
margin-bottom: 5px;
}
&--icon {
float: right;
}
&--disabled {
cursor: default;
background-color: darken($color-primary, 4);
&:hover {
background-color: darken($color-primary, 4);
}
}
}
&__margin-top {
margin-top: 25px;
}
}

73
src/app/components/floating-column/manage-account/my-account/my-account.component.ts
View File

@ -1,5 +1,7 @@
import { Component, OnInit, Input } from '@angular/core';
import { Store } from '@ngxs/store';
import { Component, OnInit, OnDestroy, Input } from '@angular/core';
import { Observable, Subscription } from 'rxjs';
import { Store, Select } from '@ngxs/store';
import { faCheckSquare } from "@fortawesome/free-regular-svg-icons";
import { NotificationService } from '../../../../services/notification.service';
import { StreamElement, StreamTypeEnum, AddStream, RemoveAllStreams } from '../../../../states/streams.state';
@ -12,11 +14,24 @@ import { NavigationService } from '../../../../services/navigation.service';
templateUrl: './my-account.component.html',
styleUrls: ['./my-account.component.scss']
})
export class MyAccountComponent implements OnInit {
export class MyAccountComponent implements OnInit, OnDestroy {
faCheckSquare = faCheckSquare;
availableStreams: StreamElement[] = [];
availableStreams: StreamWrapper[] = [];
@Input() account: AccountWrapper;
private _account: AccountWrapper;
@Input('account')
set account(acc: AccountWrapper) {
this._account = acc;
this.loadStreams(acc);
}
get account(): AccountWrapper {
return this._account;
}
@Select(state => state.streamsstatemodel.streams) streamElements$: Observable<StreamElement[]>;
private streamChangedSub: Subscription;
constructor(
private readonly store: Store,
@ -24,19 +39,41 @@ export class MyAccountComponent implements OnInit {
private notificationService: NotificationService) { }
ngOnInit() {
const instance = this.account.info.instance;
this.availableStreams.length = 0;
this.availableStreams.push(new StreamElement(StreamTypeEnum.global, 'Federated Timeline', this.account.info.id, null, null, instance));
this.availableStreams.push(new StreamElement(StreamTypeEnum.local, 'Local Timeline', this.account.info.id, null, null, instance));
this.availableStreams.push(new StreamElement(StreamTypeEnum.personnal, 'Home', this.account.info.id, null, null, instance));
this.streamChangedSub = this.streamElements$.subscribe((streams: StreamElement[]) => {
this.loadStreams(this.account);
});
}
addStream(stream: StreamElement): boolean {
if (stream) {
ngOnDestroy(): void {
if(this.streamChangedSub) {
this.streamChangedSub.unsubscribe();
}
}
private loadStreams(account: AccountWrapper){
const instance = account.info.instance;
this.availableStreams.length = 0;
this.availableStreams.push(new StreamWrapper(new StreamElement(StreamTypeEnum.global, 'Federated Timeline', account.info.id, null, null, instance)));
this.availableStreams.push(new StreamWrapper(new StreamElement(StreamTypeEnum.local, 'Local Timeline', account.info.id, null, null, instance)));
this.availableStreams.push(new StreamWrapper(new StreamElement(StreamTypeEnum.personnal, 'Home', account.info.id, null, null, instance)));
const loadedStreams = <StreamElement[]>this.store.snapshot().streamsstatemodel.streams;
this.availableStreams.forEach(s => {
if(loadedStreams.find(x => x.id === s.id)){
s.isAdded = true;
} else {
s.isAdded = false;
}
});
}
addStream(stream: StreamWrapper): boolean {
if (stream && !stream.isAdded) {
this.store.dispatch([new AddStream(stream)]).toPromise()
.then(() => {
this.notificationService.notify(`stream added`, false);
});
stream.isAdded = true;
//this.notificationService.notify(`stream added`, false);
});
}
return false;
}
@ -48,3 +85,11 @@ export class MyAccountComponent implements OnInit {
return false;
}
}
class StreamWrapper extends StreamElement {
constructor(stream: StreamElement) {
super(stream.type, stream.name, stream.accountId, stream.tag, stream.list, stream.instance);
}
isAdded: boolean;
}