Merge pull request #1475 from crazyserver/MOBILE-2481

Mobile 2481
main
Juan Leyva 2018-08-23 09:10:07 +01:00 committed by GitHub
commit afb22c3339
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 118 additions and 20 deletions

View File

@ -10,7 +10,7 @@
<core-loading [hideUntil]="filesLoaded" *ngIf="showPrivateFiles || showSiteFiles">
<!-- Allow selecting the files to see: private or site. -->
<div no-padding *ngIf="showPrivateFiles && showSiteFiles && !path">
<div padding *ngIf="showPrivateFiles && showSiteFiles && !path">
<ion-select [(ngModel)]="root" (ngModelChange)="rootChanged()" interface="popover">
<ion-option value="my">{{ 'addon.files.privatefiles' | translate }}</ion-option>
<ion-option value="site">{{ 'addon.files.sitefiles' | translate }}</ion-option>

View File

@ -67,7 +67,7 @@
<ion-grid text-wrap *ngIf="questions && questions.length && !quizAborted && !showSummary">
<ion-row>
<ion-col *ngIf="previousPage >= 0" >
<button ion-button block icon-start (click)="changePage(previousPage)">
<button ion-button block icon-start color="light" (click)="changePage(previousPage)">
<ion-icon name="arrow-back" md="ios-arrow-back"></ion-icon>
{{ 'core.previous' | translate }}
</button>

View File

