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

MOBILE-2317 user: Implement about page

main
Pau Ferrer Ocaña 2018-01-15 13:38:35 +01:00
parent 2b19b5172d
commit 2f2b16f9fa
6 changed files with 218 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/core/user/lang/en.json
View File

@ -1,11 +1,21 @@
{
"address": "Address",
"city": "City/town",
"contact": "Contact",
"country": "Country",
"description": "Description",
"details": "Details",
"detailsnotavailable": "The details of this user are not available to you.",
"editingteacher": "Teacher",
"email": "Email address",
"errorloaduser": "Error loading user.",
"interests": "Interests",
"manager": "Manager",
"newpicture": "New picture",
"phone1": "Phone",
"phone2": "Mobile phone",
"roles": "Roles",
"student": "Student",
"teacher": "Non-editing teacher"
"teacher": "Non-editing teacher",
"webpage": "Web page"
}

71
src/core/user/pages/about/about.html 100644
View File

@ -0,0 +1,71 @@
<ion-header>
<ion-navbar>
<ion-title><core-format-text [text]="title"></core-format-text></ion-title>
</ion-navbar>
</ion-header>
<ion-content>
<ion-refresher [enabled]="userLoaded" (ionRefresh)="refreshUser($event)">
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
</ion-refresher>
<core-loading [hideUntil]="userLoaded" class="core-loading-center">
<div *ngIf="user">
<ion-item-group *ngIf="hasContact">
<ion-item-divider color="light">{{ 'core.user.contact' | translate}}</ion-item-divider>
<ion-item text-wrap *ngIf="user.email">
<h2>{{ 'core.user.email' | translate }}</h2>
<p><a href="mailto:{{user.email}}" core-link auto-login="no">
<core-format-text [text]="user.email"></core-format-text>
</a></p>
</ion-item>
<ion-item text-wrap *ngIf="user.phone1">
<h2>{{ 'core.user.phone1' | translate}}</h2>
<p><a href="tel:{{user.phone1}}" core-link auto-login="no">
<core-format-text [text]="user.phone1"></core-format-text>
</a></p>
</ion-item>
<ion-item text-wrap *ngIf="user.phone2">
<h2>{{ 'core.user.phone2' | translate}}</h2>
<p><a href="tel:{{user.phone2}}" core-link auto-login="no">
<core-format-text [text]="user.phone2"></core-format-text>
</a></p>
</ion-item>
<ion-item text-wrap *ngIf="user.address">
<h2>{{ 'core.user.address' | translate}}</h2>
<p><a *ngIf="isAndroid" href="geo:0,0?q={{user.encodedAddress}}" core-link auto-login="no">
<core-format-text [text]="user.address"></core-format-text>
</a>
<a *ngIf="!isAndroid" href="http://maps.google.com?q={{user.encodedAddress}}" core-link auto-login="no">
<core-format-text [text]="user.address"></core-format-text>
</a></p>
</ion-item>
<ion-item text-wrap *ngIf="user.city && !user.address">
<h2>{{ 'core.user.city' | translate}}</h2>
<p><core-format-text [text]="user.city"></core-format-text></p>
</ion-item>
<ion-item text-wrap *ngIf="user.country && !user.address">
<h2>{{ 'core.user.country' | translate}}</h2>
<p><core-format-text [text]="user.country"></core-format-text></p>
</ion-item>
</ion-item-group>
<ion-item-group *ngIf="hasDetails">
<ion-item-divider color="light">{{ 'core.userdetails' | translate}}</ion-item-divider>
<ion-item text-wrap *ngIf="user.url">
<h2>{{ 'core.user.webpage' | translate}}</h2>
<p><a href="{{user.url}}" core-link>
<core-format-text [text]="user.url"></core-format-text>
</a></p>
</ion-item>
<ion-item text-wrap *ngIf="user.interests">
<h2>{{ 'core.user.interests' | translate}}</h2>
<p><core-format-text [text]="user.interests"></core-format-text></p>
</ion-item>
</ion-item-group>
<ion-item-group *ngIf="user.description">
<ion-item-divider color="light">{{ 'core.user.description' | translate}}</ion-item-divider>
<ion-item text-wrap>
<p><core-format-text [text]="user.description"></core-format-text></p>
</ion-item>
</ion-item-group>
</div>
<core-empty-box *ngIf="!user || (!hasContact && !hasDetails && !user.description)" icon="person" [message]=" 'core.user.detailsnotavailable' | translate"></core-empty-box>
</core-loading>

