added refresh functionnality on columns

This commit is contained in:
Nicolas Constant 2019-02-18 23:45:35 -05:00
parent df9859de0b
commit 95ef1e0885
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
7 changed files with 99 additions and 43 deletions

View File

@ -6,9 +6,10 @@
<button class="btn-custom-secondary hashtag-header__add-column" (click)="addColumn($event)" title="add column to board">add column</button>
</a>
</div>
<app-stream-statuses class="hashtag-stream" *ngIf="hashtagElement"
<app-stream-statuses #appStreamStatuses class="hashtag-stream" *ngIf="hashtagElement"
[streamElement]="hashtagElement"
[goToTop]="goToTopSubject.asObservable()"
[userLocked]="false"
(browseAccountEvent)="browseAccount($event)"
(browseHashtagEvent)="browseHashtag($event)"
(browseThreadEvent)="browseThread($event)"></app-stream-statuses>

View File

@ -1,9 +1,10 @@
import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
import { Component, OnInit, Output, EventEmitter, Input, ViewChild } from '@angular/core';
import { Subject } from 'rxjs';
import { Store } from '@ngxs/store';
import { StreamElement, StreamTypeEnum, AddStream } from '../../../states/streams.state';
import { OpenThreadEvent } from '../../../services/tools.service';
import { StreamStatusesComponent } from '../stream-statuses/stream-statuses.component';
@Component({
selector: 'app-hashtag',
@ -11,12 +12,15 @@ import { OpenThreadEvent } from '../../../services/tools.service';
styleUrls: ['./hashtag.component.scss']
})
export class HashtagComponent implements OnInit {
@Output() browseAccountEvent = new EventEmitter<string>();
@Output() browseHashtagEvent = new EventEmitter<string>();
@Output() browseThreadEvent = new EventEmitter<OpenThreadEvent>();
@Input() hashtagElement: StreamElement;
@ViewChild('appStreamStatuses') appStreamStatuses: StreamStatusesComponent;
goToTopSubject: Subject<void> = new Subject<void>();
constructor(
@ -40,6 +44,10 @@ export class HashtagComponent implements OnInit {
return false;
}
refresh(): any {
this.appStreamStatuses.refresh();
}
browseAccount(account: string) {
this.browseAccountEvent.next(account);
}

View File

@ -6,15 +6,15 @@
<a href class="overlay-next" *ngIf="canGoForward" (click)="next()">NEXT</a>
</div>
<app-user-profile *ngIf="accountName" [currentAccount]="accountName"
<app-user-profile #appUserProfile *ngIf="accountName" [currentAccount]="accountName"
(browseAccountEvent)="browseAccount($event)"
(browseHashtagEvent)="browseHashtag($event)"
(browseThreadEvent)="browseThread($event)"></app-user-profile>
<app-hashtag *ngIf="hashtagElement" [hashtagElement]="hashtagElement"
<app-hashtag #appHashtag *ngIf="hashtagElement" [hashtagElement]="hashtagElement"
(browseAccountEvent)="browseAccount($event)"
(browseHashtagEvent)="browseHashtag($event)"
(browseThreadEvent)="browseThread($event)"></app-hashtag>
<app-thread *ngIf="browseThread" [currentThread]="thread"
<app-thread #appThread *ngIf="browseThread" [currentThread]="thread"
(browseAccountEvent)="browseAccount($event)"
(browseHashtagEvent)="browseHashtag($event)"
(browseThreadEvent)="browseThread($event)"></app-thread>

View File

@ -1,8 +1,10 @@
import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
import { Account, Results } from "../../../services/models/mastodon.interfaces";
import { MastodonService } from '../../../services/mastodon.service';
import { Component, OnInit, Output, EventEmitter, Input, ViewChild } from '@angular/core';
import { ToolsService, OpenThreadEvent } from '../../../services/tools.service';
import { StreamElement, StreamTypeEnum } from '../../../states/streams.state';
import { ThreadComponent } from '../thread/thread.component';
import { UserProfileComponent } from '../user-profile/user-profile.component';
import { HashtagComponent } from '../hashtag/hashtag.component';
@Component({
selector: 'app-stream-overlay',
@ -15,7 +17,7 @@ export class StreamOverlayComponent implements OnInit {
private nextElements: OverlayBrowsing[] = [];
private currentElement: OverlayBrowsing;
canRefresh: boolean;
canRefresh: boolean = true;
canGoForward: boolean;
accountName: string;
@ -41,7 +43,11 @@ export class StreamOverlayComponent implements OnInit {
this.browseHashtag(hashtag);
}
constructor(private toolsService: ToolsService) { }
@ViewChild('appUserProfile') appUserProfile: UserProfileComponent;
@ViewChild('appHashtag') appHashtag: HashtagComponent;
@ViewChild('appThread') appThread: ThreadComponent;
constructor(private readonly toolsService: ToolsService) { }
ngOnInit() {
}
@ -85,7 +91,14 @@ export class StreamOverlayComponent implements OnInit {
}
refresh(): boolean {
console.log('refresh');
if(this.thread){
this.appThread.refresh();
} else if(this.hashtagElement){
this.appHashtag.refresh();
} else if(this.accountName){
this.appUserProfile.refresh();
}
return false;
}

View File

@ -10,7 +10,7 @@ import { Status } from '../../../services/models/mastodon.interfaces';
import { MastodonService } from '../../../services/mastodon.service';
import { StatusWrapper } from '../stream.component';
import { NotificationService } from '../../../services/notification.service';
import { OpenThreadEvent } from '../../../services/tools.service';
import { OpenThreadEvent, ToolsService } from '../../../services/tools.service';
@Component({
selector: 'app-stream-statuses',
@ -18,6 +18,7 @@ import { OpenThreadEvent } from '../../../services/tools.service';
styleUrls: ['./stream-statuses.component.scss']
})
export class StreamStatusesComponent implements OnInit, OnDestroy {
isLoading = false; //TODO
displayError: string;
@ -35,17 +36,8 @@ export class StreamStatusesComponent implements OnInit, OnDestroy {
@Input()
set streamElement(streamElement: StreamElement) {
this.resetStream();
this._streamElement = streamElement;
const splitedUserName = streamElement.accountId.split('@');
const user = splitedUserName[0];
const instance = splitedUserName[1];
this.account = this.getRegisteredAccounts().find(x => x.username == user && x.instance == instance);
this.retrieveToots();
this.launchWebsocket();
this.load(this._streamElement);
}
get streamElement(): StreamElement {
return this._streamElement;
@ -53,10 +45,13 @@ export class StreamStatusesComponent implements OnInit, OnDestroy {
@Input() goToTop: Observable<void>;
@Input() userLocked = true;
private goToTopSubscription: Subscription;
constructor(
private readonly store: Store,
private readonly toolsService: ToolsService,
private readonly notificationService: NotificationService,
private readonly streamingService: StreamingService,
private readonly mastodonService: MastodonService) {
@ -68,14 +63,34 @@ export class StreamStatusesComponent implements OnInit, OnDestroy {
});
}
ngOnDestroy(){
if( this.goToTopSubscription) this.goToTopSubscription.unsubscribe();
ngOnDestroy() {
if (this.goToTopSubscription) this.goToTopSubscription.unsubscribe();
}
refresh(): any {
this.load(this._streamElement);
}
private load(streamElement: StreamElement) {
this.resetStream();
if (this.userLocked) {
const splitedUserName = streamElement.accountId.split('@');
const user = splitedUserName[0];
const instance = splitedUserName[1];
this.account = this.getRegisteredAccounts().find(x => x.username == user && x.instance == instance);
} else {
this.account = this.toolsService.getSelectedAccounts()[0];
}
this.retrieveToots();
this.launchWebsocket();
}
private resetStream() {
this.statuses.length = 0;
this.bufferStream.length = 0;
if(this.websocketStreaming) this.websocketStreaming.dispose();
if (this.websocketStreaming) this.websocketStreaming.dispose();
}
private launchWebsocket(): void {
@ -98,7 +113,7 @@ export class StreamStatusesComponent implements OnInit, OnDestroy {
});
}
@ViewChild('statusstream') public statustream: ElementRef;
private applyGoToTop(): boolean {
this.loadBuffer();
@ -118,7 +133,7 @@ export class StreamStatusesComponent implements OnInit, OnDestroy {
onScroll() {
var element = this.statustream.nativeElement as HTMLElement;
const atBottom = element.scrollHeight <= element.clientHeight + element.scrollTop + 1000;
const atBottom = element.scrollHeight <= element.clientHeight + element.scrollTop + 1000;
const atTop = element.scrollTop === 0;
this.streamPositionnedAtTop = false;
@ -151,15 +166,15 @@ export class StreamStatusesComponent implements OnInit, OnDestroy {
this.loadBuffer();
}
private loadBuffer(){
if(this.bufferWasCleared) {
private loadBuffer() {
if (this.bufferWasCleared) {
this.statuses.length = 0;
this.bufferWasCleared = false;
}
for (const status of this.bufferStream) {
const wrapper = new StatusWrapper(status, this.account);
this.statuses.unshift(wrapper);
this.statuses.unshift(wrapper);
}
this.bufferStream.length = 0;
@ -189,7 +204,7 @@ export class StreamStatusesComponent implements OnInit, OnDestroy {
return regAccounts;
}
private retrieveToots(): void {
this.mastodonService.getTimeline(this.account, this._streamElement.type, null, null, this.streamingService.nbStatusPerIteration, this._streamElement.tag, this._streamElement.list)
.then((results: Status[]) => {
@ -202,7 +217,7 @@ export class StreamStatusesComponent implements OnInit, OnDestroy {
this.notificationService.notifyHttpError(err);
});
}
private checkAndCleanUpStream(): void {
if (this.streamPositionnedAtTop && this.statuses.length > 3 * this.streamingService.nbStatusPerIteration) {
this.statuses.length = 2 * this.streamingService.nbStatusPerIteration;

View File

@ -13,11 +13,13 @@ import { AccountInfo } from '../../../states/accounts.state';
templateUrl: '../stream-statuses/stream-statuses.component.html',
styleUrls: ['../stream-statuses/stream-statuses.component.scss']
})
export class ThreadComponent implements OnInit {
export class ThreadComponent implements OnInit {
statuses: StatusWrapper[] = [];
isLoading: boolean;
displayError: string;
private lastThreadEvent: OpenThreadEvent;
@Output() browseAccountEvent = new EventEmitter<string>();
@Output() browseHashtagEvent = new EventEmitter<string>();
@Output() browseThreadEvent = new EventEmitter<OpenThreadEvent>();
@ -26,6 +28,7 @@ export class ThreadComponent implements OnInit {
set currentThread(thread: OpenThreadEvent) {
if (thread) {
this.isLoading = true;
this.lastThreadEvent = thread;
this.getThread(thread);
}
}
@ -93,6 +96,12 @@ export class ThreadComponent implements OnInit {
});
}
refresh(): any {
this.isLoading = true;
this.statuses.length = 0;
this.getThread(this.lastThreadEvent);
}
onScroll() {
//Do nothing
}

View File

@ -1,7 +1,7 @@
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { HttpErrorResponse } from '@angular/common/http';
import { Account, Status} from "../../../services/models/mastodon.interfaces";
import { Account, Status } from "../../../services/models/mastodon.interfaces";
import { MastodonService } from '../../../services/mastodon.service';
import { ToolsService, OpenThreadEvent } from '../../../services/tools.service';
import { StatusWrapper } from '../stream.component';
@ -13,6 +13,7 @@ import { NotificationService } from '../../../services/notification.service';
styleUrls: ['./user-profile.component.scss']
})
export class UserProfileComponent implements OnInit {
account: Account;
hasNote: boolean;
@ -22,7 +23,7 @@ export class UserProfileComponent implements OnInit {
statuses: StatusWrapper[] = [];
private accountName: string;
private lastAccountName: string;
@Output() browseAccountEvent = new EventEmitter<string>();
@Output() browseHashtagEvent = new EventEmitter<string>();
@ -31,6 +32,19 @@ export class UserProfileComponent implements OnInit {
@Input('currentAccount')
//set currentAccount(account: Account) {
set currentAccount(accountName: string) {
this.lastAccountName = accountName;
this.load(this.lastAccountName);
}
constructor(
private readonly notificationService: NotificationService,
private readonly mastodonService: MastodonService,
private readonly toolsService: ToolsService) { }
ngOnInit() {
}
private load(accountName: string) {
this.statuses.length = 0;
this.isLoading = true;
@ -49,12 +63,8 @@ export class UserProfileComponent implements OnInit {
});
}
constructor(
private readonly notificationService: NotificationService,
private readonly mastodonService: MastodonService,
private readonly toolsService: ToolsService) { }
ngOnInit() {
refresh(): any {
this.load(this.lastAccountName);
}
browseAccount(accountName: string): void {
@ -71,7 +81,7 @@ export class UserProfileComponent implements OnInit {
private loadAccount(accountName: string): Promise<Account> {
this.account = null;
this.accountName = accountName;
let selectedAccounts = this.toolsService.getSelectedAccounts();
if (selectedAccounts.length === 0) {
@ -100,6 +110,6 @@ export class UserProfileComponent implements OnInit {
this.statuses.push(wrapper);
}
this.statusLoading = false;
});
});
}
}