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

Merge pull request #2048 from albertgasset/MOBILE-3021 

Mobile 3021
main
Juan Leyva 2019-08-07 12:55:46 +02:00 committed by GitHub
parent e0e7a9ba91 6e80f34547
commit e2ed241efb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 65 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/addon/calendar/components/calendar/addon-calendar-calendar.html
View File

@ -1,6 +1,6 @@
<!-- Add buttons to the nav bar. -->
<core-navbar-buttons end>
<core-navbar-buttons end prepend>
<button [hidden]="!canNavigate || isCurrentMonth || !displayNavButtons" ion-button icon-only clear (click)="goToCurrentMonth()">
<core-icon name="fa-calendar-times-o"></core-icon>
</button>
@ -8,8 +8,8 @@
<core-loading [hideUntil]="loaded" class="core-loading-center">
<!-- Period name and arrows to navigate. -->
<ion-grid padding-top>
<ion-row>
<ion-grid no-padding class="addon-calendar-navigation">
<ion-row align-items-center>
<ion-col text-start *ngIf="canNavigate">
<a ion-button icon-only clear (click)="loadPrevious()" [title]="'core.previous' | translate">
<ion-icon name="arrow-back" md="ios-arrow-back"></ion-icon>
@ -31,15 +31,15 @@
<!-- List of days. -->
<ion-row>
<ion-col text-center *ngFor="let day of weekDays" class="addon-calendar-weekday">
<p>{{ day.shortname | translate }}</p>
{{ day.shortname | translate }}
</ion-col>
</ion-row>
<!-- Weeks. -->
<ion-row *ngFor="let week of weeks" class="addon-calendar-week">
<ion-col *ngFor="let value of week.prepadding" class="dayblank addon-calendar-day"></ion-col> <!-- Empty slots (first week). -->
<ion-col text-center *ngFor="let day of week.days" [ngClass]='{"hasevents": day.hasevents, "today": day.istoday, "weekend": day.isweekend, "duration_finish": day.haslastdayofevent}' class="addon-calendar-day">
<p class="addon-calendar-day-number" (click)="dayClicked(day.mday)">{{ day.mday }}</p>
<ion-col text-center *ngFor="let day of week.days" (click)="dayClicked(day.mday)" [ngClass]='{"hasevents": day.hasevents, "today": day.istoday, "weekend": day.isweekend, "duration_finish": day.haslastdayofevent}' class="addon-calendar-day">
<p class="addon-calendar-day-number">{{ day.mday }}</p>
<!-- In phone, display some dots to indicate the type of events. -->
<p class="hidden-tablet addon-calendar-dot-types"><span *ngFor="let type of day.calendareventtypes" class="calendar_event_type calendar_event_{{type}}"></span></p>
@ -47,7 +47,7 @@
<!-- In tablet, display list of events. -->
<div class="hidden-phone addon-calendar-day-events">
<ng-container *ngFor="let event of day.filteredEvents | slice:0:4; let index = index">
<p *ngIf="index < 3 || day.filteredEvents.length == 4" class="addon-calendar-event" (click)="eventClicked(event)">
<p *ngIf="index < 3 || day.filteredEvents.length == 4" class="addon-calendar-event" (click)="eventClicked(event, $event)">
<span class="calendar_event_type calendar_event_{{event.formattedType}}"></span>
<ion-icon *ngIf="event.offline && !event.deleted" name="time"></ion-icon>
<ion-icon *ngIf="event.deleted" name="trash"></ion-icon>
@ -56,7 +56,7 @@
<span class="addon-calendar-event-name">{{event.name}}</span>
</p>
</ng-container>
<p *ngIf="day.filteredEvents.length > 4" class="addon-calendar-day-more" (click)="dayClicked(day.mday)"><b>{{ 'core.nummore' | translate:{$a: day.filteredEvents.length - 3} }}</b></p>
<p *ngIf="day.filteredEvents.length > 4" class="addon-calendar-day-more"><b>{{ 'core.nummore' | translate:{$a: day.filteredEvents.length - 3} }}</b></p>
</div>
</ion-col>
<ion-col *ngFor="let value of week.postpadding" class="dayblank addon-calendar-day"></ion-col> <!-- Empty slots (last week). -->

11
src/addon/calendar/components/calendar/calendar.scss
View File

