From 10328b7582743ec25c29b764de1bd2ec7ababbc2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= Date: Thu, 29 Aug 2019 17:09:16 +0200 Subject: [PATCH 1/2] MOBILE-3105 wiki: Move Map to a lateral modal --- .../index/addon-mod-wiki-index.html | 75 ++++-------- src/addon/mod/wiki/components/index/index.ts | 112 +++++++----------- src/addon/mod/wiki/pages/map/map.html | 29 +++++ src/addon/mod/wiki/pages/map/map.module.ts | 33 ++++++ src/addon/mod/wiki/pages/map/map.ts | 93 +++++++++++++++ 5 files changed, 220 insertions(+), 122 deletions(-) create mode 100644 src/addon/mod/wiki/pages/map/map.html create mode 100644 src/addon/mod/wiki/pages/map/map.module.ts create mode 100644 src/addon/mod/wiki/pages/map/map.ts diff --git a/src/addon/mod/wiki/components/index/addon-mod-wiki-index.html b/src/addon/mod/wiki/components/index/addon-mod-wiki-index.html index 2ee9b5e8d..749a85458 100644 --- a/src/addon/mod/wiki/components/index/addon-mod-wiki-index.html +++ b/src/addon/mod/wiki/components/index/addon-mod-wiki-index.html @@ -5,9 +5,8 @@ - - @@ -25,58 +24,32 @@ +
+ - - - - -
- + +
+ + {{ 'core.hasdatatosync' | translate:{$a: pageStr} }} + {{ 'core.hasdatatosync' | translate:{$a: moduleName} }} +
- -
- - {{ 'core.hasdatatosync' | translate:{$a: pageStr} }} - {{ 'core.hasdatatosync' | translate:{$a: moduleName} }} -
+ +
+ + {{ pageWarning }} +
- -
- - {{ pageWarning }} -
- -
- - -
- -
- {{ 'core.tag.tags' | translate }}: - -
-
- - - - - - - - - - {{ letter.label }} - - - {{ page.title }} - {{ 'core.offline' | translate }} - - - - - - +
+ + +
+
+ {{ 'core.tag.tags' | translate }}: + +
+
diff --git a/src/addon/mod/wiki/components/index/index.ts b/src/addon/mod/wiki/components/index/index.ts index 7296709d2..a7eab587f 100644 --- a/src/addon/mod/wiki/components/index/index.ts +++ b/src/addon/mod/wiki/components/index/index.ts @@ -12,8 +12,8 @@ // See the License for the specific language governing permissions and // limitations under the License. -import { Component, Optional, Injector, Input, ViewChild } from '@angular/core'; -import { Content, NavController, PopoverController, ViewController } from 'ionic-angular'; +import { Component, Optional, Injector, Input } from '@angular/core'; +import { Content, NavController, PopoverController, ViewController, ModalController } from 'ionic-angular'; import { CoreGroupsProvider } from '@providers/groups'; import { CoreUtilsProvider } from '@providers/utils/utils'; import { CoreCourseModuleMainActivityComponent } from '@core/course/classes/main-activity-component'; @@ -21,7 +21,6 @@ import { CoreUserProvider } from '@core/user/providers/user'; import { AddonModWikiProvider, AddonModWikiSubwikiListData } from '../../providers/wiki'; import { AddonModWikiOfflineProvider } from '../../providers/wiki-offline'; import { AddonModWikiSyncProvider } from '../../providers/wiki-sync'; -import { CoreTabsComponent } from '@components/tabs/tabs'; import { AddonModWikiSubwikiPickerComponent } from '../../components/subwiki-picker/subwiki-picker'; import { CoreTagProvider } from '@core/tag/providers/tag'; @@ -33,7 +32,6 @@ import { CoreTagProvider } from '@core/tag/providers/tag'; templateUrl: 'addon-mod-wiki-index.html', }) export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComponent { - @ViewChild(CoreTabsComponent) tabs: CoreTabsComponent; @Input() action: string; @Input() pageId: number; @@ -55,9 +53,6 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp loadedSubwikis: any[] = []; // The loaded subwikis. pageIsOffline: boolean; // Whether the loaded page is an offline page. pageContent: string; // Page content to display. - showHomeButton: boolean; // Whether to display the home button. - selectedTab = 0; // Tab to select at start. - map: any[] = []; // Map of pages, categorized by letter. subwikiData: AddonModWikiSubwikiListData = { // Data for the subwiki selector. subwikiSelected: 0, userSelected: 0, @@ -66,25 +61,23 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp count: 0 }; tagsEnabled: boolean; + currentPageObj: any; // Object of the current loaded page. protected syncEventName = AddonModWikiSyncProvider.AUTO_SYNCED; protected currentSubwiki: any; // Current selected subwiki. protected currentPage: number; // Current loaded page ID. - protected currentPageObj: any; // Object of the current loaded page. protected subwikiPages: any[]; // List of subwiki pages. protected newPageObserver: any; // Observer to check for new pages. protected ignoreManualSyncEvent: boolean; // Whether manual sync event should be ignored. protected manualSyncObserver: any; // An observer to watch for manual sync events. protected currentUserId: number; // Current user ID. protected hasEdited = false; // Whether the user has opened the edit page. - protected mapInitialized = false; // Whether the map was initialized. - protected initHomeButton = true; // Whether the init home button must be initialized. constructor(injector: Injector, protected wikiProvider: AddonModWikiProvider, @Optional() protected content: Content, protected wikiOffline: AddonModWikiOfflineProvider, protected wikiSync: AddonModWikiSyncProvider, protected navCtrl: NavController, protected utils: CoreUtilsProvider, protected groupsProvider: CoreGroupsProvider, protected userProvider: CoreUserProvider, private popoverCtrl: PopoverController, - private tagProvider: CoreTagProvider) { + private tagProvider: CoreTagProvider, protected modalCtrl: ModalController) { super(injector, content); this.pageStr = this.translate.instant('addon.mod_wiki.wikipage'); @@ -100,7 +93,6 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp this.currentUserId = this.sitesProvider.getCurrentSiteUserId(); this.isMainPage = !this.pageId && !this.pageTitle; this.currentPage = this.pageId; - this.selectedTab = this.action == 'map' ? 1 : 0; this.loadContent(false, true).then(() => { if (!this.wiki) { @@ -118,6 +110,10 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp // Ignore errors. }); } + }).finally(() => { + if (this.action == 'map') { + this.openMap(); + } }); // Listen for manual sync events. @@ -179,40 +175,6 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp } } - /** - * Construct the map of pages. - * - * @param subwikiPages List of pages. - */ - constructMap(subwikiPages: any[]): void { - let letter, - initialLetter; - - this.map = []; - this.mapInitialized = true; - subwikiPages.sort((a, b) => { - const compareA = a.title.toLowerCase().trim(), - compareB = b.title.toLowerCase().trim(); - - return compareA.localeCompare(compareB); - }); - - subwikiPages.forEach((page) => { - const letterCandidate = page.title.charAt(0).toLocaleUpperCase(); - - // Should we create a new grouping? - if (letterCandidate !== initialLetter) { - initialLetter = letterCandidate; - letter = {label: letterCandidate, pages: []}; - - this.map.push(letter); - } - - // Add the subwiki to the currently active grouping. - letter.pages.push(page); - }); - } - /** * Get the wiki data. * @@ -248,11 +210,6 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp return Promise.reject(null); } - if (this.isCurrentView || this.initHomeButton) { - this.initHomeButton = false; - this.showHomeButton = !!this.getWikiHomeView(); - } - // Get module instance if it's empty. let promise; if (!this.module.id) { @@ -397,7 +354,6 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp } this.subwikiPages = this.wikiProvider.sortPagesByTitle(subwikiPages.concat(offlinePages)); - this.constructMap(this.subwikiPages); // Reject if no currentPage selected from the subwikis given (if no subwikis available, do not reject). if (!this.currentPage && !this.pageTitle && this.subwikiPages.length > 0) { @@ -492,17 +448,6 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp } } - /** - * Go back to the initial page of the wiki. - */ - goToWikiHome(): void { - const homeView = this.getWikiHomeView(); - - if (homeView) { - this.navCtrl.popTo(homeView); - } - } - /** * Open the view to create the first page of the wiki. */ @@ -613,9 +558,39 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp return; } + } - // No changes done. - this.tabs.selectTab(0); + /** + * Show the map. + * + * @param {MouseEvent} event Event. + */ + openMap(event: MouseEvent): void { + const modal = this.modalCtrl.create('AddonModWikiMapPage', { + pages: this.subwikiPages, + selected: this.currentPageObj && this.currentPageObj.id, + homeView: this.getWikiHomeView() + }, { cssClass: 'core-modal-lateral', + showBackdrop: true, + enableBackdropDismiss: true, + enterAnimation: 'core-modal-lateral-transition', + leaveAnimation: 'core-modal-lateral-transition' }); + + // If the modal sends back a SCO, load it. + modal.onDidDismiss((page) => { + if (page) { + if (page.type == 'home') { + // Go back to the initial page of the wiki. + this.navCtrl.popTo(page.goto); + } else { + this.goToPage(page.goto); + } + } + }); + + modal.present({ + ev: event + }); } /** @@ -638,8 +613,7 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp wikiId: this.wiki.id, subwikiId: subwikiId, userId: userId, - groupId: groupId, - action: this.tabs.selected == 0 ? 'page' : 'map' + groupId: groupId }); } } @@ -731,8 +705,6 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp ionViewDidEnter(): void { super.ionViewDidEnter(); - this.tabs && this.tabs.ionViewDidEnter(); - if (this.hasEdited) { this.hasEdited = false; this.showLoadingAndRefresh(true, false); @@ -745,8 +717,6 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp ionViewDidLeave(): void { super.ionViewDidLeave(); - this.tabs && this.tabs.ionViewDidLeave(); - if (this.navCtrl.getActive().component.name == 'AddonModWikiEditPage') { this.hasEdited = true; } diff --git a/src/addon/mod/wiki/pages/map/map.html b/src/addon/mod/wiki/pages/map/map.html new file mode 100644 index 000000000..4d1545519 --- /dev/null +++ b/src/addon/mod/wiki/pages/map/map.html @@ -0,0 +1,29 @@ + + + {{ 'addon.mod_wiki.map' | translate }} + + + + + + + + diff --git a/src/addon/mod/wiki/pages/map/map.module.ts b/src/addon/mod/wiki/pages/map/map.module.ts new file mode 100644 index 000000000..cf9fa5738 --- /dev/null +++ b/src/addon/mod/wiki/pages/map/map.module.ts @@ -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 { CoreComponentsModule } from '@components/components.module'; +import { CoreDirectivesModule } from '@directives/directives.module'; +import { AddonModWikiMapPage } from './map'; + +@NgModule({ + declarations: [ + AddonModWikiMapPage, + ], + imports: [ + CoreComponentsModule, + CoreDirectivesModule, + IonicPageModule.forChild(AddonModWikiMapPage), + TranslateModule.forChild() + ], +}) +export class AddonModWikiMapPageModule {} diff --git a/src/addon/mod/wiki/pages/map/map.ts b/src/addon/mod/wiki/pages/map/map.ts new file mode 100644 index 000000000..e1fcb25ad --- /dev/null +++ b/src/addon/mod/wiki/pages/map/map.ts @@ -0,0 +1,93 @@ +// (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, ViewController } from 'ionic-angular'; + +/** + * Modal to display the map of a Wiki. + */ +@IonicPage({ segment: 'addon-mod-wiki-map' }) +@Component({ + selector: 'page-addon-mod-wiki-map', + templateUrl: 'map.html', +}) +export class AddonModWikiMapPage { + map: any[] = []; // Map of pages, categorized by letter. + selected: number; + homeView: ViewController; + + constructor(navParams: NavParams, protected viewCtrl: ViewController) { + this.constructMap(navParams.get('pages') || []); + + this.selected = navParams.get('selected'); + this.homeView = navParams.get('homeView'); + } + + /** + * Function called when a page is clicked. + * + * @param {any} page Clicked page. + */ + goToPage(page: any): void { + this.viewCtrl.dismiss({type: 'page', goto: page}); + } + + /** + * Go back to the initial page of the wiki. + */ + goToWikiHome(): void { + this.viewCtrl.dismiss({type: 'home', goto: this.homeView}); + } + + /** + * Construct the map of pages. + * + * @param {any[]} pages List of pages. + */ + protected constructMap(pages: any[]): void { + let letter, + initialLetter; + + this.map = []; + pages.sort((a, b) => { + const compareA = a.title.toLowerCase().trim(), + compareB = b.title.toLowerCase().trim(); + + return compareA.localeCompare(compareB); + }); + + pages.forEach((page) => { + const letterCandidate = page.title.charAt(0).toLocaleUpperCase(); + + // Should we create a new grouping? + if (letterCandidate !== initialLetter) { + initialLetter = letterCandidate; + letter = {label: letterCandidate, pages: []}; + + this.map.push(letter); + } + + // Add the subwiki to the currently active grouping. + letter.pages.push(page); + }); + } + + /** + * Close modal. + */ + closeModal(): void { + this.viewCtrl.dismiss(); + } +} From 3f1114f34c26ab5d32424714c0599518edc8c298 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= Date: Fri, 30 Aug 2019 09:44:36 +0200 Subject: [PATCH 2/2] MOBILE-3105 wiki: Code restyling --- .../index/addon-mod-wiki-index.html | 5 +- .../mod/wiki/components/index/index.scss | 1 + src/addon/mod/wiki/components/index/index.ts | 66 +++++++------------ src/addon/mod/wiki/pages/map/map.html | 5 +- src/addon/mod/wiki/pages/map/map.ts | 4 +- 5 files changed, 33 insertions(+), 48 deletions(-) diff --git a/src/addon/mod/wiki/components/index/addon-mod-wiki-index.html b/src/addon/mod/wiki/components/index/addon-mod-wiki-index.html index 749a85458..c16f7462c 100644 --- a/src/addon/mod/wiki/components/index/addon-mod-wiki-index.html +++ b/src/addon/mod/wiki/components/index/addon-mod-wiki-index.html @@ -24,7 +24,7 @@ -
+
@@ -39,7 +39,8 @@ {{ pageWarning }}
- +
+
diff --git a/src/addon/mod/wiki/components/index/index.scss b/src/addon/mod/wiki/components/index/index.scss index e320264d2..3a0249f11 100644 --- a/src/addon/mod/wiki/components/index/index.scss +++ b/src/addon/mod/wiki/components/index/index.scss @@ -12,6 +12,7 @@ ion-app.app-root addon-mod-wiki-index { .addon-mod_wiki-page-content { background-color: $white; + border-top: 1px solid $gray; @include darkmode() { background-color: $black; } diff --git a/src/addon/mod/wiki/components/index/index.ts b/src/addon/mod/wiki/components/index/index.ts index a7eab587f..f4780f4c8 100644 --- a/src/addon/mod/wiki/components/index/index.ts +++ b/src/addon/mod/wiki/components/index/index.ts @@ -145,31 +145,20 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp protected checkPageCreatedOrDiscarded(data: any): void { if (!this.currentPage && data) { // This is an offline page. Check if the page was created. - let pageId; - - for (let i = 0, len = data.created.length; i < len; i++) { - const page = data.created[i]; - if (page.title == this.pageTitle) { - pageId = page.pageId; - break; - } - } - - if (pageId) { + const page = data.created.find((page) => page.title == this.pageTitle); + if (page) { // Page was created, set the ID so it's retrieved from server. - this.currentPage = pageId; + this.currentPage = page.pageId; this.pageIsOffline = false; } else { // Page not found in created list, check if it was discarded. - for (let i = 0, len = data.discarded.length; i < len; i++) { - const page = data.discarded[i]; - if (page.title == this.pageTitle) { - // Page discarded, show warning. - this.pageWarning = page.warning; - this.pageContent = ''; - this.pageIsOffline = false; - this.hasOffline = false; - } + const page = data.discarded.find((page) => page.title == this.pageTitle); + if (page) { + // Page discarded, show warning. + this.pageWarning = page.warning; + this.pageContent = ''; + this.pageIsOffline = false; + this.hasOffline = false; } } } @@ -328,12 +317,9 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp // If no page specified, search first page. if (!this.currentPage && !this.pageTitle) { - for (const i in subwikiPages) { - const page = subwikiPages[i]; - if (page.firstpage) { - this.currentPage = page.id; - break; - } + const firstPage = subwikiPages.find((page) => page.firstpage ); + if (firstPage) { + this.currentPage = firstPage.id; } } @@ -527,7 +513,7 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp * * @param page Page to view. */ - goToPage(page: any): void { + protected goToPage(page: any): void { if (!page.id) { // It's an offline page. Check if we are already in the same offline page. if (this.currentPage || !this.pageTitle || page.title != this.pageTitle) { @@ -536,8 +522,7 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp courseId: this.courseId, pageTitle: page.title, wikiId: this.wiki.id, - subwikiId: page.subwikiid, - action: 'page' + subwikiId: page.subwikiid }); return; @@ -551,8 +536,7 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp pageTitle: page.title, pageId: page.id, wikiId: page.wikiid, - subwikiId: page.subwikiid, - action: 'page' + subwikiId: page.subwikiid }); }); @@ -563,9 +547,9 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp /** * Show the map. * - * @param {MouseEvent} event Event. + * @param event Event. */ - openMap(event: MouseEvent): void { + openMap(event?: MouseEvent): void { const modal = this.modalCtrl.create('AddonModWikiMapPage', { pages: this.subwikiPages, selected: this.currentPageObj && this.currentPageObj.id, @@ -576,7 +560,7 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp enterAnimation: 'core-modal-lateral-transition', leaveAnimation: 'core-modal-lateral-transition' }); - // If the modal sends back a SCO, load it. + // If the modal sends back a page, load it. modal.onDidDismiss((page) => { if (page) { if (page.type == 'home') { @@ -984,9 +968,7 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp if (multiLevelList) { // As we loop over each subwiki, add it to the current group - for (const i in subwikiList) { - const subwiki = subwikiList[i]; - + subwikiList.forEach((subwiki) => { // Should we create a new grouping? if (subwiki.groupid !== groupValue) { grouping = {label: subwiki.groupLabel, subwikis: []}; @@ -997,16 +979,14 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp // Add the subwiki to the currently active grouping. grouping.subwikis.push(subwiki); - } + }); } else if (showMyGroupsLabel) { const noGrouping = {label: '', subwikis: []}, myGroupsGrouping = {label: this.translate.instant('core.mygroups'), subwikis: []}, otherGroupsGrouping = {label: this.translate.instant('core.othergroups'), subwikis: []}; // As we loop over each subwiki, add it to the current group - for (const i in subwikiList) { - const subwiki = subwikiList[i]; - + subwikiList.forEach((subwiki) => { // Add the subwiki to the currently active grouping. if (typeof subwiki.canedit == 'undefined') { noGrouping.subwikis.push(subwiki); @@ -1015,7 +995,7 @@ export class AddonModWikiIndexComponent extends CoreCourseModuleMainActivityComp } else { otherGroupsGrouping.subwikis.push(subwiki); } - } + }); // Add each grouping to the subwikis if (noGrouping.subwikis.length > 0) { diff --git a/src/addon/mod/wiki/pages/map/map.html b/src/addon/mod/wiki/pages/map/map.html index 4d1545519..93429cb91 100644 --- a/src/addon/mod/wiki/pages/map/map.html +++ b/src/addon/mod/wiki/pages/map/map.html @@ -21,7 +21,10 @@ {{ page.title }} - {{ 'core.offline' | translate }} + + + {{ 'core.notsent' | translate }} + diff --git a/src/addon/mod/wiki/pages/map/map.ts b/src/addon/mod/wiki/pages/map/map.ts index e1fcb25ad..30fb14133 100644 --- a/src/addon/mod/wiki/pages/map/map.ts +++ b/src/addon/mod/wiki/pages/map/map.ts @@ -38,7 +38,7 @@ export class AddonModWikiMapPage { /** * Function called when a page is clicked. * - * @param {any} page Clicked page. + * @param page Clicked page. */ goToPage(page: any): void { this.viewCtrl.dismiss({type: 'page', goto: page}); @@ -54,7 +54,7 @@ export class AddonModWikiMapPage { /** * Construct the map of pages. * - * @param {any[]} pages List of pages. + * @param pages List of pages. */ protected constructMap(pages: any[]): void { let letter,