From e4a1060a9ccfbade35168382b6555a30b75a1242 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= Date: Mon, 21 Oct 2019 17:04:36 +0200 Subject: [PATCH] MOBILE-3136 calendar: Add Calendar filter type --- .../calendar/components/calendar/calendar.ts | 4 +-- .../filter/addon-calendar-filter-popover.html | 2 +- .../calendar/components/filter/filter.ts | 17 +++++++++--- .../upcoming-events/upcoming-events.ts | 4 +-- src/addon/calendar/pages/day/day.ts | 13 +++++++-- src/addon/calendar/pages/index/index.ts | 27 ++++++++++++------- src/addon/calendar/pages/list/list.ts | 13 +++++++-- src/addon/calendar/providers/helper.ts | 16 ++++++++++- src/app/app.scss | 2 +- 9 files changed, 74 insertions(+), 24 deletions(-) diff --git a/src/addon/calendar/components/calendar/calendar.ts b/src/addon/calendar/components/calendar/calendar.ts index 55a871937..23ffe640f 100644 --- a/src/addon/calendar/components/calendar/calendar.ts +++ b/src/addon/calendar/components/calendar/calendar.ts @@ -21,7 +21,7 @@ import { CoreDomUtilsProvider } from '@providers/utils/dom'; import { CoreTimeUtilsProvider } from '@providers/utils/time'; import { CoreUtilsProvider } from '@providers/utils/utils'; import { AddonCalendarProvider, AddonCalendarWeek } from '../../providers/calendar'; -import { AddonCalendarHelperProvider } from '../../providers/helper'; +import { AddonCalendarHelperProvider, AddonCalendarFilter } from '../../providers/helper'; import { AddonCalendarOfflineProvider } from '../../providers/calendar-offline'; import { CoreCoursesProvider } from '@core/courses/providers/courses'; import { CoreAppProvider } from '@providers/app'; @@ -36,7 +36,7 @@ import { CoreAppProvider } from '@providers/app'; export class AddonCalendarCalendarComponent implements OnInit, OnChanges, DoCheck, OnDestroy { @Input() initialYear: number | string; // Initial year to load. @Input() initialMonth: number | string; // Initial month to load. - @Input() filter: any; // Filter to apply. + @Input() filter: AddonCalendarFilter; // Filter to apply. @Input() canNavigate?: string | boolean; // Whether to include arrows to change the month. Defaults to true. @Input() displayNavButtons?: string | boolean; // Whether to display nav buttons created by this component. Defaults to true. @Output() onEventClicked = new EventEmitter(); diff --git a/src/addon/calendar/components/filter/addon-calendar-filter-popover.html b/src/addon/calendar/components/filter/addon-calendar-filter-popover.html index 8de25e0db..50ad865e1 100644 --- a/src/addon/calendar/components/filter/addon-calendar-filter-popover.html +++ b/src/addon/calendar/components/filter/addon-calendar-filter-popover.html @@ -4,7 +4,7 @@ {{ 'addon.calendar.' + type + 'events' | translate}} - + diff --git a/src/addon/calendar/components/filter/filter.ts b/src/addon/calendar/components/filter/filter.ts index a2f057404..8d0d5ee0e 100644 --- a/src/addon/calendar/components/filter/filter.ts +++ b/src/addon/calendar/components/filter/filter.ts @@ -1,4 +1,4 @@ -// (C) Copyright 2015 Martin Dougiamas +// (C) Copyright 2015 Moodle Pty Ltd. // // Licensed under the Apache License, Version 2.0 (the "License"); // you may not use this file except in compliance with the License. @@ -16,10 +16,10 @@ import { Component } from '@angular/core'; import { NavParams } from 'ionic-angular'; import { CoreEventsProvider } from '@providers/events'; import { AddonCalendarProvider } from '../../providers/calendar'; -import { AddonCalendarHelperProvider } from '../../providers/helper'; +import { AddonCalendarHelperProvider, AddonCalendarFilter } from '../../providers/helper'; /** - * Component to display a list of courses. + * Component to display the events filter that includes events types and a list of courses. */ @Component({ selector: 'addon-calendar-filter-popover', @@ -35,7 +35,16 @@ export class AddonCalendarFilterPopoverComponent { constructor(navParams: NavParams, protected eventsProvider: CoreEventsProvider) { this.courses = navParams.get('courses') || []; - const filter = navParams.get('filter') || {}; + const filter: AddonCalendarFilter = navParams.get('filter') || { + filtered: false, + courseId: null, + categoryId: null, + course: true, + group: true, + site: true, + user: true, + category: true + }; this.courseId = filter.courseId || -1; this.typeKeys = AddonCalendarProvider.ALL_TYPES.map((name) => { diff --git a/src/addon/calendar/components/upcoming-events/upcoming-events.ts b/src/addon/calendar/components/upcoming-events/upcoming-events.ts index d96c0cf25..cf0b64527 100644 --- a/src/addon/calendar/components/upcoming-events/upcoming-events.ts +++ b/src/addon/calendar/components/upcoming-events/upcoming-events.ts @@ -18,7 +18,7 @@ import { CoreLocalNotificationsProvider } from '@providers/local-notifications'; import { CoreSitesProvider } from '@providers/sites'; import { CoreDomUtilsProvider } from '@providers/utils/dom'; import { AddonCalendarProvider, AddonCalendarCalendarEvent } from '../../providers/calendar'; -import { AddonCalendarHelperProvider } from '../../providers/helper'; +import { AddonCalendarHelperProvider, AddonCalendarFilter } from '../../providers/helper'; import { AddonCalendarOfflineProvider } from '../../providers/calendar-offline'; import { CoreCoursesProvider } from '@core/courses/providers/courses'; import { CoreConstants } from '@core/constants'; @@ -31,7 +31,7 @@ import { CoreConstants } from '@core/constants'; templateUrl: 'addon-calendar-upcoming-events.html', }) export class AddonCalendarUpcomingEventsComponent implements OnInit, DoCheck, OnDestroy { - @Input() filter: any; // Filter to apply. + @Input() filter: AddonCalendarFilter; // Filter to apply. @Output() onEventClicked = new EventEmitter(); filteredEvents = []; diff --git a/src/addon/calendar/pages/day/day.ts b/src/addon/calendar/pages/day/day.ts index bcf71420f..8b195462c 100644 --- a/src/addon/calendar/pages/day/day.ts +++ b/src/addon/calendar/pages/day/day.ts @@ -22,7 +22,7 @@ import { CoreDomUtilsProvider } from '@providers/utils/dom'; import { CoreTimeUtilsProvider } from '@providers/utils/time'; import { AddonCalendarProvider, AddonCalendarCalendarEvent } from '../../providers/calendar'; import { AddonCalendarOfflineProvider } from '../../providers/calendar-offline'; -import { AddonCalendarHelperProvider } from '../../providers/helper'; +import { AddonCalendarHelperProvider, AddonCalendarFilter } from '../../providers/helper'; import { AddonCalendarSyncProvider } from '../../providers/calendar-sync'; import { CoreCoursesProvider } from '@core/courses/providers/courses'; import { CoreCoursesHelperProvider } from '@core/courses/providers/helper'; @@ -76,7 +76,16 @@ export class AddonCalendarDayPage implements OnInit, OnDestroy { syncIcon: string; isCurrentDay: boolean; isPastDay: boolean; - filter = {}; + filter: AddonCalendarFilter = { + filtered: false, + courseId: null, + categoryId: null, + course: true, + group: true, + site: true, + user: true, + category: true + }; constructor(localNotificationsProvider: CoreLocalNotificationsProvider, navParams: NavParams, diff --git a/src/addon/calendar/pages/index/index.ts b/src/addon/calendar/pages/index/index.ts index 4fad22e36..98fbc5316 100644 --- a/src/addon/calendar/pages/index/index.ts +++ b/src/addon/calendar/pages/index/index.ts @@ -21,7 +21,7 @@ import { CoreSitesProvider } from '@providers/sites'; import { CoreDomUtilsProvider } from '@providers/utils/dom'; import { AddonCalendarProvider } from '../../providers/calendar'; import { AddonCalendarOfflineProvider } from '../../providers/calendar-offline'; -import { AddonCalendarHelperProvider } from '../../providers/helper'; +import { AddonCalendarHelperProvider, AddonCalendarFilter } from '../../providers/helper'; import { AddonCalendarCalendarComponent } from '../../components/calendar/calendar'; import { AddonCalendarUpcomingEventsComponent } from '../../components/upcoming-events/upcoming-events'; import { AddonCalendarFilterPopoverComponent } from '../../components/filter/filter'; @@ -66,7 +66,16 @@ export class AddonCalendarIndexPage implements OnInit, OnDestroy { syncIcon: string; showCalendar = true; loadUpcoming = false; - filter = {}; + filter: AddonCalendarFilter = { + filtered: false, + courseId: null, + categoryId: null, + course: true, + group: true, + site: true, + user: true, + category: true + }; constructor(localNotificationsProvider: CoreLocalNotificationsProvider, navParams: NavParams, @@ -95,7 +104,7 @@ export class AddonCalendarIndexPage implements OnInit, OnDestroy { AddonCalendarProvider.ALL_TYPES.forEach((name) => { this.filter[name] = true; }); - this.filter['courseId'] = navParams.get('courseId'); + this.filter.courseId = navParams.get('courseId'); // Listen for events added. When an event is added, reload the data. this.newEventObserver = eventsProvider.on(AddonCalendarProvider.NEW_EVENT_EVENT, (data) => { @@ -218,12 +227,12 @@ export class AddonCalendarIndexPage implements OnInit, OnDestroy { this.hasOffline = false; // Load courses for the popover. - promises.push(this.coursesHelper.getCoursesForPopover(this.filter['courseId']).then((data) => { + promises.push(this.coursesHelper.getCoursesForPopover(this.filter.courseId).then((data) => { this.courses = data.courses; })); // Check if user can create events. - promises.push(this.calendarHelper.canEditEvents(this.filter['courseId']).then((canEdit) => { + promises.push(this.calendarHelper.canEditEvents(this.filter.courseId).then((canEdit) => { this.canCreate = canEdit; })); @@ -315,8 +324,8 @@ export class AddonCalendarIndexPage implements OnInit, OnDestroy { year: data.year }; - if (this.filter['courseId']) { - params.courseId = this.filter['courseId']; + if (this.filter.courseId) { + params.courseId = this.filter.courseId; } this.navCtrl.push('AddonCalendarDayPage', params); @@ -349,8 +358,8 @@ export class AddonCalendarIndexPage implements OnInit, OnDestroy { if (eventId) { params.eventId = eventId; } - if (this.filter['courseId']) { - params.courseId = this.filter['courseId']; + if (this.filter.courseId) { + params.courseId = this.filter.courseId; } this.navCtrl.push('AddonCalendarEditEventPage', params); diff --git a/src/addon/calendar/pages/list/list.ts b/src/addon/calendar/pages/list/list.ts index 68195ddcf..a9857a2cf 100644 --- a/src/addon/calendar/pages/list/list.ts +++ b/src/addon/calendar/pages/list/list.ts @@ -16,7 +16,7 @@ import { Component, ViewChild, OnDestroy, NgZone } from '@angular/core'; import { IonicPage, Content, NavParams, NavController, PopoverController } from 'ionic-angular'; import { AddonCalendarProvider, AddonCalendarGetEventsEvent } from '../../providers/calendar'; import { AddonCalendarOfflineProvider } from '../../providers/calendar-offline'; -import { AddonCalendarHelperProvider } from '../../providers/helper'; +import { AddonCalendarHelperProvider, AddonCalendarFilter } from '../../providers/helper'; import { AddonCalendarSyncProvider } from '../../providers/calendar-sync'; import { CoreCoursesProvider } from '@core/courses/providers/courses'; import { CoreCoursesHelperProvider } from '@core/courses/providers/helper'; @@ -81,7 +81,16 @@ export class AddonCalendarListPage implements OnDestroy { hasOffline = false; isOnline = false; syncIcon: string; // Sync icon. - filter = {}; + filter: AddonCalendarFilter = { + filtered: false, + courseId: null, + categoryId: null, + course: false, + group: false, + site: false, + user: false, + category: false + }; constructor( navParams: NavParams, diff --git a/src/addon/calendar/providers/helper.ts b/src/addon/calendar/providers/helper.ts index 68aa6abe1..976c21431 100644 --- a/src/addon/calendar/providers/helper.ts +++ b/src/addon/calendar/providers/helper.ts @@ -317,7 +317,7 @@ export class AddonCalendarHelperProvider { * @param categories Categories indexed by ID. * @return Filtered events. */ - getFilteredEvents(events: any[], filter: any, categories: any): any[] { + getFilteredEvents(events: any[], filter: AddonCalendarFilter, categories: any): any[] { // Do not filter. if (!filter.filtered) { return events; @@ -515,3 +515,17 @@ export class AddonCalendarHelperProvider { return this.refreshAfterChangeEvents([{event: event, repeated: repeated}], siteId); } } + +/** + * Calculated data for Calendar filtering. + */ +export type AddonCalendarFilter = { + filtered: boolean; // If filter enabled (some filters applied). + courseId: number; // Course Id to filter. + categoryId: string; // Category Id to filter. + course: boolean, // Filter to show course events. + group: boolean, // Filter to show group events. + site: boolean, // Filter to show show site events. + user: boolean, // Filter to show user events. + category: boolean // Filter to show category events. +}; diff --git a/src/app/app.scss b/src/app/app.scss index 8f49c0974..d1b203b5d 100644 --- a/src/app/app.scss +++ b/src/app/app.scss @@ -293,7 +293,7 @@ ion-app.app-root { @include darkmode { background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) calc(100% - 50px), $core-dark-item-bg-color calc(100% - 15px)); - background: -webkit-gradient(left top, left bottom, color-stop(calc(100% - 50px), rgba(255, 255, 255, 0)), color-stop(calc(100% - 15px), white)); + background: -webkit-gradient(left top, left bottom, color-stop(calc(100% - 50px), rgba(255, 255, 255, 0)), color-stop(calc(100% - 15px), $core-dark-item-bg-color)); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) calc(100% - 50px), $core-dark-item-bg-color calc(100% - 15px)); background: -o-linear-gradient(top, rgba(255, 255, 255, 0) calc(100% - 50px), $core-dark-item-bg-color calc(100% - 15px)); background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) calc(100% - 50px), $core-dark-item-bg-color calc(100% - 15px));