@ -402,7 +402,7 @@ ion-card core-format-text img {
// Ionic fix. Button can occupy all page if not.
ion-select {
position: relative
position: relative;
}
ion-col ion-select {
@ -415,12 +415,54 @@ ion-col ion-select {
}
}
:not(.item) > * > * > ion-select,
.core-button-select {
background-color: white;
color: $core-color;
white-space: normal;
align-self: start;
max-width: none;
&.select-md,
&.button-md {
background: $card-md-background-color;
box-shadow: $card-md-box-shadow;
}
&.select-ios,
&.button-ios {
background: $card-ios-background-color;
box-shadow: $card-ios-box-shadow;
}
&.select-wp,
&.button-wp {
background: $card-wp-background-color;
box-shadow: $card-wp-box-shadow;
}
.select-text {
white-space: normal;
}
.button-inner {
justify-content: start;
}
.select-icon .select-icon-inner {
color: $core-color;
}
ion-icon:last-child {
@include margin(null, null, null, 5px);
text-align: right;
flex-grow: 2;
}
}
// File uploader.
// -------------------------

View File

@ -2,7 +2,7 @@
<div class="core-tabs-bar" #topTabs [hidden]="!tabs || tabs.length < 2">
<ion-row>
<ion-col class="col-with-arrow" (click)="slidePrev()" no-padding col-1>
<ion-icon *ngIf="showPrevButton" name="arrow-back"></ion-icon>
<ion-icon *ngIf="showPrevButton" name="arrow-back" md="ios-arrow-back"></ion-icon>
</ion-col>
<ion-col no-padding col-10>
<ion-slides (ionSlideDidChange)="slideChanged()" [slidesPerView]="slidesShown">
@ -18,7 +18,7 @@
</ion-slides>
</ion-col>
<ion-col class="col-with-arrow" (click)="slideNext()" no-padding col-1>
<ion-icon *ngIf="showNextButton" name="arrow-forward"></ion-icon>
<ion-icon *ngIf="showNextButton" name="arrow-forward" md="ios-arrow-forward"></ion-icon>
</ion-col>
</ion-row>
</div>

View File

@ -13,7 +13,7 @@
<div *ngIf="course.imageThumb" class="core-course-thumb">
<img [src]="course.imageThumb" core-external-content alt=""/>
</div>
<ion-item *ngIf="course.progress != null && course.progress >= 0">
<ion-item *ngIf="course.progress != null && course.progress >= 0" class="core-course-progress">
<core-progress-bar [progress]="course.progress"></core-progress-bar>
</ion-item>
</ion-list>
@ -22,8 +22,9 @@
<core-loading [hideUntil]="loaded">
<!-- Section selector. -->
<core-dynamic-component [component]="sectionSelectorComponent" [data]="data">
<div text-wrap *ngIf="displaySectionSelector && sections && sections.length" no-padding class="clearfix">
<button float-start ion-button (click)="showSectionSelector($event)" clear class="core-button-select button-no-uppercase">
<div text-wrap *ngIf="displaySectionSelector && sections && sections.length" padding class="clearfix" ion-row justify-content-between>
<button float-start ion-button icon-start (click)="showSectionSelector($event)" color="light" class="core-button-select button-no-uppercase" ion-col>
<core-icon name="fa-folder"></core-icon>
{{selectedSection && (selectedSection.formattedName || selectedSection.name) || 'core.course.sections' | translate }}
<ion-icon name="arrow-dropdown" ios="md-arrow-dropdown"></ion-icon>
</button>
@ -49,6 +50,17 @@
</core-dynamic-component>
</div>
</core-loading>
<ion-buttons padding end class="core-course-section-nav-buttons" *ngIf="displaySectionSelector && sections && sections.length">
<button *ngIf="previousSection" ion-button color="light" icon-only (click)="sectionChanged(previousSection)" title="{{ 'core.previous' | translate }}">
<ion-icon name="arrow-back" md="ios-arrow-back"></ion-icon>
<core-format-text class="accesshide" [text]="previousSection.formattedName || previousSection.name"></core-format-text>
</button>
<button *ngIf="nextSection" ion-button icon-only (click)="sectionChanged(nextSection)" title="{{ 'core.next' | translate }}">
<core-format-text class="accesshide" [text]="nextSection.formattedName || nextSection.name"></core-format-text>
<ion-icon name="arrow-forward" md="ios-arrow-forward"></ion-icon>
</button>
</ion-buttons>
</core-dynamic-component>
<!-- Template to render a section. -->

View File

@ -9,6 +9,22 @@ core-course-format {
.core-format-progress-list {
margin-bottom: 0;
.item {
background: transparent;
.label {
margin-top: 0;
margin-bottom: 0;
}
progress {
.progress-bar-fallback,
&[value]::-webkit-progress-bar {
background-color: $white;
}
}
}
}
.core-course-thumb {
@ -39,8 +55,13 @@ core-course-format {
line-height: 44px;
}
}
}
.core-section-select {
width: 100%;
.core-course-section-nav-buttons {
.button-inner core-format-text {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
text-transform: none;
}
}
}

View File

@ -63,6 +63,8 @@ export class CoreCourseFormatComponent implements OnInit, OnChanges, OnDestroy {
displaySectionSelector: boolean;
selectedSection: any;
previousSection: any;
nextSection: any;
allSectionsId: number = CoreCourseProvider.ALL_SECTIONS_ID;
selectOptions: any = {};
loaded: boolean;
@ -248,6 +250,26 @@ export class CoreCourseFormatComponent implements OnInit, OnChanges, OnDestroy {
this.selectedSection = newSection;
this.data.section = this.selectedSection;
// Select next and previous sections to show the arrows.
const i = this.sections.findIndex((value, index) => {
return this.compareSections(value, this.selectedSection);
});
let j;
for (j = i - 1; j >= 1; j--) {
if (!(this.sections[j].visible === 0 || this.sections[j].uservisible === false) && this.sections[j].hasContent) {
break;
}
}
this.previousSection = j >= 1 ? this.sections[j] : null;
for (j = i + 1; j < this.sections.length; j++) {
if (!(this.sections[j].visible === 0 || this.sections[j].uservisible === false) && this.sections[j].hasContent) {
break;
}
}
this.nextSection = j < this.sections.length ? this.sections[j] : null;
if (this.moduleId && typeof previousValue == 'undefined') {
setTimeout(() => {
this.domUtils.scrollToElementBySelector(this.content, '#core-course-module-' + this.moduleId);

View File

@ -57,7 +57,7 @@ core-course-module {
padding-right: $label-md-margin-end;
margin-bottom: $label-md-margin-bottom;
.core-module-description .core-show-more {
.core-show-more {
padding-right: $label-md-margin-end;
}
}
@ -87,7 +87,7 @@ core-course-module {
padding-right: $label-ios-margin-end;
margin-bottom: $label-md-margin-bottom;
.core-module-description .core-show-more {
.core-show-more {
padding-right: $label-ios-margin-end;
}
}
@ -112,7 +112,7 @@ core-course-module {
padding-right: ($item-wp-padding-end / 2);
margin-bottom: $label-md-margin-bottom;
.core-module-description .core-show-more {
.core-show-more {
padding-right: ($item-wp-padding-end / 2);
}
}

View File

@ -11,6 +11,7 @@
<ion-content>
<ng-container *ngFor="let section of sections">
<a ion-item *ngIf="section.hasContent" text-wrap (click)="selectSection(section)" [class.core-primary-item]="selected.id == section.id" [class.item-dimmed]="section.visible === 0 || section.uservisible === false" detail-none>
<core-icon name="fa-folder" item-start></core-icon>
<h2><core-format-text [text]="section.formattedName || section.name"></core-format-text></h2>
<ion-badge color="secondary" *ngIf="section.visible === 0">{{ 'core.course.nocontentavailable' | translate }}</ion-badge>
<ion-badge color="secondary" *ngIf="section.availabilityinfo"><core-format-text [text]=" section.availabilityinfo"></core-format-text></ion-badge>

View File

@ -36,14 +36,14 @@
<core-loading [hideUntil]="courses.loaded" class="core-loading-center">
<!-- "Time" selector. -->
<div no-padding class="clearfix" [hidden]="showFilter">
<ion-select [title]="'core.show' | translate" [(ngModel)]="courses.selected" float-start (ngModelChange)="selectedChanged()" interface="popover">
<div padding class="clearfix" [hidden]="showFilter" ion-row justify-content-between>
<ion-select float-start [title]="'core.show' | translate" [(ngModel)]="courses.selected" ion-col (ngModelChange)="selectedChanged()" interface="popover">
<ion-option value="inprogress">{{ 'core.courses.inprogress' | translate }}</ion-option>
<ion-option value="future">{{ 'core.courses.future' | translate }}</ion-option>
<ion-option value="past">{{ 'core.courses.past' | translate }}</ion-option>
</ion-select>
<!-- Download all courses. -->
<div *ngIf="downloadAllCoursesEnabled && courses[courses.selected] && courses[courses.selected].length > 1" class="core-button-spinner" float-end>
<div *ngIf="downloadAllCoursesEnabled && courses[courses.selected] && courses[courses.selected].length > 1" class="core-button-spinner">
<button *ngIf="prefetchCoursesData[courses.selected].icon && prefetchCoursesData[courses.selected].icon != 'spinner'" ion-button icon-only clear color="dark" (click)="prefetchCourses()">
<core-icon [name]="prefetchCoursesData[courses.selected].icon"></core-icon>
</button>
@ -81,7 +81,7 @@
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
</ion-refresher>
<div no-padding [hidden]="!(timeline.loaded || timelineCourses.loaded)">
<div padding [hidden]="!(timeline.loaded || timelineCourses.loaded)">
<ion-select [(ngModel)]="timeline.sort" (ngModelChange)="switchSort()" interface="popover">
<ion-option value="sortbydates">{{ 'core.courses.sortbydates' | translate }}</ion-option>
<ion-option value="sortbycourses">{{ 'core.courses.sortbycourses' | translate }}</ion-option>

View File

@ -6,7 +6,7 @@
<ion-content class="core-center-view">
<core-loading [hideUntil]="pageLoaded">
<div class="box">
<div text-wrap text-center>
<div text-wrap text-center margin-bottom>
<!-- Show site logo or a default image. -->
<img *ngIf="logoUrl" [src]="logoUrl" role="presentation">
<img *ngIf="!logoUrl" src="assets/img/login_logo.png" class="login-logo" role="presentation">

View File

@ -5,7 +5,7 @@
</ion-header>
<ion-content padding class="core-center-view">
<div class="box">
<div *ngIf="site" text-wrap text-center [ngClass]="{'item-avatar-center': site.avatar}">
<div *ngIf="site" text-wrap text-center margin-bottom [ngClass]="{'item-avatar-center': site.avatar}">
<ion-avatar *ngIf="site.avatar">
<!-- Show user avatar. -->
<img [src]="site.avatar" class="avatar" core-external-content [siteId]="site.id" alt="{{ 'core.pictureof' | translate:{$a: site.fullname} }}" role="presentation" onError="this.src='assets/img/user-avatar.png'">