@@ -81,10 +81,12 @@
+
+
diff --git a/src/app/datasets/components/results/results.component.scss b/src/app/datasets/components/results/results.component.scss index 5d715f93..88878ec5 100644 --- a/src/app/datasets/components/results/results.component.scss +++ b/src/app/datasets/components/results/results.component.scss @@ -1,6 +1,18 @@ @import "../../../../../node_modules/bulma/sass/utilities/_all"; @import "../../../../scss/variables.scss"; +//not working in a calc() +$sticky-distance: $header-bar-height + 32px; + +.main-content{ + display: flex; + padding: 2rem; + flex-direction: column; + @media screen and(min-width:$desktop){ + flex-direction: row; + } +} + @media (max-width: $tablet) { .header-dataset { flex-direction: column-reverse; @@ -27,7 +39,7 @@ justify-content: space-between; align-items: center; background: $grey-background-color; - border-bottom: 1px solid $grey-super-light-color; + //border-bottom: 1px solid $grey-super-light-color; cursor: pointer; .filter-title { @@ -65,12 +77,18 @@ .filter-column { padding: 0; top: 10px; - + background: white; + box-shadow: 0px 6px 12px rgba(129, 128, 128, 0.1); + border-radius: 8px; + padding: 0.7rem; + margin-bottom: 1rem; @media screen and (min-width: $desktop) { height: calc(100vh - #{$header-bar-height} - #{$footer-height}); overflow-y: auto; position: sticky; - top: $header-bar-height; + top: $sticky-distance; + margin-right:1rem; + margin-bottom: 0; } } @@ -79,27 +97,30 @@ // Padding more small for mobile padding: 0.5rem; padding-top: 0; + box-shadow: 0px 6px 12px rgba(129, 128, 128, 0.1); + border-radius: 8px; + box-sizing: border-box; @media screen and (min-width: $tablet) { - padding: 1.5rem; + padding: 2rem; } - .tab-results { + .tab-results { margin-top: 1rem; margin-bottom: 1rem; - border-bottom: 1px solid $grey-super-light-color; + border-bottom: 2px solid $grey-background-color; // Make the border have all the screen margin-left: -0.5rem; margin-right: -0.5rem; - padding-left: 0.5rem; - padding-right: 0.5rem; + padding-left: 1.25rem; + padding-right: 1.25rem; @media screen and (min-width: $tablet) { - margin-left: -1.5rem; - margin-right: -1.5rem; + margin-left: -2rem; + margin-right: -2rem; padding-left: 1.5rem; padding-right: 1.5rem; - margin-top: 2rem; + margin-top: 0; } } @@ -204,7 +225,11 @@ span.item-found { margin-bottom: 0.75rem; margin-top: 0.5rem; } - +hr{ + margin-left:-2rem; + margin-right:-2rem; + background:$grey-background-color; +} .pagination-bottom { display: flex; justify-content: center; diff --git a/src/app/shared/components/basic-tabs/basic-tabs.component.scss b/src/app/shared/components/basic-tabs/basic-tabs.component.scss index 79afc83d..490f11d3 100644 --- a/src/app/shared/components/basic-tabs/basic-tabs.component.scss +++ b/src/app/shared/components/basic-tabs/basic-tabs.component.scss @@ -6,12 +6,13 @@ align-content: stretch; flex-wrap: wrap; border-bottom: 1px solid $grey-super-light-color; + margin-top:1.5rem; li { display: flex; align-items: center; padding-right: 2rem; - padding-bottom: 0.4rem; + padding-bottom: 0.8rem; padding-top: 0.4rem; cursor: pointer; position: relative; diff --git a/src/app/shared/components/page-header/page-header.component.scss b/src/app/shared/components/page-header/page-header.component.scss index bdeb0c5f..4d918102 100644 --- a/src/app/shared/components/page-header/page-header.component.scss +++ b/src/app/shared/components/page-header/page-header.component.scss @@ -4,7 +4,7 @@ .page-header { display: flex; padding-top: 1.875rem; - padding-bottom: 1rem; + padding-bottom: 1.875rem; position: relative; .title-item { diff --git a/src/app/user/components/access-management/access-management.component.html b/src/app/user/components/access-management/access-management.component.html index 36c74da0..d96fa176 100644 --- a/src/app/user/components/access-management/access-management.component.html +++ b/src/app/user/components/access-management/access-management.component.html @@ -1,7 +1,8 @@ -
+
+
- +
\ No newline at end of file diff --git a/src/app/user/components/access-management/access-management.component.scss b/src/app/user/components/access-management/access-management.component.scss index baf7d529..555952d0 100644 --- a/src/app/user/components/access-management/access-management.component.scss +++ b/src/app/user/components/access-management/access-management.component.scss @@ -1,3 +1,13 @@ .tabs { margin-bottom: 1rem; } + +.main-container{ + margin-top:0.5rem; +} + +.header-section{ + background-color: white; + padding:0 2rem; +} + diff --git a/src/app/user/components/access-management/available-data/available-data.component.html b/src/app/user/components/access-management/available-data/available-data.component.html index 504a50e7..ccccf280 100644 --- a/src/app/user/components/access-management/available-data/available-data.component.html +++ b/src/app/user/components/access-management/available-data/available-data.component.html @@ -6,12 +6,12 @@
Service
-
+
-
+
@@ -35,7 +35,7 @@
{{ getResourceServices(resource) }}
-
+
-
@@ -54,7 +54,7 @@ {{ service.name }}
-
+
-
-
-
+
+
-
@@ -82,7 +82,7 @@
-
+
@@ -113,7 +113,7 @@
-
- - -
- - +
-
+
+ + +
+
\ No newline at end of file diff --git a/src/app/user/components/auth/password-forgotten/password-forgotten.component.scss b/src/app/user/components/auth/password-forgotten/password-forgotten.component.scss index ba156316..5b785503 100644 --- a/src/app/user/components/auth/password-forgotten/password-forgotten.component.scss +++ b/src/app/user/components/auth/password-forgotten/password-forgotten.component.scss @@ -5,9 +5,13 @@ .password-forgotten-form-container { margin-top: 1rem; } +label{ + margin-top:1rem; +} .button-container { display: flex; justify-content: flex-end; margin-top: 1.75rem; + margin-right:2rem; } diff --git a/src/app/user/components/auth/password-reset/password-reset.component.html b/src/app/user/components/auth/password-reset/password-reset.component.html index 09b2f82e..d1ede0f1 100644 --- a/src/app/user/components/auth/password-reset/password-reset.component.html +++ b/src/app/user/components/auth/password-reset/password-reset.component.html @@ -1,111 +1,107 @@ -
- - +
+
+ +
-
-
-
-
- -

- - - - - - - -

+ +
+
+
+
+ +

+ + + + + + + +

-
-
- You must enter a password. -
+
+
+ You must enter a password. +
-
- Your password must at least contain {{ passwordMinLength }} characters. -
+
+ Your password must at least contain {{ passwordMinLength }} characters. +
-
- Your password contains some forbidden characters (€, ô, é, è, …). -
+
+ Your password contains some forbidden characters (€, ô, é, è, …). +
-
- Your password must contain at least one special character. -
+
+ Your password must contain at least one special character. +
-
- Your password must contain at least one uppercased character. -
+
+ Your password must contain at least one uppercased character. +
-
- Your password must contain at least one lowercased character. -
+
+ Your password must contain at least one lowercased character. +
-
- Your password must contain at least one number. -
+
+ Your password must contain at least one number. +
-
- Your password must not contain obvious words. +
+ Your password must not contain obvious words. +
-
-
-
-
- -

- - - - - - - -

+
+
+
+ +

+ + + + + + + +

-
-
- You must confirm your password. +
+
+ You must confirm your password. +
-
-
-
- The password confirmation doesn't match with the password. +
+
+ The password confirmation doesn't match with the password. +
-
-
-
-
- -
-
-
+
+
diff --git a/src/app/user/components/auth/password-reset/password-reset.component.scss b/src/app/user/components/auth/password-reset/password-reset.component.scss index 37be82de..2bfcc6ac 100644 --- a/src/app/user/components/auth/password-reset/password-reset.component.scss +++ b/src/app/user/components/auth/password-reset/password-reset.component.scss @@ -3,3 +3,8 @@ .is-warning { color: $warning-color; } + +.button-container { + text-align: right; + margin-right: 2rem; +} \ No newline at end of file diff --git a/src/app/user/components/auth/sign-up/sign-up.component.html b/src/app/user/components/auth/sign-up/sign-up.component.html index 1daa10bc..76fe8627 100644 --- a/src/app/user/components/auth/sign-up/sign-up.component.html +++ b/src/app/user/components/auth/sign-up/sign-up.component.html @@ -1,8 +1,10 @@ -
+
+
- +
\ No newline at end of file diff --git a/src/app/user/components/auth/sign-up/sign-up.component.scss b/src/app/user/components/auth/sign-up/sign-up.component.scss index 023f2ea3..579a4630 100644 --- a/src/app/user/components/auth/sign-up/sign-up.component.scss +++ b/src/app/user/components/auth/sign-up/sign-up.component.scss @@ -46,3 +46,6 @@ h1 { font-weight: 600; } } +.validation{ + padding-right:1rem; +} diff --git a/src/app/user/components/user-profil/user-info/user-info.component.html b/src/app/user/components/user-profil/user-info/user-info.component.html index a30cf4ae..3ad7add9 100644 --- a/src/app/user/components/user-profil/user-info/user-info.component.html +++ b/src/app/user/components/user-profil/user-info/user-info.component.html @@ -1,168 +1,170 @@ -
-
-
-
- -

