Merge branch 'max_dev' of Software_Engineering_I/greenvironment-frontend into master

master
Trivernis 5 years ago committed by Gitea
commit 6d19d555a6

@ -45,6 +45,8 @@ import { OverlayModule} from '@angular/cdk/overlay';
import {MatSlideToggleModule} from '@angular/material/slide-toggle';
import {MatMenuModule} from '@angular/material/menu';
import {MatRippleModule} from '@angular/material/core';
import {MatBadgeModule} from '@angular/material/badge';
import {MatProgressSpinnerModule} from '@angular/material/progress-spinner';
import { FlexLayoutModule } from '@angular/flex-layout';
import { MainNavigationComponent } from './components/main-navigation/main-navigation.component';
@ -122,7 +124,9 @@ const appRoutes: Routes = [
MatMenuModule,
MatRippleModule,
MatTableModule,
MatSortModule
MatSortModule,
MatBadgeModule,
MatProgressSpinnerModule
],
providers: [],
bootstrap: [AppComponent]

@ -1,8 +1,3 @@
<!--<div id="postinput">
<textarea #content id='input' placeholder="Post something ..." rows='3' wrap="soft"></textarea>
<button id="attach" type='submit'><span><i class="fa fa-paperclip fa-2x" aria-hidden="true"></i></span></button>
<button id="submit" type='submit' (click)=createPost(content)><span><i class="fa fa-send-o fa-2x" aria-hidden="true"></i></span></button>
</div>-->
<div id="home">
<mat-card >
<mat-card-content>
@ -36,10 +31,6 @@
</mat-button-toggle-group>
</div>
<div id="complete-feed">
<!--<div id='feedchooser'>
<button id="new" (click)="showNew()">New</button>
<button id='mostliked' (click)="showMostLiked()">Most Liked</button>
</div>-->
<div id="feedlist">
<div *ngIf = "viewNew">
<feed-postlist (voteEvent)="refresh($event)" [childPostList]="parentSelectedPostList"></feed-postlist>
@ -47,6 +38,7 @@
<div *ngIf = "viewMostLiked">
<feed-postlist (voteEvent)="refresh($event)" [childPostList]="parentSelectedPostList"></feed-postlist>
</div>
<mat-spinner *ngIf="loading" style="margin:0 auto; margin-top: 5em;" diameter="50"></mat-spinner>
</div>
</div>
</div>

