Skip to content

Commit

Permalink
Merge pull request #70 from ljw980105/drinks-admin-menu
Browse files Browse the repository at this point in the history
add-drinks-component
  • Loading branch information
ljw980105 authored May 19, 2024
2 parents cf77d96 + 84b056d commit 8d304f2
Show file tree
Hide file tree
Showing 14 changed files with 1,599 additions and 3,003 deletions.
4,411 changes: 1,414 additions & 2,997 deletions package-lock.json

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,7 @@
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"postcss": "^8.4.18",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
Expand Down
4 changes: 3 additions & 1 deletion src/app/admin-panel/admin-panel-components-routing.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import {EditProjectsComponent} from './edit-projects/edit-projects.component';
import {EditHomeComponent} from './edit-home/edit-home.component';
import {EditGraphicsComponent} from './edit-graphics/edit-graphics.component';
import {EditResumeComponent} from './edit-resume/edit-resume.component';
import {EditDrinksComponent} from './edit-drinks/edit-drinks.component';

const routes: Routes = [
{
Expand All @@ -18,7 +19,8 @@ const routes: Routes = [
{path: 'edit-projects', component: EditProjectsComponent},
{path: 'edit-home', component: EditHomeComponent},
{path: 'edit-graphics', component: EditGraphicsComponent},
{path: 'edit-resume', component: EditResumeComponent}
{path: 'edit-resume', component: EditResumeComponent},
{path: 'edit-drinks', component: EditDrinksComponent}
]
},
];
Expand Down
4 changes: 3 additions & 1 deletion src/app/admin-panel/admin-panel-components.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import { BatchFileUploaderComponent } from './batch-file-uploader/batch-file-upl
import { EditAppsComponent } from './edit-apps/edit-apps.component';
import { FileBrowserComponent } from './file-browser/file-browser.component';
import {SharedModule} from '../shared/shared.module';
import { EditDrinksComponent } from './edit-drinks/edit-drinks.component';

