From 6812df7a535cba4c6134d574b2efbfc8e5b25ba9 Mon Sep 17 00:00:00 2001 From: Henriette Dinger Date: Wed, 22 May 2019 13:22:06 +0200 Subject: [PATCH] Add new teaser video on the boards page when there is no EE token --- config/locales/js-en.yml | 6 ++-- frontend/src/app/globals/constants.const.ts | 2 ++ .../modules/boards/board-constants.const.ts | 1 + .../boards-index-page.component.html | 30 +++++++++++++++---- .../boards-index-page.component.sass | 8 +++++ .../index-page/boards-index-page.component.ts | 27 ++++++++++++++--- 6 files changed, 63 insertions(+), 11 deletions(-) create mode 100644 frontend/src/app/modules/boards/board-constants.const.ts diff --git a/config/locales/js-en.yml b/config/locales/js-en.yml index c2e9c1378e..4824c23685 100644 --- a/config/locales/js-en.yml +++ b/config/locales/js-en.yml @@ -49,8 +49,10 @@ en: boards: upsale: - boards: 'Need to freely structure your work in a board view?' - check_out_link: 'Check out the Enterprise Edition.' + teaser_text: 'Improve your agile project management with this flexible Boards view. Create as many boards as you like for anything you would like to keep track of.' + upgrade_to_ee_text: 'Boards is an Enterprise feature. Please upgrade to a paid plan.' + upgrade: 'Upgrade now' + personal_demo: 'Get a personal demo' lists: delete: 'Delete list' edit_version: 'Edit version' diff --git a/frontend/src/app/globals/constants.const.ts b/frontend/src/app/globals/constants.const.ts index 1dc4f8279b..df2ca18347 100644 --- a/frontend/src/app/globals/constants.const.ts +++ b/frontend/src/app/globals/constants.const.ts @@ -1 +1,3 @@ export const enterpriseEditionUrl = "https://www.openproject.org/enterprise-edition/?op_edtion=community-edition"; + +export const enterpriseDemoUrl = "https://www.openproject.org/enterprise-demo/"; diff --git a/frontend/src/app/modules/boards/board-constants.const.ts b/frontend/src/app/modules/boards/board-constants.const.ts new file mode 100644 index 0000000000..388d8ea5dc --- /dev/null +++ b/frontend/src/app/modules/boards/board-constants.const.ts @@ -0,0 +1 @@ +export const boardTeaserVideoURL = "https://player.vimeo.com/video/337280106"; diff --git a/frontend/src/app/modules/boards/index-page/boards-index-page.component.html b/frontend/src/app/modules/boards/index-page/boards-index-page.component.html index 22c53c27fd..5a2b101fc7 100644 --- a/frontend/src/app/modules/boards/index-page/boards-index-page.component.html +++ b/frontend/src/app/modules/boards/index-page/boards-index-page.component.html @@ -103,8 +103,28 @@ - - +
+

{{ text.teaser_text }}

+

{{ text.enterprise }}

+ + + {{ text.upgrade }} + + + + {{ text.personal_demo }} + + +
+ +
+
diff --git a/frontend/src/app/modules/boards/index-page/boards-index-page.component.sass b/frontend/src/app/modules/boards/index-page/boards-index-page.component.sass index fff0b3389d..8519106d6e 100644 --- a/frontend/src/app/modules/boards/index-page/boards-index-page.component.sass +++ b/frontend/src/app/modules/boards/index-page/boards-index-page.component.sass @@ -1,2 +1,10 @@ .boards--listing-group position: relative + +.boards--teaser-video-container + height: 50vh + text-align: center + + .boards--teaser-video + width: 100% + height: 100% diff --git a/frontend/src/app/modules/boards/index-page/boards-index-page.component.ts b/frontend/src/app/modules/boards/index-page/boards-index-page.component.ts index bb32dc3911..22eb2de39c 100644 --- a/frontend/src/app/modules/boards/index-page/boards-index-page.component.ts +++ b/frontend/src/app/modules/boards/index-page/boards-index-page.component.ts @@ -1,4 +1,4 @@ -import {AfterContentInit, AfterViewInit, Component, Injector, OnDestroy, OnInit} from "@angular/core"; +import {AfterViewInit, Component, Injector, OnDestroy, OnInit} from "@angular/core"; import {Observable} from "rxjs"; import {I18nService} from "core-app/modules/common/i18n/i18n.service"; import {BoardService} from "core-app/modules/boards/board/board.service"; @@ -11,6 +11,9 @@ import {BannersService} from "core-app/modules/common/enterprise/banners.service import {LoadingIndicatorService} from "core-app/modules/common/loading-indicator/loading-indicator.service"; import {AuthorisationService} from "core-app/modules/common/model-auth/model-auth.service"; import {componentDestroyed} from "ng2-rx-componentdestroyed"; +import {enterpriseDemoUrl, enterpriseEditionUrl} from "core-app/globals/constants.const"; +import {DomSanitizer} from "@angular/platform-browser"; +import {boardTeaserVideoURL} from "core-app/modules/boards/board-constants.const"; @Component({ templateUrl: './boards-index-page.component.html', @@ -31,8 +34,11 @@ export class BoardsIndexPageComponent implements OnInit, OnDestroy, AfterViewIni areYouSure: this.I18n.t('js.text_are_you_sure'), deleteSuccessful: this.I18n.t('js.notice_successful_delete'), noResults: this.I18n.t('js.notice_no_results_to_display'), - upsaleBoards: this.I18n.t('js.boards.upsale.boards'), - upsaleCheckOutLink: this.I18n.t('js.boards.upsale.check_out_link') + + teaser_text: this.I18n.t('js.boards.upsale.teaser_text'), + enterprise: this.I18n.t('js.boards.upsale.upgrade_to_ee_text'), + upgrade: this.I18n.t('js.boards.upsale.upgrade'), + personal_demo: this.I18n.t('js.boards.upsale.personal_demo'), }; public canAdd = false; @@ -47,7 +53,8 @@ export class BoardsIndexPageComponent implements OnInit, OnDestroy, AfterViewIni private readonly loadingIndicatorService:LoadingIndicatorService, private readonly authorisationService:AuthorisationService, private readonly injector:Injector, - private readonly bannerService:BannersService) { + private readonly bannerService:BannersService, + private readonly domSanitizer:DomSanitizer) { } ngOnInit():void { @@ -88,4 +95,16 @@ export class BoardsIndexPageComponent implements OnInit, OnDestroy, AfterViewIni public showBoardIndexView() { return !this.bannerService.eeShowBanners; } + + public eeLink() { + return enterpriseEditionUrl + '&op_referrer=boards'; + } + + public demoLink() { + return enterpriseDemoUrl; + } + + public teaserVideoURL() { + return this.domSanitizer.bypassSecurityTrustResourceUrl(boardTeaserVideoURL); + } }