- - - - - - - -

+ +
+
+
+
+ +

+ + + + + + + +

-
-
- You must enter your first name. -
-
- Special characters are forbidden. +
+
+ You must enter your first name. +
+
+ Special characters are forbidden. +
+
-
-
-
-
- -

- - - - - - - -

+
+
+ +

+ + + + + + + +

-
-
- You must enter your last name. -
-
- Special characters are forbidden. +
+
+ You must enter your last name. +
+
+ Special characters are forbidden. +
+
-
-
-
-
- -

- -

-
-
+
+
+ +

+ +

+
+
-
-
- - -

- Check this box if you agree to receive information emails from Data about the operation of services, model - changes, new formats, maintenance operations. Your data will not be sent to partners. -

-
-
+
+
+ + +

+ Check this box if you agree to receive information emails from Data about the operation of services, model + changes, new formats, maintenance operations. Your data will not be sent to partners. +

+
+
-
-
- -

- -

-
-
+
+
+ +

+ +

+
+
-
+
-
-
- -

- -

-
-
+
+
+ +

+ +

+
+
-
-
- -

- -

-
-
+
+
+ +

+ +

+
+
-
-
- -

- -

-
-
+
+
+ +

+ +

+
+
-
-
- -

- -

-
-
+
+
+ +

+ +

+
+
-
-
- - -
-
- You must accept the processing of the information entered in this form to - respond to your request. +
+
+ + +
+
+ You must accept the processing of the information entered in this form to + respond to your request. +
+
+

+ Fields with an asterisk (*) are mandatory. Information in these fields will be processed to respond to + your request. The data is kept for a period of 12 months. Recipients of this + information are the metropolitan departments in charge of processing your request. In compliance with the + “Digital Technology and Freedom” law dated January 6, 1978, you have the right to access and rectify + information that concerns you. To exercise this right, please contact: Lyon Métropole - Direction des + Affaires Juridiques et de la Commande Publique - 20 Rue du Lac - BP 33569 - 69505 Lyon Cedex 03, by postal + mail. You may also oppose processing of your personal data for a legitimate reason. In this case, we will + not be able to process the request submitted using this form. +

-

- Fields with an asterisk (*) are mandatory. Information in these fields will be processed to respond to - your request. The data is kept for a period of 12 months. Recipients of this - information are the metropolitan departments in charge of processing your request. In compliance with the - “Digital Technology and Freedom” law dated January 6, 1978, you have the right to access and rectify - information that concerns you. To exercise this right, please contact: Lyon Métropole - Direction des - Affaires Juridiques et de la Commande Publique - 20 Rue du Lac - BP 33569 - 69505 Lyon Cedex 03, by postal - mail. You may also oppose processing of your personal data for a legitimate reason. In this case, we will - not be able to process the request submitted using this form. -

