altered the lifecycle of the user login

This commit is contained in:
Nikolaos Laskaris 2017-11-27 12:52:52 +02:00
parent f28beeda69
commit 70d5d72699
7 changed files with 96 additions and 47 deletions

View File

@ -11,6 +11,7 @@ import { BreadcrumbComponent } from './widgets/breadcrumb/breadcrumb.component';
import { AutocompleteRemoteComponent } from './form/fields/autocomplete-remote/autocomplete-remote.component'; import { AutocompleteRemoteComponent } from './form/fields/autocomplete-remote/autocomplete-remote.component';
declare const gapi: any;
declare var $ :any; declare var $ :any;
@Component({ @Component({
@ -36,10 +37,45 @@ export class AppComponent implements OnInit {
} }
ngOnInit() { ngOnInit() {
//this.initiateExternalProviders();
}
initiateExternalProviders(){
//initiate google
var clientId = '1010962018903-glegmqudqtl1lub0150vacopbu06lgsg.apps.googleusercontent.com';
var scope = [
'profile',
'email'
].join(' ');
if(gapi.auth2 == undefined){
gapi.load('auth2', () => {
gapi.auth2.init({
client_id: clientId,
cookiepolicy: 'single_host_origin',
scope: scope
});
//RE-Render the button (due to known issues of google-button with angular's lifecycle)
gapi.signin2.render('googleBtn');
//var buttonElement = this.element.nativeElement.querySelector('#googleBtn');
//this.attachSignin(buttonElement);
});
}
} }
slideNav(){ slideNav(){
$("#appSidebar").toggleClass("expanded"); $("#appSidebar").toggleClass("expanded");

View File

@ -68,7 +68,7 @@
<!-- data-toggle="modal" data-target="#dmp-deatils-fullscreen" --> <!-- data-toggle="modal" data-target="#dmp-deatils-fullscreen" -->
<td class="url-like" (click)="viewDetailedDMP(dmp)">{{(dmp?.label?.length > 40) ? (dmp?.label | slice:0:40)+'...':(dmp?.label) }}</td> <td class="url-like" (click)="viewDetailedDMP(dmp)">{{(dmp?.label?.length > 40) ? (dmp?.label | slice:0:40)+'...':(dmp?.label) }}</td>
<td style="width:20px;">{{dmp?.version}}</td> <td style="width:20px;">{{dmp?.version}}</td>
<td style="width:300px;">{{dmp?.previous}}</td> <td style="width:300px;">{{(dmp?.previous?.label?.length > 40) ? (dmp?.previous?.label | slice:0:40)+'...':(dmp?.previous?.label) }}</td>
<td class="url-like" (click)="viewDetailedProject(dmp)">{{(dmp?.project?.label?.length > 40) ? (dmp?.project?.label | slice:0:40)+'...':(dmp?.project?.label) }}</td> <td class="url-like" (click)="viewDetailedProject(dmp)">{{(dmp?.project?.label?.length > 40) ? (dmp?.project?.label | slice:0:40)+'...':(dmp?.project?.label) }}</td>
<td>{{(dmp?.description?.length > 40) ? (dmp?.description | slice:0:40)+'...':(dmp?.description) }}</td> <td>{{(dmp?.description?.length > 40) ? (dmp?.description | slice:0:40)+'...':(dmp?.description) }}</td>
<td>{{dmp?.created | date:'yyyy-MM-dd HH:mm:ss Z'}}</td> <td>{{dmp?.created | date:'yyyy-MM-dd HH:mm:ss Z'}}</td>

View File

@ -28,48 +28,19 @@ export class GooggleSignInComponent implements OnInit, AfterViewInit, Injectable
ngAfterViewInit() { ngAfterViewInit() {
this.googleInit();
//RE-Render the button (due to known issues of google-button with angular's lifecycle)
gapi.signin2.render('googleBtn');
var buttonElement = this.element.nativeElement.querySelector('#googleBtn');
this.attachSignin(buttonElement);
} }
private clientId:string = '1010962018903-glegmqudqtl1lub0150vacopbu06lgsg.apps.googleusercontent.com';
private scope = [
'profile',
'email'
//,
//'https://www.googleapis.com/auth/plus.me',
//'https://www.googleapis.com/auth/contacts.readonly',
//'https://www.googleapis.com/auth/admin.directory.user.readonly'
].join(' ');
public auth2: any;
public googleInit() {
gapi.load('auth2', () => {
this.auth2 = gapi.auth2.init({
client_id: this.clientId,
cookiepolicy: 'single_host_origin',
scope: this.scope
});
//RE-Render the button (due to known issues of google-button with angular's lifecycle)
gapi.signin2.render('googleBtn');
var buttonElement = this.element.nativeElement.querySelector('#googleBtn');
this.attachSignin(buttonElement);
});
}
public attachSignin(element) { public attachSignin(element) {
this.auth2.attachClickHandler(element, {},
gapi.auth2.getAuthInstance().attachClickHandler(element, {},
(googleUser) => { (googleUser) => {
//simple_notifier("success",null,"Successful login"); //simple_notifier("success",null,"Successful login");
let profile = googleUser.getBasicProfile(); let profile = googleUser.getBasicProfile();
@ -78,7 +49,8 @@ export class GooggleSignInComponent implements OnInit, AfterViewInit, Injectable
function (error) { function (error) {
//simple_notifier("danger",null,"Failed to login"); //simple_notifier("danger",null,"Failed to login");
console.log(JSON.stringify(error, undefined, 2)); console.log(JSON.stringify(error, undefined, 2));
}); }
);
} }

View File

@ -4,7 +4,7 @@
<div class="modal-content" id="dmp-modal-content"> <div class="modal-content" id="dmp-modal-content">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times" aria-hidden="true"></i></button> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times" aria-hidden="true"></i></button>
<h4 style="text-align:center;" class="modal-title">Details</h4> <h4 style="text-align:center;" class="modal-title"><b>{{dmp?.label}}</b></h4>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<!-- <!--
@ -15,13 +15,13 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-6 row-cell"><b>Digital Management Plan: </b>{{dmp?.label}}</div> <!--<div class="col-md-6 row-cell"><b>Digital Management Plan: </b>{{dmp?.label}}</div>-->
<div class="col-md-6 row-cell"><b>Project: </b>{{dmp?.project?.label}}</div> <div class="col-md-12 row-cell"><b>Belongs to Project: </b>{{dmp?.project?.label}}</div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6 row-cell"><b>Version:</b><span class="badge">{{dmp?.version}}</span></div> <div class="col-md-6 row-cell"><b>Current version:</b><span class="badge">{{dmp?.version}}</span></div>
<div class="col-md-6 row-cell"><b>Previous DMPs:</b> <div class="col-md-6 row-cell"><b>Previous DMPs:</b>
<ul> <ul>
<li *ngFor="let previous of previousDMPs">{{ previous?.label }}</li> <li *ngFor="let previous of previousDMPs">{{ previous?.label }}</li>

View File

@ -4,7 +4,7 @@
<div class="modal-content" id="project-modal-content"> <div class="modal-content" id="project-modal-content">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times" aria-hidden="true"></i></button> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times" aria-hidden="true"></i></button>
<h4 class="modal-title" style="text-align:center;">{{project?.label}}</h4> <h4 class="modal-title" style="text-align:center;"><b>{{project?.label}}</b></h4>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<!-- <!--
@ -61,13 +61,13 @@
<div class="col-md-6 row-cell"><b>Associated DMPs:</b> <div class="col-md-6 row-cell"><b>Associated DMPs:</b>
<ul> <ul>
<li *ngFor="let dmp of project?.dmps"> <li *ngFor="let dmp of project?.dmps">
{{ dmp?.label }} (creator: {{ users.get(dmp?.creator) }}) {{ dmp?.label }} (owner: {{ users.get(dmp?.creator) }})
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
{{users | json}}
<!-- <!--
STUFF NOT USED: STUFF NOT USED:

View File

@ -38,6 +38,7 @@ export class ProjectDetailedComponent implements OnInit {
response => { response => {
this.project.dmps = response; this.project.dmps = response;
this.populateUsersMap(this.project); this.populateUsersMap(this.project);
//this.get
}, },
error => { error => {
console.log("Could not fetch project's dmps"); console.log("Could not fetch project's dmps");
@ -60,18 +61,30 @@ export class ProjectDetailedComponent implements OnInit {
return this.serverService.getUserByID(userid); //Notice: returns Observable ! return this.serverService.getUserByID(userid); //Notice: returns Observable !
} }
async populateUsersMap1(project){
this.users.clear();
for(var i=0;i<project.dmps.length;i++){
debugger;
const user = await this.serverService.getUserByID(project.dmps[i].creator).toPromise();
this.users.set(project.dmps[i].creator, user.name);
}
}
private populateUsersMap(project){ private populateUsersMap(project){
this.users.clear(); this.users.clear();
project.dmps.forEach(dmp => { project.dmps.forEach(dmp => {
if(!this.users.has(dmp.creator)){ if(!this.users.has(dmp.creator)){
this.serverService.getUserByID(dmp.creator).subscribe( this.serverService.getUserByID(dmp.creator).subscribe(
user => { user => {
this.users.set(dmp.creator, dmp.name); this.users.set(dmp.creator, user.name);
}, },
error => { error => {
} }
) )
console.log("USERS: "+JSON.stringify(this.users))
} }
}); });
} }

View File

@ -1,3 +1,31 @@
var clientId = '1010962018903-glegmqudqtl1lub0150vacopbu06lgsg.apps.googleusercontent.com';
var scope = [
'profile',
'email'
].join(' ');
if(gapi.auth2 == undefined){
gapi.load('auth2', () => {
gapi.auth2.init({
client_id: clientId,
cookiepolicy: 'single_host_origin',
scope: scope
});
debugger;
//RE-Render the button (due to known issues of google-button with angular's lifecycle)
gapi.signin2.render('googleBtn');
//var buttonElement = this.element.nativeElement.querySelector('#googleBtn');
//this.attachSignin(buttonElement);
});
}
var sign_out_google = (function() { var sign_out_google = (function() {
var auth2 = gapi.auth2.getAuthInstance(); var auth2 = gapi.auth2.getAuthInstance();