#625 show and hide calendars

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();
 

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);

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);

src/linagora.esn.calendar/app/components/calendars-list/calendars-list.less

@@ -79,7 +79,7 @@
 
           .mdi {
             font-size: 24px;
-            color: @primaryColor;
+            color: grey;
           }
         }
 

src/linagora.esn.calendar/app/components/calendars-list/calendars-list.pug

@@ -2,13 +2,16 @@
   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(
     feature-flag="linagora.esn.calendar.features.isSharingCalendarEnabled",
     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"
   )

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);

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 }}
 

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: '=?'

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()]",

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: '<',

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")    

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);

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);

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 }}
+    | {{ 'Settings' | translate }}

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);

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 }}