Skip to content

Commit

Permalink
feat: move about
Browse files Browse the repository at this point in the history
  • Loading branch information
MAudelGisaia committed Jan 6, 2025
1 parent f861bae commit f8d4216
Show file tree
Hide file tree
Showing 10 changed files with 241 additions and 83 deletions.
2 changes: 2 additions & 0 deletions angular.json
Original file line number Diff line number Diff line change
Expand Up @@ -261,10 +261,12 @@
},
"schematics": {
"@schematics/angular:component": {
"project": "arlas-wui",
"prefix": "arlas",
"style": "scss"
},
"@schematics/angular:directive": {
"project": "arlas-wui",
"prefix": "arlas"
},
"@angular-eslint/schematics:application": {
Expand Down
14 changes: 11 additions & 3 deletions src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -44,8 +44,14 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterModule } from '@angular/router';
import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core';
import {
HistogramModule, MapglImportModule, MapglModule, MapglSettingsModule,
ResultsModule, FormatNumberModule, BboxGeneratorModule, GetValueModule
BboxGeneratorModule,
FormatNumberModule,
GetValueModule,
HistogramModule,
MapglImportModule,
MapglModule,
MapglSettingsModule,
ResultsModule
} from 'arlas-web-components';
import {
ArlasCollectionService,
Expand Down Expand Up @@ -83,6 +89,7 @@ import { GetResultlistConfigPipe } from './pipes/get-resultlist-config.pipe';
import { MapService } from './services/map.service';
import { ResultlistService } from './services/resultlist.service';
import { ArlasAnalyticsComponent } from './components/arlas-analytics/arlas-analytics.component';
import { ActionMenuComponent } from '@components/action-menu/action-menu.component';


@NgModule({
Expand Down Expand Up @@ -168,7 +175,8 @@ import { ArlasAnalyticsComponent } from './components/arlas-analytics/arlas-anal
ArlasTaggerModule,
LoginModule,
LazyLoadImageModule,
GetValueModule
GetValueModule,
ActionMenuComponent
],
providers: [
VisualizeService,
Expand Down
52 changes: 52 additions & 0 deletions src/app/components/action-menu/action-menu.component.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
<button mat-icon-button [matMenuTriggerFor]="actionMenu" *ngIf="!arlasStartupService.emptyMode" class="action-menu-button">
<mat-icon>more_vert</mat-icon>
</button>

<arlas-share #share [icon]="'share'" [hidden]="true"></arlas-share>

<arlas-download #download [collections]="collections" [hidden]="true"></arlas-download>

<arlas-bookmark-menu #bookmarkMenu></arlas-bookmark-menu>

<arlas-about #about [pathToMd]="aboutFile" [extraTextData]="extraAboutText"></arlas-about>

<arlas-tag #tag></arlas-tag>

<mat-menu #tagMenu="matMenu">
<button mat-menu-item (click)="displayTag()">
<mat-icon>add_circle_outline</mat-icon>
<span>{{ 'Add' | translate }}</span>
</button>
<button mat-menu-item (click)="displayTagManagement()">
<mat-icon>replay</mat-icon>
<span>{{ 'Replay' | translate }}</span>
</button>
</mat-menu>
<mat-menu #actionMenu="matMenu">
<button mat-menu-item *ngIf="shareComponentConfig" (click)="displayShare()">
<mat-icon>share</mat-icon>
<span>{{ 'Share geographical data' | translate }}</span>
</button>
<button mat-menu-item *ngIf="downloadComponentConfig" (click)="displayDownload()">
<mat-icon>get_app</mat-icon>
<span>{{ 'Download data' | translate }}</span>
</button>
<button mat-menu-item [matMenuTriggerFor]="bookmarkMenu.matMenu" *ngIf="!arlasStartupService.emptyMode">
<mat-icon>bookmark</mat-icon>
<span>{{ 'Bookmark' | translate }}</span>
</button>
<button mat-menu-item *ngIf="tagComponentConfig" [matMenuTriggerFor]="tagMenu">
<mat-icon>local_offer</mat-icon>
<span>{{ 'Tag data' | translate }}</span>
</button>
<button mat-menu-item *ngIf="walkthroughService.isActivable" (click)="replayTour()">
<mat-icon>slideshow</mat-icon>
<span>{{ 'Replay tour' | translate }}</span>
</button>

<!-- Information -->
<button mat-menu-item *ngIf="showAboutButton()" (click)="displayAbout()">
<mat-icon class="icon">info_outline</mat-icon>
<span>{{ 'About' | translate }} {{ wuiName() }} {{ version() }}</span>
</button>
</mat-menu>
Empty file.
23 changes: 23 additions & 0 deletions src/app/components/action-menu/action-menu.component.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';

import { ActionMenuComponent } from './action-menu.component';

describe('ActionMenuComponent', () => {
let component: ActionMenuComponent;
let fixture: ComponentFixture<ActionMenuComponent>;

beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [ActionMenuComponent]
})
.compileComponents();

fixture = TestBed.createComponent(ActionMenuComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});
139 changes: 139 additions & 0 deletions src/app/components/action-menu/action-menu.component.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,139 @@
/*
* Licensed to Gisaïa under one or more contributor
* license agreements. See the NOTICE.txt file distributed with
* this work for additional information regarding copyright
* ownership. Gisaïa licenses this file to you 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, inject, input, OnInit, ViewChild } from '@angular/core';
import { MatIcon } from '@angular/material/icon';
import { MatIconButton } from '@angular/material/button';
import { MatMenu, MatMenuItem, MatMenuTrigger } from '@angular/material/menu';
import { NgIf } from '@angular/common';
import { TranslateModule, TranslateService } from '@ngx-translate/core';
import {
AboutComponent,
ArlasConfigService,
ArlasStartupService,
ArlasTaggerModule,
ArlasToolkitSharedModule,
ArlasWalkthroughService,
DownloadComponent,
ShareComponent,
TagComponent
} from 'arlas-wui-toolkit';
import { MapService } from '@services/map.service';
import { MatTooltip } from '@angular/material/tooltip';

@Component({
selector: 'arlas-action-menu',
standalone: true,
imports: [
MatIcon,
MatIconButton,
MatMenu,
MatMenuItem,
NgIf,
TranslateModule,
MatMenuTrigger,
ArlasToolkitSharedModule,
ArlasTaggerModule,
MatTooltip
],
templateUrl: './action-menu.component.html',
styleUrl: './action-menu.component.scss'
})
export class ActionMenuComponent implements OnInit{

/**
* @Input : Angular
* List of collections displayed in the map
*/
public collections = input<string[]>([]);
public showAboutButton = input<boolean>(true);
/**
* @Input : Angular
* @description Version of the WUI to display as info
*/
public version = input<string>('');

/**
* @Input : Angular
* @description Name of the WUI in which the bar is used
*/
public wuiName= input<string>('');


@ViewChild('share', { static: false }) private shareComponent: ShareComponent;
@ViewChild('download', { static: false }) private downloadComponent: DownloadComponent;
@ViewChild('tag', { static: false }) private tagComponent: TagComponent;
@ViewChild('about', { static: false }) private aboutcomponent: AboutComponent;

public tagComponentConfig: any;
public shareComponentConfig: any;
public downloadComponentConfig: any;
public aboutFile: string;
public extraAboutText: string;

protected walkthroughService = inject(ArlasWalkthroughService);
protected mapService = inject(MapService);
protected arlasStartupService = inject(ArlasStartupService);
protected configService = inject(ArlasConfigService);
protected translate = inject(TranslateService);

public constructor() {
this.extraAboutText = this.translate.instant('extraAboutText') === 'extraAboutText' ? '' : this.translate.instant('extraAboutText');
this.aboutFile = 'assets/about/about_' + this.translate.currentLang + '.md?' + Date.now() + '.md';
}

public ngOnInit() {
if (!this.arlasStartupService.emptyMode) {
this.shareComponentConfig = this.configService.getValue('arlas.web.components.share');
this.downloadComponentConfig = this.configService.getValue('arlas.web.components.download');
this.tagComponentConfig = this.configService.getValue('arlas.tagger');
}
}


/** When opening the dialog of layers to share, we specify the visibility status of all
* layers so that we choose only the displayed ones */
public displayShare() {
this.shareComponent.openDialog(this.mapService.mapComponent.visibilityStatus);
}

public replayTour() {
this.walkthroughService.resetTour();
this.walkthroughService.startTour();
}

public displayDownload() {
this.downloadComponent.openDialog();
}

public displayTag() {
this.tagComponent.openDialog();
}

public displayAbout() {
this.aboutcomponent.openDialog();
}

public displayTagManagement() {
this.tagComponent.openManagement();
}
}


Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<div>
<arlas-top-menu [wuiName]="'ARLAS WUI'" [version]="version">
<arlas-top-menu [wuiName]="'ARLAS WUI'" [version]="version" [showAboutButton]="false">
<div left-menu class="top-left-menu">
<img src="assets/logo-only.png" [matTooltip]="appName | translate" class="img" alt="'ARLAS-wui logo' | translate">
<arlas-search *ngIf="searchContributors" #search id="search" class="arlas-search"
Expand All @@ -11,10 +11,11 @@
</arlas-filter>
</div>

<div right-menu class="title" id="title">
<div right-menu class="right-menu-container" id="title">
<arlas-permissions-creator></arlas-permissions-creator>
<mat-divider vertical class="vertical-divider"></mat-divider>
{{appName | translate}}
<span>{{appName | translate}}</span>
<arlas-action-menu [wuiName]="'ARLAS WUI'" [version]="version" [collections]="collections"></arlas-action-menu>
</div>
</arlas-top-menu>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -461,9 +461,10 @@
border-bottom: $menu-border;
}

.title {
.right-menu-container {
font-size: $title-font-size;
display: flex;
align-items: center;
mat-divider {
margin: 0 $sm-margin;
}
Expand Down
41 changes: 0 additions & 41 deletions src/app/components/left-menu/left-menu.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -23,48 +23,7 @@
</button>
</mat-list-item>
</mat-nav-list>
<button mat-icon-button [matMenuTriggerFor]="actionMenu" *ngIf="!arlasStartupService.emptyMode" class="action-menu-button">
<mat-icon>more_vert</mat-icon>
</button>
<mat-menu #actionMenu="matMenu">
<button mat-menu-item *ngIf="shareComponentConfig" (click)="displayShare()">
<mat-icon>share</mat-icon>
<span>{{ 'Share geographical data' | translate }}</span>
</button>
<button mat-menu-item *ngIf="downloadComponentConfig" (click)="displayDownload()">
<mat-icon>get_app</mat-icon>
<span>{{ 'Download data' | translate }}</span>
</button>
<button mat-menu-item [matMenuTriggerFor]="bookmarkMenu.matMenu" *ngIf="!arlasStartupService.emptyMode">
<mat-icon>bookmark</mat-icon>
<span>{{ 'Bookmark' | translate }}</span>
</button>
<button mat-menu-item *ngIf="tagComponentConfig" [matMenuTriggerFor]="tagMenu">
<mat-icon>local_offer</mat-icon>
<span>{{ 'Tag data' | translate }}</span>
</button>
<button mat-menu-item *ngIf="walkthroughService.isActivable" (click)="replayTour()">
<mat-icon>slideshow</mat-icon>
<span>{{ 'Replay tour' | translate }}</span>
</button>
</mat-menu>
</div>
</div>
<arlas-share #share [icon]="'share'" [hidden]="true"></arlas-share>

<arlas-download #download [collections]="collections" [hidden]="true"></arlas-download>

<arlas-bookmark-menu #bookmarkMenu></arlas-bookmark-menu>

<arlas-tag #tag></arlas-tag>

<mat-menu #tagMenu="matMenu">
<button mat-menu-item (click)="displayTag()">
<mat-icon>add_circle_outline</mat-icon>
<span>{{ 'Add' | translate }}</span>
</button>
<button mat-menu-item (click)="displayTagManagement()">
<mat-icon>replay</mat-icon>
<span>{{ 'Replay' | translate }}</span>
</button>
</mat-menu>
Loading

0 comments on commit f8d4216

Please sign in to comment.