33
src/core/user/pages/about/about.module.ts 100644
View File

@ -0,0 +1,33 @@
// (C) Copyright 2015 Martin Dougiamas
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { TranslateModule } from '@ngx-translate/core';
import { CoreUserAboutPage } from './about';
import { CoreDirectivesModule } from '../../../../directives/directives.module';
import { CoreComponentsModule } from '../../../../components/components.module';
@NgModule({
declarations: [
CoreUserAboutPage,
],
imports: [
CoreComponentsModule,
CoreDirectivesModule,
IonicPageModule.forChild(CoreUserAboutPage),
TranslateModule.forChild()
],
})
export class CoreUserAboutPageModule {}

2
src/core/user/pages/about/about.scss 100644
View File

@ -0,0 +1,2 @@
page-core-user-about {
}

100
src/core/user/pages/about/about.ts 100644
View File

@ -0,0 +1,100 @@
// (C) Copyright 2015 Martin Dougiamas
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
import { Component } from '@angular/core';
import { IonicPage, NavParams, Platform } from 'ionic-angular';
import { CoreUserProvider } from '../../providers/user';
import { CoreUserHelperProvider } from '../../providers/helper';
import { CoreDomUtilsProvider } from '../../../../providers/utils/dom';
import { CoreCoursesProvider } from '../../../courses/providers/courses';
import { CoreEventsProvider } from '../../../../providers/events';
import { CoreSitesProvider } from '../../../../providers/sites';
/**
* Page that displays an user about page.
*/
@IonicPage({segment: "core-user-about"})
@Component({
selector: 'page-core-user-about',
templateUrl: 'about.html',
})
export class CoreUserAboutPage {
protected courseId: number;
protected userId: number;
protected siteId;
userLoaded: boolean = false;
hasContact: boolean = false;
hasDetails: boolean = false;
isAndroid: boolean = false;
user: any = {};
title: string;
constructor(private navParams: NavParams, private userProvider: CoreUserProvider, private userHelper: CoreUserHelperProvider,
private domUtils: CoreDomUtilsProvider, private eventsProvider: CoreEventsProvider,
private sitesProvider: CoreSitesProvider, private platform: Platform) {
this.userId = navParams.get('userId');
this.courseId = navParams.get('courseId');
this.isAndroid = this.platform.is('android');
this.siteId = this.sitesProvider.getCurrentSite().getId();
}
/**
* View loaded.
*/
ionViewDidLoad() {
this.fetchUser().finally(() => {
this.userLoaded = true;
});
}
/**
* Fetches the user and updates the view.
*/
fetchUser() : Promise<any> {
return this.userProvider.getProfile(this.userId, this.courseId).then((user) => {
if (user.address) {
user.address = this.userHelper.formatAddress(user.address, user.city, user.country);
user.encodedAddress = encodeURIComponent(user.address);
}
this.hasContact = user.email || user.phone1 || user.phone2 || user.city || user.country || user.address;
this.hasDetails = user.url || user.interests || (user.customfields && user.customfields.length > 0);
this.user = user;
this.title = user.fullname;
}).catch((error) => {
this.domUtils.showErrorModalDefault(error, 'core.user.errorloaduser', true);
});
}
/**
* Refresh the user.
*
* @param {any} refresher Refresher.
*/
refreshUser(refresher?: any) {
this.userProvider.invalidateUserCache(this.userId).finally(() => {
this.fetchUser().finally(() => {
this.eventsProvider.trigger(CoreUserProvider.PROFILE_REFRESHED, {courseId: this.courseId, userId: this.userId,
user: this.user}, this.siteId);
refresher && refresher.complete();
});
});
}
}

2
src/core/user/pages/profile/profile.html
View File

@ -23,7 +23,7 @@
</p>
</ion-item>
<a ion-item text-wrap class="core-user-profile-handler" [navPush]="CoreUserAboutPage" [navParams]="{courseId: courseId, userId: userId}" title="{{ 'core.user.details' | translate }}">
<a ion-item text-wrap class="core-user-profile-handler" navPush="CoreUserAboutPage" [navParams]="{courseId: courseId, userId: userId}" title="{{ 'core.user.details' | translate }}">
<ion-icon name="person" item-start></ion-icon>
<h2>{{ 'core.user.details' | translate }}</h2>
</a>