@ -10,6 +10,10 @@ $calendar-border-color: $gray !default;
ion-app.app-root addon-calendar-calendar {
.addon-calendar-navigation {
@include padding(5px, 10px, null, 10px);
}
.addon-calendar-months {
background-color: white;
padding: 0;
@ -19,7 +23,7 @@ ion-app.app-root addon-calendar-calendar {
border-bottom: 1px solid $calendar-border-color;
@include border-end(1px, solid, $calendar-border-color);
overflow: hidden;
min-height: 70px;
min-height: 60px;
&:first-child {
@include padding(null, null, null, 10px);
@ -64,7 +68,7 @@ ion-app.app-root addon-calendar-calendar {
}
.addon-calendar-dot-types {
@include margin(0.6em, null, 0.6em, null);
margin: 0;
}
}
@ -125,6 +129,7 @@ ion-app.app-root addon-calendar-calendar {
@include margin-horizontal(1px, 1px);
width: 16px;
height: 16px;
display: inline;
display: inline-block;
vertical-align: middle;
}
}

8
src/addon/calendar/components/calendar/calendar.ts
View File

@ -305,10 +305,12 @@ export class AddonCalendarCalendarComponent implements OnInit, OnChanges, OnDest
/**
* An event was clicked.
*
* @param {any} event Event.
* @param {any} calendarEvent Calendar event..
* @param {MouseEvent} event Mouse event.
*/
eventClicked(event: any): void {
this.onEventClicked.emit(event.id);
eventClicked(calendarEvent: any, event: MouseEvent): void {
this.onEventClicked.emit(calendarEvent.id);
event.stopPropagation();
}
/**

68
src/addon/calendar/pages/day/day.html
View File

@ -2,12 +2,12 @@
<ion-navbar core-back-button>
<ion-title>{{ 'addon.calendar.calendarevents' | translate }}</ion-title>
<ion-buttons end>
<button *ngIf="courses && courses.length" ion-button icon-only (click)="openCourseFilter($event)" [attr.aria-label]="'core.courses.filter' | translate">
<ion-icon name="funnel"></ion-icon>
</button>
<button *ngIf="!isCurrentDay" ion-button icon-only clear (click)="goToCurrentDay()">
<core-icon name="fa-calendar-times-o"></core-icon>
</button>
<button *ngIf="courses && courses.length" ion-button icon-only (click)="openCourseFilter($event)" [attr.aria-label]="'core.courses.filter' | translate">
<ion-icon name="funnel"></ion-icon>
</button>
<core-context-menu>
<core-context-menu-item [hidden]="!loaded || !hasOffline || !isOnline" [priority]="400" [content]="'core.settings.synchronizenow' | translate" (action)="doRefresh(null, $event, true)" [iconAction]="syncIcon" [closeOnClick]="false"></core-context-menu-item>
</core-context-menu>
@ -38,37 +38,39 @@
</ion-row>
</ion-grid>
<!-- There is data to be synchronized -->
<ion-card class="core-warning-card" icon-start *ngIf="hasOffline">
<ion-icon name="warning"></ion-icon> {{ 'core.hasdatatosync' | translate:{$a: 'core.day' | translate} }}
</ion-card>
<core-loading [hideUntil]="loaded">
<!-- There is data to be synchronized -->
<ion-card class="core-warning-card" icon-start *ngIf="hasOffline">
<ion-icon name="warning"></ion-icon> {{ 'core.hasdatatosync' | translate:{$a: 'core.day' | translate} }}
</ion-card>
<core-empty-box *ngIf="!filteredEvents || !filteredEvents.length" icon="calendar" [message]="'addon.calendar.noevents' | translate">
</core-empty-box>
<core-empty-box *ngIf="!filteredEvents || !filteredEvents.length" icon="calendar" [message]="'addon.calendar.noevents' | translate">
</core-empty-box>
<ion-list *ngIf="filteredEvents && filteredEvents.length" no-margin>
<ng-container *ngFor="let event of filteredEvents">
<a ion-item text-wrap [title]="event.name" (click)="gotoEvent(event.id)" [class.core-split-item-selected]="event.id == eventId">
<img *ngIf="event.moduleIcon" src="{{event.moduleIcon}}" item-start class="core-module-icon">
<core-icon *ngIf="event.icon && !event.moduleIcon" [name]="event.icon" item-start></core-icon>
<h2><core-format-text [text]="event.name"></core-format-text></h2>
<p><core-format-text [text]="event.formattedtime"></core-format-text></p>
<ion-note *ngIf="event.offline && !event.deleted" item-end>
<ion-icon name="time"></ion-icon>
<span text-wrap>{{ 'core.notsent' | translate }}</span>
</ion-note>
<ion-note *ngIf="event.deleted" item-end>
<ion-icon name="trash"></ion-icon>
<span text-wrap>{{ 'core.deletedoffline' | translate }}</span>
</ion-note>
</a>
</ng-container>
</ion-list>
<ion-list *ngIf="filteredEvents && filteredEvents.length" no-margin>
<ng-container *ngFor="let event of filteredEvents">
<a ion-item text-wrap [title]="event.name" (click)="gotoEvent(event.id)">
<img *ngIf="event.moduleIcon" src="{{event.moduleIcon}}" item-start class="core-module-icon">
<core-icon *ngIf="event.icon && !event.moduleIcon" [name]="event.icon" item-start></core-icon>
<h2><core-format-text [text]="event.name"></core-format-text></h2>
<p><core-format-text [text]="event.formattedtime"></core-format-text></p>
<ion-note *ngIf="event.offline && !event.deleted" item-end>
<ion-icon name="time"></ion-icon>
<span text-wrap>{{ 'core.notsent' | translate }}</span>
</ion-note>
<ion-note *ngIf="event.deleted" item-end>
<ion-icon name="trash"></ion-icon>
<span text-wrap>{{ 'core.deletedoffline' | translate }}</span>
</ion-note>
</a>
</ng-container>
</ion-list>
<!-- Create a calendar event. -->
<ion-fab core-fab bottom end *ngIf="canCreate">
<button ion-fab (click)="openEdit()" [attr.aria-label]="'addon.calendar.newevent' | translate">
<ion-icon name="add"></ion-icon>
</button>
</ion-fab>
<!-- Create a calendar event. -->
<ion-fab core-fab bottom end *ngIf="canCreate">
<button ion-fab (click)="openEdit()" [attr.aria-label]="'addon.calendar.newevent' | translate">
<ion-icon name="add"></ion-icon>
</button>
</ion-fab>
</core-loading>
</ion-content>

2
src/addon/calendar/providers/helper.ts
View File

@ -274,7 +274,7 @@ export class AddonCalendarHelperProvider {
}
// Show the event if it is from site home or if it matches the selected course.
return event.courseid === this.sitesProvider.getSiteHomeId() || event.courseid == courseId;
return event.course && (event.course.id == this.sitesProvider.getCurrentSiteHomeId() || event.course.id == courseId);
}
/**

5
src/components/navbar-buttons/navbar-buttons.ts
View File

@ -25,6 +25,8 @@ import { CoreContextMenuComponent } from '../context-menu/context-menu';
* If this component indicates a position (start/end), the buttons will only be added if the header has some buttons in that
* position. If no start/end is specified, then the buttons will be added to the first <ion-buttons> found in the header.
*
* If this component has a "prepend" attribute, the buttons will be added before other existing buttons in the header.
*
* You can use the [hidden] input to hide all the inner buttons if a certain condition is met.
*
* IMPORTANT: Do not use *ngIf in the buttons inside this component, it can cause problems. Please use [hidden] instead.
@ -92,7 +94,8 @@ export class CoreNavBarButtonsComponent implements OnInit, OnDestroy {
if (buttonsContainer) {
this.mergeContextMenus(buttonsContainer);
this.movedChildren = this.domUtils.moveChildren(this.element, buttonsContainer);
const prepend = this.element.hasAttribute('prepend');
this.movedChildren = this.domUtils.moveChildren(this.element, buttonsContainer, prepend);
this.showHideAllElements();
} else {

6
src/providers/utils/dom.ts
View File

@ -795,16 +795,18 @@ export class CoreDomUtilsProvider {
*
* @param {HTMLElement} oldParent The old parent.
* @param {HTMLElement} newParent The new parent.
* @param {boolean} [prepend] If true, adds the children to the beginning of the new parent.
* @return {Node[]} List of moved children.
*/
moveChildren(oldParent: HTMLElement, newParent: HTMLElement): Node[] {
moveChildren(oldParent: HTMLElement, newParent: HTMLElement, prepend?: boolean): Node[] {
const movedChildren: Node[] = [];
const referenceNode = prepend ? newParent.firstChild : null;
while (oldParent.childNodes.length > 0) {
const child = oldParent.childNodes[0];
movedChildren.push(child);
newParent.appendChild(child);
newParent.insertBefore(child, referenceNode);
}
return movedChildren;