Commit 5161636a08ea267906fc341042d3a33afbe22f75
Exists in
master
and in
26 other branches
Merge branch 'login-block' into 'master'
Login block Added the Noosfero basic login-block. See merge request !12
Showing
10 changed files
with
224 additions
and
4 deletions
Show diff stats
src/app/layout/blocks/login-block/login-block.component.spec.ts
0 → 100644
... | ... | @@ -0,0 +1,110 @@ |
1 | +import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder'; | |
2 | +import {Injectable, Provider, provide} from "ng-forward"; | |
3 | +import {ComponentTestHelper, createClass} from './../../../../spec/component-test-helper'; | |
4 | +import {ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder'; | |
5 | +import {providers} from 'ng-forward/cjs/testing/providers'; | |
6 | +import {LoginBlockComponent} from './login-block.component'; | |
7 | +import * as helpers from "./../../../../spec/helpers"; | |
8 | +import {SessionService, AuthService, AuthController, AuthEvents} from "./../../../login"; | |
9 | + | |
10 | +const htmlTemplate: string = '<noosfero-login-block></noosfero-login-block>'; | |
11 | + | |
12 | +describe("Components", () => { | |
13 | + | |
14 | + describe("Login Block Component", () => { | |
15 | + let helper: ComponentTestHelper<LoginBlockComponent>; | |
16 | + let person: any = null; | |
17 | + | |
18 | + /** | |
19 | + * Mock objects | |
20 | + */ | |
21 | + let authService: any = helpers.mocks.authService; | |
22 | + let user = <noosfero.User>{ person: person }; | |
23 | + let sessionService: any = <any>helpers.mocks.sessionWithCurrentUser(user); | |
24 | + let state = jasmine.createSpyObj("$state", ["go"]); | |
25 | + let scope = helpers.mocks.scopeWithEvents; | |
26 | + | |
27 | + let providers = [ | |
28 | + new Provider('SessionService', { useValue: sessionService }), | |
29 | + new Provider('$state', { useValue: state }), | |
30 | + new Provider('AuthService', { useValue: authService }), | |
31 | + new Provider('$scope', { useValue: scope }) | |
32 | + ]; | |
33 | + | |
34 | + beforeEach( angular.mock.module("templates") ); | |
35 | + | |
36 | + beforeEach( (done: Function) => { | |
37 | + let cls = createClass({ | |
38 | + template: htmlTemplate, | |
39 | + directives: [LoginBlockComponent], | |
40 | + providers: providers, | |
41 | + properties: {} | |
42 | + }); | |
43 | + helper = new ComponentTestHelper<LoginBlockComponent>(cls, done); | |
44 | + }); | |
45 | + | |
46 | + it("expect person to be null with no logged in user", () => { | |
47 | + expect(helper.component.currentUser).toBeNull; | |
48 | + }); | |
49 | + | |
50 | + it("expect person to be defined when user login", () => { | |
51 | + // Executes the login method on the component | |
52 | + doComponentLogin(); | |
53 | + expect(helper.component.currentUser.person).toBe(person); | |
54 | + }); | |
55 | + | |
56 | + it("expect person to be null when user logout", () => { | |
57 | + // First do a login | |
58 | + doComponentLogin(); | |
59 | + // The logout the user | |
60 | + doComponentLogout(); | |
61 | + // Check if the current user was cleared | |
62 | + expect(helper.component.currentUser).toBeNull; | |
63 | + }); | |
64 | + | |
65 | + /** | |
66 | + * Execute the logout method on the target component | |
67 | + */ | |
68 | + function doComponentLogout() { | |
69 | + // Create a mock for the AuthService logout method | |
70 | + spyOn(authService, "logout"); | |
71 | + helper.component.logout(); | |
72 | + expect(authService.logout).toHaveBeenCalled(); | |
73 | + // After the component logout method execution, fire the | |
74 | + // AuthService event | |
75 | + simulateLogoutEvent(); | |
76 | + } | |
77 | + | |
78 | + /** | |
79 | + * Execute the login method on the target component | |
80 | + */ | |
81 | + function doComponentLogin() { | |
82 | + // Create a mock for the AuthService login method | |
83 | + spyOn(authService, "login"); | |
84 | + helper.component.login(); | |
85 | + expect(authService.login).toHaveBeenCalled(); | |
86 | + // After the component login method execution, fire the | |
87 | + // AuthService event | |
88 | + simulateLoginEvent(); | |
89 | + } | |
90 | + | |
91 | + /** | |
92 | + * Simulate the AuthService loginSuccess event | |
93 | + */ | |
94 | + function simulateLoginEvent() { | |
95 | + let successEvent: string = AuthEvents[AuthEvents.loginSuccess]; | |
96 | + | |
97 | + (<any>helper.component.authService)[successEvent].next(user); | |
98 | + } | |
99 | + | |
100 | + /** | |
101 | + * Simulate the AuthService logoutSuccess event | |
102 | + */ | |
103 | + function simulateLogoutEvent() { | |
104 | + let successEvent: string = AuthEvents[AuthEvents.logoutSuccess]; | |
105 | + | |
106 | + (<any>helper.component.authService)[successEvent].next(user); | |
107 | + } | |
108 | + }); | |
109 | + | |
110 | +}); | |
0 | 111 | \ No newline at end of file | ... | ... |
src/app/layout/blocks/login-block/login-block.component.ts
0 → 100644
... | ... | @@ -0,0 +1,73 @@ |
1 | +import {Input, Inject, Component} from "ng-forward"; | |
2 | +import {SessionService, AuthService, AuthEvents} from "./../../../login"; | |
3 | + | |
4 | +/** | |
5 | + * @ngdoc controller | |
6 | + * @name layout.blocks.LoginBlockComponent | |
7 | + * @description | |
8 | + * The Noosfero block responible for presenting a login form and user status | |
9 | + */ | |
10 | +@Component({ | |
11 | + selector: "noosfero-login-block", | |
12 | + templateUrl: 'app/layout/blocks/login-block/login-block.html', | |
13 | +}) | |
14 | +@Inject("SessionService", "$state", 'AuthService', "$scope") | |
15 | +export class LoginBlockComponent { | |
16 | + | |
17 | + /** | |
18 | + * @ngdoc property | |
19 | + * @name currentUser | |
20 | + * @propertyOf layout.blocks.LoginBlockComponent | |
21 | + * @description | |
22 | + * The current loged in user | |
23 | + */ | |
24 | + currentUser: noosfero.User; | |
25 | + | |
26 | + /** | |
27 | + * @ngdoc property | |
28 | + * @name credentials | |
29 | + * @propertyOf layout.blocks.LoginBlockComponent | |
30 | + * @description | |
31 | + * The credentials of the currentUser | |
32 | + */ | |
33 | + credentials: noosfero.Credentials; | |
34 | + | |
35 | + constructor( | |
36 | + private session: SessionService, | |
37 | + private $state: ng.ui.IStateService, | |
38 | + public authService: AuthService, | |
39 | + private $scope: ng.IScope) { | |
40 | + this.currentUser = this.session.currentUser(); | |
41 | + | |
42 | + this.authService.subscribe(AuthEvents[AuthEvents.loginSuccess], () => { | |
43 | + this.currentUser = this.session.currentUser(); | |
44 | + }); | |
45 | + | |
46 | + this.authService.subscribe(AuthEvents[AuthEvents.logoutSuccess], () => { | |
47 | + this.currentUser = this.session.currentUser(); | |
48 | + }); | |
49 | + | |
50 | + } | |
51 | + | |
52 | + /** | |
53 | + * @ngdoc method | |
54 | + * @name login | |
55 | + * @methodOf layout.blocks.LoginBlockComponent | |
56 | + * @description | |
57 | + * Logs in the user using its credentials | |
58 | + */ | |
59 | + login() { | |
60 | + this.authService.login(this.credentials); | |
61 | + } | |
62 | + | |
63 | + /** | |
64 | + * @ngdoc method | |
65 | + * @name logout | |
66 | + * @methodOf layout.blocks.LoginBlockComponent | |
67 | + * @description | |
68 | + * Logout the user | |
69 | + */ | |
70 | + logout() { | |
71 | + this.authService.logout(); | |
72 | + }; | |
73 | +} | ... | ... |
... | ... | @@ -0,0 +1,27 @@ |
1 | +<div class="logged-user-info" ng-show="ctrl.currentUser"> | |
2 | + <h4>Logged in as {{ctrl.currentUser.person.identifier}}</h4> | |
3 | + <ul> | |
4 | + <li>User since | |
5 | + <span class="time"> | |
6 | + <span am-time-ago="ctrl.currentUser.person.created_at | dateFormat"></span> | |
7 | + </span> | |
8 | + </li> | |
9 | + <li><a ui-sref="main.profile.info({profile: ctrl.currentUser.person.identifier})">Profile Homepage</a></li> | |
10 | + </ul> | |
11 | + <div class="user-actions"> | |
12 | + <a href="#" ng-click="ctrl.logout()"><i class="fa fa-fw fa-power-off"></i> {{"navbar.logout" | translate}}</a> | |
13 | + </div> | |
14 | +</div> | |
15 | +<div class="logged-user-info" ng-show="!ctrl.currentUser"> | |
16 | + <form> | |
17 | + <div class="form-group"> | |
18 | + <label for="exampleInputEmail1">{{"auth.form.login" | translate}}</label> | |
19 | + <input type="text" class="form-control" id="exampleInputEmail1" placeholder="Login / Email" ng-model="ctrl.credentials.username"> | |
20 | + </div> | |
21 | + <div class="form-group"> | |
22 | + <label for="exampleInputPassword1">{{"auth.form.password" | translate}}</label> | |
23 | + <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password" ng-model="ctrl.credentials.password"> | |
24 | + </div> | |
25 | + <button type="submit" class="btn btn-default" ng-click="ctrl.login()">{{"auth.form.login_button" | translate}}</button> | |
26 | + </form> | |
27 | +</div> | |
0 | 28 | \ No newline at end of file | ... | ... |
src/app/login/session.service.ts
... | ... | @@ -11,13 +11,11 @@ export class SessionService { |
11 | 11 | |
12 | 12 | create(data: UserResponse): noosfero.User { |
13 | 13 | this.$localStorage.currentUser = data.user; |
14 | - this.$log.debug('User session created.', this.$localStorage.currentUser); | |
15 | 14 | return this.$localStorage.currentUser; |
16 | 15 | }; |
17 | 16 | |
18 | 17 | destroy() { |
19 | 18 | delete this.$localStorage.currentUser; |
20 | - this.$log.debug('User session destroyed.'); | |
21 | 19 | }; |
22 | 20 | |
23 | 21 | currentUser(): noosfero.User { | ... | ... |
src/app/main/main.component.ts
... | ... | @@ -19,6 +19,7 @@ import {StatisticsBlockComponent} from "../layout/blocks/statistics/statistics-b |
19 | 19 | import {MembersBlockComponent} from "./../layout/blocks/members/members-block.component"; |
20 | 20 | import {CommunitiesBlockComponent} from "./../layout/blocks/communities/communities-block.component"; |
21 | 21 | |
22 | +import {LoginBlockComponent} from "../layout/blocks/login-block/login-block.component"; | |
22 | 23 | |
23 | 24 | import {NoosferoTemplate} from "../shared/pipes/noosfero-template.filter"; |
24 | 25 | import {DateFormat} from "../shared/pipes/date-format.filter"; |
... | ... | @@ -96,7 +97,8 @@ export class EnvironmentContent { |
96 | 97 | EnvironmentComponent, PeopleBlockComponent, |
97 | 98 | LinkListBlockComponent, CommunitiesBlockComponent, HtmlEditorComponent, |
98 | 99 | MainBlockComponent, RecentDocumentsBlockComponent, Navbar, SidebarComponent, ProfileImageBlockComponent, |
99 | - MembersBlockComponent, NoosferoTemplate, DateFormat, RawHTMLBlockComponent, StatisticsBlockComponent | |
100 | + MembersBlockComponent, NoosferoTemplate, DateFormat, RawHTMLBlockComponent, StatisticsBlockComponent, | |
101 | + LoginBlockComponent | |
100 | 102 | ].concat(plugins.mainComponents).concat(plugins.hotspots), |
101 | 103 | |
102 | 104 | providers: [AuthService, SessionService, NotificationService, BodyStateClassesService] | ... | ... |
src/lib/ng-noosfero-api/interfaces/person.ts
src/lib/ng-noosfero-api/interfaces/profile.ts
... | ... | @@ -22,6 +22,14 @@ namespace noosfero { |
22 | 22 | * @returns {string} The unque identifier for the Profile |
23 | 23 | */ |
24 | 24 | identifier: string; |
25 | + | |
26 | + /** | |
27 | + * @ngdoc property | |
28 | + * @name created_at | |
29 | + * @propertyOf noofero.Profile | |
30 | + * @returns {string} The timestamp this object was created | |
31 | + */ | |
32 | + created_at: string; | |
25 | 33 | |
26 | 34 | /** |
27 | 35 | * @ngdoc property | ... | ... |
src/spec/component-test-helper.ts
... | ... | @@ -2,6 +2,7 @@ import { Component } from "ng-forward"; |
2 | 2 | import { TestComponentBuilder, ngClass } from 'ng-forward/cjs/testing/test-component-builder'; |
3 | 3 | import { INgForwardJQuery } from "ng-forward/cjs/util/jqlite-extensions"; |
4 | 4 | import { ComponentFixture } from 'ng-forward/cjs/testing/test-component-builder'; |
5 | +import * as helpers from './helpers'; | |
5 | 6 | |
6 | 7 | /** |
7 | 8 | * @ngdoc object |
... | ... | @@ -149,6 +150,7 @@ export function createClass({ |
149 | 150 | providers = <any[]>[], |
150 | 151 | properties = <any>{} |
151 | 152 | }): any { |
153 | + providers = providers.concat(helpers.provideFilters("translateFilter")); | |
152 | 154 | @Component({ selector: 'component-test-helper-container', template, directives, providers }) |
153 | 155 | class Test { |
154 | 156 | constructor() { | ... | ... |
src/spec/mocks.ts