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

master
Max_ES 5 years ago committed by Gitea
commit 571dd54100

6
package-lock.json generated

@ -9449,9 +9449,9 @@
} }
}, },
"ts-md5": { "ts-md5": {
"version": "1.2.6", "version": "1.2.7",
"resolved": "https://registry.npmjs.org/ts-md5/-/ts-md5-1.2.6.tgz", "resolved": "https://registry.npmjs.org/ts-md5/-/ts-md5-1.2.7.tgz",
"integrity": "sha512-VFW6O4CTZsgTPDBhF31i83hPhfwd9Dcp5RnbfGOIJPDRro9IhvXMYd8xBycD0yXqHZiAvv+iDG8F+UFrPEyQ5w==" "integrity": "sha512-emODogvKGWi1KO1l9c6YxLMBn6CEH3VrH5mVPIyOtxBG52BvV4jP3GWz6bOZCz61nLgBc3ffQYE4+EHfCD+V7w=="
}, },
"ts-node": { "ts-node": {
"version": "7.0.1", "version": "7.0.1",

@ -33,7 +33,7 @@
"js-sha512": "^0.8.0", "js-sha512": "^0.8.0",
"ngx-socket-io": "^2.0.0", "ngx-socket-io": "^2.0.0",
"rxjs": "~6.3.3", "rxjs": "~6.3.3",
"ts-md5": "^1.2.6", "ts-md5": "^1.2.7",
"zone.js": "~0.8.26" "zone.js": "~0.8.26"
}, },
"devDependencies": { "devDependencies": {

@ -31,7 +31,7 @@ export class AppComponent implements OnInit {
this.data.currentUserInfo.subscribe(user => { this.data.currentUserInfo.subscribe(user => {
this.userInfo = user; this.userInfo = user;
console.log(this.userInfo); console.log(this.userInfo);
this.data.changeChatIDs(this.chatIDs) this.data.changeChatIDs(user.chatIDs)
}) })
if(this.loggedIn != true){ if(this.loggedIn != true){
this.selfservice.checkIfLoggedIn(); this.selfservice.checkIfLoggedIn();

@ -6,11 +6,18 @@
<button id="tab-login" routerLink="/login" *ngIf="loggedIn != true">Login</button> <button id="tab-login" routerLink="/login" *ngIf="loggedIn != true">Login</button>
<div id="dropdown" *ngIf="loggedIn"> <div id="dropdown" *ngIf="loggedIn">
<div> <div>
<span><i class="fa fa-caret-down" aria-hidden="true"></i></span> <span (click)="showDropdown()"><i class="fa fa-caret-down" aria-hidden="true"></i></span>
<span> Niklas Lampe</span> <span>{{username}}</span>
</div> </div>
<div id="dropdown-content"> <div id="dropdown-content" *ngIf="dropdownShown">
Hallo <div>
<span>Rang:</span>
<span>{{level}}</span>
</div>
<div>
<span>Punkte:</span>
<span>{{points}}</span>
</div>
</div> </div>
</div> </div>
<button id="logoutbutton" *ngIf="loggedIn"><span><i class="fa fa-sign-out-alt fa-2x" aria-hidden="true"></i></span></button> <button id="logoutbutton" *ngIf="loggedIn" (click)="logout()"><span><i class="fa fa-sign-out-alt fa-2x" aria-hidden="true"></i></span></button>

@ -47,18 +47,18 @@ h1
span span
margin-left: 1em margin-left: 1em
#dropdown-content #dropdown-content
display: none
position: absolute position: absolute
background-color: #f9f9f9 background-color: $cHeadPrimaryBackground
min-width: 160px min-width: 160px
margin-top: 7vh
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2) box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2)
padding: 12px 16px padding: 12px 16px
z-index: 1 z-index: 1
div:hover div:hover
background-color: lighten($cHeadPrimaryBackground, 10%) background-color: lighten($cHeadPrimaryBackground, 10%)
cursor: pointer cursor: pointer
div:hover #dropdown-content #dropdown-content
display: block //display: block
#logoutbutton #logoutbutton
@include gridPosition(1, 2, 8, 9) @include gridPosition(1, 2, 8, 9)

@ -2,6 +2,10 @@ import { Component, OnInit } from '@angular/core';
import { LoginComponent } from '../login/login.component'; import { LoginComponent } from '../login/login.component';
import { DatasharingService } from '../../services/datasharing.service'; import { DatasharingService } from '../../services/datasharing.service';
import { SelfService } from '../../services/selfservice/self.service'; import { SelfService } from '../../services/selfservice/self.service';
import { Levellist } from 'src/app/models/levellist';
import { Http } from '@angular/http';
import { Router } from '@angular/router';
import { User } from 'src/app/models/user';
@Component({ @Component({
selector: 'app-scaffold', selector: 'app-scaffold',
@ -12,16 +16,56 @@ import { SelfService } from '../../services/selfservice/self.service';
export class AppScaffoldComponent implements OnInit { export class AppScaffoldComponent implements OnInit {
loggedIn: boolean = false; loggedIn: boolean = false;
userId: number; userId: number;
username: string
user: User
levellist: Levellist = new Levellist()
level: string
points: number
profileUrl: string; profileUrl: string;
dropdownShown: boolean = false
constructor(private data: DatasharingService) { } constructor(private data: DatasharingService) { }
constructor(private data: DatasharingService,private selfservice: SelfService, private http: Http, private router: Router) { }
ngOnInit() { ngOnInit() {
this.data.currentUserInfo.subscribe(user => { this.data.currentUserInfo.subscribe(user => {
this.user = user
this.loggedIn = user.loggedIn; this.loggedIn = user.loggedIn;
this.userId = user.userID; this.userId = user.userID;
this.username = user.username
this.level = this.levellist.getLevelName(user.level)
this.points = user.points
this.profileUrl = '/profile/' + this.userId; this.profileUrl = '/profile/' + this.userId;
}) })
} }
showDropdown() {
if(!this.dropdownShown) {
this.dropdownShown = true
}
else {
this.dropdownShown = false
}
}
logout() {
let url = 'https://greenvironment.net/graphql'
let 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
let user = new User()
user.loggedIn = false
this.data.changeUserInfo(user)
this.router.navigate(['login'])
}
} }

@ -1,10 +1,10 @@
<div id="chat"> <div id="chat">
<div id='header'> <div id='header'>
<button id="goback" (click)="goBack()"><span><i class="fa fa-arrow-left fa-3x" aria-hidden="true"></i></span></button> <button id="goback" (click)="goBack()"><span><i class="fa fa-arrow-left fa-3x" aria-hidden="true"></i></span></button>
<span class='title'>{{childChat.id}}</span> <span class='title'>{{childChat.memberName}}</span>
</div> </div>
<div id='messagecontainer'> <div id='messagecontainer'>
<div class="chatmessage" *ngFor="let message of messages"> <div class="chatmessage" *ngFor="let message of childChat.messages">
<div *ngIf="message.myself == true" id='ownmessage'><span>{{message.content}}</span></div> <div *ngIf="message.myself == true" id='ownmessage'><span>{{message.content}}</span></div>
<div *ngIf="message.myself == false" id='foreignmessage'><span>{{message.content}}</span></div> <div *ngIf="message.myself == false" id='foreignmessage'><span>{{message.content}}</span></div>
</div> </div>

@ -1,6 +1,8 @@
import { Component, OnInit, EventEmitter, Output, Input } from '@angular/core'; import { Component, OnInit, EventEmitter, Output, Input } from '@angular/core';
import { Chatmessage } from 'src/app/models/chatmessage'; import { Chatmessage } from 'src/app/models/chatmessage';
import { Chatinfo } from 'src/app/models/chatinfo'; import { Chatinfo } from 'src/app/models/chatinfo';
import { ChatService } from 'src/app/services/chat/chat.service';
import { Chat } from 'src/app/models/chat';
@Component({ @Component({
selector: 'chatmanager-chat', selector: 'chatmanager-chat',
@ -14,15 +16,21 @@ export class ChatComponent implements OnInit {
new Chatmessage("Hallo", "01.01.",true)] new Chatmessage("Hallo", "01.01.",true)]
@Output() goBackEvent = new EventEmitter<boolean>(); @Output() goBackEvent = new EventEmitter<boolean>();
@Input() childChat: Chatinfo; @Input() childChat: Chat;
constructor() { } constructor(private chatService: ChatService) { }
ngOnInit() { ngOnInit() {
} }
goBack() { goBack() {
this.goBackEvent.emit(true) this.goBackEvent.emit(true)
this.chatService.getAllChats()
}
sendMessage(pContent: string) {
this.chatService.sendMessage(this.childChat.id, pContent)
this.chatService.getMessages(this.childChat.id)
} }
} }

@ -4,11 +4,11 @@
<button id="newchat" (click)="newChat()"><span><i class="fa fa-plus fa-3x" aria-hidden="true"></i></span></button> <button id="newchat" (click)="newChat()"><span><i class="fa fa-plus fa-3x" aria-hidden="true"></i></span></button>
</div> </div>
<div id="chats"> <div id="chats">
<div class="chatitem" *ngFor="let chat of chats" <div class="chatitem" *ngFor="let chat of chatService.chats"
[class.selected]="chat === selectedChat" (click)="showChat(chat)"> [class.selected]="chat === selectedChat" (click)="showChat(chat)">
<div class="picture">Pic</div> <div class="picture">Pic</div>
<div class="name"><span>{{chat.id}}</span></div> <div class="name"><span>{{chat.id}}</span></div>
<div class="date"> <a>{{chat.date}}</a></div> <div class="date"> <a>Date of last message</a></div>
</div> </div>
</div> </div>
</div> </div>

@ -49,7 +49,6 @@
margin: 0.2em margin: 0.2em
padding: 0.25em padding: 0.25em
border-radius: 0.25em border-radius: 0.25em
border: solid
display: grid display: grid
grid-template: 100% / 20% 60% 20% grid-template: 100% / 20% 60% 20%
.picture .picture

@ -1,6 +1,7 @@
import { Component, OnInit, Output, EventEmitter } from '@angular/core'; import { Component, OnInit, Output, EventEmitter } from '@angular/core';
import { Chatinfo } from 'src/app/models/chatinfo'; import { Chatinfo } from 'src/app/models/chatinfo';
import { ChatService } from 'src/app/services/chat/chat.service'; import { ChatService } from 'src/app/services/chat/chat.service';
import { Chat } from 'src/app/models/chat';
@Component({ @Component({
selector: 'chatmanager-chatlist', selector: 'chatmanager-chatlist',
@ -9,23 +10,21 @@ import { ChatService } from 'src/app/services/chat/chat.service';
}) })
export class ChatlistComponent implements OnInit { export class ChatlistComponent implements OnInit {
chats:Array<Chatinfo> = [new Chatinfo("Max", "23.06.19 12:50"), new Chatinfo("Julius", "17.04.19 16:50"), @Output() showChatEvent = new EventEmitter<Chat>();
new Chatinfo("David", "23.06.19 12:50"), new Chatinfo("Bruno", "23.06.19 12:50")]
@Output() showChatEvent = new EventEmitter<Chatinfo>();
@Output() showCreateChatEvent = new EventEmitter<boolean>(); @Output() showCreateChatEvent = new EventEmitter<boolean>();
selectedChat: Chatinfo; selectedChat: Chat;
constructor(private chatService: ChatService) { } constructor(private chatService: ChatService) { }
ngOnInit() { ngOnInit() {
} }
showNewChat() { showNewChat() {
this.showCreateChatEvent.emit(true) this.showCreateChatEvent.emit(true)
} }
showChat(pChat: Chatinfo) { showChat(pChat: Chat) {
this.selectedChat = pChat this.selectedChat = pChat
this.showChatEvent.emit(this.selectedChat) this.showChatEvent.emit(this.selectedChat)
} }

@ -3,6 +3,7 @@ import { ChatService } from '../../services/chat/chat.service'
import { ChatComponent } from '../chat/chat.component'; import { ChatComponent } from '../chat/chat.component';
import { Chatinfo } from 'src/app/models/chatinfo'; import { Chatinfo } from 'src/app/models/chatinfo';
import { DatasharingService } from 'src/app/services/datasharing.service'; import { DatasharingService } from 'src/app/services/datasharing.service';
import { Chat } from 'src/app/models/chat';
@Component({ @Component({
selector: 'home-chatmanager', selector: 'home-chatmanager',
@ -14,16 +15,17 @@ export class ChatmanagerComponent implements OnInit {
showChatlist: boolean = true showChatlist: boolean = true
showChat: boolean = false showChat: boolean = false
showCreateNewChat: boolean = false showCreateNewChat: boolean = false
parentSelectedChat: Chatinfo parentSelectedChat: Chat
chatIDs: number[] chatIds: number[] = []
constructor(private data: DatasharingService) { } constructor(private data: DatasharingService, private chatService: ChatService) { }
ngOnInit() { ngOnInit() {
this.data.currentChatIDs.subscribe(chatIDs => { this.data.currentChatIDs.subscribe(chatIDs => {
this.chatIDs = chatIDs this.chatIds = chatIDs
}) })
this.chatService.getChatsByID(this.chatIds)
} }
goBackToChatlist($event) { goBackToChatlist($event) {

@ -1,7 +1,7 @@
<div id="postinput"> <div id="postinput">
<textarea id='input' placeholder="Post something ..." rows='3' wrap="soft"></textarea> <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="attach" type='submit'><span><i class="fa fa-paperclip fa-2x" aria-hidden="true"></i></span></button>
<button id="submit" type='submit'><span><i class="fa fa-send-o fa-2x" aria-hidden="true"></i></span></button> <button id="submit" type='submit' (click)=createPost(content.value)><span><i class="fa fa-send-o fa-2x" aria-hidden="true"></i></span></button>
</div> </div>
<div id='completeFeed'> <div id='completeFeed'>
<div id='feedchooser'> <div id='feedchooser'>

@ -8,21 +8,28 @@
grid-template: 100% /80% 10% 10% grid-template: 100% /80% 10% 10%
#input #input
@include gridPosition(1, 2, 1, 2) @include gridPosition(1, 2, 1, 2)
border-radius: 0.25em border-radius: 0.5em
border: 1px solid $cFeedInputBorder
padding: 0.125em padding: 0.125em
resize: none resize: none
#attach #attach
@include gridPosition(1, 2, 2, 3) @include gridPosition(1, 2, 2, 3)
#submit #submit
@include gridPosition(1, 2, 3, 4) @include gridPosition(1, 2, 3, 4)
button
background-color: $cFeedChooserBackground
color: $cFontWhite
border: none
border-radius: 0.5em
button:hover
background-color: lighten($cFeedChooserBackground, 10%)
cursor: pointer
#completeFeed #completeFeed
@include gridPosition(2, 3, 1, 2) @include gridPosition(2, 3, 1, 2)
display: grid display: grid
grid-template: 5% 95% /100% grid-template: 5% 95% /100%
background-color: $cFeedBackground
overflow: auto overflow: auto
background-color: $cFontWhite
#feedchooser #feedchooser
@include gridPosition(1, 2, 1, 2) @include gridPosition(1, 2, 1, 2)
@ -36,6 +43,7 @@
border: none border: none
font-size: 1.5em font-size: 1.5em
color: $cFontWhite color: $cFontWhite
border-radius: 0.5em
button:hover button:hover
background-color: lighten($cFeedChooserBackground, 10%) background-color: lighten($cFeedChooserBackground, 10%)
cursor: pointer cursor: pointer

@ -12,30 +12,25 @@ export class FeedComponent implements OnInit {
viewNew: boolean = true viewNew: boolean = true
viewMostLiked: boolean = false viewMostLiked: boolean = false
feedNew: Array<Post>/* = [ feedNew: Array<Post>
new Post("1", "Niklas", "@nick123", "This is a test message", "01.10.2019 10:00 Uhr", 10), feedMostLiked: Array<Post>
new Post("2", "Niklas", "@nick123", "This is a test message", "01.10.2019 10:00 Uhr", 10),
new Post("3", "Niklas", "@nick123", "This is a test message", "01.10.2019 10:00 Uhr", 10), parentSelectedPostList: Array<Post>
new Post("4", "Niklas", "@nick123", "This is a test message", "01.10.2019 10:00 Uhr", 10),
new Post("5", "Niklas", "@nick123", "This is a test message", "01.10.2019 10:00 Uhr", 10),
new Post("6", "Niklas", "@nick123", "This is a test message", "01.10.2019 10:00 Uhr", 10),
new Post("7", "Niklas", "@nick123", "This is a test message", "01.10.2019 10:00 Uhr", 10)
]*/
feedMostLiked: Array<Post>/* = [
new Post("1", "Max", "@max123", "This is a test message", "01.10.2019 10:00 Uhr", 50),
new Post("2", "Max", "@max123", "This is a test message", "01.10.2019 10:00 Uhr", 50),
new Post("3", "Max", "@max123", "This is a test message", "01.10.2019 10:00 Uhr", 50),
new Post("4", "Max", "@max123", "This is a test message", "01.10.2019 10:00 Uhr", 50),
new Post("5", "Max", "@max123", "This is a test message", "01.10.2019 10:00 Uhr", 50)
]*/
parentSelectedPostList: Array<Post> = this.feedNew
constructor(private feedService: FeedService) { } constructor(private feedService: FeedService) { }
ngOnInit() { ngOnInit() {
this.feedNew = this.feedService.getAllPosts() this.feedService.getAllPostsRaw().subscribe(response => {
this.feedMostLiked = this.feedService.getAllPosts() this.feedNew = this.feedService.renderAllPosts(response.json())
console.log(response)
this.parentSelectedPostList = this.feedNew
this.feedMostLiked = this.feedNew
})
}
createPost(pContent: string){
this.feedService.createPost(pContent)
console.log(pContent)
} }
showNew() { showNew() {

@ -18,12 +18,12 @@ export class PostlistComponent implements OnInit {
} }
voteUp(pPost: Post){ voteUp(pPost: Post){
this.feedService.voteUp(pPost.id) this.feedService.upvote(pPost.id)
console.log("UPVOTE", pPost.id) console.log("UPVOTE", pPost.id)
} }
voteDown(pPost: Post){ voteDown(pPost: Post){
this.feedService.voteDown(pPost.id) this.feedService.downvote(pPost.id)
} }
} }

@ -1,5 +1,5 @@
<div id="content"> <div id="content">
<home-chatmanager id="chatcontainer"></home-chatmanager> <home-chatmanager id="chatcontainer" *ngIf="loggedIn"></home-chatmanager>
<home-feed id="feedcontainer"></home-feed> <home-feed id="feedcontainer"></home-feed>
<home-social id="socialcontainer"></home-social> <home-social id="socialcontainer" *ngIf="loggedIn"></home-social>
</div> </div>

@ -6,6 +6,7 @@
display: grid display: grid
min-height: 90vh min-height: 90vh
max-height: 90vh max-height: 90vh
background-color: $cFontWhite
#chatcontainer #chatcontainer
@include gridPosition(1, 3, 1, 2) @include gridPosition(1, 3, 1, 2)
@ -16,7 +17,7 @@
@include gridPosition(1, 3, 2, 3) @include gridPosition(1, 3, 2, 3)
display: grid display: grid
grid-template: 10% 90% /100% grid-template: 10% 90% /100%
background-color: $cSecondaryBackground background-color: $cFontWhite
overflow: auto overflow: auto
#socialcontainer #socialcontainer

@ -1,4 +1,6 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { DatasharingService } from 'src/app/services/datasharing.service';
import { FeedService } from 'src/app/services/feed/feed.service';
@Component({ @Component({
selector: 'app-home', selector: 'app-home',
@ -7,9 +9,15 @@ import { Component, OnInit } from '@angular/core';
}) })
export class HomeComponent implements OnInit { export class HomeComponent implements OnInit {
constructor() { } loggedIn: boolean
constructor(private data: DatasharingService, private feedService: FeedService) { }
ngOnInit() { ngOnInit() {
this.data.currentUserInfo.subscribe(user => {
this.loggedIn = user.loggedIn;
})
this.feedService.getAllPosts()
} }
} }

@ -32,6 +32,8 @@ export class LoginComponent implements OnInit {
this.login.passwordHash = sha512.sha512(pPasswordHash); this.login.passwordHash = sha512.sha512(pPasswordHash);
console.log(this.login.passwordHash); console.log(this.login.passwordHash);
console.log(this.login.passwordHash)
this.loginService.login(this.login, error => this.loginError(error.json())); this.loginService.login(this.login, error => this.loginError(error.json()));
} }

@ -4,7 +4,9 @@
<button id="invitations" type="submit"><span><i class="fa fa-envelope-o 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> </div>
<div id="friendslist"> <div id="friendslist">
<div class="frienditem" *ngFor="let friend of friends"> <div class="frienditem" *ngFor="let friend of friends"
<div class="friendname">{{friend}}</div> [class.selected]="friend === selectedFriend" (click)="showFriendProfile(friend)">
<div class="picture">Pic</div>
<div class="name"><span>{{friend.name}}</span></div>
</div> </div>
</div> </div>

@ -5,20 +5,28 @@
#friendslist #friendslist
overflow: auto overflow: auto
@include gridPosition(2, 3, 1, 2) @include gridPosition(2, 3, 1, 2)
div:hover
background-color: darken($cPrimaryBackground, 10%)
cursor: pointer
.frienditem .frienditem
background-color: $cPrimaryBackground background-color: $cPrimaryBackground
height: 3em height: 3em
margin: 0.2em margin: 0.2em
padding: 0.25em padding: 0.25em
border-radius: 0.25em border-radius: 0.25em
border: solid //border: solid
display: flex; display: grid
.friendname grid-template: 100% / 20% 60% 20%
.picture
@include gridPosition(1, 2, 1, 2)
border: solid
.name, .date
margin-top: auto
margin-bottom: auto
.name
@include gridPosition(1, 2, 2, 3)
font-weight: bold font-weight: bold
text-align: left text-align: left
border: solid padding-left: 0.5em
width: 60%
padding-left: 1em
margin: auto
span span
font-size: 125% font-size: 125%

@ -1,4 +1,8 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { DatasharingService } from 'src/app/services/datasharing.service';
import { Http } from '@angular/http';
import { FriendInfo } from 'src/app/models/friendinfo';
import { Router } from '@angular/router';
@Component({ @Component({
selector: 'social-friends', selector: 'social-friends',
@ -6,10 +10,47 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./friends.component.sass'] styleUrls: ['./friends.component.sass']
}) })
export class FriendsComponent implements OnInit { export class FriendsComponent implements OnInit {
friends: Array<String> = ["Friend 1", "Friend 2", "Friend 3", "Friend 4", "Friend 5", "Friend 6"]
constructor() { } friendIDs: number[] = [1,2,3,4,5,6]
friends = new Array<FriendInfo>() //= ["Friend 1", "Friend 2", "Friend 3", "Friend 4", "Friend 5", "Friend 6"]
constructor(private data: DatasharingService, private http: Http, private router: Router) { }
ngOnInit() { ngOnInit() {
//this.data.currentUserInfo.subscribe(user => {
// this.friendIDs = user.friendIDs})
this.getFriendsNames()
}
getFriendsNames() {
for(let id of this.friendIDs) {
let url = 'https://greenvironment.net/graphql'
let 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))
}
buildJson(pId: number): any {
const body = {query: `query($userId: ID) {
getUser(userId:$userId) {
name
}
}`, variables: {
userId: pId
}}
return body
}
public showFriendProfile(pFriend: FriendInfo){
this.router.navigate(['profile/' + pFriend.id])
} }
} }

@ -4,7 +4,9 @@
<button id="invitations" type="submit"><span><i class="fa fa-envelope-o 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> </div>
<div id="groupslist"> <div id="groupslist">
<div class="groupitem" *ngFor="let group of groups"> <div class="groupitem" *ngFor="let group of groups"
<div class="groupname">{{group}}</div> [class.selected]="group === selectedGroup" (click)="showGroup(group)">
<div class="picture">Pic</div>
<div class="name"><span>{{group.name}}</span></div>
</div> </div>
</div> </div>

@ -5,20 +5,28 @@
#groupslist #groupslist
overflow: auto overflow: auto
@include gridPosition(2, 3, 1, 2) @include gridPosition(2, 3, 1, 2)
div:hover
background-color: darken($cPrimaryBackground, 10%)
cursor: pointer
.groupitem .groupitem
background-color: $cPrimaryBackground background-color: $cPrimaryBackground
height: 3em height: 3em
margin: 0.2em margin: 0.2em
padding: 0.25em padding: 0.25em
border-radius: 0.25em border-radius: 0.25em
border: solid //border: solid
display: flex; display: grid
.groupname grid-template: 100% / 20% 60% 20%
.picture
@include gridPosition(1, 2, 1, 2)
border: solid
.name, .date
margin-top: auto
margin-bottom: auto
.name
@include gridPosition(1, 2, 2, 3)
font-weight: bold font-weight: bold
text-align: left text-align: left
border: solid padding-left: 0.5em
width: 60%
padding-left: 1em
margin: auto
span span
font-size: 125% font-size: 125%

@ -1,4 +1,5 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { GroupInfo } from 'src/app/models/groupinfo';
@Component({ @Component({
selector: 'social-groups', selector: 'social-groups',
@ -6,7 +7,7 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./groups.component.sass'] styleUrls: ['./groups.component.sass']
}) })
export class GroupsComponent implements OnInit { export class GroupsComponent implements OnInit {
groups: Array<String> = ["Group 1", "Group 2", "Group 3", "Group 4", "Group 5", "Group 6"] groups: Array<GroupInfo> = [new GroupInfo(1,"Group 1",[]), new GroupInfo(1,"Group 2",[]), new GroupInfo(1,"Group 3",[]), new GroupInfo(1,"Group 4",[])]
constructor() { } constructor() { }
ngOnInit() { ngOnInit() {

@ -0,0 +1,11 @@
export class GroupInfo {
id: number
name: string
members: number[]
constructor(pId: number, pName: string, pMembers: number[]) {
this.id = pId
this.name = pName
this.members = pMembers
}
}

@ -4,6 +4,7 @@ import { Chat } from 'src/app/models/chat';
import { responsePathAsArray } from 'graphql'; import { responsePathAsArray } from 'graphql';
import { Chatmessage } from 'src/app/models/chatmessage'; import { Chatmessage } from 'src/app/models/chatmessage';
import { FriendInfo } from 'src/app/models/friendinfo'; import { FriendInfo } from 'src/app/models/friendinfo';
import { DatasharingService } from '../datasharing.service';
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'
@ -12,11 +13,15 @@ export class ChatService {
arr: number[] arr: number[]
ownID: number ownID: number
chats: Array<Chat> chats: Array<Chat> = []
constructor(private http: Http) { } constructor(private http: Http, private data: DatasharingService) {
this.data.currentUserInfo.subscribe(user => {
this.ownID = user.userID})
}
public getAllChats(): Array<Chat> { public getAllChats(): Array<Chat> {
console.log("Getting all chats ..")
let url = 'https://greenvironment.net/graphql' let url = 'https://greenvironment.net/graphql'
let headers = new Headers() let headers = new Headers()
@ -29,6 +34,24 @@ export class ChatService {
return this.chats return this.chats
} }
public getChatsByID(pChatIDs: number[]): Array<Chat> {
this.chats = []
console.log("Getting chats by ID..")
for(let chatId of pChatIDs) {
let url = 'https://greenvironment.net/graphql'
let headers = new Headers()
headers.set('Content-Type', 'application/json')
this.http.post(url, this.getBodyForGetChatsByID(chatId))
.subscribe(response => {
this.updateChat(response.json())
})
}
return this.chats
}
public createNewChat(pUserID: number) { public createNewChat(pUserID: number) {
let url = 'https://greenvironment.net/graphql' let url = 'https://greenvironment.net/graphql'
@ -72,11 +95,38 @@ export class ChatService {
let headers = new Headers() let headers = new Headers()
headers.set('Content-Type', 'application/json') headers.set('Content-Type', 'application/json')
this.http.post(url, this.getBodyForSendMessage(pChatID, pContent)) this.http.post(url, this.getBodyForSendMessage(pChatID, pContent)).subscribe(response => console.log("Message sent"))
}
public getMessages(pChatID): Array<Chatmessage> {
let messages: Array<Chatmessage>
let url = 'https://greenvironment.net/graphql'
let headers = new Headers()
headers.set('Content-Type', 'application/json')
this.http.post(url, this.getBodyForGetMessagesInChat(pChatID)).subscribe(response =>
{
console.log("Downloading messages ...")
messages = this.updateMessages(response.json())
})
return messages
}
updateMessages(pResponse: any): Array<Chatmessage> {
let messages = new Array<Chatmessage>()
for(let message of pResponse.data.getChat.messages) {
if(message.author.id == this.ownID) {
messages.push(new Chatmessage(message.content, message.createdAt, true))
} else {
messages.push(new Chatmessage(message.content, message.createdAt, false))
}
}
return messages
} }
updateAllChats(pResponse: any): Array<Chat> { updateAllChats(pResponse: any): Array<Chat> {
let chats: Array<Chat> let chats = Array<Chat>()
for(let chat of pResponse.data.getSelf.chats) { for(let chat of pResponse.data.getSelf.chats) {
let memberID: number let memberID: number
let memberName: string let memberName: string
@ -86,7 +136,7 @@ export class ChatService {
memberName = member.name memberName = member.name
} }
} }
let messages: Array<Chatmessage> let messages = new Array<Chatmessage>()
for(let message of chat.messages) { for(let message of chat.messages) {
if(message.author.id == this.ownID) { if(message.author.id == this.ownID) {
messages.push(new Chatmessage(message.content, message.createdAt, true)) messages.push(new Chatmessage(message.content, message.createdAt, true))
@ -99,6 +149,27 @@ export class ChatService {
return chats return chats
} }
updateChat(pResponse: any) {
let id = pResponse.data.getChat.id
let memberId : number
let memberName: string
for(let member of pResponse.data.getChat.members) {
if(member.id != this.ownID) {
memberId = member.id
memberName = member.name
}
}
let messages = new Array<Chatmessage>()
for(let message of pResponse.data.getChat.messages) {
if(message.author.id == this.ownID) {
messages.push(new Chatmessage(message.content, message.createdAt, true))
} else {
messages.push(new Chatmessage(message.content, message.createdAt, false))
}
}
this.chats.push(new Chat(id, memberId, memberName, messages))
}
getBodyForNewChat(pUserID: number) { getBodyForNewChat(pUserID: number) {
this.arr = [pUserID] this.arr = [pUserID]
const body = {query: `mutation($userID: number[]) { const body = {query: `mutation($userID: number[]) {
@ -133,11 +204,34 @@ export class ChatService {
getBodyForGetAllChats() { getBodyForGetAllChats() {
const body = {query: `query { const body = {query: `query {
getSelf { getUser {
chats(first: 1000, offset: 0) {id, members{name, id}, chats(first: 1000, offset: 0) {id, members{name, id},
messages(first: 1000, offset: 0) {author {id}, createdAt, content}} messages(first: 1000, offset: 0) {author {id}, createdAt, content}}
} }
}` }`
} }
return body
}
getBodyForGetChatsByID(pChatID: number) {
const body = {query: `query($chatID: ID!) {
getChat(chatId: $chatID) {id, members{name, id},
messages(first: 1000, offset: 0) {author {id}, createdAt, content}}
}
}`, variables: {
chatId: pChatID
}}
return body
}
getBodyForGetMessagesInChat(pChatID: number) {
const body = {query: `query($chatID: ID!) {
getChat(chatId: $chatID) {
messages(first: 1000, offset: 0) {author {id}, createdAt, content}
}
}`, variables: {
chatId: pChatID
}}
return body
} }
} }

@ -12,34 +12,66 @@ export class FeedService {
constructor(private http: Http) { } constructor(private http: Http) { }
public voteUp(pPostID: number): void { public createPost(pContent: String){
let url = 'https://greenvironment.net/graphql' let url = 'https://greenvironment.net/graphql'
let headers = new Headers() let headers = new Headers()
headers.set('Content-Type', 'application/json') headers.set('Content-Type', 'application/json')
const body = {query: `mutation($postId: number) { const body = {query: `mutation($content: String!) {
createPost(content: $content) {id}
}`, variables: {
content: pContent
}}
this.http.post(url, body).subscribe(response => {
console.log(response.text())})
}
public createPost2(pContent: String){
let url = 'https://greenvironment.net/graphql'
let headers = new Headers()
headers.set('Content-Type', 'application/json')
const body = {query: `query{
getSelf {name}
}`}
this.http.post(url, body).subscribe(response => {
console.log(response.text())})
}
public upvote(pPostID: number): void {
let url = 'https://greenvironment.net/graphql'
let headers = new Headers()
headers.set('Content-Type', 'application/json')
const body = {query: `mutation($postId: ID!) {
vote(postId: $postId, type: UPVOTE) vote(postId: $postId, type: UPVOTE)
}`, variables: { }`, variables: {
postId: pPostID postId: pPostID
}} }}
this.http.post(url, body) this.http.post(url, body).subscribe(response => {
console.log(response.text())})
} }
public voteDown(pPostID: number): void { public downvote(pPostID: number): void {
let url = 'https://greenvironment.net/graphql' let url = 'https://greenvironment.net/graphql'
let headers = new Headers() let headers = new Headers()
headers.set('Content-Type', 'application/json') headers.set('Content-Type', 'application/json')
const body = {query: `mutation($postId: number) { const body = {query: `mutation($postId: ID!) {
vote(postId: $postId, type: DOWNVOTE) vote(postId: $postId, type: DOWNVOTE)
}`, variables: { }`, variables: {
postId: pPostID postId: pPostID
}} }}
this.http.post(url, body) this.http.post(url, body).subscribe(response => {
console.log(response.text())})
} }
public getAllPosts(): Array<Post> { public getAllPosts(): Array<Post> {
@ -51,10 +83,20 @@ export class FeedService {
this.http.post(url, this.getBodyForGetAllChats()) this.http.post(url, this.getBodyForGetAllChats())
.subscribe(response => { .subscribe(response => {
this.posts = this.renderAllPosts(response.json()) this.posts = this.renderAllPosts(response.json())
console.log(response)
}); });
return this.posts return this.posts
} }
public getAllPostsRaw(): any {
let url = 'https://greenvironment.net/graphql'
let headers = new Headers()
headers.set('Content-Type', 'application/json')
return this.http.post(url, this.getBodyForGetAllChats())
}
getBodyForGetAllChats() { getBodyForGetAllChats() {
const body = {query: `query { const body = {query: `query {
getPosts (first: 1000, offset: 0) {id, content, upvotes, downvotes, author{name, handle, id}, createdAt} getPosts (first: 1000, offset: 0) {id, content, upvotes, downvotes, author{name, handle, id}, createdAt}
@ -64,7 +106,7 @@ export class FeedService {
return body return body
} }
renderAllPosts(pResponse: any): Array<Post> { public renderAllPosts(pResponse: any): Array<Post> {
let posts = new Array<Post>() let posts = new Array<Post>()
for(let post of pResponse.data.getPosts) { for(let post of pResponse.data.getPosts) {
let id: number = post.id let id: number = post.id

Loading…
Cancel
Save