Skip to content

Instantly share code, notes, and snippets.

@jefo
Created February 15, 2017 14:50
Show Gist options
  • Save jefo/755d647c3c8f0fd445e951fb9cdebe84 to your computer and use it in GitHub Desktop.
Save jefo/755d647c3c8f0fd445e951fb9cdebe84 to your computer and use it in GitHub Desktop.
client-main-screen.component.ts
import {
Component,
OnInit,
ChangeDetectionStrategy,
ViewChild,
DoCheck,
Inject,
ChangeDetectorRef,
NgZone
} from '@angular/core';
import {ComponentInstruction} from 'angular2/router';
import {AsyncPipe, NgIf, COMMON_DIRECTIVES} from '@angular/common';
import {CanActivate, RouteConfig, Router, RouteParams} from '@angular/router-deprecated';
import {Reducer, Action, Store} from '@ngrx/store';
import {Observable} from 'rxjs/Observable';
import {BehaviorSubject} from 'rxjs/BehaviorSubject';
import {Map} from 'immutable';
import {includes} from 'lodash';
import {MenuPanelComponent} from '../menu-panel';
import {ClientMapComponent} from '../client-map';
import {TourTnx} from '../tour-tnx';
import {ClientMainScreenViewModel} from './client-main-screen.viewmodel';
import {ProxiesActions} from '../../proxies/proxies.actions';
import {ProxyInfoPopupComponent} from '../proxy-info-popup';
import {UserActions} from '../../users/users.actions';
import {RequestsActions} from '../../requests/requests.actions';
import {RequestsRtManager} from '../../requests/requests-rt-manager';
import {RequestsStore} from '../../requests/requests.store';
import {IUser, ICreateRequestResponse, IGetRequestResponse} from '../../api';
import {canActivateMainScreen, shouldActivate} from '../../common/helpers';
import {SearchLocationComponent} from '../search-location';
import {CreateRequestPopupComponent} from '../create-request-popop';
@Component({
selector: 'client-main-screen',
template: require('./client-main-screen.html'),
styles: [require('./client-main-screen.css')],
directives: [
COMMON_DIRECTIVES,
MenuPanelComponent,
ClientMapComponent,
ProxyInfoPopupComponent,
TourTnx,
SearchLocationComponent,
CreateRequestPopupComponent
],
providers: [ClientMainScreenViewModel],
pipes: [AsyncPipe],
changeDetection: ChangeDetectionStrategy.OnPush
})
@CanActivate(canActivateMainScreen)
export class ClientMainScreenComponent implements OnInit {
@ViewChild(ProxyInfoPopupComponent) proxyPopup: ProxyInfoPopupComponent;
slideUp: any = { 'page__wrapper__slideup': false };
showTourCompletedOverlay = false;
showSearch = false;
createRequestVisible = false;
private _timeoutId: any = false;
private _countUpdateInterval;
constructor(
private _proxiesActions: ProxiesActions,
private _usersActions: UserActions,
private _requestsManager: RequestsRtManager,
private _requestActions: RequestsActions,
private _requestsStore: RequestsStore,
private _store: Store<any>,
private _router: Router,
private _routeParams: RouteParams,
private _changeDetectorRef: ChangeDetectorRef,
zone: NgZone,
public vm: ClientMainScreenViewModel) {
this._proxiesActions.getProxiesCount();
this._proxiesActions.getOnlineProxies();
this._countUpdateInterval = setInterval(() =>
this._proxiesActions.getProxiesCount(), 60000);
}
routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction) {
let prevUrl = prev ? prev.urlPath : null;
if (prevUrl === '') {
this.slideUp['page__wrapper__slideup'] = true; // tslint:disable-line
}
}
showProxyPopup(userId: number) {
this._usersActions.getUser({ id: userId }).subscribe(user => {
this.proxyPopup.show(user);
});
}
onCreateRequestClick(userId) {
this._requestActions.create({ proxy_id: userId })
.subscribe((request) => {
this._requestsManager.subscribeToStatusChange(request.request_id);
this.proxyPopup.startTimer(59);
},
(err) => {
let message = '';
try {
message = err.json().proxy_id[0];
} catch (e) {
message = 'Unexpected error.';
}
this.proxyPopup.statusMessage = message;
});
}
ngOnInit() { }
ngAfterViewInit() {
this._requestsManager.on(['new'], (request, proxy) => {
this.proxyPopup.show(proxy);
this.proxyPopup.startTimer(59);
});
this._requestsManager.on(['accepted'], (request, proxy) => {
this.proxyPopup.statusMessage = 'Request was accepted.';
this.proxyPopup.show(proxy);
});
this._requestsManager.on(['halted', 'declined'], (request, proxy) => {
this.proxyPopup.statusMessage = request.status === 'declined'
? 'Request was declined.'
: 'Proxy did not respond.';
this.proxyPopup.show(proxy);
});
this._requestsManager.on(['online'], (request, proxy) => {
this._router.navigate(['Tour', { requestId: request.request_id }]);
});
this._requestsStore.currentRequest$.subscribe(request => {
if (request && request.status === 'completed') {
this.showTourCompletedOverlay = true;
}
});
this._requestsManager.restoreSubscription();
}
hideTourCompletedOverlay() {
this.showTourCompletedOverlay = false;
}
showCreateRequestPopup() {
this.createRequestVisible = true;
}
closeCreateRequestPopup() {
this.createRequestVisible = false;
}
ngOnChanges() {
console.log('main screen changed');
}
ngOnDestroy() {
clearInterval(this._countUpdateInterval);
clearTimeout(this._timeoutId);
}
onCommonRequestSubmit() {
this.createRequestVisible = false;
this.showSearch = true;
}
onSearch() {
this.showSearch = true;
}
onSearchCancel() {
this.showSearch = false;
}
onLogout() {
this._usersActions.logout();
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment