Commit 6b66bf91d4eca6487bffcaa7af5dd52e20ae0f88
1 parent
a7fe2119
Added the modal to show environment terms of use text
Showing
10 changed files
with
109 additions
and
61 deletions
Show diff stats
src/app/account/register-component.html
... | ... | @@ -2,7 +2,6 @@ |
2 | 2 | <div class="welcome-message"> |
3 | 3 | <h1>{{"account.register.welcomeMessageTitle" | translate }}</h1> |
4 | 4 | <div class="environment-signup-intro" ng-bind-html="ctrl.environment.signup_intro"></div> |
5 | - <p>{{"account.register.seeMoreMessage" | translate}} <a href="#">{{"account.register.informationsMessage" | translate}} </a></p> | |
6 | 5 | </div> |
7 | 6 | <form name="signupForm"> |
8 | 7 | <div class="row"> |
... | ... | @@ -62,7 +61,7 @@ |
62 | 61 | </div> |
63 | 62 | |
64 | 63 | <div class="col-md-12"> |
65 | - <p class="terms-info">{{"account.register.accountCreatingMessage" | translate}} <a href="#">{{"account.register.termsOfUseMessage" | translate}}</a>.</p> | |
64 | + <p class="terms-info">{{"account.register.accountCreatingMessage" | translate}} <a (click)="ctrl.openTerms()" href="#">{{"account.register.termsOfUseMessage" | translate}}</a>.</p> | |
66 | 65 | </div> |
67 | 66 | |
68 | 67 | <div class="col-md-12"> | ... | ... |
... | ... | @@ -0,0 +1,7 @@ |
1 | +<div class="modal-header"> | |
2 | + <h3 class="modal-title">Register terms</h3> | |
3 | +</div> | |
4 | +<div class="modal-body modal-body-overflow" ng-bind-html="ctrl.environment.terms_of_use"></div> | |
5 | +<div class="modal-footer"> | |
6 | + <button class="btn btn-primary" type="button" (click)="vm.closeTerms()">OK</button> | |
7 | +</div> | ... | ... |
src/app/account/register.component.ts
... | ... | @@ -2,6 +2,8 @@ import { Inject, Input, Component, Output, EventEmitter, provide } from 'ng-forw |
2 | 2 | import { RegisterService } from "./../../lib/ng-noosfero-api/http/register.service"; |
3 | 3 | import { NotificationService } from "./../shared/services/notification.service"; |
4 | 4 | import { EnvironmentService } from "../../lib/ng-noosfero-api/http/environment.service"; |
5 | +import { RegisterController } from "./register.controller"; | |
6 | +import { IModalComponent } from "../shared/components/interfaces"; | |
5 | 7 | |
6 | 8 | @Component({ |
7 | 9 | selector: 'noosfero-register', |
... | ... | @@ -11,16 +13,20 @@ import { EnvironmentService } from "../../lib/ng-noosfero-api/http/environment.s |
11 | 13 | ] |
12 | 14 | }) |
13 | 15 | |
14 | -@Inject("$state", RegisterService, NotificationService, EnvironmentService) | |
16 | +@Inject('$state', '$uibModal', '$scope', RegisterService, NotificationService, EnvironmentService) | |
15 | 17 | export class RegisterComponent { |
16 | 18 | @Input() account: any; |
17 | 19 | environment: noosfero.Environment; |
18 | 20 | |
21 | + modalInstance: ng.ui.bootstrap.IModalServiceInstance; | |
22 | + | |
19 | 23 | constructor( |
20 | 24 | private $state: ng.ui.IStateService, |
25 | + private $uibModal: ng.ui.bootstrap.IModalService, | |
26 | + private $scope: ng.IScope, | |
21 | 27 | public registerService: RegisterService, |
22 | 28 | private notificationService: NotificationService, |
23 | - private environmentService: EnvironmentService | |
29 | + private environmentService: EnvironmentService, | |
24 | 30 | ) { |
25 | 31 | this.account = {}; |
26 | 32 | this.environment = environmentService.getCurrentEnvironment(); |
... | ... | @@ -44,4 +50,16 @@ export class RegisterComponent { |
44 | 50 | isInvalid(field: Object): Object { |
45 | 51 | return { 'has-error': field['$touched'] && field['$invalid'] }; |
46 | 52 | } |
53 | + | |
54 | + openTerms() { | |
55 | + | |
56 | + this.modalInstance = this.$uibModal.open({ | |
57 | + templateUrl: 'app/account/register-terms.html', | |
58 | + size: 'lg', | |
59 | + controller: RegisterController, | |
60 | + controllerAs: 'vm', | |
61 | + bindToController: true, | |
62 | + scope: this.$scope | |
63 | + }); | |
64 | + } | |
47 | 65 | } | ... | ... |
... | ... | @@ -0,0 +1,17 @@ |
1 | +import { Input } from "ng-forward"; | |
2 | +import { IModalComponent } from "../shared/components/interfaces"; | |
3 | + | |
4 | +export class RegisterController { | |
5 | + | |
6 | + static $inject = ["$log", "$stateParams", "$scope"]; | |
7 | + ctrl: IModalComponent; | |
8 | + | |
9 | + constructor( | |
10 | + private $log: ng.ILogService, | |
11 | + private $stateParams: any, | |
12 | + ) { } | |
13 | + | |
14 | + closeTerms() { | |
15 | + this.ctrl.modalInstance.dismiss('ok'); | |
16 | + } | |
17 | +} | ... | ... |
src/app/account/scss/register-component.scss
... | ... | @@ -1,38 +0,0 @@ |
1 | -.register-page button { | |
2 | - width: 100%; | |
3 | - text-transform: uppercase; | |
4 | - font-weight: 600; | |
5 | -} | |
6 | - | |
7 | -.register-page .light-text { | |
8 | - color: #BBB; | |
9 | - margin-top: 0px; | |
10 | - margin-bottom: 0px; | |
11 | - font-weight: 600; | |
12 | -} | |
13 | - | |
14 | -.register-page .terms-info { | |
15 | - margin-top: 30px; | |
16 | - margin-bottom: 30px; | |
17 | -} | |
18 | - | |
19 | -.register-page .welcome-message { | |
20 | - text-align: center; | |
21 | -} | |
22 | - | |
23 | -.register-page .already-registered-message { | |
24 | - margin-top: 60px; | |
25 | - text-align: center; | |
26 | -} | |
27 | - | |
28 | -.register-page input { | |
29 | - height: 40px; | |
30 | -} | |
31 | - | |
32 | -.register-page .register-field { | |
33 | - margin-bottom: 25px; | |
34 | -} | |
35 | - | |
36 | -.register-page input:focus { | |
37 | - border: 2px solid #bbb; | |
38 | -} |
... | ... | @@ -0,0 +1,44 @@ |
1 | +.modal .modal-body-overflow { | |
2 | + max-height: 420px; | |
3 | + overflow-y: auto; | |
4 | +} | |
5 | + | |
6 | +.register-page button { | |
7 | + width: 100%; | |
8 | + text-transform: uppercase; | |
9 | + font-weight: 600; | |
10 | +} | |
11 | + | |
12 | +.register-page .light-text { | |
13 | + color: #BBB; | |
14 | + margin-top: 0px; | |
15 | + margin-bottom: 0px; | |
16 | + font-weight: 600; | |
17 | +} | |
18 | + | |
19 | +.register-page .terms-info { | |
20 | + margin-top: 30px; | |
21 | + margin-bottom: 30px; | |
22 | + font-weight: bold; | |
23 | +} | |
24 | + | |
25 | +.register-page .welcome-message { | |
26 | + text-align: center; | |
27 | +} | |
28 | + | |
29 | +.register-page .already-registered-message { | |
30 | + margin-top: 60px; | |
31 | + text-align: center; | |
32 | +} | |
33 | + | |
34 | +.register-page input { | |
35 | + height: 40px; | |
36 | +} | |
37 | + | |
38 | +.register-page .register-field { | |
39 | + margin-bottom: 25px; | |
40 | +} | |
41 | + | |
42 | +.register-page input:focus { | |
43 | + border: 2px solid #bbb; | |
44 | +} | ... | ... |
src/app/layout/navbar/navbar.ts
1 | -import {Component, Inject, EventEmitter, Input} from "ng-forward"; | |
2 | -import {LanguageSelectorComponent} from "../language-selector/language-selector.component"; | |
3 | -import {SessionService, AuthService, AuthController, AuthEvents} from "./../../login"; | |
4 | -import {EnvironmentService} from "./../../../lib/ng-noosfero-api/http/environment.service"; | |
5 | -import {SidebarNotificationService} from "../sidebar/sidebar.notification.service"; | |
6 | -import {BodyStateClassesService} from '../services/body-state-classes.service'; | |
7 | -import {DesignModeTogglerComponent} from './../../admin/layout-edit/designModeToggler.component'; | |
8 | -import {BootstrapSwitcherComponent, BootstrapSwitcherItem} from './../../shared/components/bootstrap-switcher/bootstrap-switcher.component'; | |
1 | +import { Component, Inject, EventEmitter, Input } from "ng-forward"; | |
2 | +import { LanguageSelectorComponent } from "../language-selector/language-selector.component"; | |
3 | +import { SessionService, AuthService, AuthController, AuthEvents } from "./../../login"; | |
4 | +import { EnvironmentService } from "./../../../lib/ng-noosfero-api/http/environment.service"; | |
5 | +import { SidebarNotificationService } from "../sidebar/sidebar.notification.service"; | |
6 | +import { BodyStateClassesService } from '../services/body-state-classes.service'; | |
7 | +import { DesignModeTogglerComponent } from './../../admin/layout-edit/designModeToggler.component'; | |
8 | +import { BootstrapSwitcherComponent, BootstrapSwitcherItem } from './../../shared/components/bootstrap-switcher/bootstrap-switcher.component'; | |
9 | 9 | |
10 | 10 | @Component({ |
11 | 11 | selector: "acme-navbar", |
... | ... | @@ -17,14 +17,14 @@ import {BootstrapSwitcherComponent, BootstrapSwitcherItem} from './../../shared/ |
17 | 17 | export class Navbar { |
18 | 18 | |
19 | 19 | private currentUser: noosfero.User; |
20 | - private modalInstance: any = null; | |
20 | + private modalInstance: ng.ui.bootstrap.IModalServiceInstance; | |
21 | 21 | public showHamburger: boolean = false; |
22 | 22 | public currentEnvironment: noosfero.Environment = <any>{ name: '' }; |
23 | 23 | /** |
24 | 24 | * |
25 | 25 | */ |
26 | 26 | constructor( |
27 | - private $uibModal: any, | |
27 | + private $uibModal: ng.ui.bootstrap.IModalService, | |
28 | 28 | public authService: AuthService, |
29 | 29 | private session: SessionService, |
30 | 30 | private $state: ng.ui.IStateService, | ... | ... |
src/app/shared/components/interfaces.ts
1 | - | |
2 | - | |
3 | 1 | export interface IComponentWithPermissions { |
4 | 2 | permissions: () => string[]; |
5 | -} | |
6 | 3 | \ No newline at end of file |
4 | +} | |
5 | + | |
6 | +export interface IModalComponent { | |
7 | + $uibModal: ng.ui.bootstrap.IModalService; | |
2 |
|
|
8 | + modalInstance: ng.ui.bootstrap.IModalServiceInstance; | |
9 | +} | ... | ... |
src/languages/en.json
... | ... | @@ -100,8 +100,6 @@ |
100 | 100 | "block.edition.display_user.not_logged": "Not logged", |
101 | 101 | "block.edition.language.label": "Show for:", |
102 | 102 | "account.register.welcomeMessageTitle": "Nice to have you there!", |
103 | - "account.register.seeMoreMessage": "See more ", | |
104 | - "account.register.informationsMessage": "informations", | |
105 | 103 | "account.register.fullNameLabel": "Full name", |
106 | 104 | "account.register.usernameLabel": "Username", |
107 | 105 | "account.register.emailLabel": "Email", |
... | ... | @@ -117,5 +115,6 @@ |
117 | 115 | "messages.invalid.required": "This field is required", |
118 | 116 | "messages.invalid.maxlength": "This field is too long", |
119 | 117 | "messages.invalid.minlength": "This field is too short", |
120 | - "messages.invalid.email": "This needs to be a valid email" | |
118 | + "messages.invalid.email": "This needs to be a valid email", | |
119 | + "messages.invalid.passwordConfirm": "Passwords do not match" | |
121 | 120 | } | ... | ... |
src/languages/pt.json
... | ... | @@ -100,8 +100,6 @@ |
100 | 100 | "block.edition.display_user.not_logged": "Não logados", |
101 | 101 | "block.edition.language.label": "Exibir para:", |
102 | 102 | "account.register.welcomeMessageTitle": "Ótimo ter você aqui!", |
103 | - "account.register.seeMoreMessage": "Saiba mais ", | |
104 | - "account.register.informationsMessage": "informações", | |
105 | 103 | "account.register.fullNameLabel": "Nome completo", |
106 | 104 | "account.register.lastNameLabel": "Sobrenome", |
107 | 105 | "account.register.usernameLabel": "Nome de usuário", |
... | ... | @@ -118,5 +116,6 @@ |
118 | 116 | "messages.invalid.required": "Campo obrigatório", |
119 | 117 | "messages.invalid.maxlength": "O valor é muito longo", |
120 | 118 | "messages.invalid.minlength": "O valor é muito curto", |
121 | - "messages.invalid.email": "Informe um email válido" | |
119 | + "messages.invalid.email": "Informe um email válido", | |
120 | + "messages.invalid.passwordConfirm": "As senhas não coincidem" | |
122 | 121 | } | ... | ... |