export function getHighlightLanguages() {
return {
Expand All @@ -37,7 +38,8 @@ export function playerFactory() {
ActivityIndicatorComponent,
BatchFileUploaderComponent,
EditAppsComponent,
FileBrowserComponent
FileBrowserComponent,
EditDrinksComponent
],
imports: [
CommonModule,
Expand Down
32 changes: 32 additions & 0 deletions src/app/admin-panel/edit-drinks/edit-drinks.component.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
<h3 class="mohave admin-header">DRINKS</h3>

<div class="admin-section flex">
<div class="left-half">
<table *ngIf="dataReady" class="helvetica">
<tr>
<th>Name</th>
<th>Ingredients</th>
</tr>
<tr *ngFor="let drink of drinks">
<td>{{drink.name}}</td>
<td>{{drink.description}}</td>
</tr>
</table>
</div>
<div class="right-half">
<h3 class="helvetica">JSON Spec</h3>
<div>
<pre class="minimal-top-spacing">
<code [highlight]="jsonSpec"></code>
</pre>
</div>

<div>
<h3 class="helvetica">Submit JSON</h3>
<label>
<textarea class="admin-textarea" [(ngModel)]="textAreaContents"></textarea>
</label>
<button (click)="submitViaJSON()">Submit</button>
</div>
</div>
</div>
25 changes: 25 additions & 0 deletions src/app/admin-panel/edit-drinks/edit-drinks.component.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
table {
margin: 0 0 1% 1%;
width: 98%;
border-collapse: collapse;
}

td, th {
text-align: left;
padding: 8px;
}

$tableGray: rgb(240, 240, 240);

th {
background-color: $tableGray;
}

tr:nth-child(odd) {
background-color: $tableGray;
}

textarea {
width: 400px;
height: 200px;
}
25 changes: 25 additions & 0 deletions src/app/admin-panel/edit-drinks/edit-drinks.component.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';

import { EditDrinksComponent } from './edit-drinks.component';

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

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

beforeEach(() => {
fixture = TestBed.createComponent(EditDrinksComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});
55 changes: 55 additions & 0 deletions src/app/admin-panel/edit-drinks/edit-drinks.component.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import {Component, OnInit} from '@angular/core';
import {MemoryManagerComponent} from '../../shared/memory-manager/memory-manager.component';
import {ApiService} from '../../services/api.service';
import {AdminHelperService} from '../admin-helper.service';
import {takeUntil} from 'rxjs/operators';
import {NameAndDescription} from '../../models/pure-models/NameAndDescription';

@Component({
selector: 'app-edit-drinks',
templateUrl: './edit-drinks.component.html',
styleUrls: ['./edit-drinks.component.scss']
})
export class EditDrinksComponent extends MemoryManagerComponent implements OnInit {

jsonSpec = `
{
"drinks": [
{
"name": "...",
"description": "..."
},
...
]
}
`;
textAreaContents = '';
drinks: NameAndDescription[];
dataReady = false;

constructor(public apiService: ApiService, private helperService: AdminHelperService) {
super();
}



ngOnInit(): void {
this.getDrinks();
}

getDrinks() {
this.apiService.getDrinks()
.pipe(takeUntil(this.unsubscribe$))
.subscribe((drinks) => {
this.drinks = drinks.drinks;
this.dataReady = true;
});
}

submitViaJSON() {
this.helperService.showActivityIndicatorWithObservable(
this.apiService.addDrinks(this.textAreaContents), () => this.getDrinks()
);
}

}
6 changes: 6 additions & 0 deletions src/app/admin-panel/navigator/navigator.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,12 @@
[routerLinkActive]="'active'">Apps
</a>
</div>
<div [ngClass]="{'highlighted': highlights['edit-drinks']}">
<a (click)="highlightComponent('edit-drinks')"
class="helvetica anchor-style"
[routerLink]="['edit-drinks']"
[routerLinkActive]="'active'"> Drinks</a>
</div>
<div [ngClass]="{'highlighted': highlights['browse-files']}">
<a (click)="highlightComponent('browse-files')"
class="helvetica anchor-style"
Expand Down
1 change: 1 addition & 0 deletions src/app/admin-panel/navigator/navigator.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ export class NavigatorComponent implements OnInit, OnDestroy {
'edit-home': false,
'edit-projects': false,
'edit-apps': false,
'edit-drinks': false,
'browse-files': false
};

Expand Down
17 changes: 14 additions & 3 deletions src/app/minor-components/drinks/drinks.component.ts
Original file line number Diff line number Diff line change
@@ -1,16 +1,21 @@
import {Component, OnInit} from '@angular/core';
import {NameAndDescription} from '../../models/pure-models/NameAndDescription';
import {Title} from '@angular/platform-browser';
import {ApiService} from '../../services/api.service';
import {MemoryManagerComponent} from '../../shared/memory-manager/memory-manager.component';
import {takeUntil} from 'rxjs/operators';

@Component({
selector: 'app-drinks',
templateUrl: './drinks.component.html',
styleUrls: ['./drinks.component.scss']
})
export class DrinksComponent implements OnInit {
cocktails: NameAndDescription[];
export class DrinksComponent extends MemoryManagerComponent implements OnInit {
cocktails: NameAndDescription[] = [];

constructor(private titleService: Title) {
constructor(private titleService: Title, private apiService: ApiService) {
super();
/*
this.cocktails = [
new NameAndDescription(
'Aperol Spritz',
Expand Down Expand Up @@ -49,10 +54,16 @@ export class DrinksComponent implements OnInit {
'Gin, Aperol, Sweet Vermouth'
)
];
*/
titleService.setTitle('Drinks Menu');
}

ngOnInit(): void {
this.apiService.getDrinks()
.pipe(takeUntil(this.unsubscribe$))
.subscribe((drinks) => {
this.cocktails = drinks.drinks;
});
}

}
6 changes: 6 additions & 0 deletions src/app/models/pure-models/Drinks.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
import {NameAndDescription} from './NameAndDescription';

export class Drinks {
constructor(public drinks: NameAndDescription[]) {
}
}
11 changes: 11 additions & 0 deletions src/app/services/api.service.ts
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import {tryCatchWithObservable} from '../models/Global';
import {NameAndURL} from '../models/pure-models/NameAndURL';
import {FileToBrowse} from '../models/pure-models/FileToBrowse';
import {DirectoryInfo} from '../models/files/DirectoryInfo';
import {Drinks} from '../models/pure-models/Drinks';

@Injectable({
providedIn: 'root'
Expand Down Expand Up @@ -250,6 +251,16 @@ export class ApiService {
.pipe(catchError(() => of([])));
}

// drinks
getDrinks(): Observable<Drinks> {
return this.http.get<Drinks>(`${this.apiRoot}api/drinks`)
.pipe(catchError(() => of(new Drinks([]))));
}

addDrinks(data: string): Observable<ServerResponse> {
return this.addJSONToEndPoint(`${this.apiRoot}api/drinks`, data);
}

private authHeaders() {
return {
headers: new HttpHeaders({
Expand Down
4 changes: 3 additions & 1 deletion src/common-css/admin-panel-styles.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
$admin-bg-gray: rgb(240, 240, 240);

input[type=text] {
width: 100%;
padding: 8px 8px;
Expand Down Expand Up @@ -83,7 +85,7 @@ label, textarea, input {
}

.admin-single-project {
background-color: rgb(240, 240, 240);
background-color: $admin-bg-gray;
padding: 10px 15px;
border-radius: 10px;
display: flex;
Expand Down

0 comments on commit 8d304f2

Please sign in to comment.