From 67f41d126ca358b8b2ada4c34dae1e925d8c8ff8 Mon Sep 17 00:00:00 2001 From: Asma AYARI Date: Fri, 7 Jan 2022 07:33:56 +0100 Subject: [PATCH] #625 show and hide calendars --- .../services/calendar-visibility-service.js | 34 +++++++++++- .../app/services/calendar-visibility.spec.js | 55 +++++++++++++++++++ .../calendars-list.controller.js | 12 +++- .../calendars-list/calendars-list.less | 2 +- .../calendars-list/calendars-list.pug | 7 ++- .../external-calendars-list.component.js | 3 +- .../external/external-calendars-list.pug | 4 +- .../items/calendars-list-items.component.js | 2 +- .../items/calendars-list-items.pug | 1 + .../item/calendars-list-item.component.js | 1 + .../items/item/calendars-list-item.pug | 2 +- ...ndars-list-item-configuration.component.js | 3 +- ...dars-list-item-configuration.controller.js | 10 +++- .../item/configuration/configuration-list.pug | 6 +- .../user/user-calendars-list.component.js | 4 +- .../user/user-calendars-list.pug | 4 +- 16 files changed, 132 insertions(+), 18 deletions(-) diff --git a/src/esn.calendar.libs/app/services/calendar-visibility-service.js b/src/esn.calendar.libs/app/services/calendar-visibility-service.js index 6fa851c9..35a5f291 100644 --- a/src/esn.calendar.libs/app/services/calendar-visibility-service.js +++ b/src/esn.calendar.libs/app/services/calendar-visibility-service.js @@ -11,8 +11,10 @@ require('../app.constants.js'); return { getHiddenCalendars: getHiddenCalendars, - isHidden: isHidden, - toggle: toggle + isHidden, + toggle, + showOneCalendarAndHideOthers, + showAndHideCalendars }; //////////// @@ -23,6 +25,34 @@ require('../app.constants.js'); }); } + function showOneCalendarAndHideOthers(calendar, status) { + var calId = calendar.getUniqueId(); + + storage.setItem(calId, status).then(function(hidden) { + $rootScope.$broadcast(CAL_EVENTS.CALENDARS.TOGGLE_VIEW, { + calendarUniqueId: calId, + hidden: status + }); + + return hidden; + }); + } + + function showAndHideCalendars(calendar, status) { + var calId = calendar.getUniqueId(); + + storage.getItem(calId).then(function(hiddenBefore) { + return storage.setItem(calId, hiddenBefore); + }).then(function(hidden) { + $rootScope.$broadcast(CAL_EVENTS.CALENDARS.TOGGLE_VIEW, { + calendarUniqueId: calId, + hidden: status ? true : hidden + }); + + return hidden; + }); + } + function toggle(calendar) { var calId = calendar.getUniqueId(); diff --git a/src/esn.calendar.libs/app/services/calendar-visibility.spec.js b/src/esn.calendar.libs/app/services/calendar-visibility.spec.js index 33cbbc61..fafd5ced 100644 --- a/src/esn.calendar.libs/app/services/calendar-visibility.spec.js +++ b/src/esn.calendar.libs/app/services/calendar-visibility.spec.js @@ -116,6 +116,61 @@ describe('The calendarVisibilityService', function() { }); }); + describe.only('the showOneCalendarAndHideOthers function', function() { + it('should broadcast the calendar and it new display status', function() { + var cal = this.getCalendar(42); + const status = false; + + this.$rootScope.$broadcast = sinon.spy(this.$rootScope.$broadcast); + + this.calendarVisibilityService.showOneCalendarAndHideOthers(cal, status); + this.$rootScope.$digest(); + expect(this.$rootScope.$broadcast).to.have.been.calledWith( + this.CAL_EVENTS.CALENDARS.TOGGLE_VIEW, + { calendarUniqueId: cal.uniqueId, hidden: false } + ); + + }); + }); + + describe('the showAndHideCalendars function', function () { + it('should broadcast the calendar and it new display status', function () { + var cal = this.getCalendar(42); + + this.$rootScope.$broadcast = sinon.spy(this.$rootScope.$broadcast); + + this.calendarVisibilityService.toggle(cal); + this.$rootScope.$digest(); + expect(this.$rootScope.$broadcast).to.have.been.calledWith( + this.CAL_EVENTS.CALENDARS.TOGGLE_VIEW, + { calendarUniqueId: cal.uniqueId, hidden: true } + ); + + this.$rootScope.$broadcast.reset(); + + this.calendarVisibilityService.toggle(cal); + this.$rootScope.$digest(); + expect(this.$rootScope.$broadcast).to.have.been.calledWith( + this.CAL_EVENTS.CALENDARS.TOGGLE_VIEW, + { calendarUniqueId: cal.uniqueId, hidden: false } + ); + }); + + it('should correctly record hidden calendar in localforage', function () { + var id1 = '1'; + var id2 = '2'; + var hiddenCalendars = [this.getCalendar(id1), this.getCalendar(id2)]; + var thenSpy = sinon.spy(); + + hiddenCalendars.map(this.calendarVisibilityService.toggle); + this.$rootScope.$digest(); + this.calendarVisibilityService.getHiddenCalendars().then(thenSpy); + this.$rootScope.$digest(); + + expect(thenSpy).to.have.been.calledWith([id1, id2]); + }); + }); + describe('The isHidden function', function() { it('should return true if and only if the calendar is hidden', function() { var cal = this.getCalendar(42); diff --git a/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.controller.js b/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.controller.js index ee921816..858be191 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.controller.js +++ b/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.controller.js @@ -20,7 +20,6 @@ const _ = require('lodash'); self.$onInit = $onInit; self.activate = activate; - //////////// function $onInit() { @@ -29,8 +28,9 @@ const _ = require('lodash'); self.publicCalendars = []; self.sharedCalendars = []; self.hiddenCalendars = {}; + self.calendarsToggled = true; self.toggleCalendar = calendarVisibilityService.toggle; - + self.selectAllCalendars = selectAllCalendars; self.activate(); } @@ -52,6 +52,14 @@ const _ = require('lodash'); }); } + function selectAllCalendars(calendarType, status) { + const calendars = userAndExternalCalendars(self.calendars); + + calendars[calendarType].forEach(function(calendar) { + calendarVisibilityService.showAndHideCalendars(calendar, status); + }); + } + function listCalendars() { return calendarService.listPersonalAndAcceptedDelegationCalendars(session.user._id).then(function(calendars) { self.calendars = _.clone(calendars); diff --git a/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.less b/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.less index be4dd0dd..2ffeef00 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.less +++ b/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.less @@ -79,7 +79,7 @@ .mdi { font-size: 24px; - color: @primaryColor; + color: grey; } } diff --git a/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.pug b/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.pug index fd90f3a0..ea5ce4f9 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.pug +++ b/src/linagora.esn.calendar/app/components/calendars-list/calendars-list.pug @@ -2,7 +2,9 @@ cal-user-calendars-list( user-calendars="$ctrl.userCalendars", toggle-calendar="$ctrl.toggleCalendar", - hidden-calendars="$ctrl.hiddenCalendars" + hidden-calendars="$ctrl.hiddenCalendars", + select-all-calendars="$ctrl.selectAllCalendars" + ) cal-external-calendars-list( @@ -10,5 +12,6 @@ shared-calendars="$ctrl.sharedCalendars", public-calendars="$ctrl.publicCalendars", toggle-calendar="$ctrl.toggleCalendar", - hidden-calendars="$ctrl.hiddenCalendars" + hidden-calendars="$ctrl.hiddenCalendars", + select-all-calendars="$ctrl.selectAllCalendars" ) \ No newline at end of file diff --git a/src/linagora.esn.calendar/app/components/calendars-list/external/external-calendars-list.component.js b/src/linagora.esn.calendar/app/components/calendars-list/external/external-calendars-list.component.js index b455127b..91ed37d5 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/external/external-calendars-list.component.js +++ b/src/linagora.esn.calendar/app/components/calendars-list/external/external-calendars-list.component.js @@ -8,7 +8,8 @@ sharedCalendars: '=', publicCalendars: '=', toggleCalendar: '=', - hiddenCalendars: '=' + hiddenCalendars: '=', + selectAllCalendars: '=' } }); })(angular); diff --git a/src/linagora.esn.calendar/app/components/calendars-list/external/external-calendars-list.pug b/src/linagora.esn.calendar/app/components/calendars-list/external/external-calendars-list.pug index 65aacd74..7b893d96 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/external/external-calendars-list.pug +++ b/src/linagora.esn.calendar/app/components/calendars-list/external/external-calendars-list.pug @@ -2,7 +2,7 @@ .lv-item.calendar-item.calendar-header-title.hidden-md .media .pull-left - i.mdi.mdi-calendar + i.mdi.mdi-checkbox-multiple-blank-circle.all-calendars-selected .media-body .lv-title {{ 'Shared calendars' | translate }} .lv-item.calendar-item.calendar-header-title-desktop.visible-md.clickable.toggle-submenu.waves-classic(esn-toggle) @@ -11,7 +11,7 @@ .caret-submenu i.mdi.mdi-menu-down .calendar-item-left - i.mdi.mdi-calendar + i.mdi(ng-class="!$ctrl.calendarsToggled? 'mdi-checkbox-multiple-blank-circle' : 'mdi-checkbox-multiple-blank-circle-outline'",ng-click="$ctrl.selectAllCalendars('sharedCalendars',$ctrl.calendarsToggled=!$ctrl.calendarsToggled)") .media-body .lv-title {{ 'Shared calendars' | translate }} diff --git a/src/linagora.esn.calendar/app/components/calendars-list/items/calendars-list-items.component.js b/src/linagora.esn.calendar/app/components/calendars-list/items/calendars-list-items.component.js index c44247f1..f6833cc5 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/items/calendars-list-items.component.js +++ b/src/linagora.esn.calendar/app/components/calendars-list/items/calendars-list-items.component.js @@ -6,7 +6,7 @@ template: require('./calendars-list-items.pug'), controller: 'CalendarsListItemsController', bindings: { - calendars: '=?', + calendars: '=', toggleCalendar: '=?', hiddenCalendars: '=?', showDetails: '=?' diff --git a/src/linagora.esn.calendar/app/components/calendars-list/items/calendars-list-items.pug b/src/linagora.esn.calendar/app/components/calendars-list/items/calendars-list-items.pug index 28526057..4499e3c9 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/items/calendars-list-items.pug +++ b/src/linagora.esn.calendar/app/components/calendars-list/items/calendars-list-items.pug @@ -1,5 +1,6 @@ .calendar-list-items(ng-repeat="calendar in $ctrl.calendars track by calendar.uniqueId") cal-calendars-list-item( + calendars="$ctrl.calendars" calendar="calendar", on-show-hide-toggle="$ctrl.toggleCalendar(calendar)", selected="!$ctrl.hiddenCalendars[calendar.getUniqueId()]", diff --git a/src/linagora.esn.calendar/app/components/calendars-list/items/item/calendars-list-item.component.js b/src/linagora.esn.calendar/app/components/calendars-list/items/item/calendars-list-item.component.js index 0c45bc1a..f3872f20 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/items/item/calendars-list-item.component.js +++ b/src/linagora.esn.calendar/app/components/calendars-list/items/item/calendars-list-item.component.js @@ -6,6 +6,7 @@ template: require('./calendars-list-item.pug'), controller: 'CalendarsListItemController', bindings: { + calendars: '=', calendar: '<', onShowHideToggle: '&', selected: '<', diff --git a/src/linagora.esn.calendar/app/components/calendars-list/items/item/calendars-list-item.pug b/src/linagora.esn.calendar/app/components/calendars-list/items/item/calendars-list-item.pug index 8a1c8cb7..7e9c4a1f 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/items/item/calendars-list-item.pug +++ b/src/linagora.esn.calendar/app/components/calendars-list/items/item/calendars-list-item.pug @@ -10,4 +10,4 @@ .details(ng-if="$ctrl.details") span.ellipsis {{ ::$ctrl.details }} settings-overlay.settings(ng-click="$event.stopImmediatePropagation(); hideAside();", ui-sref-active-eq="selected") - cal-calendars-list-item-configuration(calendar-id="$ctrl.calendar.uniqueId") + cal-calendars-list-item-configuration(calendar-id="$ctrl.calendar.uniqueId",calendars="$ctrl.calendars") diff --git a/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/calendars-list-item-configuration.component.js b/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/calendars-list-item-configuration.component.js index 7feea1d5..34f55b02 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/calendars-list-item-configuration.component.js +++ b/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/calendars-list-item-configuration.component.js @@ -6,7 +6,8 @@ template: require('./configuration-list.pug'), controller: 'CalendarsListItemConfigurationController', bindings: { - calendarId: '=' + calendarId: '=', + calendars: '=' } }); })(angular); diff --git a/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/calendars-list-item-configuration.controller.js b/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/calendars-list-item-configuration.controller.js index 14c5b966..11475d35 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/calendars-list-item-configuration.controller.js +++ b/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/calendars-list-item-configuration.controller.js @@ -4,17 +4,25 @@ angular.module('esn.calendar') .controller('CalendarsListItemConfigurationController', CalendarsListItemConfigurationController); - function CalendarsListItemConfigurationController($state) { + function CalendarsListItemConfigurationController( + $state, + calendarVisibilityService + ) { var self = this; self.$onInit = $onInit; function $onInit() { self.onOptionClick = onOptionClick; + self.onlyShowThisCalendar = onlyShowThisCalendar; } function onOptionClick() { $state.go('calendar.main.edit', { calendarUniqueId: self.calendarId }); } + + function onlyShowThisCalendar() { + self.calendars.map(item => (item.uniqueId === self.calendarId ? calendarVisibilityService.showOneCalendarAndHideOthers(item, false) : calendarVisibilityService.showOneCalendarAndHideOthers(item, true))); + } } })(angular); diff --git a/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/configuration-list.pug b/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/configuration-list.pug index 6fe7c154..f078175a 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/configuration-list.pug +++ b/src/linagora.esn.calendar/app/components/calendars-list/items/item/configuration/configuration-list.pug @@ -1,4 +1,8 @@ +md-menu-item + md-button(ng-click="$ctrl.onlyShowThisCalendar()") + md-icon(md-menu-origin, md-svg-icon="eye", aria-label="show calendar Icon") + | {{ 'Show only this calendar' | translate }} md-menu-item md-button(ng-click="$ctrl.onOptionClick()") md-icon(md-menu-origin, md-svg-icon="settings", aria-label="settings open Icon") - | {{ 'Settings' | translate }} \ No newline at end of file + | {{ 'Settings' | translate }} diff --git a/src/linagora.esn.calendar/app/components/calendars-list/user/user-calendars-list.component.js b/src/linagora.esn.calendar/app/components/calendars-list/user/user-calendars-list.component.js index 157bb91f..2b61de37 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/user/user-calendars-list.component.js +++ b/src/linagora.esn.calendar/app/components/calendars-list/user/user-calendars-list.component.js @@ -7,7 +7,9 @@ bindings: { userCalendars: '=', toggleCalendar: '=', - hiddenCalendars: '=' + hiddenCalendars: '=', + selectAllCalendars: '=', + calendarsToggled: '<' } }); })(angular); diff --git a/src/linagora.esn.calendar/app/components/calendars-list/user/user-calendars-list.pug b/src/linagora.esn.calendar/app/components/calendars-list/user/user-calendars-list.pug index caed2db9..4c19c3d7 100644 --- a/src/linagora.esn.calendar/app/components/calendars-list/user/user-calendars-list.pug +++ b/src/linagora.esn.calendar/app/components/calendars-list/user/user-calendars-list.pug @@ -2,7 +2,7 @@ .lv-item.calendar-item.calendar-header-title.hidden-md .media .pull-left - i.mdi.mdi-calendar + i.mdi.mdi-checkbox-multiple-blank-circle.all-calendars-selected .media-body .lv-title {{ 'My calendars' | translate }} .lv-item.calendar-item.calendar-header-title-desktop.visible-md.clickable.toggle-submenu.waves-classic(esn-toggle) @@ -11,7 +11,7 @@ .caret-submenu i.mdi.mdi-menu-down .calendar-item-left - i.mdi.mdi-calendar + i.mdi(ng-class="!$ctrl.calendarsToggled? 'mdi-checkbox-multiple-blank-circle' : 'mdi-checkbox-multiple-blank-circle-outline'",ng-click="$ctrl.selectAllCalendars('userCalendars',$ctrl.calendarsToggled=!$ctrl.calendarsToggled)") .media-body .lv-title {{ 'My calendars' | translate }}