From 0201c1b10f13824bbfe13bc1cd5f02609ff2316a Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 3 Dec 2020 12:08:26 +0100 Subject: [PATCH] add apis and fix back navigation --- .gitignore | 2 + angular.json | 3 +- src/apis/conn.conn | 16 ++++ src/apis/index.php | 93 ++++++++++++++++++++++ src/app/app-layout/app-layout.component.ts | 2 +- src/app/app-routing.module.ts | 6 +- src/app/detail/detail.component.html | 16 +++- src/app/detail/detail.component.scss | 14 +++- src/app/detail/detail.component.ts | 28 +++++-- src/app/portfolio/portfolio.component.ts | 3 +- src/app/services/apis.service.ts | 4 +- src/environments/environment.ts | 2 +- 12 files changed, 170 insertions(+), 19 deletions(-) create mode 100755 src/apis/conn.conn create mode 100644 src/apis/index.php diff --git a/.gitignore b/.gitignore index 915068b..cd1b3c8 100644 --- a/.gitignore +++ b/.gitignore @@ -4,3 +4,5 @@ node_modules/ package-lock\.json src/assets/images/contents/ + +dist/ diff --git a/angular.json b/angular.json index 48a4209..be23e47 100644 --- a/angular.json +++ b/angular.json @@ -25,7 +25,8 @@ "aot": true, "assets": [ "src/assets/images/favicon.png", - "src/assets" + "src/assets", + "src/apis" ], "styles": [ "src/assets/scss/main.scss" diff --git a/src/apis/conn.conn b/src/apis/conn.conn new file mode 100755 index 0000000..877d806 --- /dev/null +++ b/src/apis/conn.conn @@ -0,0 +1,16 @@ + diff --git a/src/apis/index.php b/src/apis/index.php new file mode 100644 index 0000000..8adaa9a --- /dev/null +++ b/src/apis/index.php @@ -0,0 +1,93 @@ +items = array(); + +$filter = array("portfolio", "installations", "entertainment", "performances", "workshops"); + +switch($_GET['query']) { + case "portfolio": + case "installations": + case "entertainment": + case "performances": + case "workshops": + if($_GET['query'] == 'portfolio') {$filter = '';} else {$filter = "WHERE type='".$_GET['query']."'";} + $qe = mysqli_query($conn,"SELECT * FROM `works` $filter ORDER BY id DESC"); + if(mysqli_num_rows($qe) > 0) { + $content = null; + $content->items = array(); + while($re = mysqli_fetch_array($qe)) { + $item = null; + $item->id = $re['id']; + $item->title = $re['title']; + $item->type = $re['type']; + $item->tags = $re['tags']; + $item->image = $re['image']; + array_push($content->items, $item); + } + } + break; + case "exhibitions": + $qe = mysqli_query($conn,"SELECT * FROM `exhibitions` ORDER BY date_from DESC"); + if(mysqli_num_rows($qe) > 0) { + $content = null; + $content->items = array(); + while($re = mysqli_fetch_array($qe)) { + $item = null; + $item->id = $re['id']; + $item->title = $re['title']; + $item->date_from = $re['date_from']; + $item->date_to = $re['date_to']; + $item->tags = $re['tags']; + $item->image = $re['image']; + array_push($content->items, $item); + } + } + break; + case "detail": + $qe = mysqli_query($conn,"SELECT * FROM `".$_GET['type']."` WHERE id=".$_GET['id']); + if(mysqli_num_rows($qe)>0) { + $content = null; + $re = mysqli_fetch_array($qe); + $item = null; + $item->id = $re['id']; + $item->title = $re['title']; + $item->content = $re['content']; + $item->tags = $re['tags']; + $item->image = $re['image']; + if($_GET['type'] == 'exhibitions') { + $item->date_from = $re['date_from']; + $item->date_to = $re['date_to']; + $item->works = array(); + $qx = mysqli_query($conn,"SELECT id,title FROM `works` WHERE id IN (".$re['works'].")"); + while($re = mysqli_fetch_array($qx)) { + $ex = null; + $ex->id = $re['id']; + $ex->title = $re['title']; + array_push($item->works, $ex); + } + } else if($_GET['type'] == 'works') { + $item->type = $re['type']; + $item->exhibitions = array(); + $qx = mysqli_query($conn,"SELECT id,title FROM `exhibitions` WHERE id IN (".$re['exhibitions'].")"); + while($re = mysqli_fetch_array($qx)) { + $ex = null; + $ex->id = $re['id']; + $ex->title = $re['title']; + array_push($item->exhibitions, $ex); + } + } + $content->item = $item; + } + break; +} + + +header('Access-Control-Allow-Origin: *'); +header('Content-Type: application/json'); +echo json_encode($content); + +?> diff --git a/src/app/app-layout/app-layout.component.ts b/src/app/app-layout/app-layout.component.ts index 7174112..0b874c6 100644 --- a/src/app/app-layout/app-layout.component.ts +++ b/src/app/app-layout/app-layout.component.ts @@ -8,7 +8,7 @@ import type { Container } from 'tsparticles' }) export class AppLayoutComponent implements OnInit { - public particlesEnabled: boolean = true + public particlesEnabled: boolean = false public id: string = 'tsparticles' public particlesOptions: any = { diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 1b2066f..83b3dbc 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -21,7 +21,11 @@ const routes: Routes = [ { path: 'workshops', component: PortfolioComponent }, { path: 'detail', component: DetailComponent, children: [ - { path: '**', component: DetailComponent } + { path: '**', component: DetailComponent, + children: [ + { path: '**', component: DetailComponent } + ] + } ] } diff --git a/src/app/detail/detail.component.html b/src/app/detail/detail.component.html index 408cb39..f5aa256 100644 --- a/src/app/detail/detail.component.html +++ b/src/app/detail/detail.component.html @@ -3,7 +3,19 @@

{{details.title}}

-
- Tags: {{details.tags}} +
+ Tags: {{details.tags}} + + Exhibitions: + {{exhibition.title}} + + + Works: + {{work.title}} +
diff --git a/src/app/detail/detail.component.scss b/src/app/detail/detail.component.scss index 6900e99..aeeb2d8 100644 --- a/src/app/detail/detail.component.scss +++ b/src/app/detail/detail.component.scss @@ -22,13 +22,23 @@ .text { font-size: $font-18; text-align: justify; + padding-bottom: 40px; } - .tags { + .tags, + .links { display: block; font-size: $font-12; text-transform: uppercase; - padding-top: 40px; + padding: 5px 0; + + .link { + display: inline-block; + font-size: $font-12; + text-transform: uppercase; + padding: 0 5px; + cursor: pointer; + } } .back { diff --git a/src/app/detail/detail.component.ts b/src/app/detail/detail.component.ts index 760367f..9b5cf81 100644 --- a/src/app/detail/detail.component.ts +++ b/src/app/detail/detail.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core' -import { Router, NavigationEnd } from '@angular/router' +import { Router, NavigationEnd, NavigationStart, ActivatedRoute } from '@angular/router' import { Location } from '@angular/common' import { ApisService } from '../services/apis.service' @@ -11,19 +11,24 @@ import { ApisService } from '../services/apis.service' export class DetailComponent implements OnInit { public details: any = {} + private history: string[] = [] constructor( private apisService: ApisService, private router: Router, - private location: Location - ){ } + private location: Location, + private activeRoute: ActivatedRoute + ) { } ngOnInit(): void { - this.showDetails(this.router.url.split('/')[2]) + this.showDetails(this.router.url.split('/')[2], this.router.url.split('/')[3]) } - showDetails(id): void { - this.apisService.getDetails(id).toPromise().then((response) => { + showDetails(section, id): void { + this.apisService.getDetails(section, id).toPromise().then((response) => { + if(this.history[this.history.length - 1] != `/detail/${section}/${id}`) { + this.history.push(`/detail/${section}/${id}`) + } this.details = response.item },(error) => { console.error('getPortfolio ERROR', error) @@ -32,7 +37,14 @@ export class DetailComponent implements OnInit { }) } - back() { - this.location.back() + back(): void { + this.history.pop() + if(this.history.length > 0) { + const last = this.history[this.history.length - 1] + this.showDetails(last.split('/')[2], last.split('/')[3]) + this.location.back() + } else { + this.location.back() + } } } diff --git a/src/app/portfolio/portfolio.component.ts b/src/app/portfolio/portfolio.component.ts index ecdf1e1..6bf8d0f 100644 --- a/src/app/portfolio/portfolio.component.ts +++ b/src/app/portfolio/portfolio.component.ts @@ -27,7 +27,8 @@ export class PortfolioComponent implements OnInit { } showDetails(id): void { - this.router.navigate([`/detail/${id}`]) + const section = this.router.url.split('/')[1] == 'exhibitions' ? 'exhibitions' : 'works' + this.router.navigate([`/detail/${section}/${id}`]) } } diff --git a/src/app/services/apis.service.ts b/src/app/services/apis.service.ts index 3df86b3..ce4e16d 100644 --- a/src/app/services/apis.service.ts +++ b/src/app/services/apis.service.ts @@ -23,8 +23,8 @@ export class ApisService extends BaseService { ) } - getDetails(id): Observable { - let urlApi = `${this.restApi}?query=single&id=${id}` + getDetails(section, id): Observable { + let urlApi = `${this.restApi}?query=detail&type=${section}&id=${id}` return this.http.get(urlApi).pipe( catchError(this.handleError) ) diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 2128c6d..4e9ecb9 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -1,5 +1,5 @@ export const environment = { production: false, - API_URL: `http://localhost/dslak_website/apis/` + API_URL: `http://dslakng.local/apis/` }