@ -11,6 +11,7 @@ import { User } from 'src/app/models/user';
styleUrls: ['./feed.component.sass']
})
export class FeedComponent implements OnInit {
loading = true;
checked: boolean; // if the "I protected the environment."-box is checked
empty: boolean;
// points value of the green action
@ -38,6 +39,7 @@ export class FeedComponent implements OnInit {
if (this.loggedIn) {
this.userId = user.userID;
this.feedService.getAllPostsRawByUserId(this.userId).subscribe(response => {
this.loading = false;
this.feedNew = this.feedService.renderAllPosts(response.json());
this.parentSelectedPostList = this.feedNew;
this.feedMostLiked = this.feedNew;
@ -45,6 +47,7 @@ export class FeedComponent implements OnInit {
});
} else {
this.feedService.getAllPostsRaw().subscribe(response => {
this.loading = false;
this.feedNew = this.feedService.renderAllPosts(response.json());
this.parentSelectedPostList = this.feedNew;
this.feedMostLiked = this.feedNew;

@ -57,21 +57,23 @@
</nav>
<div id="menu-button-box">
<button mat-icon-button [matMenuTriggerFor]="requestMenu" [disabled]="!loggedIn" id="menu-button">
<mat-icon >notifications</mat-icon>
<mat-icon [matBadge]="user.receivedRequests.length" [matBadgeHidden]="!(user.receivedRequests.length > 0)" matBadgeColor="accent">notifications</mat-icon>
</button>
<button mat-icon-button [matMenuTriggerFor]="menu" id="menu-button">
<mat-icon>more_vert</mat-icon>
</button>
</div>
<mat-menu #requestMenu="matMenu">
<button mat-menu-item (click)="$event.stopPropagation();">
<button mat-icon-button>
<span mat-menu-item disableRipple="true" disabled="true">friend requests:</span>
<button mat-menu-item *ngFor = "let request of user.receivedRequests" [class.selected]="request === selectedRequest" (click)="$event.stopPropagation();" disableRipple="true">
<button mat-icon-button (click)=acceptRequest(request.senderUserID) (click)="$event.stopPropagation();">
<mat-icon>check</mat-icon>
</button>
<button mat-icon-button>
<button mat-icon-button (click)=denyRequest(request.senderUserID) (click)="$event.stopPropagation();">
<mat-icon>close</mat-icon>
</button>
<span>request</span>
<span>{{request.senderUsername}}</span>
<span>&nbsp; @{{request.senderHandle}}</span>
</button>
</mat-menu>
<mat-menu #menu="matMenu">

@ -26,7 +26,6 @@
.mat-tab-link
height: 56px
#link-box
padding: 0.5em

@ -4,6 +4,7 @@ import { Observable } from 'rxjs';
import { map, shareReplay } from 'rxjs/operators';
import { DatasharingService } from '../../services/datasharing.service';
import { SelfService } from '../../services/selfservice/self.service';
import { RequestService } from '../../services/request/request.service';
import { environment } from 'src/environments/environment';
import { Levellist } from 'src/app/models/levellist';
import { Http } from '@angular/http';
@ -22,6 +23,7 @@ export class MainNavigationComponent implements OnInit {
public overlayContainer: OverlayContainer,
private data: DatasharingService,
private selfservice: SelfService,
private requestservice: RequestService,
private breakpointObserver: BreakpointObserver,
private http: Http, private router: Router
) {
@ -102,11 +104,9 @@ export class MainNavigationComponent implements OnInit {
const headers = new Headers();
headers.set('Content-Type', 'application/json');
const body = {query: `mutation {
logout
}`};
this.http.post(url, body).subscribe(response => {
console.log(response.text()); });
this.loggedIn = false;
@ -115,4 +115,34 @@ export class MainNavigationComponent implements OnInit {
this.data.changeUserInfo(user);
this.router.navigate(['login']);
}
acceptRequest(id: number) {
for (let i = 0; i < this.user.receivedRequests.length; i++) {
if (this.user.receivedRequests[i].senderUserID === id) {
this.user.receivedRequests.splice(i, 1);
return;
}
}
const headers = new Headers();
headers.set('Content-Type', 'application/json');
this.http.post(environment.graphQLUrl, this.requestservice.buildJsonAcceptRequest(id))
.subscribe(response => {
console.log(response);
});
}
denyRequest(id: number) {
for (let i = 0; i < this.user.receivedRequests.length; i++) {
if (this.user.receivedRequests[i].senderUserID === id) {
this.user.receivedRequests.splice(i, 1);
return;
}
}
const headers = new Headers();
headers.set('Content-Type', 'application/json');
this.http.post(environment.graphQLUrl, this.requestservice.buildJsonDenyRequest(id))
.subscribe(response => {
console.log(response);
});
}
}

@ -55,7 +55,6 @@ export class ProfileComponent implements OnInit {
this.user.points = response.data.getUser.points;
this.user.level = response.data.getUser.level;
this.rankname = this.levellist.getLevelName(this.user.level);
this.user.friendIDs = response.data.getUser.friends;
} else {
this.profileNotFound = true;
}

@ -32,9 +32,11 @@
<mat-card-title class="pointer" (click)="showUserProfile(user)">{{user.username}}</mat-card-title>
<mat-card-subtitle class="pointer" (click)="showUserProfile(user)">{{user.handle}}</mat-card-subtitle>
<div class="icon-box">
<button mat-icon-button class="request-button" (click)="sendFriendRequest(user)"><mat-icon>person_add</mat-icon></button>
<button mat-icon-button class="request-button" (click)="sendFriendRequest(user)" [disabled]="!user.allowedToSendRequest"><mat-icon>person_add</mat-icon></button>
</div>
</mat-card-header>
</mat-card>
<mat-spinner *ngIf="loading" style="margin:0 auto; margin-top: 5em;" diameter="50"></mat-spinner>
</div>
</div>

@ -5,6 +5,7 @@ import {Headers, Http} from '@angular/http';
import { User } from 'src/app/models/user';
import {environment} from 'src/environments/environment';
import { Router } from '@angular/router';
import { DatasharingService } from '../../services/datasharing.service';
@Component({
selector: 'home-search',
@ -12,16 +13,22 @@ import { Router } from '@angular/router';
styleUrls: ['./search.component.sass']
})
export class SearchComponent implements OnInit {
loading = false;
searchValue = ' ';
category = 'user';
user: User;
foundUsers: Array<User>;
constructor(
private searchService: SearchService,
private requestService: RequestService,
private http: Http,
private router: Router) { }
private router: Router,
private data: DatasharingService) { }
ngOnInit() {
this.data.currentUserInfo.subscribe(user => {
this.user = user;
});
}
changeCategory(value: string) {
@ -34,6 +41,7 @@ export class SearchComponent implements OnInit {
this.searchValue = searchWord;
if (searchWord) { // if not null or empty
if (this.category === 'user') {
this.loading = true;
this.findUser(searchWord);
} else if (this.category === 'groupe') {
// this.findUserByHandle(searchWord);
@ -47,9 +55,28 @@ export class SearchComponent implements OnInit {
headers.set('Content-Type', 'application/json');
this.http.post(environment.graphQLUrl, this.searchService.buildJsonUser(name))
.subscribe(response => {
console.log('response received');
console.log(response);
this.foundUsers = this.searchService.renderUsers(response.json());
for (const foundUser of this.foundUsers) {
if (!this.user.loggedIn) {foundUser.allowedToSendRequest = false; } else {
for (const receiverID of this.user.sentRequestUserIDs) {
if (foundUser.userID === receiverID ||
foundUser.userID === this.user.userID) {
foundUser.allowedToSendRequest = false;
}
}
for (const friend of this.user.friends) {
if (foundUser.userID === friend.id) {
foundUser.allowedToSendRequest = false;
}
}
for (const sender of this.user.receivedRequests) {
if (foundUser.userID === sender.senderUserID) {
foundUser.allowedToSendRequest = false;
}
}
}
}
this.loading = false;
});
}
@ -58,12 +85,11 @@ export class SearchComponent implements OnInit {
}
public sendFriendRequest(user: User) {
user.allowedToSendRequest = false;
const headers = new Headers();
headers.set('Content-Type', 'application/json');
this.http.post(environment.graphQLUrl, this.requestService.buildJsonRequest(user.userID, 'FRIENDREQUEST'))
.subscribe(response => {
console.log('response received');
console.log(response);
});
}
}

@ -1,8 +1,3 @@
<!--<div id="header">
<span class="title">Friends</span>
<button id="new" type="submit"><span><i class="fa fa-plus fa-3x" aria-hidden="true"></i></span></button>
<button id="invitations" type="submit"><span><i class="fa fa-envelope-o fa-3x" aria-hidden="true"></i></span></button>
</div>-->
<mat-toolbar>
<span>Friends</span>
<div id="button-box">
@ -10,12 +5,7 @@
</div>
</mat-toolbar>
<div id="friendlist">
<!--<div class="frienditem" *ngFor="let friend of friends"
[class.selected]="friend === selectedFriend" (click)="showFriendProfile(friend)">
<div class="picture">Pic</div>
<div class="name"><span>{{friend.name}}</span></div>
</div>-->
<mat-card class="friend-card" *ngFor="let friend of friends"
<mat-card class="friend-card" *ngFor="let friend of user.friends"
[class.selected]="friend === selectedFriend" (click)="showFriendProfile(friend)"
tabindex="0"
matRipple>

@ -4,6 +4,7 @@ import { Http } from '@angular/http';
import { FriendInfo } from 'src/app/models/friendinfo';
import { Router } from '@angular/router';
import { environment } from 'src/environments/environment';
import { User } from 'src/app/models/user';
@Component({
selector: 'social-friends',
@ -11,44 +12,12 @@ import { environment } from 'src/environments/environment';
styleUrls: ['./friends.component.sass']
})
export class FriendsComponent implements OnInit {
friendIDs: number[] = [29, 27, 30, 31];
friends = new Array<FriendInfo>(); // = ["Friend 1", "Friend 2", "Friend 3", "Friend 4", "Friend 5", "Friend 6"]
user: User;
constructor(private data: DatasharingService, private http: Http, private router: Router) { }
ngOnInit() {
// this.data.currentUserInfo.subscribe(user => {
// this.friendIDs = user.friendIDs})
this.getFriendsNames();
}
getFriendsNames() {
for (const id of this.friendIDs) {
const url = environment.graphQLUrl;
const headers = new Headers();
headers.set('Content-Type', 'application/json');
this.http.post(url, this.buildJson(id))
.subscribe(response => {this.readOutFriendsNames(id, response.json()); });
}
}
readOutFriendsNames(pId: number, pResponse: any) {
this.friends.push(new FriendInfo(pId, pResponse.data.getUser.name, pResponse.data.getUser.level ));
}
buildJson(pId: number): any {
const body = {query: `query($userId: ID) {
getUser(userId:$userId) {
name
level
}
}`, variables: {
userId: pId
}};
return body;
this.data.currentUserInfo.subscribe(user => {
this.user = user; });
}
public showFriendProfile(pFriend: FriendInfo) {

@ -0,0 +1,8 @@
import { User } from 'src/app/models/user';
export class FriendRequest {
id: number;
senderUserID: number;
senderHandle: string;
senderUsername: string;
}

@ -1,5 +1,8 @@
import { FriendRequest } from 'src/app/models/friendRequest';
import { FriendInfo } from 'src/app/models/friendinfo';
export class User {
loggedIn: boolean;
loggedIn = false;
userID: number;
username: string;
handle: string;
@ -8,9 +11,11 @@ export class User {
level: number;
profilePicture: string;
friendIDs: number[];
friends: FriendInfo[] = new Array();
groupIDs: number[];
chatIDs: number[];
requestIDs: number[];
receivedRequests: FriendRequest[] = new Array();
sentRequestUserIDs: number[] = new Array(); // IDs of users that already received requests of the logged in user
allowedToSendRequest = true; /* if a user already received a request this should
be false to avoid multiple invitations*/
}

@ -15,6 +15,7 @@ export class DatasharingService {
constructor() { }
changeUserInfo(pUserInfo: User) {
console.log('DatasharingService: user info updated');
this.userInfoSource.next(pUserInfo);
}

@ -1,10 +1,12 @@
import {Injectable} from '@angular/core';
import {Headers, Http} from '@angular/http';
import {Headers, Http, Request} from '@angular/http';
import {Login} from '../../models/login';
import {User} from 'src/app/models/user';
import {DatasharingService} from '../datasharing.service';
import {Router} from '@angular/router';
import {environment} from 'src/environments/environment';
import { FriendRequest } from 'src/app/models/friendRequest';
import { FriendInfo } from 'src/app/models/friendinfo';
@Injectable({
providedIn: 'root'
@ -35,6 +37,7 @@ export class LoginService {
public updateUserInfo(response: any) {
const user: User = new User();
let friendRequest: FriendRequest = new FriendRequest();
user.loggedIn = true;
user.userID = response.data.login.id;
user.username = response.data.login.name;
@ -42,13 +45,24 @@ export class LoginService {
user.email = response.data.login.email;
user.points = response.data.login.points;
user.level = response.data.login.level;
user.friendIDs = response.data.login.friends;
for (const friend of response.data.login.friends) {
user.friends.push(new FriendInfo(friend.id, friend.name, friend.level));
}
user.groupIDs = response.data.login.groups;
user.chatIDs = response.data.login.chats;
user.requestIDs = response.data.login.requests;
for (const request of response.data.login.sentRequests) {
user.sentRequestUserIDs.push(request.receiver.id);
}
for (const request of response.data.login.receivedRequests) {
friendRequest = new FriendRequest();
friendRequest.id = request.id;
friendRequest.senderUserID = request.sender.id;
friendRequest.senderUsername = request.sender.name;
friendRequest.senderHandle = request.sender.handle;
user.receivedRequests.push(friendRequest);
}
console.log(user.friends);
this.data.changeUserInfo(user);
}
public buildJson(login: Login): any {
@ -61,8 +75,12 @@ export class LoginService {
handle,
points,
level,
receivedRequests{id, sender{name, handle, id}},
sentRequests{receiver{id}},
friends {
id
id,
name,
level
},
groups {
id

@ -5,6 +5,8 @@ import {Router} from '@angular/router';
import { DatasharingService } from '../datasharing.service';
import { User } from 'src/app/models/user';
import { environment } from 'src/environments/environment';
import { FriendRequest } from 'src/app/models/friendRequest';
import { FriendInfo } from 'src/app/models/friendinfo';
@Injectable({
providedIn: 'root'
@ -38,6 +40,7 @@ export class RegisterService {
public updateUserInfo(response: any) {
const user: User = new User();
let friendRequest: FriendRequest = new FriendRequest();
user.loggedIn = true;
user.userID = response.data.register.id;
user.username = response.data.register.name;
@ -45,11 +48,22 @@ export class RegisterService {
user.email = response.data.register.email;
user.points = response.data.register.points;
user.level = response.data.register.level;
user.friendIDs = response.data.register.friends;
for (const friend of response.data.login.friends) {
user.friends.push(new FriendInfo(friend.id, friend.name, friend.level));
}
user.groupIDs = response.data.register.groups;
user.chatIDs = response.data.register.chats;
user.requestIDs = response.data.register.requests;
for (const request of response.data.register.sentRequests) {
user.sentRequestUserIDs.push(request.receiver.id);
}
for (const request of response.data.login.receivedRequests) {
friendRequest = new FriendRequest();
friendRequest.id = request.id;
friendRequest.senderUserID = request.sender.id;
friendRequest.senderUsername = request.sender.name;
friendRequest.senderHandle = request.sender.handle;
user.receivedRequests.push(friendRequest);
}
this.data.changeUserInfo(user);
}
@ -62,7 +76,13 @@ export class RegisterService {
handle,
points,
level,
friends{id},
receivedRequests{id, sender{name, handle, id}},
sentRequests{receiver{id}}
friends {
id,
name,
level
},
groups{id},
chats{id}
}

@ -27,4 +27,29 @@ export class RequestService {
};
return body;
}
public buildJsonAcceptRequest(id_: number): any {
const body = {
query: `mutation($id: ID!) {
acceptRequest(sender: $id, type: FRIENDREQUEST)
}`
, variables: {
id: id_
}
};
return body;
}
public buildJsonDenyRequest(id_: number): any {
const body = {
query: `mutation($id: ID!) {
denyRequest(sender: $id, type: FRIENDREQUEST)
}`
, variables: {
id: id_
}
};
return body;
}
}

@ -24,7 +24,7 @@ export class SearchService {
pUser.handle = user.handle;
pUser.points = user.points;
pUser.level = user.level;
pUser.friendIDs = user.friends;
pUser.friends = user.friends;
users.push(pUser);
}
return users;

@ -6,6 +6,8 @@ import { DatasharingService } from '../datasharing.service';
import { userInfo } from 'os';
import {Router} from '@angular/router';
import { environment } from 'src/environments/environment';
import { FriendRequest } from 'src/app/models/friendRequest';
import { FriendInfo } from 'src/app/models/friendinfo';
@Injectable({
providedIn: 'root'
@ -43,6 +45,7 @@ export class SelfService {
public updateUserInfo(response: any) {
const user: User = new User();
let friendRequest: FriendRequest = new FriendRequest();
user.loggedIn = true;
user.userID = response.data.getSelf.id;
user.username = response.data.getSelf.name;
@ -50,17 +53,48 @@ export class SelfService {
user.email = response.data.getSelf.email;
user.points = response.data.getSelf.points;
user.level = response.data.getSelf.level;
user.friendIDs = response.data.getSelf.friends;
for (const friend of response.data.login.friends) {
user.friends.push(new FriendInfo(friend.id, friend.name, friend.level));
}
user.groupIDs = response.data.getSelf.groups;
user.chatIDs = response.data.getSelf.chats;
user.requestIDs = response.data.getSelf.requests;
for (const request of response.data.getSelf.sentRequests) {
user.sentRequestUserIDs.push(request.receiver.id);
}
for (const request of response.data.login.receivedRequests) {
friendRequest = new FriendRequest();
friendRequest.id = request.id;
friendRequest.senderUserID = request.sender.id;
friendRequest.senderUsername = request.sender.name;
friendRequest.senderHandle = request.sender.handle;
user.receivedRequests.push(friendRequest);
}
this.data.changeUserInfo(user);
}
public buildJson(): any {
const body = {query: `{
getSelf{id, name,email, handle, points, level, friends{id}, groups{id},chats{id}}
getSelf{
id,
name,
email,
handle,
points,
level,
receivedRequests{id, sender{name, handle, id}},
sentRequests{receiver{id}},
friends {
id,
name,
level
},
groups {
id
},
chats{
id
}
}
}`, variables: {
}};
return body;

@ -9,8 +9,8 @@
// Define the palettes for your theme using the Material Design palettes available in palette.scss
// (imported above). For each palette, you can optionally specify a default, lighter, and darker
// hue. Available color palettes: https://material.io/design/color/
$primary: mat-palette($mat-green);
$accent: mat-palette($mat-pink, A200, A100, A400);
$primary: mat-palette($mat-light-green);
$accent: mat-palette($mat-brown, A200, A100, A400);
$background-color: map_get($mat-grey, 50);
// The warn palette is optional (defaults to red).
$warn: mat-palette($mat-red);
@ -27,8 +27,8 @@ $light-theme: map_merge($light-theme, (background: $background));
$dark-primary: mat-palette($mat-green);
$dark-accent: mat-palette($mat-pink, A200, A100, A400);
$dark-primary: mat-palette($mat-light-green);
$dark-accent: mat-palette($mat-brown, A200, A100, A400);
// The warn palette is optional (defaults to red).
$dark-warn: mat-palette($mat-red);

Loading…
Cancel
Save