- -
- - -
-
+
+ + +
+
diff --git a/src/app/user/components/user-profil/user-info/user-info.component.scss b/src/app/user/components/user-profil/user-info/user-info.component.scss index 8d48f21c..2a79c836 100644 --- a/src/app/user/components/user-profil/user-info/user-info.component.scss +++ b/src/app/user/components/user-profil/user-info/user-info.component.scss @@ -1,8 +1,5 @@ @import '../../../../../../node_modules/bulma/sass/utilities/_all.sass'; - -form { - margin-top: 1rem; -} +@import '../../../../../scss/variables.scss'; .btn-red-text { margin-right: 1.25rem; @@ -38,6 +35,10 @@ form { .action-profile { text-align: center; + padding-right:2rem; + @media screen and(max-width:$tablet){ + padding-right: 0.5rem; + } button:first-of-type { margin-bottom: 0.5rem; diff --git a/src/app/user/components/user-profil/user-password-update/user-password-update.component.html b/src/app/user/components/user-profil/user-password-update/user-password-update.component.html index a1bf0946..122f3cc9 100644 --- a/src/app/user/components/user-profil/user-password-update/user-password-update.component.html +++ b/src/app/user/components/user-profil/user-password-update/user-password-update.component.html @@ -1,4 +1,5 @@ -
+ +
@@ -107,6 +108,8 @@
+
+
@@ -117,5 +120,4 @@
-
\ No newline at end of file diff --git a/src/app/user/components/user-profil/user-password-update/user-password-update.component.scss b/src/app/user/components/user-profil/user-password-update/user-password-update.component.scss index e69de29b..2369b023 100644 --- a/src/app/user/components/user-profil/user-password-update/user-password-update.component.scss +++ b/src/app/user/components/user-profil/user-password-update/user-password-update.component.scss @@ -0,0 +1,7 @@ +@import '../../../../../scss/variables.scss'; +@import '../../../../../../node_modules/bulma/sass/utilities/_all.sass'; + + .button-gl{ + margin-right:1.5rem; + margin-bottom:3rem; + } \ No newline at end of file diff --git a/src/app/user/components/user-profil/user-profil.component.html b/src/app/user/components/user-profil/user-profil.component.html index 36c74da0..f837bb07 100644 --- a/src/app/user/components/user-profil/user-profil.component.html +++ b/src/app/user/components/user-profil/user-profil.component.html @@ -1,7 +1,8 @@ -
- - - +
+
+ + +
\ No newline at end of file diff --git a/src/app/user/components/user-profil/user-profil.component.scss b/src/app/user/components/user-profil/user-profil.component.scss index e69de29b..ab8467a7 100644 --- a/src/app/user/components/user-profil/user-profil.component.scss +++ b/src/app/user/components/user-profil/user-profil.component.scss @@ -0,0 +1,12 @@ +@import '../../../../scss/variables.scss'; + + +.main-container{ + margin-top:0.5rem; +} + +.header-section{ + background-color: white; + padding:0 2rem; +} + diff --git a/src/i18n/traductions.ts b/src/i18n/traductions.ts index 25a288f9..b80ca58b 100644 --- a/src/i18n/traductions.ts +++ b/src/i18n/traductions.ts @@ -260,7 +260,7 @@ export const pageTitles = { changelog: 'Last changes', actors: 'Actors', signup: 'Sign up', - login: 'Login', + login: 'Log in', passwordReset: 'Password reset', passwordForgotten: 'Password forgotten', contact: 'Contact us', diff --git a/src/scss/variables.scss b/src/scss/variables.scss index e3e1ea4d..9f290ac9 100644 --- a/src/scss/variables.scss +++ b/src/scss/variables.scss @@ -13,6 +13,7 @@ $menu-selected-color: #c8c8d0; $link-color: #0057a8; $yellow-dd-color: #ffdc26; $blue-color: #4668ab; +$table-selected-item-color: #f1f3f8; $orange-color: #B9541D; // Colors for the files (in api and downloads) diff --git a/src/styles.scss b/src/styles.scss index 4f70e82c..4371453f 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -319,10 +319,9 @@ span.required-field, border-bottom-color: $link-color; } } - .btn-red-text { - background: transparent; - border-radius: 2px; + background: white; + border-radius: 4px; font-size: 0.875rem; color: $tomato-color; border: 1px solid $grey-super-light-color; @@ -361,7 +360,7 @@ span.required-field, width: 13.75rem; height: 3.14em; background: $tomato-color; - border-radius: 2px; + border-radius: 4px; border-width: 0; font-size: 0.875rem; font-weight: 600; @@ -411,7 +410,26 @@ span.required-field, } } } +.main-container{ + margin-top:0; +} +.header-section{ + background-color: white; + padding:0 2rem; +} +.centered-form{ + padding-bottom: 5rem; + max-width:850px; + margin:auto; + .form-content{ + margin: 2rem; + padding:2rem; + background-color: white; + box-shadow: 0px 6px 12px rgba(129, 128, 128, 0.1); + border-radius: 8px; + } +} .page-container { margin: auto; min-height: calc(100% - 1rem); -- GitLab From d725211008197b38b4e9f615ca06165f8acc152a Mon Sep 17 00:00:00 2001 From: FORESTIER Fabien Date: Mon, 4 May 2020 14:45:22 +0200 Subject: [PATCH 53/78] Fix mobile display of the user button of the header --- src/app/core/components/main/header/header.component.scss | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/app/core/components/main/header/header.component.scss b/src/app/core/components/main/header/header.component.scss index a4174106..d48ea257 100644 --- a/src/app/core/components/main/header/header.component.scss +++ b/src/app/core/components/main/header/header.component.scss @@ -374,8 +374,10 @@ svg.is-connected { left: 1rem; } - .put-menu-to-right { - width: 142px; + @media screen and (max-width: $tablet) { + .put-menu-to-right { + width: 142px; + } } .modal.is-active { -- GitLab From 804d1a8a3ad6cf748b77f70075e1508e8a49ce01 Mon Sep 17 00:00:00 2001 From: CARRON Guilhem Date: Mon, 4 May 2020 15:46:35 +0200 Subject: [PATCH 54/78] new ui contact --- .../components/contact/contact.component.html | 28 +++++++++++-------- .../components/contact/contact.component.scss | 14 ++++++++-- 2 files changed, 29 insertions(+), 13 deletions(-) diff --git a/src/app/core/components/contact/contact.component.html b/src/app/core/components/contact/contact.component.html index 49483505..87ee2ada 100644 --- a/src/app/core/components/contact/contact.component.html +++ b/src/app/core/components/contact/contact.component.html @@ -1,16 +1,17 @@ -
- +
+
- +
-
+ +
Identity
-
+
@@ -26,8 +27,8 @@
- -
+
+

@@ -52,7 +53,7 @@

-
+

@@ -76,8 +77,9 @@

- -
+
+
+

@@ -102,7 +104,7 @@

-
+

@@ -134,9 +136,12 @@

+
+
+
Message @@ -234,6 +239,7 @@
+
diff --git a/src/app/core/components/contact/contact.component.scss b/src/app/core/components/contact/contact.component.scss index 2e50cf9d..18604b14 100644 --- a/src/app/core/components/contact/contact.component.scss +++ b/src/app/core/components/contact/contact.component.scss @@ -32,18 +32,28 @@ cursor: pointer; background-color: lightgrey; } - +.form-content:not(:first-child){ + margin-top:0; +} +.form-content:first-child{ + margin-bottom:1rem; + .column{ + margin-bottom:0; + } +} .button-wrapper { display: flex; justify-content: flex-end; + padding-right:2rem; + @media screen and (max-width: 550px) { flex-direction: column; align-items: center; justify-content: space-between; + padding-right:0; .button { - width: 100%; &:first-of-type { margin-bottom: 0.5rem; -- GitLab From 65d431ffb25d929ab4ab4115c9dbb892b1ecd427 Mon Sep 17 00:00:00 2001 From: "ext.sopra.ncastejon" Date: Mon, 4 May 2020 16:34:36 +0200 Subject: [PATCH 55/78] TRansform the key for an aggregation: remove the special characters --- .../filter-detail.component.html | 6 +- .../filter-detail/filter-detail.component.ts | 2 +- .../components/results/results.component.ts | 33 ++++++-- .../services/dataset-research.service.ts | 45 +++++----- .../datasets/services/research-url.service.ts | 82 +++++++++++++++---- src/app/elasticsearch/models/filter.model.ts | 10 ++- .../services/elasticsearch.service.ts | 12 +-- 7 files changed, 136 insertions(+), 54 deletions(-) diff --git a/src/app/datasets/components/filter-list/filter-detail/filter-detail.component.html b/src/app/datasets/components/filter-list/filter-detail/filter-detail.component.html index aa35e198..36ceecf6 100644 --- a/src/app/datasets/components/filter-list/filter-detail/filter-detail.component.html +++ b/src/app/datasets/components/filter-list/filter-detail/filter-detail.component.html @@ -15,7 +15,7 @@ [ngClass]="{'active': (aggregation.isActive == true) }">
+ *ngIf="aggregation.subAggregations.length < 2 || aggregation.label === 'ATMO Auvergne-Rhône-Alpes'">
@@ -71,7 +71,7 @@ [name]="subAgg.key+subAgg.parentAggregation.key" class="is-checkradio is-small" [id]="subAgg.key+subAgg.parentAggregation.key"> diff --git a/src/app/datasets/components/filter-list/filter-detail/filter-detail.component.ts b/src/app/datasets/components/filter-list/filter-detail/filter-detail.component.ts index 5005ff01..dbadae2b 100644 --- a/src/app/datasets/components/filter-list/filter-detail/filter-detail.component.ts +++ b/src/app/datasets/components/filter-list/filter-detail/filter-detail.component.ts @@ -34,7 +34,7 @@ export class FilterDetailComponent implements OnInit { const parentAggregationKey = (aggregation.parentAggregation) ? aggregation.parentAggregation.key : ''; this._datasetResearchService.updateAggregation( this.filter.field, aggregation.key, - newValueActive, parentAggregationKey); + newValueActive, parentAggregationKey, true); this._datasetResearchService.triggerSearchChange(); } diff --git a/src/app/datasets/components/results/results.component.ts b/src/app/datasets/components/results/results.component.ts index 9c46ad61..4fac28ad 100644 --- a/src/app/datasets/components/results/results.component.ts +++ b/src/app/datasets/components/results/results.component.ts @@ -50,9 +50,19 @@ export class ResultsComponent implements OnInit, OnDestroy { // Set the title and description for the research page this._meta.updateTag({ name: 'description', content: metaDescription.research }); - this._route.queryParams.subscribe((params) => { - this.manageUrlParameters(params); - }); + // If url with parameters too long, we reset it and display a notif + + if (location.href.length > 2000) { + this._researchUrlService.reset(); + this._notificationService.notify(new Notification({ + message: 'The url was too long bro. Have a join to feel better.', + type: 'warning', + })); + } else { + this._route.queryParams.subscribe((params) => { + this.manageUrlParameters(params); + }); + } if (!this.hasParams) { this.search(); @@ -78,6 +88,7 @@ export class ResultsComponent implements OnInit, OnDestroy { // If there are parameters, we extract them to set the ESoptions for a news search. private manageUrlParameters(params) { if (params && Object.keys(params).length > 0) { + this.hasParams = true; // We need to make an initial request to get the aggregations and subaggregations this._datasetResearchService.getResults().subscribe(() => { @@ -88,29 +99,35 @@ export class ResultsComponent implements OnInit, OnDestroy { this._datasetResearchService.shouldAggregateResultCount = true; // Set the aggregations const aggParameters = this._researchUrlService.aggParameters; + Object.keys(aggParameters).forEach((key) => { - let aggField = `metadata-fr.${key}`; + const aggField = `metadata-fr.${key}`; const oneAgg = aggParameters[key]; + oneAgg.forEach((agg: string) => { + let newAggField = aggField; + // Find out if it's an aggregation or subaggregation const filters = this._datasetResearchService.elasticSearchOptions.filters; let parentAgg = ''; filters.forEach((filter) => { + if (filter.subField === aggField) { - // We need to find the parent aggregatin + // We need to find the parent aggregation filter.aggregations.forEach((aggregation) => { if (aggregation.subAggregations.length > 0) { const index = aggregation.subAggregations.findIndex(el => el.key === agg); + const subAggregation = aggregation.subAggregations[index]; if (subAggregation) { parentAgg = subAggregation.parentAggregation.key; - aggField = subAggregation.parentAggregation.field; + newAggField = subAggregation.parentAggregation.field; } } }); } }); - this._datasetResearchService.updateAggregation(aggField, agg, true, parentAgg); + this._datasetResearchService.updateAggregation(newAggField, agg, true, parentAgg, false); }); }); this._datasetResearchService.triggerSearchChange(); @@ -120,6 +137,8 @@ export class ResultsComponent implements OnInit, OnDestroy { ngOnDestroy() { this.searchChangeSub.unsubscribe(); + // Reset the url parameters + this._researchUrlService.reset(); } search() { diff --git a/src/app/datasets/services/dataset-research.service.ts b/src/app/datasets/services/dataset-research.service.ts index f6663254..e4b64514 100644 --- a/src/app/datasets/services/dataset-research.service.ts +++ b/src/app/datasets/services/dataset-research.service.ts @@ -404,30 +404,34 @@ export class DatasetResearchService { * Some logic is necessary depending if it's a 'parent' aggregation or a subaggregation * When the aggregation is updated, the searchChangeSubject is triggered. */ - updateAggregation(filterField: string, aggregationKey: string, isActive: boolean, aggregationParentKey = '') { + updateAggregation( + filterField: string, aggregationKey: string, + isActive: boolean, aggregationParentKey = '', updateUrlParams = true) { const filterToUpdate = this._elasticsearchOptions.filters.find((el => el.field === filterField)); - const aggregation = filterToUpdate.findInAggregationsAndSubAggregations(aggregationKey, aggregationParentKey); - if (aggregation) { - filterToUpdate.setAggregationAndSubaggregation(aggregation, isActive); - if (aggregation.isActive) { - this._researchUrlService.setAggParameter(aggregation.field, aggregationKey); - } else { - this._researchUrlService.setAggParameter(aggregation.field, null); + if (filterToUpdate) { + // If we find the filter to update + const aggregation = filterToUpdate.findInAggregationsAndSubAggregations(aggregationKey, aggregationParentKey); + + if (aggregation) { + filterToUpdate.setAggregationAndSubaggregation(aggregation, isActive); + if (updateUrlParams) { + this._researchUrlService.setAggParameter(aggregation, isActive); + } } - } - // By default, we set the lastclicked filter. - // But if there is no more active aggregation for this filter, we - // want to set it to null to force display new ES aggregations count. - this._lastFilterClicked = filterField; - const aggrActive = filterToUpdate.findActiveAggregations(); - if (!isActive && aggrActive.length === 0) { - this._lastFilterClicked = null; - } + // By default, we set the lastclicked filter. + // But if there is no more active aggregation for this filter, we + // want to set it to null to force display new ES aggregations count. + this._lastFilterClicked = filterField; + const aggrActive = filterToUpdate.findActiveAggregations(); + if (!isActive && aggrActive.length === 0) { + this._lastFilterClicked = null; + } - this._elasticsearchOptions.pageIndex = 0; - this._elasticsearchOptions.shouldAggregateFilters = true; - this._elasticsearchOptions.shouldAggregateResultCount = true; + this._elasticsearchOptions.pageIndex = 0; + this._elasticsearchOptions.shouldAggregateFilters = true; + this._elasticsearchOptions.shouldAggregateResultCount = true; + } } @@ -450,6 +454,7 @@ export class DatasetResearchService { this._lastFilterClicked = null; this._elasticsearchOptions.shouldAggregateFilters = true; this._elasticsearchOptions.shouldAggregateResultCount = true; + this._researchUrlService.reset(); } searchChanged(value: string) { diff --git a/src/app/datasets/services/research-url.service.ts b/src/app/datasets/services/research-url.service.ts index 97a79dad..f6016c88 100644 --- a/src/app/datasets/services/research-url.service.ts +++ b/src/app/datasets/services/research-url.service.ts @@ -1,6 +1,6 @@ import { Location } from '@angular/common'; import { Injectable } from '@angular/core'; -import { IElasticsearchOptions, ISortOption } from '../../elasticsearch/models'; +import { Aggregation, IElasticsearchOptions, ISortOption } from '../../elasticsearch/models'; import { AppRoutes } from '../../routes'; import { scopesResearch } from '../../shared/variables'; @@ -32,6 +32,7 @@ export class ResearchUrlService { } else { // First we check if it's an aggregation (it should but if someone enter a random filter) const aggs = params[key].split(','); + this._aggParameters[key] = []; aggs.forEach((agg: string) => { this._aggParameters[key].push(agg); @@ -81,27 +82,72 @@ export class ResearchUrlService { } // Set an aggregation parameter in the _aggParameters variable, and change the url - setAggParameter(field: string, value: string) { - const fieldKey = field.replace(/metadata-fr./, ''); - - // If value is null, we remove the param. If not, we add it - if (!value) { - delete this._aggParameters[fieldKey]; - } else { - // If new, init the array - if (!this._aggParameters[fieldKey]) { - this._aggParameters[fieldKey] = []; - } - // If value not exists already - if (!this._aggParameters[fieldKey].includes(value)) { - this._aggParameters[fieldKey].push(value); + setAggParameter(aggregation: Aggregation, isActiveAgg: boolean) { + const fieldKey = aggregation.field.replace(/metadata-fr./, ''); + + // If it's a parent, we active or inactive all the chil + if (!aggregation.parentAggregation) { + // If active agg + if (isActiveAgg) { + this.addAggregation(fieldKey, aggregation.key); + } else { + this.removeAggregation(fieldKey, aggregation.key); } + } + // If one subaggregation is updated: + // - parent aggregation becomes active if all the sub aggregations are active + // - parent aggregation becomes inactive if NOT all the sub aggregations are active + // tslint:disable-next-line: brace-style + else { + const parentAggregation = aggregation.parentAggregation; + const parentFieldKey = parentAggregation.field.replace(/metadata-fr./, ''); + + if (parentAggregation.isAllSubAggregationsActive()) { + // Remove the current field for subaggregations + const aggField = aggregation.field.replace(/metadata-fr./, ''); + delete this._aggParameters[aggField]; + this.addAggregation(parentFieldKey, parentAggregation.key); + } else { + // Remove the parentAgg as filter, and add all the subAgg active + this.removeAggregation(parentFieldKey, parentAggregation.key); + aggregation.parentAggregation.subAggregations.forEach((subAgg) => { + const subAggFieldKey = subAgg.field.replace(/metadata-fr./, ''); + if (subAgg.isActive) { + this.addAggregation(subAggFieldKey, subAgg.key); + } else { + this.removeAggregation(subAggFieldKey, subAgg.key); + } + }); + } } + const params = this.generateUrlParams(); this._location.go(AppRoutes.research.uri, params); } + private addAggregation(fieldKey: string, aggregationKey: string) { + // If new, init the array + if (!this._aggParameters[fieldKey]) { + this._aggParameters[fieldKey] = []; + } + // If value not exists already + if (!this._aggParameters[fieldKey].includes(aggregationKey)) { + this._aggParameters[fieldKey].push(aggregationKey); + } + } + + private removeAggregation(fieldKey: string, aggregationKey: string) { + if (this._aggParameters[fieldKey]) { + const index = this._aggParameters[fieldKey].indexOf(aggregationKey); + if (index !== -1) this._aggParameters[fieldKey].splice(index, 1); + // If array is empty, then we remove the parent field. + if (this._aggParameters[fieldKey].length === 0) { + delete this._aggParameters[fieldKey]; + } + } + } + setPaginationParameter(pageIndex: number) { this._parameters['page'] = pageIndex + 1; const params = this.generateUrlParams(); @@ -144,6 +190,12 @@ export class ResearchUrlService { return params; } + reset() { + this._parameters = {}; + this._aggParameters = {}; + this._location.go(AppRoutes.research.uri, ''); + } + get aggParameters() { return this._aggParameters; } diff --git a/src/app/elasticsearch/models/filter.model.ts b/src/app/elasticsearch/models/filter.model.ts index b6d9dc65..4be4482c 100644 --- a/src/app/elasticsearch/models/filter.model.ts +++ b/src/app/elasticsearch/models/filter.model.ts @@ -20,7 +20,7 @@ export class Aggregation { type: string; constructor(aggBucket: IAggregationBucket) { - this.key = aggBucket.key; + this.key = this.removeSpecialCharacters(aggBucket.key); this.doc_count = aggBucket.doc_count; this.count_per_metadata = aggBucket.count_per_metadata; this.isActive = aggBucket.isActive ? this.isActive : false; @@ -34,7 +34,7 @@ export class Aggregation { } else if (geosource.updateFrequencies[this.key]) { this.label = geosource.updateFrequencies[this.key]; } else { - this.label = this.key; + this.label = aggBucket.key; } // The label display needs some treatment if too long or if have special pattern: @@ -69,6 +69,11 @@ export class Aggregation { } + private removeSpecialCharacters(key: string) { + // return (typeof key === 'string') ? key.replace(/[^a-zA-Z ]/g, '') : key; + return (typeof key === 'string') ? key.replace(/[!@,#$%^&*]/g, '') : key; + } + findInSubAggregations(key: string) { const index = this.subAggregations.findIndex(el => el.key === key); return (index) ? this.subAggregations[index] : null; @@ -115,6 +120,7 @@ export class Filter { findInAggregationsAndSubAggregations(key: string, aggregationParentKey = '') { let aggregationFound = null; + this.aggregations.forEach((aggregation) => { if (aggregation.key === key && aggregationParentKey === '') { aggregationFound = aggregation; diff --git a/src/app/elasticsearch/services/elasticsearch.service.ts b/src/app/elasticsearch/services/elasticsearch.service.ts index 444530f7..9531ca6c 100644 --- a/src/app/elasticsearch/services/elasticsearch.service.ts +++ b/src/app/elasticsearch/services/elasticsearch.service.ts @@ -139,7 +139,7 @@ export class ElasticsearchService { body['sort'] = [sort]; } - // Here the default_field is 'data', meaning that the query + // Here the default_field is 'data', meaning that the query if (options.searchString !== '') { const searchString = this.escapeSpecialCharacters(options.searchString, options.fromAutocompletion, 'AND'); body.query.bool['must'] = [ @@ -446,12 +446,12 @@ export class ElasticsearchService { must: [ { match: { - [field]: activeAgg.key, + [field]: activeAgg.label, }, }, { match: { - [fieldParent]: activeAgg.parentAggregation.key, + [fieldParent]: activeAgg.parentAggregation.label, }, }, ], @@ -466,7 +466,7 @@ export class ElasticsearchService { ignore_unmapped: true, query: { term: { - [field]: activeAgg.key, + [field]: activeAgg.label, }, }, }, @@ -476,7 +476,7 @@ export class ElasticsearchService { } else { // Special treatment for the licences if (filter.label === geosource.filterCategories.licences && - !options.knownLicences.includes(activeAgg.key)) { + !options.knownLicences.includes(activeAgg.label)) { options.otherLicenceAggregations.forEach((agg) => { shouldExpression.push({ term: { @@ -487,7 +487,7 @@ export class ElasticsearchService { } else { shouldExpression.push({ term: { - [field]: activeAgg.key, + [field]: activeAgg.label, }, }); } -- GitLab From ff31a7f0ff40aabf97f2f49f09fe93ddca04f4d7 Mon Sep 17 00:00:00 2001 From: CARRON Guilhem Date: Thu, 2 Apr 2020 13:51:48 +0200 Subject: [PATCH 56/78] Integration new cookie banner --- .../cookie-banner.component.html | 71 ++++++- .../cookie-banner.component.scss | 187 +++++++++++++++--- .../cookie-banner/cookie-banner.component.ts | 16 +- 3 files changed, 235 insertions(+), 39 deletions(-) diff --git a/src/app/core/components/cookie-banner/cookie-banner.component.html b/src/app/core/components/cookie-banner/cookie-banner.component.html index 140c8f9e..9b181c97 100644 --- a/src/app/core/components/cookie-banner/cookie-banner.component.html +++ b/src/app/core/components/cookie-banner/cookie-banner.component.html @@ -1,9 +1,68 @@ -
-
-

By continuing to browse this site, you agree to the use of cookies. - Learn more

+
+
+ + + +
-
- +
+ + + + + + + + +
+
+
+
+
Gestionnaire de cookies +
+ + + + +
+ +
+ + +
+
+

Pourquoi ces cookies ?

+

+ + + + Cookies nécessaires

+
+
+
+

Pourquoi ces cookies

+
+

Nous utilisons des cookies pour nous informer lors de votre visite comment vous interagissez avec nous, afin d’enrichir votre expérience utilisateur et pour personnaliser votre relation avec le portail data.

+

Cliquez sur les différents en-têtes de catégories pour en savoir plus. Vous pouvez également modifier vos préférences en matière de cookies.

+

Les cookies ne sont pas utilisés à des fins publicitaires

+
+
+
+

Cookies nécessaires

+
+

Trois cookies sont toujours actifs :

+

- un cookie sauvegardant votre choix de gestion de cookies afin de ne pas vous proposer à chaque visite la personnalisation des cookies

+

- un cookie activé uniquement lors d’une connection afin ne pas vous demander vos identifiants et mot de passe à chaque visite

+

- un cookie permettant la mesure d’audience

+
+
+ +
+
+
+
+ diff --git a/src/app/core/components/cookie-banner/cookie-banner.component.scss b/src/app/core/components/cookie-banner/cookie-banner.component.scss index 1eee2eb6..1b0fa135 100644 --- a/src/app/core/components/cookie-banner/cookie-banner.component.scss +++ b/src/app/core/components/cookie-banner/cookie-banner.component.scss @@ -2,27 +2,48 @@ @import '../../../../../node_modules/bulma/sass/utilities/_all.sass'; .cookie-baner-container { - height: 4.3125rem; - width: 100%; + background: rgba(36, 43, 63, 0.9); position: fixed; - bottom: 0; - display: flex; - justify-content: space-between; - background-color: $brand-color; + border: 1px solid #FFFFFF; + box-sizing: border-box; + border-radius: 4px; z-index: 5; - - p, - a, - span { - color: white; - font-size: 16px; + min-height: 200px; + right: 0; + max-width: 300px; + margin: 1rem; + bottom: 0; + @media screen and(max-width:600px){ + min-height: 215px; + right: 0; + max-width: 700px; + margin: auto; + bottom: 0; + left: 0; + width: 100%; + background: rgba(36, 43, 63, 1); } - - div { - display: flex; - align-items: center; - padding: 0 2.5rem; + .cross{ + float: right; + color:white; + cursor: pointer; + margin: 0.8rem; } + .cookie-icon{ + margin: 1rem 0 0.7rem 2rem; + text-align: center; + + } + .banner-text, .banner-text span{ + color: white; + font-size: 15px; + margin:auto; +} +span{ + display: block; + text-align: center; +} + a { color: $tomato-color; @@ -31,31 +52,135 @@ } button.button { - height: 43px; - width: 85px; + width: 120px; + height: 36px; border: 1px solid white; border-radius: 4px; font-size: 12px; font-weight: bold; background-color: transparent; color: white; - + display: block; + margin:auto; + margin-top:1rem; + padding: 0.5rem 1.5rem; &:hover { border-color: $tomato-color; } } +} + .modal{ + width: 100%; + height: 100vh; + position: fixed; + top:0; + left:0; + background: rgba(36, 43, 63, 0.8); + z-index:10; + display: flex; + align-items: center; + overflow: hidden; - @media screen and (max-width: $tablet) { - height: unset; - display: block; - - div { - padding: 1rem 2.5rem; - - &:last-of-type { - justify-content: center; - padding-top: 0; + .box{ + width: 100%; + max-width: 600px; + min-height: 270px; + background: #FFFFFF; + box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.55); + @media screen and(max-width:650px){ + margin:95%; + } + .title{ + background: #242B3F; + color:white; + text-align: left; + margin-bottom:0; + font-size: 1.2rem; + padding: 1rem; + } + .cross{ + float: right; + color:white; + cursor: pointer; + } + .content{ + display: flex; + @media screen and(max-width:650px){ + flex-direction: column; + } + .tabs{ + width: 35%; + background: #EBEBEB; + color: #242B3F; + @media screen and(max-width:650px){ + width:100%; + } + .tab{ + cursor: pointer; + padding:1rem; + border-bottom: 1px solid #B4B4B4; + position: relative; + + .circle{ + margin-right: 5px; + } + } + .tab-active{ + background: white; + //remove border + &:after{ + content:''; + height: 100%; + width:2px; + position: absolute; + right:-2px; + top:0; + background: white; + } + } + } + .description{ + width:65%; + border-left: 1px solid #B4B4B4; + padding: 1.3rem 1rem; + background-color:#fff; + @media screen and(max-width:650px){ + width:100%; + border:none; + } + .tab-description{ + color: #242B3F; + text-align: left; + .tab-title{ + font-weight: bold; + font-size: 1.2rem; + } + .tab-content{ + margin-top: 1rem; + p{ + margin-bottom:0.7rem; + } + } + } + .hidden{ + display: none; + } + } } } } -} + + // @media screen and (max-width: $tablet) { + // height: unset; + // display: block; + + // div { + // padding: 1rem 2.5rem; + + // &:last-of-type { + // justify-content: center; + // padding-top: 0; + // } + // } + // } + diff --git a/src/app/core/components/cookie-banner/cookie-banner.component.ts b/src/app/core/components/cookie-banner/cookie-banner.component.ts index 2f0d09ca..cf114017 100644 --- a/src/app/core/components/cookie-banner/cookie-banner.component.ts +++ b/src/app/core/components/cookie-banner/cookie-banner.component.ts @@ -8,6 +8,9 @@ import { AppRoutes } from '../../../routes'; styleUrls: ['./cookie-banner.component.scss'], }) export class CookieBannerComponent implements OnInit { + modalOpen: boolean = false; + cookieBannerOpen: boolean = true; + tab: boolean = false; AppRoutes = AppRoutes; private cookiesAccepted: boolean; @@ -34,9 +37,18 @@ export class CookieBannerComponent implements OnInit { hideCookieBanner() { this.cookiesAccepted = true; } - + hideModal() { + this.modalOpen = false; + this.cookiesAccepted = true; + } get displayCookieBanner() { return !this.cookiesAccepted; } - + showMore() { + this.modalOpen = true; + this.cookieBannerOpen = false; + } + toggleTab() { + this.tab = !this.tab; + } } -- GitLab From 2c5fef9e7b48ee91abe4684512bc69295c40c2fb Mon Sep 17 00:00:00 2001 From: CARRON Guilhem Date: Thu, 2 Apr 2020 16:45:50 +0200 Subject: [PATCH 57/78] Added translations --- .../cookie-banner.component.html | 45 ++++++++-------- .../cookie-banner.component.scss | 14 +++-- .../cookie-banner/cookie-banner.component.ts | 1 + src/i18n/messages.en.xlf | 52 +++++++++++++++++- src/i18n/messages.fr.xlf | 54 +++++++++++++++++-- 5 files changed, 135 insertions(+), 31 deletions(-) diff --git a/src/app/core/components/cookie-banner/cookie-banner.component.html b/src/app/core/components/cookie-banner/cookie-banner.component.html index 9b181c97..290e05e8 100644 --- a/src/app/core/components/cookie-banner/cookie-banner.component.html +++ b/src/app/core/components/cookie-banner/cookie-banner.component.html @@ -16,51 +16,50 @@
-
-
Gestionnaire de cookies -
- +
+

Cookies manager

+ -
-
-

Pourquoi ces cookies ?

-

+

+

Why these cookies ?

+
+
- - - Cookies nécessaires

+ + +

Required cookies

+
-

Pourquoi ces cookies

+

Why these cookies ?

-

Nous utilisons des cookies pour nous informer lors de votre visite comment vous interagissez avec nous, afin d’enrichir votre expérience utilisateur et pour personnaliser votre relation avec le portail data.

-

Cliquez sur les différents en-têtes de catégories pour en savoir plus. Vous pouvez également modifier vos préférences en matière de cookies.

-

Les cookies ne sont pas utilisés à des fins publicitaires

+

We use cookies to let you know how you interact with us, in order to improve your user experience and to customize your relation with the data portal.

+

Click on the different category headers to learn more. You can also edit your cookies preferences.

+

These cookies are not used for a commercial purpose.

-

Cookies nécessaires

+

Required cookies

-

Trois cookies sont toujours actifs :

-

- un cookie sauvegardant votre choix de gestion de cookies afin de ne pas vous proposer à chaque visite la personnalisation des cookies

-

- un cookie activé uniquement lors d’une connection afin ne pas vous demander vos identifiants et mot de passe à chaque visite

-

- un cookie permettant la mesure d’audience

+

Three cookies are always active :

+

- one cookie that saves your cookie managment settings so you won't be asked for it each time you visit the website

+

- one cookie actived only when you sign in in order to remember your account details when you come back on the website

+

- one cookie used for trafic analysis

-
diff --git a/src/app/core/components/cookie-banner/cookie-banner.component.scss b/src/app/core/components/cookie-banner/cookie-banner.component.scss index 1b0fa135..843c479c 100644 --- a/src/app/core/components/cookie-banner/cookie-banner.component.scss +++ b/src/app/core/components/cookie-banner/cookie-banner.component.scss @@ -42,6 +42,7 @@ span{ display: block; text-align: center; + padding: 0 1rem; } @@ -87,6 +88,7 @@ span{ min-height: 270px; background: #FFFFFF; box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.55); + position: relative; @media screen and(max-width:650px){ margin:95%; } @@ -99,7 +101,10 @@ span{ padding: 1rem; } .cross{ - float: right; + position: absolute; + top:0; + right:0; + margin: 1.2rem 1rem; color:white; cursor: pointer; } @@ -120,9 +125,12 @@ span{ padding:1rem; border-bottom: 1px solid #B4B4B4; position: relative; - + p{ + display: inline-block; + } .circle{ - margin-right: 5px; + margin-right: 8px; + display: inline-block; } } .tab-active{ diff --git a/src/app/core/components/cookie-banner/cookie-banner.component.ts b/src/app/core/components/cookie-banner/cookie-banner.component.ts index cf114017..5faa1759 100644 --- a/src/app/core/components/cookie-banner/cookie-banner.component.ts +++ b/src/app/core/components/cookie-banner/cookie-banner.component.ts @@ -32,6 +32,7 @@ export class CookieBannerComponent implements OnInit { } ngOnInit() { + this.cookiesAccepted = false; } hideCookieBanner() { diff --git a/src/i18n/messages.en.xlf b/src/i18n/messages.en.xlf index a5ce4a75..5a5ee468 100644 --- a/src/i18n/messages.en.xlf +++ b/src/i18n/messages.en.xlf @@ -1229,13 +1229,61 @@ Here is the list of the last evolutions of the portal. If you wish to contribute Ouch! - By continuing to browse this site, you agree to the use of cookies. - By continuing to browse this site, you agree to the use of cookies. + We care about your personal data and we use cookies in order to improve your experience. + We care about your personal data and we use cookies in order to improve your experience. Learn more Learn more + + Cookies manager + Cookies manager + + + Why these cookies ? + Why these cookies ? + + + Why these cookies ? + Why these cookies ? + + + We use cookies to let you know how you interact with us, in order to improve your user experience and to customize your relation with the data portal. + We use cookies to let you know how you interact with us, in order to improve your user experience and to customize your relation with the data portal. + + + Click on the different category headers to learn more. You can also edit your cookies preferences. + Click on the different category headers to learn more. You can also edit your cookies preferences. + + + These cookies are not used for a commercial purpose. + These cookies are not used for a commercial purpose. + + + Required cookies + Required cookies + + + Required cookies + Required cookies + + + Three cookies are always active : + Three cookies are always active : + + + - one cookie that saves your cookie managment settings so you won't be asked for it each time you visit the website + - one cookie that saves your cookie managment settings so you won't be asked for it each time you visit the website + + + - one cookie actived only when you sign in in order to remember your account details when you come back on the website + - one cookie actived only when you sign in in order to remember your account details when you come back on the website + + + - one cookie used for trafic analysis + - one cookie used for trafic analysis + I accept the I accept the diff --git a/src/i18n/messages.fr.xlf b/src/i18n/messages.fr.xlf index 90876000..7d5f0505 100644 --- a/src/i18n/messages.fr.xlf +++ b/src/i18n/messages.fr.xlf @@ -1234,12 +1234,60 @@ Voici la liste des dernières évolutions du portail. Si vous souhaitez contribu Aïe ! - By continuing to browse this site, you agree to the use of cookies. - En poursuivant votre navigation sur ce site, vous acceptez l’utilisation de cookies. + We care about your personal data and we use cookies in order to improve your experience. + Nous nous soucions de vos données personnelles et utilisons des cookies afin d’améliorer votre expérience. Learn more - En savoir plus + En savoir + + + + Cookies manager + Gestionnaire de cookies + + + Why these cookies ? + Pourquoi ces cookies ? + + + Why these cookies ? + Pourquoi ces cookies ? + + + We use cookies to let you know how you interact with us, in order to improve your user experience and to customize your relation with the data portal. + Nous utilisons des cookies pour nous informer lors de votre visite comment vous interagissez avec nous, afin d’enrichir votre expérience utilisateur et pour personnaliser votre relation avec le portail data. + + + Click on the different category headers to learn more. You can also edit your cookies preferences. + Cliquez sur les différents en-têtes de catégories pour en savoir plus. Vous pouvez également modifier vos préférences en matière de cookies. + + + These cookies are not used for a commercial purpose. + Les cookies ne sont pas utilisés à des fins publicitaires. + + + Required cookies + Cookies nécessaires + + + Required cookies + Cookies nécessaires + + + Three cookies are always active : + Trois cookies sont toujours actifs : + + + - one cookie that saves your cookie managment settings so you won't be asked for it each time you visit the website + - un cookie sauvegardant votre choix de gestion de cookies afin de ne pas vous proposer à chaque visite la personnalisation des cookies + + + - one cookie actived only when you sign in in order to remember your account details when you come back on the website + - un cookie activé uniquement lors d’une connection afin ne pas vous demander vos identifiants et mot de passe à chaque visite + + + - one cookie used for trafic analysis + - un cookie permettant la mesure d’audience I accept the -- GitLab From 234d926cdf66f8601685535dace5005b4e6c7aa4 Mon Sep 17 00:00:00 2001 From: FORESTIER Fabien Date: Mon, 4 May 2020 17:38:04 +0200 Subject: [PATCH 58/78] Update cookie banner text + small css changes + cookies link in footer --- .../cookie-banner.component.html | 128 ++++---- .../cookie-banner.component.scss | 278 ++++++++++-------- .../cookie-banner/cookie-banner.component.ts | 69 +++-- .../main/footer/footer.component.html | 4 + .../main/footer/footer.component.ts | 9 +- src/app/core/services/app-state.service.ts | 21 +- src/i18n/messages.en.xlf | 52 ++-- src/i18n/messages.fr.xlf | 48 +-- 8 files changed, 358 insertions(+), 251 deletions(-) diff --git a/src/app/core/components/cookie-banner/cookie-banner.component.html b/src/app/core/components/cookie-banner/cookie-banner.component.html index 290e05e8..9986bc7d 100644 --- a/src/app/core/components/cookie-banner/cookie-banner.component.html +++ b/src/app/core/components/cookie-banner/cookie-banner.component.html @@ -1,67 +1,83 @@ -
+
- - - - + + + +
- - - - - - - - - + + + + + + + + +
-
+ + +
-
-
-
-

Cookies manager

- - - - +
+
+
+

Cookies manager

+ + + + +
+ + +
+
+
+

Why do we use cookies?

+
+
+ + + +

Necessary cookies

- - -
-
-
-

Why these cookies ?

-
-
- - - -

Required cookies

-
+
+
+
+

Why do we use cookies?

+
+

We use cookies to learn about how you interact with us, improve your + experience on our site and personalize your relationship with the platform data.grandlyon.com.

+

Cookies are not used for commercial purposes.

+

Click on the « Necessary cookies » tab to find out more.

-
-
-

Why these cookies ?

-
-

We use cookies to let you know how you interact with us, in order to improve your user experience and to customize your relation with the data portal.

-

Click on the different category headers to learn more. You can also edit your cookies preferences.

-

These cookies are not used for a commercial purpose.

-
-
-
-

Required cookies

-
-

Three cookies are always active :

-

- one cookie that saves your cookie managment settings so you won't be asked for it each time you visit the website

-

- one cookie actived only when you sign in in order to remember your account details when you come back on the website

-

- one cookie used for trafic analysis

-
-
+
+
+

Necessary cookies

+
+

Active cookies allow to :

+

- save your awareness of how cookies are managed, so that you will not have + to go through it at each visit.

+

- save your awareness and acceptance of the Terms of use, so that we will + not have to ask you to renew this acceptance at each visit.

+

- avoid, during authenticated sessions, to systematically prompt you for + your credentials at each visit or new page

+

- measure the data.grandlyon.com platform's traffic

- +
+
\ No newline at end of file diff --git a/src/app/core/components/cookie-banner/cookie-banner.component.scss b/src/app/core/components/cookie-banner/cookie-banner.component.scss index 843c479c..423dd8c6 100644 --- a/src/app/core/components/cookie-banner/cookie-banner.component.scss +++ b/src/app/core/components/cookie-banner/cookie-banner.component.scss @@ -13,8 +13,8 @@ max-width: 300px; margin: 1rem; bottom: 0; - @media screen and(max-width:600px){ - min-height: 215px; + + @media screen and(max-width: $tablet) { right: 0; max-width: 700px; margin: auto; @@ -23,27 +23,32 @@ width: 100%; background: rgba(36, 43, 63, 1); } - .cross{ + + .cross { float: right; - color:white; + color: white; cursor: pointer; margin: 0.8rem; } - .cookie-icon{ + + .cookie-icon { margin: 1rem 0 0.7rem 2rem; text-align: center; - + } - .banner-text, .banner-text span{ + + .banner-text, + .banner-text span { color: white; font-size: 15px; - margin:auto; -} -span{ - display: block; - text-align: center; - padding: 0 1rem; -} + margin: auto; + } + + span { + display: block; + text-align: center; + padding: 0 1rem; + } a { @@ -52,6 +57,20 @@ span{ display: inline-block; } + .button-wrapper { + display: flex; + justify-content: space-evenly; + + @media screen and (max-width: $tablet) { + justify-content: center; + margin-top: 0.4rem; + + button:first-of-type { + margin-right: 1rem; + } + } + } + button.button { width: 120px; height: 36px; @@ -59,136 +78,147 @@ span{ border-radius: 4px; font-size: 12px; font-weight: bold; - background-color: transparent; + background-color: #242B3F; color: white; display: block; - margin:auto; - margin-top:1rem; + margin-top: 1rem; padding: 0.5rem 1.5rem; + &:hover { border-color: $tomato-color; } } + + button.button.button-white { + background-color: white; + color: #242B3F; + } } - .modal{ + +.modal { + width: 100%; + height: 100vh; + position: fixed; + top: 0; + left: 0; + background: rgba(36, 43, 63, 0.8); + z-index: 10; + display: flex; + align-items: center; + overflow: hidden; + + .box { width: 100%; - height: 100vh; - position: fixed; - top:0; - left:0; - background: rgba(36, 43, 63, 0.8); - z-index:10; - display: flex; - align-items: center; - overflow: hidden; - - .box{ - width: 100%; - max-width: 600px; - min-height: 270px; - background: #FFFFFF; - box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.55); - position: relative; - @media screen and(max-width:650px){ - margin:95%; - } - .title{ - background: #242B3F; - color:white; - text-align: left; - margin-bottom:0; - font-size: 1.2rem; - padding: 1rem; - } - .cross{ - position: absolute; - top:0; - right:0; - margin: 1.2rem 1rem; - color:white; - cursor: pointer; + max-width: 600px; + min-height: 360px; + background: #FFFFFF; + box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.55); + position: relative; + + @media screen and(max-width: $tablet) { + margin: 95%; + } + + .title { + background: #242B3F; + color: white; + text-align: left; + margin-bottom: 0; + font-size: 1.2rem; + padding: 1rem; + } + + .cross { + position: absolute; + top: 0; + right: 0; + margin: 1.2rem 1rem; + color: white; + cursor: pointer; + } + + .content { + display: flex; + height: 100%; + + @media screen and(max-width: $tablet) { + flex-direction: column; } - .content{ - display: flex; - @media screen and(max-width:650px){ - flex-direction: column; + + .tabs { + width: 35%; + background: #EBEBEB; + color: #242B3F; + + @media screen and(max-width: $tablet) { + width: 100%; } - .tabs{ - width: 35%; - background: #EBEBEB; - color: #242B3F; - @media screen and(max-width:650px){ - width:100%; + + .tab { + cursor: pointer; + padding: 1rem; + border-bottom: 1px solid #B4B4B4; + position: relative; + + p { + display: inline-block; } - .tab{ - cursor: pointer; - padding:1rem; - border-bottom: 1px solid #B4B4B4; - position: relative; - p{ - display: inline-block; - } - .circle{ - margin-right: 8px; - display: inline-block; - } + + .circle { + margin-right: 8px; + display: inline-block; } - .tab-active{ + } + + .tab-active { + background: white; + + //remove border + &:after { + content: ''; + height: 100%; + width: 2px; + position: absolute; + right: -2px; + top: 0; background: white; - //remove border - &:after{ - content:''; - height: 100%; - width:2px; - position: absolute; - right:-2px; - top:0; - background: white; - } } } - .description{ - width:65%; - border-left: 1px solid #B4B4B4; - padding: 1.3rem 1rem; - background-color:#fff; - @media screen and(max-width:650px){ - width:100%; - border:none; + } + + .description { + width: 65%; + border-left: 1px solid #B4B4B4; + padding: 1.3rem 1rem; + background-color: #fff; + + @media screen and(max-width: $tablet) { + width: 100%; + border: none; + } + + .tab-description { + color: #242B3F; + text-align: left; + + .tab-title { + font-weight: bold; + font-size: 1.2rem; } - .tab-description{ - color: #242B3F; - text-align: left; - .tab-title{ - font-weight: bold; - font-size: 1.2rem; - } - .tab-content{ - margin-top: 1rem; - p{ - margin-bottom:0.7rem; - } + + .tab-content { + margin-top: 1rem; + + p { + margin-bottom: 0.7rem; } } - .hidden{ - display: none; - } + } + + .hidden { + display: none; } } } } - - // @media screen and (max-width: $tablet) { - // height: unset; - // display: block; - - // div { - // padding: 1rem 2.5rem; - - // &:last-of-type { - // justify-content: center; - // padding-top: 0; - // } - // } - // } - +} diff --git a/src/app/core/components/cookie-banner/cookie-banner.component.ts b/src/app/core/components/cookie-banner/cookie-banner.component.ts index 5faa1759..9afc3586 100644 --- a/src/app/core/components/cookie-banner/cookie-banner.component.ts +++ b/src/app/core/components/cookie-banner/cookie-banner.component.ts @@ -1,55 +1,70 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnDestroy, OnInit } from '@angular/core'; import { CookieService } from 'ngx-cookie-service'; +import { Subscription } from 'rxjs'; import { AppRoutes } from '../../../routes'; +import { AppStateService } from '../../services'; @Component({ selector: 'app-cookie-banner', templateUrl: './cookie-banner.component.html', styleUrls: ['./cookie-banner.component.scss'], }) -export class CookieBannerComponent implements OnInit { - modalOpen: boolean = false; - cookieBannerOpen: boolean = true; - tab: boolean = false; +export class CookieBannerComponent implements OnInit, OnDestroy { + modalOpen: boolean; + tab = 0; AppRoutes = AppRoutes; private cookiesAccepted: boolean; private cookiesAcceptedKey = 'COOKIES_ACCEPTED'; + private sub: Subscription; constructor( private _cookieService: CookieService, - ) { - this.cookiesAccepted = (this._cookieService.get(this.cookiesAcceptedKey) === 'true'); - this._cookieService.set( - this.cookiesAcceptedKey, // Key - 'true', // Value - new Date(new Date().setFullYear(new Date().getFullYear() + 1)), // Expiration date now + 1 year - '/', - document.location.hostname, - false, - 'Strict', - ); - } + private _appStateService: AppStateService, + ) { } ngOnInit() { - this.cookiesAccepted = false; + this.cookiesAccepted = (this._cookieService.get(this.cookiesAcceptedKey) === 'true'); + + this.modalOpen = this._appStateService.cookieModalOpened; + + this.sub = this._appStateService.cookieModalStateChanged$.subscribe((state) => { + this.modalOpen = state; + }); } hideCookieBanner() { - this.cookiesAccepted = true; + if (!this.cookiesAccepted) { + this._cookieService.set( + this.cookiesAcceptedKey, // Key + 'true', // Value + new Date(new Date().setFullYear(new Date().getFullYear() + 1)), // Expiration date now + 1 year + '/', + document.location.hostname, + false, + 'Strict', + ); + this.cookiesAccepted = true; + } } + hideModal() { - this.modalOpen = false; - this.cookiesAccepted = true; + this._appStateService.changeCookieModalState(false); } + + showMore() { + this._appStateService.changeCookieModalState(true); + } + + toggleTab(tabNumber) { + this.tab = tabNumber; + } + get displayCookieBanner() { return !this.cookiesAccepted; } - showMore() { - this.modalOpen = true; - this.cookieBannerOpen = false; - } - toggleTab() { - this.tab = !this.tab; + + ngOnDestroy() { + this.sub.unsubscribe(); } } diff --git a/src/app/core/components/main/footer/footer.component.html b/src/app/core/components/main/footer/footer.component.html index efecf5e5..c12449b9 100644 --- a/src/app/core/components/main/footer/footer.component.html +++ b/src/app/core/components/main/footer/footer.component.html @@ -58,6 +58,10 @@ • Terms of use
+
+ • + Cookies +
diff --git a/src/app/core/components/main/footer/footer.component.ts b/src/app/core/components/main/footer/footer.component.ts index 2d1d5650..968bc6a6 100644 --- a/src/app/core/components/main/footer/footer.component.ts +++ b/src/app/core/components/main/footer/footer.component.ts @@ -1,5 +1,6 @@ import { Component, OnInit } from '@angular/core'; import { AppRoutes } from '../../../../routes'; +import { AppStateService } from '../../../services'; import { APP_CONFIG } from '../../../services/app-config.service'; @Component({ @@ -13,8 +14,14 @@ export class FooterComponent implements OnInit { APP_CONFIG = APP_CONFIG; catalogueUrl = APP_CONFIG.backendUrls.catalogue; - constructor() { } + constructor( + private _appStateService: AppStateService, + ) { } ngOnInit() { } + openCookieModal() { + this._appStateService.changeCookieModalState(true); + } + } diff --git a/src/app/core/services/app-state.service.ts b/src/app/core/services/app-state.service.ts index 8bcea9bb..8857fd2c 100644 --- a/src/app/core/services/app-state.service.ts +++ b/src/app/core/services/app-state.service.ts @@ -8,11 +8,15 @@ export class AppStateService { private _menuStateChanged: Subject; private _feedbackOpened: boolean; private _feedbackStateChanged: Subject; + private _cookieModalOpened: boolean; + private _cookieModalStateChanged: Subject; constructor() { this._menuStateChanged = new Subject(); this._feedbackStateChanged = new Subject(); + this._cookieModalStateChanged = new Subject(); this._feedbackOpened = false; + this._cookieModalOpened = false; } changeMenuState(state: boolean) { @@ -27,6 +31,13 @@ export class AppStateService { } } + changeCookieModalState(state: boolean) { + if (this.cookieModalOpened !== state) { + this._cookieModalOpened = state; + this._cookieModalStateChanged.next(state); + } + } + get menuStateChanged$(): Observable { return this._menuStateChanged.asObservable(); } @@ -35,6 +46,10 @@ export class AppStateService { return this._feedbackStateChanged.asObservable(); } + get cookieModalStateChanged$(): Observable { + return this._cookieModalStateChanged.asObservable(); + } + get menuOpened() { return this._menuOpened; } @@ -42,4 +57,8 @@ export class AppStateService { get feedbackOpened() { return this._feedbackOpened; } -} \ No newline at end of file + + get cookieModalOpened() { + return this._cookieModalOpened; + } +} diff --git a/src/i18n/messages.en.xlf b/src/i18n/messages.en.xlf index 5a5ee468..e0dd121a 100644 --- a/src/i18n/messages.en.xlf +++ b/src/i18n/messages.en.xlf @@ -1236,53 +1236,61 @@ Here is the list of the last evolutions of the portal. If you wish to contribute Learn more Learn more + + Close + Close + Cookies manager Cookies manager - Why these cookies ? - Why these cookies ? + Why do we use cookies? + Why do we use cookies? - Why these cookies ? - Why these cookies ? + Why do we use cookies? + Why do we use cookies? - We use cookies to let you know how you interact with us, in order to improve your user experience and to customize your relation with the data portal. - We use cookies to let you know how you interact with us, in order to improve your user experience and to customize your relation with the data portal. + We use cookies to learn about how you interact with us, improve your experience on our site and personalize your relationship with the platform data.grandlyon.com. + We use cookies to learn about how you interact with us, improve your experience on our site and personalize your relationship with the platform data.grandlyon.com. - Click on the different category headers to learn more. You can also edit your cookies preferences. - Click on the different category headers to learn more. You can also edit your cookies preferences. + Cookies are not used for commercial purposes. + Cookies are not used for commercial purposes. - These cookies are not used for a commercial purpose. - These cookies are not used for a commercial purpose. + Click on the « Necessary cookies » tab to find out more. + Click on the « Necessary cookies » tab to find out more. - Required cookies - Required cookies + Necessary cookies + Necessary cookies - Required cookies - Required cookies + Necessary cookies + Necessary cookies - Three cookies are always active : - Three cookies are always active : + Active cookies allow to : + Active cookies allow to : - - one cookie that saves your cookie managment settings so you won't be asked for it each time you visit the website - - one cookie that saves your cookie managment settings so you won't be asked for it each time you visit the website + - save your awareness of how cookies are managed, so that you will not have to go through it at each visit. + - save your awareness of how cookies are managed, so that you will not have to go through it at each visit. - - one cookie actived only when you sign in in order to remember your account details when you come back on the website - - one cookie actived only when you sign in in order to remember your account details when you come back on the website + - save your awareness and acceptance of the Terms of use, so that we will not have to ask you to renew this acceptance at each visit. + - save your awareness and acceptance of the Terms of use, so that we will not have to ask you to renew this acceptance at each visit. - - one cookie used for trafic analysis - - one cookie used for trafic analysis + - avoid, during authenticated sessions, to systematically prompt you for your credentials at each visit or new page + - avoid, during authenticated sessions, to systematically prompt you for your credentials at each visit or new page + + + - measure the data.grandlyon.com platform's traffic + - measure the data.grandlyon.com platform's traffic I accept the diff --git a/src/i18n/messages.fr.xlf b/src/i18n/messages.fr.xlf index 7d5f0505..59288499 100644 --- a/src/i18n/messages.fr.xlf +++ b/src/i18n/messages.fr.xlf @@ -1241,53 +1241,61 @@ Voici la liste des dernières évolutions du portail. Si vous souhaitez contribu Learn more En savoir + + + Close + Fermer + Cookies manager Gestionnaire de cookies - Why these cookies ? - Pourquoi ces cookies ? + Why do we use cookies? + Pourquoi des cookies ? - Why these cookies ? - Pourquoi ces cookies ? + Why do we use cookies? + Pourquoi des cookies ? - We use cookies to let you know how you interact with us, in order to improve your user experience and to customize your relation with the data portal. - Nous utilisons des cookies pour nous informer lors de votre visite comment vous interagissez avec nous, afin d’enrichir votre expérience utilisateur et pour personnaliser votre relation avec le portail data. + We use cookies to learn about how you interact with us, improve your experience on our site and personalize your relationship with the platform data.grandlyon.com. + Nous utilisons des cookies pour nous informer sur la façon dont vous interagissez avec nous, afin d’enrichir votre expérience utilisateur et pour personnaliser votre relation avec la plateforme data.grandlyon.com. - Click on the different category headers to learn more. You can also edit your cookies preferences. - Cliquez sur les différents en-têtes de catégories pour en savoir plus. Vous pouvez également modifier vos préférences en matière de cookies. + Cookies are not used for commercial purposes. + Les cookies ne sont pas utilisés à des fins commerciales. - These cookies are not used for a commercial purpose. - Les cookies ne sont pas utilisés à des fins publicitaires. + Click on the « Necessary cookies » tab to find out more. + Cliquez sur l’onglet « Cookies nécessaires » pour en savoir plus. - Required cookies + Necessary cookies Cookies nécessaires - Required cookies + Necessary cookies Cookies nécessaires - Three cookies are always active : - Trois cookies sont toujours actifs : + Active cookies allow to : + Les cookies toujours actifs permettent : - - one cookie that saves your cookie managment settings so you won't be asked for it each time you visit the website - - un cookie sauvegardant votre choix de gestion de cookies afin de ne pas vous proposer à chaque visite la personnalisation des cookies + - save your awareness of how cookies are managed, so that you will not have to go through it at each visit. + - de sauvegarder votre prise de connaissance du mode de gestion des cookies, pour ne pas vous le proposer à chaque visite - - one cookie actived only when you sign in in order to remember your account details when you come back on the website - - un cookie activé uniquement lors d’une connection afin ne pas vous demander vos identifiants et mot de passe à chaque visite + - save your awareness and acceptance of the Terms of use, so that we will not have to ask you to renew this acceptance at each visit. + - de sauvegarder votre prise de connaissance et acceptation des Conditions Générales d’Utilisation, afin de ne pas vous demander de renouveler cette acceptation à chaque visite - - one cookie used for trafic analysis - - un cookie permettant la mesure d’audience + - avoid, during authenticated sessions, to systematically prompt you for your credentials at each visit or new page + - d’éviter, lors de votre connexion authentifiée, de vous demander systématiquement à chaque visite ou nouvelle page, vos identifiants et mot de passe + + + - measure the data.grandlyon.com platform's traffic + - de mesurer l’audience de la plateforme data.grandlyon.com I accept the -- GitLab From d63463e664fa8ac1ea340473f7b7f17c7399b14d Mon Sep 17 00:00:00 2001 From: FORESTIER Fabien Date: Mon, 4 May 2020 17:43:05 +0200 Subject: [PATCH 59/78] Fix translation --- src/i18n/messages.en.xlf | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/i18n/messages.en.xlf b/src/i18n/messages.en.xlf index e0dd121a..3ec8f363 100644 --- a/src/i18n/messages.en.xlf +++ b/src/i18n/messages.en.xlf @@ -1236,7 +1236,7 @@ Here is the list of the last evolutions of the portal. If you wish to contribute Learn more Learn more - + Close Close -- GitLab From c893866c1d9471d3b11649ba9d51840bc08cd7d7 Mon Sep 17 00:00:00 2001 From: FORESTIER Fabien Date: Tue, 5 May 2020 10:31:36 +0200 Subject: [PATCH 60/78] Modify some text and translation --- .../components/contact/contact.component.html | 407 +++++++------- .../feedback/feedback.component.html | 14 +- .../cgu-modal/cgu-modal.component.html | 7 +- .../auth/sign-up/sign-up.component.html | 516 +++++++++--------- .../user-info/user-info.component.html | 274 +++++----- src/i18n/messages.en.xlf | 38 +- src/i18n/messages.fr.xlf | 21 +- 7 files changed, 651 insertions(+), 626 deletions(-) diff --git a/src/app/core/components/contact/contact.component.html b/src/app/core/components/contact/contact.component.html index 87ee2ada..64e6355d 100644 --- a/src/app/core/components/contact/contact.component.html +++ b/src/app/core/components/contact/contact.component.html @@ -1,245 +1,250 @@
- +
-
-
- Identity +
+
+ Identity +
-
-
-
-
- - - - - -
-

{{ user.firstName }} {{ user.lastName }}

-

{{ user.email }}

+
+
+
+ + + + + +
+

{{ user.firstName }} {{ user.lastName }}

+

{{ user.email }}

+
-
- -
-
-
- -

- - - - - - - -

+ +
+
+
+ +

+ + + + + + + +

-
-
- You must indicate a lastname. -
-
- Special characters are forbidden. +
+
+ You must indicate a lastname. +
+
+ Special characters are forbidden. +
+
-
-
-
- -

- - - - - - - -

+
+ +

+ + + + + + + +

-
-
- You must indicate a firstname. -
-
- Special characters are forbidden. +
+
+ You must indicate a firstname. +
+
+ Special characters are forbidden. +
+
-
-
-
-
- -

- - - - - - - -

+
+
+ +

+ + + + + + + +

-
-
- You must enter an email address. -
+
+
+ You must enter an email address. +
-
- You must enter a valid email address. +
+ You must enter a valid email address. +
+
-
-
-
- -

- - - - - - - -

+
+ +

+ + + + + + + +

-
-
- You must confirm your email address. -
+
+
+ You must confirm your email address. +
-
- You must enter a valid email address. -
-
-
-
- You must enter the same email address. +
+ You must enter a valid email address. +
+
+
+
+ You must enter the same email address. +
+
-
-
- + +
-
-
-
-
- Message +
+
+
+ Message +
-
-
-
-
- -
-
- -
-