aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/core
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-01-27 16:54:44 +0100
committerChocobozzz <florian.bigard@gmail.com>2017-01-27 16:59:56 +0100
commit5769e1db8d3d5a1e3baa8dff23090cfe93d48a50 (patch)
treeacbb14fda82b7517734f22d4ca57fb5e1ff9ef04 /client/src/app/core
parent7ddd02c9b8c1e088f6679a2227f105e6439fc992 (diff)
downloadPeerTube-5769e1db8d3d5a1e3baa8dff23090cfe93d48a50.tar.gz
PeerTube-5769e1db8d3d5a1e3baa8dff23090cfe93d48a50.tar.zst
PeerTube-5769e1db8d3d5a1e3baa8dff23090cfe93d48a50.zip
Client: better confirm box for a beautiful world
Diffstat (limited to 'client/src/app/core')
-rw-r--r--client/src/app/core/confirm/confirm.component.html20
-rw-r--r--client/src/app/core/confirm/confirm.component.ts61
-rw-r--r--client/src/app/core/confirm/confirm.service.ts15
-rw-r--r--client/src/app/core/confirm/index.ts2
-rw-r--r--client/src/app/core/core.module.ts13
-rw-r--r--client/src/app/core/index.ts2
6 files changed, 112 insertions, 1 deletions
diff --git a/client/src/app/core/confirm/confirm.component.html b/client/src/app/core/confirm/confirm.component.html
new file mode 100644
index 000000000..3052526ba
--- /dev/null
+++ b/client/src/app/core/confirm/confirm.component.html
@@ -0,0 +1,20 @@
1<div bsModal #confirmModal="bs-modal" class="modal" tabindex="-1" role="dialog">
2 <div class="modal-dialog">
3 <div class="modal-content">
4
5 <div class="modal-header">
6 <button type="button" class="close" aria-label="Close" (click)="abort()">
7 <span aria-hidden="true">&times;</span>
8 </button>
9 <h4 class="modal-title">{{ title }}</h4>
10 </div>
11
12 <div class="modal-body" [innerHtml]="message"></div>
13
14 <div class="modal-footer">
15 <button type="button" class="btn btn-default" data-dismiss="modal" (click)="abort()">Annuler</button>
16 <button type="button" class="btn btn-primary" (click)="confirm()">Valider</button>
17 </div>
18 </div>
19 </div>
20</div>
diff --git a/client/src/app/core/confirm/confirm.component.ts b/client/src/app/core/confirm/confirm.component.ts
new file mode 100644
index 000000000..14b4ef324
--- /dev/null
+++ b/client/src/app/core/confirm/confirm.component.ts
@@ -0,0 +1,61 @@
1import { Component, HostListener, OnInit, ViewChild } from '@angular/core';
2
3import { ModalDirective } from 'ng2-bootstrap/modal';
4
5import { ConfirmService } from './confirm.service';
6
7export interface ConfigChangedEvent {
8 columns: { [id: string]: { isDisplayed: boolean }; };
9 config: { resultsPerPage: number };
10}
11
12@Component({
13 selector: 'my-confirm',
14 templateUrl: './confirm.component.html'
15})
16export class ConfirmComponent implements OnInit {
17 @ViewChild('confirmModal') confirmModal: ModalDirective;
18
19 title = '';
20 message = '';
21
22 constructor (private confirmService: ConfirmService) {
23 // Empty
24 }
25
26 ngOnInit() {
27 this.confirmModal.config = {
28 backdrop: 'static',
29 keyboard: false
30 };
31
32 this.confirmService.showConfirm.subscribe(
33 ({ title, message }) => {
34 this.title = title;
35 this.message = message;
36
37 this.showModal();
38 }
39 );
40 }
41
42 @HostListener('keydown.enter')
43 confirm() {
44 this.confirmService.confirmResponse.next(true);
45 this.hideModal();
46 }
47
48 @HostListener('keydown.esc')
49 abort() {
50 this.confirmService.confirmResponse.next(false);
51 this.hideModal();
52 }
53
54 showModal() {
55 this.confirmModal.show();
56 }
57
58 hideModal() {
59 this.confirmModal.hide();
60 }
61}
diff --git a/client/src/app/core/confirm/confirm.service.ts b/client/src/app/core/confirm/confirm.service.ts
new file mode 100644
index 000000000..b97969795
--- /dev/null
+++ b/client/src/app/core/confirm/confirm.service.ts
@@ -0,0 +1,15 @@
1import { Injectable } from '@angular/core';
2import { Subject } from 'rxjs/Subject';
3import 'rxjs/add/operator/first';
4
5@Injectable()
6export class ConfirmService {
7 showConfirm = new Subject<{ title, message }>();
8 confirmResponse = new Subject<boolean>();
9
10 confirm(message: string = '', title: string = '') {
11 this.showConfirm.next({ title, message });
12
13 return this.confirmResponse.asObservable().first();
14 }
15}
diff --git a/client/src/app/core/confirm/index.ts b/client/src/app/core/confirm/index.ts
new file mode 100644
index 000000000..789e7e547
--- /dev/null
+++ b/client/src/app/core/confirm/index.ts
@@ -0,0 +1,2 @@
1export * from './confirm.component';
2export * from './confirm.service';
diff --git a/client/src/app/core/core.module.ts b/client/src/app/core/core.module.ts
index 48fec2d43..f02304647 100644
--- a/client/src/app/core/core.module.ts
+++ b/client/src/app/core/core.module.ts
@@ -4,8 +4,10 @@ import { HttpModule } from '@angular/http';
4import { RouterModule } from '@angular/router'; 4import { RouterModule } from '@angular/router';
5 5
6import { SimpleNotificationsModule } from 'angular2-notifications'; 6import { SimpleNotificationsModule } from 'angular2-notifications';
7import { ModalModule } from 'ng2-bootstrap/modal';
7 8
8import { AuthService } from './auth'; 9import { AuthService } from './auth';
10import { ConfirmComponent, ConfirmService } from './confirm';
9import { MenuComponent, MenuAdminComponent } from './menu'; 11import { MenuComponent, MenuAdminComponent } from './menu';
10import { throwIfAlreadyLoaded } from './module-import-guard'; 12import { throwIfAlreadyLoaded } from './module-import-guard';
11 13
@@ -15,19 +17,28 @@ import { throwIfAlreadyLoaded } from './module-import-guard';
15 HttpModule, 17 HttpModule,
16 RouterModule, 18 RouterModule,
17 19
20 ModalModule,
18 SimpleNotificationsModule 21 SimpleNotificationsModule
19 ], 22 ],
23
20 declarations: [ 24 declarations: [
25 ConfirmComponent,
21 MenuComponent, 26 MenuComponent,
22 MenuAdminComponent 27 MenuAdminComponent
23 ], 28 ],
29
24 exports: [ 30 exports: [
25 SimpleNotificationsModule, 31 SimpleNotificationsModule,
26 32
33 ConfirmComponent,
27 MenuComponent, 34 MenuComponent,
28 MenuAdminComponent 35 MenuAdminComponent
29 ], 36 ],
30 providers: [ AuthService ] 37
38 providers: [
39 AuthService,
40 ConfirmService
41 ]
31}) 42})
32export class CoreModule { 43export class CoreModule {
33 constructor( @Optional() @SkipSelf() parentModule: CoreModule) { 44 constructor( @Optional() @SkipSelf() parentModule: CoreModule) {
diff --git a/client/src/app/core/index.ts b/client/src/app/core/index.ts
index fa951b215..9b4dd1999 100644
--- a/client/src/app/core/index.ts
+++ b/client/src/app/core/index.ts
@@ -1,2 +1,4 @@
1export * from './auth'; 1export * from './auth';
2export * from './confirm';
3export * from './menu';
2export * from './core.module' 4export * from './core.module'