EVOgeek
/
Vmeda.Online
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-3913 timeline: Search activities on timeline block

main
Pau Ferrer Ocaña 2021-11-24 15:40:43 +01:00
parent 127877486b
commit c8f7b753a8
15 changed files with 101 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
scripts/langindex.json
View File

@ -73,6 +73,7 @@
"addon.block_timeline.noevents": "block_timeline",
"addon.block_timeline.overdue": "block_timeline",
"addon.block_timeline.pluginname": "block_timeline",
"addon.block_timeline.searchevents": "block_timeline",
"addon.block_timeline.sortbycourses": "block_timeline",
"addon.block_timeline.sortbydates": "block_timeline",
"addon.blog.blog": "blog",

2
src/addons/block/timeline/components/components.module.ts
View File

@ -18,6 +18,7 @@ import { CoreSharedModule } from '@/core/shared.module';
import { AddonBlockTimelineComponent } from './timeline/timeline';
import { AddonBlockTimelineEventsComponent } from './events/events';
import { CoreSearchComponentsModule } from '@features/search/components/components.module';
@NgModule({
declarations: [
@ -26,6 +27,7 @@ import { AddonBlockTimelineEventsComponent } from './events/events';
],
imports: [
CoreSharedModule,
CoreSearchComponentsModule,
],
exports: [
AddonBlockTimelineComponent,

2
src/addons/block/timeline/components/events/events.ts
View File

@ -52,7 +52,7 @@ export class AddonBlockTimelineEventsComponent implements OnChanges {
this.showCourse = !this.course;
if (changes.events || changes.from || changes.to) {
if (this.events && this.events.length > 0) {
if (this.events) {
const filteredEvents = await this.filterEventsByTime(this.from, this.to);
this.empty = !filteredEvents || filteredEvents.length <= 0;

16
src/addons/block/timeline/components/timeline/addon-block-timeline.html
View File

@ -4,7 +4,7 @@
</ion-label>
</ion-item-divider>
<core-loading [hideUntil]="loaded" [fullscreen]="false">
<ion-row class="ion-no-padding ion-justify-content-between">
<ion-row class="ion-no-padding ion-justify-content-between ion-align-items-center">
<ion-col size="auto" class="ion-no-padding">
<core-combobox [selection]="filter" (onChange)="switchFilter($event)" icon="fas-filter">
<ion-select-option class="ion-text-wrap" value="all">
@ -30,6 +30,12 @@
</ion-select-option>
</core-combobox>
</ion-col>
<ion-col class="ion-no-padding ion-hide-md-down" *ngIf="searchEnabled">
<!-- Filter courses. -->
<core-search-box (onSubmit)="searchTextChanged($event)" (onClear)="searchTextChanged()"
[placeholder]="'addon.block_timeline.searchevents' | translate" autocorrect="off" spellcheck="false" lengthCheck="2"
searchArea="AddonBlockTimeline"></core-search-box>
</ion-col>
<ion-col size="auto" class="ion-no-padding">
<core-combobox [label]="'core.sortby' | translate" [selection]="sort" (onChange)="switchSort($event)"
icon="fas-sort-amount-down-alt">
@ -42,6 +48,14 @@
</core-combobox>
</ion-col>
</ion-row>
<ion-row class="ion-no-padding ion-hide-md-up" *ngIf="searchEnabled">
<ion-col class="ion-no-padding">
<!-- Filter courses. -->
<core-search-box (onSubmit)="searchTextChanged($event)" (onClear)="searchTextChanged()"
[placeholder]="'addon.block_timeline.searchevents' | translate" autocorrect="off" spellcheck="false" lengthCheck="2"
searchArea="AddonBlockTimeline"></core-search-box>
</ion-col>
</ion-row>
<core-loading [hideUntil]="timeline.loaded" [hidden]="sort != 'sortbydates'" [fullscreen]="false">
<addon-block-timeline-events [events]="timeline.events" [canLoadMore]="timeline.canLoadMore" (loadMore)="loadMore()"

23
src/addons/block/timeline/components/timeline/timeline.ts
View File

@ -59,6 +59,9 @@ export class AddonBlockTimelineComponent extends CoreBlockBaseComponent implemen
dataFrom?: number;
dataTo?: number;
searchEnabled = false;
searchText = '';
protected courseIds: number[] = [];
protected fetchContentDefaultError = 'Error getting timeline data.';
@ -85,6 +88,8 @@ export class AddonBlockTimelineComponent extends CoreBlockBaseComponent implemen
this.sort = await this.currentSite.getLocalSiteConfig('AddonBlockTimelineSort', this.sort);
this.searchEnabled = this.currentSite.isVersionGreaterEqualThan('4.0');
super.ngOnInit();
}
@ -135,7 +140,8 @@ export class AddonBlockTimelineComponent extends CoreBlockBaseComponent implemen
async loadMore(course?: AddonBlockTimelineCourse): Promise<void> {
try {
if (course) {
const courseEvents = await AddonBlockTimeline.getActionEventsByCourse(course.id, course.canLoadMore);
const courseEvents =
await AddonBlockTimeline.getActionEventsByCourse(course.id, course.canLoadMore, this.searchText);
course.events = course.events?.concat(courseEvents.events);
course.canLoadMore = courseEvents.canLoadMore;
} else {
@ -153,7 +159,7 @@ export class AddonBlockTimelineComponent extends CoreBlockBaseComponent implemen
* @return Promise resolved when done.
*/
protected async fetchMyOverviewTimeline(afterEventId?: number): Promise<void> {
const events = await AddonBlockTimeline.getActionEventsByTimesort(afterEventId);
const events = await AddonBlockTimeline.getActionEventsByTimesort(afterEventId, this.searchText);
this.timeline.events = events.events;
this.timeline.canLoadMore = events.canLoadMore;
@ -174,7 +180,7 @@ export class AddonBlockTimelineComponent extends CoreBlockBaseComponent implemen
if (this.timelineCourses.courses.length > 0) {
this.courseIds = this.timelineCourses.courses.map((course) => course.id);
const courseEvents = await AddonBlockTimeline.getActionEventsByCourses(this.courseIds);
const courseEvents = await AddonBlockTimeline.getActionEventsByCourses(this.courseIds, this.searchText);
this.timelineCourses.courses = this.timelineCourses.courses.filter((course) => {
if (courseEvents[course.id].events.length == 0) {
@ -243,6 +249,17 @@ export class AddonBlockTimelineComponent extends CoreBlockBaseComponent implemen
}
}
/**
* Search text changed.
*
* @param searchValue Search value
*/
searchTextChanged(searchValue = ''): void {
this.searchText = searchValue || '';
this.fetchContent();
}
}
export type AddonBlockTimelineCourse = CoreEnrolledCourseDataWithOptions & {

3
src/addons/block/timeline/lang.json
View File

@ -8,6 +8,7 @@
"noevents": "No upcoming activities due",
"overdue": "Overdue",
"pluginname": "Timeline",
"searchevents": "Search by activity type or name",
"sortbycourses": "Sort by courses",
"sortbydates": "Sort by dates"
}
}

46
src/addons/block/timeline/services/timeline.ts
View File

@ -26,7 +26,6 @@ import {
import moment from 'moment';
import { makeSingleton } from '@singletons';
import { CoreSiteWSPreSets } from '@classes/site';
import { CoreError } from '@classes/errors/error';
// Cache key was maintained from block myoverview when blocks were splitted.
const ROOT_CACHE_KEY = 'myoverview:';
@ -45,12 +44,14 @@ export class AddonBlockTimelineProvider {
*
* @param courseId Only events in this course.
* @param afterEventId The last seen event id.
* @param searchValue The value a user wishes to search against.
* @param siteId Site ID. If not defined, use current site.
* @return Promise resolved when the info is retrieved.
*/
async getActionEventsByCourse(
courseId: number,
afterEventId?: number,
searchValue = '',
siteId?: string,
): Promise<{ events: AddonCalendarEvent[]; canLoadMore?: number }> {
const site = await CoreSites.getSite(siteId);
@ -70,17 +71,18 @@ export class AddonBlockTimelineProvider {
cacheKey: this.getActionEventsByCourseCacheKey(courseId),
};
if (searchValue != '') {
data.searchvalue = searchValue;
preSets.getFromCache = false;
}
const courseEvents = await site.read<AddonCalendarEvents>(
'core_calendar_get_action_events_by_course',
data,
preSets,
);
if (courseEvents && courseEvents.events) {
return this.treatCourseEvents(courseEvents, time);
}
throw new CoreError('No events returned on core_calendar_get_action_events_by_course.');
return this.treatCourseEvents(courseEvents, time);
}
/**
@ -98,10 +100,12 @@ export class AddonBlockTimelineProvider {
*
* @param courseIds Course IDs.
* @param siteId Site ID. If not defined, use current site.
* @param searchValue The value a user wishes to search against.
* @return Promise resolved when the info is retrieved.
*/
async getActionEventsByCourses(
courseIds: number[],
searchValue = '',
siteId?: string,
): Promise<{[courseId: string]: { events: AddonCalendarEvent[]; canLoadMore?: number } }> {
const site = await CoreSites.getSite(siteId);
@ -117,6 +121,11 @@ export class AddonBlockTimelineProvider {
cacheKey: this.getActionEventsByCoursesCacheKey(),
};
if (searchValue != '') {
data.searchvalue = searchValue;
preSets.getFromCache = false;
}
const events = await site.read<AddonCalendarEventsGroupedByCourse>(
'core_calendar_get_action_events_by_courses',
data,
@ -145,11 +154,13 @@ export class AddonBlockTimelineProvider {
* Get calendar action events based on the timesort value.
*
* @param afterEventId The last seen event id.
* @param searchValue The value a user wishes to search against.
* @param siteId Site ID. If not defined, use current site.
* @return Promise resolved when the info is retrieved.
*/
async getActionEventsByTimesort(
afterEventId?: number,
searchValue = '',
siteId?: string,
): Promise<{ events: AddonCalendarEvent[]; canLoadMore?: number }> {
const site = await CoreSites.getSite(siteId);
@ -171,25 +182,26 @@ export class AddonBlockTimelineProvider {
uniqueCacheKey: true,
};
if (searchValue != '') {
data.searchvalue = searchValue;
preSets.getFromCache = false;
}
const result = await site.read<AddonCalendarEvents>(
'core_calendar_get_action_events_by_timesort',
data,
preSets,
);
if (result && result.events) {
const canLoadMore = result.events.length >= limitnum ? result.lastid : undefined;
const canLoadMore = result.events.length >= limitnum ? result.lastid : undefined;
// Filter events by time in case it uses cache.
const events = result.events.filter((element) => element.timesort >= timesortfrom);
// Filter events by time in case it uses cache.
const events = result.events.filter((element) => element.timesort >= timesortfrom);
return {
events,
canLoadMore,
};
}
throw new CoreError('No events returned on core_calendar_get_action_events_by_timesort.');
return {
events,
canLoadMore,
};
}
/**

3
src/addons/calendar/services/calendar.ts
View File

@ -1785,6 +1785,7 @@ export type AddonCalendarGetActionEventsByCoursesWSParams = {
timesortfrom?: number; // Time sort from.
timesortto?: number; // Time sort to.
limitnum?: number; // Limit number.
searchvalue?: string; // The value a user wishes to search against.
};
/**
@ -1804,6 +1805,7 @@ export type AddonCalendarGetActionEventsByCourseWSParams = {
timesortto?: number; // Time sort to.
aftereventid?: number; // The last seen event id.
limitnum?: number; // Limit number.
searchvalue?: string; // The value a user wishes to search against.
};
/**
@ -1816,6 +1818,7 @@ export type AddonCalendarGetActionEventsByTimesortWSParams = {
limitnum?: number; // Limit number.
limittononsuspendedevents?: boolean; // Limit the events to courses the user is not suspended in.
userid?: number; // The user id.
searchvalue?: string; // The value a user wishes to search against.
};
/**

1
src/core/components/combobox/combobox.scss
View File

@ -2,6 +2,7 @@
:host {
max-width: 100%;
display: block;
@include margin-horizontal(var(--ion-safe-area-left), var(--ion-safe-area-right));
ion-select,

2
src/core/directives/auto-focus.ts
View File

@ -52,7 +52,7 @@ export class CoreAutoFocusDirective implements AfterViewInit {
/**
* Function to focus the element.
*
* @param retries Internal param to stop retrying then 0.
* @param retries Internal param to stop retrying on 0.
*/
protected setFocus(retries = 10): void {
if (retries == 0) {

13
src/core/features/block/components/side-blocks/side-blocks.scss 100644
View File

@ -0,0 +1,13 @@
@import "~theme/globals";
:host ::ng-deep core-block {
@include media-breakpoint-up(md) {
.ion-hide-md-down {
display: none !important;
}
.ion-hide-md-up {
display: block !important;
}
}
}

1
src/core/features/block/components/side-blocks/side-blocks.ts
View File

@ -28,6 +28,7 @@ import { CoreCoursesDashboard } from '@features/courses/services/dashboard';
@Component({
selector: 'core-block-side-blocks',
templateUrl: 'side-blocks.html',
styleUrls: ['side-blocks.scss'],
})
export class CoreBlockSideBlocksComponent implements OnInit {

14
src/core/features/search/components/search-box/search-box.scss
View File

@ -1,5 +1,5 @@
:host {
height: 73px;
min-height: 61px;
display: block;
position: relative;
@ -8,13 +8,12 @@
left: 0;
right: 0;
z-index: 4;
margin-top: 10px;
margin-bottom: 10px;
margin-top: 8px;
margin-bottom: 8px;
}
ion-button.button {
margin-left: 0;
margin-right: 0;
margin: 0;
}
.core-search-history {
@ -37,4 +36,9 @@
padding-left: 0;
padding-right: 0;
}
ion-item {
--min-height: var(--a11y-min-target-size);
}
}

4
src/core/features/search/components/search-box/search-box.ts
View File

@ -41,8 +41,8 @@ export class CoreSearchBoxComponent implements OnInit {
@Input() searchLabel?: string; // Label to be used on action button.
@Input() placeholder?: string; // Placeholder text for search text input.
@Input() autocorrect = 'on'; // Enables/disable Autocorrection on search text input.
@Input() spellcheck?: string | boolean = true; // Enables/disable Spellchecker on search text input.
@Input() autoFocus?: string | boolean; // Enables/disable Autofocus when entering view.
@Input() spellcheck: string | boolean = true; // Enables/disable Spellchecker on search text input.
@Input() autoFocus: string | boolean = false; // Enables/disable Autofocus when entering view.
@Input() lengthCheck = 3; // Check value length before submit. If 0, any string will be submitted.
@Input() showClear = true; // Show/hide clear button.
@Input() disabled = false; // Disables the input text.

1
src/theme/theme.base.scss
View File

@ -172,6 +172,7 @@ ion-app.ios ion-header h2 {
.item.ion-text-wrap ion-label core-format-text .core-format-text-content > *,
.fake-ion-item.ion-text-wrap core-format-text .core-format-text-content > * {
white-space: normal;
overflow: inherit;
}
.item.ion-text-wrap ion-label {