Skip to content

Commit 37b5968

Browse files
jweismanjweisman
committed
New menu using the menu component
1 parent 4061ba5 commit 37b5968

File tree

8 files changed

+185
-145
lines changed

8 files changed

+185
-145
lines changed

‎cloudapp/src/app/app.module.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { NgModule } from '@angular/core';
22
import { HttpClientModule } from '@angular/common/http';
33
import { BrowserModule, Title } from '@angular/platform-browser';
44
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
5-
import { MaterialModule, getTranslateModule, AlertModule } from '@exlibris/exl-cloudapp-angular-lib';
5+
import { MaterialModule, getTranslateModule, AlertModule, MenuModule } from '@exlibris/exl-cloudapp-angular-lib';
66
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
77
import { SelectEntitiesModule } from 'eca-components';
88

@@ -57,6 +57,7 @@ import { ConfirmationDialog, StyleComponent } from './style/style.component';
5757
getTranslateModule(),
5858
AlertModule,
5959
SelectEntitiesModule,
60+
MenuModule,
6061
],
6162
providers: [
6263
Title

‎cloudapp/src/app/main/main-menu.ts‎

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
export const menu = [
2+
{
3+
title: 'Routes',
4+
text: 'Adding additional routes',
5+
icon: 'uxf-icon uxf-link',
6+
link: 'newroute'
7+
},
8+
{
9+
title: 'Themes',
10+
text: 'Using Material components & theming',
11+
icon: 'uxf-icon uxf-background-color',
12+
link: 'theming'
13+
},
14+
{
15+
title: 'Settings',
16+
text: 'Using the Settings Service',
17+
icon: 'uxf-icon uxf-settings',
18+
link: 'settings'
19+
},
20+
{
21+
title: 'Parallelize',
22+
text: 'Making parallel API requests',
23+
icon: 'uxf-icon uxf-switch',
24+
link: 'parallel'
25+
},
26+
{
27+
title: 'External APIs',
28+
text: 'Reaching outside your app',
29+
icon: 'uxf-icon uxf-external-link',
30+
link: 'external'
31+
},
32+
{
33+
title: 'XML',
34+
text: 'Working with bibliographic records in XML',
35+
icon: 'uxf-icon uxf-code',
36+
link: 'xml'
37+
},
38+
{
39+
title: 'Binding',
40+
text: 'Model binding with REST objects',
41+
icon: 'uxf-icon uxf-database',
42+
link: 'bind'
43+
},
44+
{
45+
title: 'Storage',
46+
text: 'Using the Store Service',
47+
icon: 'uxf-icon uxf-clipboard',
48+
link: 'store'
49+
},
50+
{
51+
title: 'Translations',
52+
text: 'Making your app ready for translation',
53+
icon: 'uxf-icon uxf-globe',
54+
link: 'translate'
55+
},
56+
{
57+
title: 'Multi-select',
58+
text: 'Selecting multiple entities',
59+
icon: 'uxf-icon uxf-list',
60+
link: 'multi-select'
61+
},
62+
{
63+
title: 'Configuration',
64+
text: 'Using the Configuration Service',
65+
icon: 'uxf-icon uxf-wrench',
66+
link: 'configuration'
67+
},
68+
{
69+
title: 'Style Guide',
70+
text: 'Following the Style Guide',
71+
icon: 'uxf-icon uxf-compass',
72+
link: 'style'
73+
},
74+
]

‎cloudapp/src/app/main/main.component.html‎

Lines changed: 3 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,6 @@
11
<section>
22
<p>This app includes all of the code referenced in the <a href="https://developers.exlibrisgroup.com/cloudapps/tutorials" target="_blank">tutorials section of the Cloud Apps documentation</a>. The following menu will lead you to the component referenced in the corresponding tutorial:</p>
3-
<ul>
4-
<li><a [routerLink]="['newroute']">Adding additional routes</a></li>
5-
<li><a [routerLink]="['theming']">Using Material components & theming</a></li>
6-
<li><a [routerLink]="['settings']">Using the Settings Service</a></li>
7-
<li><a [routerLink]="['parallel']">Making parallel API requests</a></li>
8-
<li><a [routerLink]="['external']">Reaching outside your app</a></li>
9-
<li><a [routerLink]="['xml']">Working with bibliographic records in XML</a></li>
10-
<li><a [routerLink]="['bind']">Model binding with REST objects</a></li>
11-
<li><a [routerLink]="['store']">Using the Store Service</a></li>
12-
<li><a [routerLink]="['translate']">Translating your app</a></li>
13-
<li><a [routerLink]="['multi-select']">Selecting multiple entities</a></li>
14-
<li><a [routerLink]="['configuration']">Using the Configuration Service</a></li>
15-
<li><a [routerLink]="['style']">Following the Style Guide</a></li>
16-
</ul>
3+
<eca-menu>
4+
<eca-menu-item *ngFor="let item of menu" [title]="item.title" [routerLink]="item.link" [icon]="item.icon">{{item.text}}</eca-menu-item>
5+
</eca-menu>
176
</section>

‎cloudapp/src/app/main/main.component.scss‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
section>h1 {
2-
padding: 5px 10px;
3-
border-radius: 4px;
4-
margin-top: 10px;
5-
}
1+
p {
2+
margin-bottom: 15px;
3+
}

‎cloudapp/src/app/main/main.component.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { Component, OnInit } from '@angular/core';
22
import { AppService } from '../app.service';
33
import { CloudAppEventsService } from '@exlibris/exl-cloudapp-angular-lib';
4+
import { menu } from './main-menu';
45

56
@Component({
67
selector: 'app-main',
@@ -9,6 +10,7 @@ import { CloudAppEventsService } from '@exlibris/exl-cloudapp-angular-lib';
910
})
1011
export class MainComponent implements OnInit {
1112
isAdmin = false;
13+
menu = menu;
1214

1315
constructor(
1416
private appService: AppService,

‎cloudapp/src/app/xml/xml.component.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ export class XmlComponent implements OnInit, OnDestroy {
2828
this.appService.setTitle('Working with XML');
2929
this.bibUtils = new BibUtils(this.restService);
3030
this.pageLoad$ = this.eventsService.onPageLoad((pageInfo: PageInfo) => {
31-
const entities = (pageInfo.entities||[]).filter(e=>[EntityType.BIB_MMS, 'IEP', 'BIB'].includes(e.type));
31+
const entities = (pageInfo.entities||[]).filter(e=>[EntityType.BIB_MMS].includes(e.type));
3232
if (entities.length > 0) {
3333
this.bibUtils.getBib(entities[0].id).subscribe(bib=>
3434
this.bib = (bib.record_format=='marc21') ? bib : null

0 commit comments

Comments
 (0)