From 43d0ea7f4b88d52097172cc0c1831edd7e492503 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Wed, 28 Aug 2019 14:40:06 +0200 Subject: Add welcome modal --- .../instance-config-warning-modal.component.html | 15 +++++ .../instance-config-warning-modal.component.scss | 6 ++ .../instance-config-warning-modal.component.ts | 23 ++++++++ client/src/app/modal/welcome-modal.component.html | 66 ++++++++++++++++++++++ client/src/app/modal/welcome-modal.component.scss | 31 ++++++++++ client/src/app/modal/welcome-modal.component.ts | 40 +++++++++++++ 6 files changed, 181 insertions(+) create mode 100644 client/src/app/modal/instance-config-warning-modal.component.html create mode 100644 client/src/app/modal/instance-config-warning-modal.component.scss create mode 100644 client/src/app/modal/instance-config-warning-modal.component.ts create mode 100644 client/src/app/modal/welcome-modal.component.html create mode 100644 client/src/app/modal/welcome-modal.component.scss create mode 100644 client/src/app/modal/welcome-modal.component.ts (limited to 'client/src/app/modal') diff --git a/client/src/app/modal/instance-config-warning-modal.component.html b/client/src/app/modal/instance-config-warning-modal.component.html new file mode 100644 index 000000000..595afb103 --- /dev/null +++ b/client/src/app/modal/instance-config-warning-modal.component.html @@ -0,0 +1,15 @@ + +
+

Warning!

+ +
+ +
+ +
+ +
+ Close +
+ + diff --git a/client/src/app/modal/instance-config-warning-modal.component.scss b/client/src/app/modal/instance-config-warning-modal.component.scss new file mode 100644 index 000000000..51834c649 --- /dev/null +++ b/client/src/app/modal/instance-config-warning-modal.component.scss @@ -0,0 +1,6 @@ +@import '_mixins'; +@import '_variables'; + +.action-button-cancel { + margin-right: 0 !important; +} diff --git a/client/src/app/modal/instance-config-warning-modal.component.ts b/client/src/app/modal/instance-config-warning-modal.component.ts new file mode 100644 index 000000000..5cc9207cd --- /dev/null +++ b/client/src/app/modal/instance-config-warning-modal.component.ts @@ -0,0 +1,23 @@ +import { Component, ElementRef, ViewChild } from '@angular/core' +import { Notifier } from '@app/core' +import { I18n } from '@ngx-translate/i18n-polyfill' +import { NgbModal } from '@ng-bootstrap/ng-bootstrap' + +@Component({ + selector: 'my-instance-config-warning-modal', + templateUrl: './instance-config-warning-modal.component.html', + styleUrls: [ './instance-config-warning-modal.component.scss' ] +}) +export class InstanceConfigWarningModalComponent { + @ViewChild('modal', { static: true }) modal: ElementRef + + constructor ( + private modalService: NgbModal, + private notifier: Notifier, + private i18n: I18n + ) { } + + show () { + this.modalService.open(this.modal) + } +} diff --git a/client/src/app/modal/welcome-modal.component.html b/client/src/app/modal/welcome-modal.component.html new file mode 100644 index 000000000..c83b53c2c --- /dev/null +++ b/client/src/app/modal/welcome-modal.component.html @@ -0,0 +1,66 @@ + +
+

Welcome on PeerTube dear administrator!

+ +
+ +
+ +
+
Useful links
+ + +
+ +
+
Configure your instance
+ +

+ Now it's time to configure your instance! Choosing your instance name, setting up a description, + specifying who you are and how long you plan to maintain your instance + is very important for visitors to understand on what type of instance they are. +

+ +

+ If you want to open registrations, please decide what are your moderation rules, fill your instance terms + and specify the categories and languages you speak. This way, users that are looking for a PeerTube instance on which they can register + will be able to choose the right one. +

+ +
+ Configure your instance +
+
+ +
+
Index your instance
+ + If you want, you can index your PeerTube instance on the public PeerTube instances list: + https://instances.joinpeertube.org/instances +
+
+ +
+ Understood! +
+ + diff --git a/client/src/app/modal/welcome-modal.component.scss b/client/src/app/modal/welcome-modal.component.scss new file mode 100644 index 000000000..ab57bb993 --- /dev/null +++ b/client/src/app/modal/welcome-modal.component.scss @@ -0,0 +1,31 @@ +@import '_mixins'; +@import '_variables'; + +.modal-body { + font-size: 15px; +} + +.action-button-cancel { + margin-right: 0 !important; +} + +.subtitle { + font-weight: $font-semibold; + margin-bottom: 10px; + font-size: 16px; +} + +.block-configuration, +.block-instance { + margin-top: 30px; +} + +li { + margin-bottom: 10px; +} + +.configure-instance { + text-align: center; + font-weight: 600; + font-size: 18px; +} diff --git a/client/src/app/modal/welcome-modal.component.ts b/client/src/app/modal/welcome-modal.component.ts new file mode 100644 index 000000000..bff2968d4 --- /dev/null +++ b/client/src/app/modal/welcome-modal.component.ts @@ -0,0 +1,40 @@ +import { Component, ElementRef, ViewChild } from '@angular/core' +import { Notifier } from '@app/core' +import { NgbModal } from '@ng-bootstrap/ng-bootstrap' +import { UserService } from '@app/shared' + +@Component({ + selector: 'my-welcome-modal', + templateUrl: './welcome-modal.component.html', + styleUrls: [ './welcome-modal.component.scss' ] +}) +export class WelcomeModalComponent { + @ViewChild('modal', { static: true }) modal: ElementRef + + constructor ( + private userService: UserService, + private modalService: NgbModal, + private notifier: Notifier + ) { } + + show () { + const ref = this.modalService.open(this.modal,{ + backdrop: 'static', + keyboard: false, + size: 'lg' + }) + + ref.result.finally(() => this.doNotOpenAgain()) + } + + private doNotOpenAgain () { + this.userService.updateMyProfile({ noWelcomeModal: true }) + .subscribe( + () => console.log('We will not open the welcome modal again.'), + + err => this.notifier.error(err.message) + ) + + return true + } +} -- cgit v1.2.3