diff --git a/libs/common-docs/src/components/blog-preview/blog-portfolio-item.component.ts b/libs/common-docs/src/components/blog-preview/blog-portfolio-item.component.ts index 00a4f662f..4bdae7002 100644 --- a/libs/common-docs/src/components/blog-preview/blog-portfolio-item.component.ts +++ b/libs/common-docs/src/components/blog-preview/blog-portfolio-item.component.ts @@ -9,7 +9,10 @@ import { IPortfolio } from "../../models/portfolio.interface"; template:`
- +

{{article ? article.title : project?.name}}

diff --git a/libs/common-docs/src/services/getArticles.service.ts b/libs/common-docs/src/services/getArticles.service.ts index 32631245a..964ccede1 100644 --- a/libs/common-docs/src/services/getArticles.service.ts +++ b/libs/common-docs/src/services/getArticles.service.ts @@ -1,68 +1,68 @@ import { Injectable, Inject } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import { Observable } from 'rxjs'; -import { ARTICLES_LIST, ARTICLES_REFACTORED_TITLE_LIST } from "../tokens/articlesList.token"; -import { IArticle } from "../models/article.interface"; +import { ARTICLES_LIST, ARTICLES_REFACTORED_TITLE_LIST } from '../tokens/articlesList.token'; +import { IArticle } from '../models/article.interface'; import { titleRefactoring } from '../utils/titleRefactoringUtil'; -@Injectable({providedIn: 'platform'}) +@Injectable({ providedIn: 'platform' }) export class GetArticlesService { - private apiArray?: Observable[]; - private articlesList?: string[]; - private articlesRefactoredTitlesList?: string[]; - private refactoredArticleList?: string[]; + private apiArray?: Observable[]; + private articlesList?: string[]; + private articlesRefactoredTitlesList?: string[]; + private refactoredArticleList?: string[]; - constructor( - private http: HttpClient, - @Inject(ARTICLES_LIST) articlesList: string[], - @Inject(ARTICLES_REFACTORED_TITLE_LIST) articlesRefactoredTitlesList: string[] - ){ - this.articlesList = articlesList; - this.articlesRefactoredTitlesList = articlesRefactoredTitlesList; - this.apiArray = this.articlesRefactoredTitlesList.map((art) => { - return this.getArticleRequest(art); - }); - } + constructor( + private http: HttpClient, + @Inject(ARTICLES_LIST) articlesList: string[], + @Inject(ARTICLES_REFACTORED_TITLE_LIST) articlesRefactoredTitlesList: string[] + ) { + this.articlesList = articlesList; + this.articlesRefactoredTitlesList = articlesRefactoredTitlesList; + this.apiArray = this.articlesRefactoredTitlesList.map((art) => { + return this.getArticleRequest(art); + }); + } - getArticleRequest(art: string):Observable { - return this.http.get(`assets/articles/${art}/${art}.json`) as Observable; - } + getArticleRequest(art: string): Observable { + return this.http.get(`https://valor-software.com/assets/articles/${art}/${art}.json`) as Observable; + } - getPreviewArticle(): Observable[] | undefined { - return this.apiArray; - } + getPreviewArticle(): Observable[] | undefined { + return this.apiArray; + } - getFullListOfArticles(): Observable[] | undefined { - return this.apiArray; - } + getFullListOfArticles(): Observable[] | undefined { + return this.apiArray; + } - getArticlesByNames(value: string[]): Observable[] | undefined { - if (!this.articlesList?.length) { - return; - } + getArticlesByNames(value: string[]): Observable[] | undefined { + if (!this.articlesList?.length) { + return; + } - const articlesList = [...this.articlesList]; - if (articlesList?.length) { - return value.map(art => this.getArticleRequest(art)); - } - return; - } + const articlesList = [...this.articlesList]; + if (articlesList?.length) { + return value.map(art => this.getArticleRequest(art)); + } + return; + } - getRefactoredArticlesList(): string[] | undefined { - return this.refactoredArticleList; - } + getRefactoredArticlesList(): string[] | undefined { + return this.refactoredArticleList; + } - getRefactoredTitle(title: string): string { - return titleRefactoring(title); - } + getRefactoredTitle(title: string): string { + return titleRefactoring(title); + } - // eslint-disable-next-line @typescript-eslint/ban-ts-comment - // @ts-ignore - getHTMLSource(link?: string): Observable | undefined { - if (!link) { - return; - } + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + getHTMLSource(link?: string): Observable | undefined { + if (!link) { + return; + } - return this.http.get(`assets/articles/${link}/${link}.html`, {responseType:'text'}); - } + return this.http.get(`https://valor-software.com/assets/articles/${link}/${link}.html`, { responseType: 'text' }); + } } \ No newline at end of file diff --git a/libs/common-docs/src/services/getPortfolio.service.ts b/libs/common-docs/src/services/getPortfolio.service.ts index e5d5e7ea4..233342bf3 100644 --- a/libs/common-docs/src/services/getPortfolio.service.ts +++ b/libs/common-docs/src/services/getPortfolio.service.ts @@ -1,64 +1,64 @@ import { Inject, Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import { Observable } from 'rxjs'; -import { IPortfolio } from "../models/portfolio.interface"; -import { PORTFOLIO_LIST } from "../tokens/portfolioList.token"; -import {titleRefactoring, checkHTMLExtension} from "../utils/titleRefactoringUtil"; +import { IPortfolio } from '../models/portfolio.interface'; +import { PORTFOLIO_LIST } from '../tokens/portfolioList.token'; +import { titleRefactoring, checkHTMLExtension } from '../utils/titleRefactoringUtil'; -@Injectable({providedIn: 'platform'}) +@Injectable({ providedIn: 'platform' }) export class GetPortfolioService { - private apiArray?: Observable[]; - private portfolioList?: string[]; - private refactoredList?: string[]; + private apiArray?: Observable[]; + private portfolioList?: string[]; + private refactoredList?: string[]; - constructor( - private http: HttpClient, - @Inject(PORTFOLIO_LIST) portfolioList: string[] - ){ - this.portfolioList = portfolioList; - if (!this.refactoredList?.length) { - this.refactoredList = this.portfolioList.map(item => titleRefactoring(item)).reverse(); - } + constructor( + private http: HttpClient, + @Inject(PORTFOLIO_LIST) portfolioList: string[] + ) { + this.portfolioList = portfolioList; + if (!this.refactoredList?.length) { + this.refactoredList = this.portfolioList.map(item => titleRefactoring(item)).reverse(); + } - this.apiArray = this.refactoredList.map(art => { - return this.getPortfolioRequest(art); - }).reverse(); - } + this.apiArray = this.refactoredList.map(art => { + return this.getPortfolioRequest(art); + }).reverse(); + } - getPortfolioRequest(art: string):Observable { - return this.http.get(`assets/portfolio/clients/${art}.json`); - } + getPortfolioRequest(art: string): Observable { + return this.http.get(`https://valor-software.com/assets/portfolio/clients/${art}.json`); + } - getFullListOfPortfolio(): Observable[] | undefined { - return this.apiArray; - } + getFullListOfPortfolio(): Observable[] | undefined { + return this.apiArray; + } - getProjectList(): string[] | undefined { - return this.portfolioList; - } + getProjectList(): string[] | undefined { + return this.portfolioList; + } - getRefactoredList(): string[] | undefined { - return this.refactoredList; - } + getRefactoredList(): string[] | undefined { + return this.refactoredList; + } - getTitleIndex(title: string): number | undefined { - if (!this.refactoredList?.length) { - return; - } + getTitleIndex(title: string): number | undefined { + if (!this.refactoredList?.length) { + return; + } - const refactoredList = [...this.refactoredList].reverse(); - let index = refactoredList.findIndex(item => item === title || item === checkHTMLExtension(title)); + const refactoredList = [...this.refactoredList].reverse(); + let index = refactoredList.findIndex(item => item === title || item === checkHTMLExtension(title)); - if (index || index === 0) { - index = index + 1; - return index; - } + if (index || index === 0) { + index = index + 1; + return index; + } - return; - } + return; + } - getRefactoredTitle(title: string): string { - return titleRefactoring(title); - } + getRefactoredTitle(title: string): string { + return titleRefactoring(title); + } } \ No newline at end of file diff --git a/libs/route-pages/blog-portfolio/src/article.component.html b/libs/route-pages/blog-portfolio/src/article.component.html index 6a64c6315..4ddff11da 100644 --- a/libs/route-pages/blog-portfolio/src/article.component.html +++ b/libs/route-pages/blog-portfolio/src/article.component.html @@ -22,16 +22,22 @@
- +
- +
- +
diff --git a/libs/route-pages/blog-portfolio/src/blog-portfolio.module.ts b/libs/route-pages/blog-portfolio/src/blog-portfolio.module.ts index 61d6a434d..ba569cb38 100644 --- a/libs/route-pages/blog-portfolio/src/blog-portfolio.module.ts +++ b/libs/route-pages/blog-portfolio/src/blog-portfolio.module.ts @@ -2,7 +2,7 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { RouterModule } from "@angular/router"; import { routes } from './routes'; -import { GeneralPageComponent } from "./genral-page.component"; +import { GeneralPageComponent } from "./general-page.component"; import { CommonDocsModule } from "@valor-software/common-docs"; import { BlogComponent } from "./blog.component"; import { ProjectsBlockComponent } from "./projects-block.component"; diff --git a/libs/route-pages/blog-portfolio/src/general-page.component.html b/libs/route-pages/blog-portfolio/src/general-page.component.html index b6b2476c2..887c3e756 100644 --- a/libs/route-pages/blog-portfolio/src/general-page.component.html +++ b/libs/route-pages/blog-portfolio/src/general-page.component.html @@ -1,127 +1,142 @@
- -
-
-
-

- {{activeProject?.name | customSlice: 40}} - {{activeArticle?.title | customSlice: 40}} -

-

- {{activeProject?.description | customSlice: 300}} - {{activeArticle?.seoDescription | customSlice: 300}} -

- - - - - - -
- -
-

- {{!isBlogPage() ? 'Recent projects' : 'Latest Articles'}} -

- + +
+
+
+

+ {{activeProject?.name | customSlice: 40}} + {{activeArticle?.title | customSlice: 40}} +

+

+ {{activeProject?.description | customSlice: 300}} + {{activeArticle?.seoDescription | customSlice: 300}} +

+ + + + + + +
+ +
+

+ {{!isBlogPage() ? 'Recent projects' : 'Latest Articles'}} +

+ -
- - - - - - - - - - - - - - - - - - - - -
-
- +
+ + + + + + + + + + + + + + + + + + + + +
+
+
-

{{isBlogPage() ? 'Articles' : 'Projects'}}

-
- -
-
- -
+

{{isBlogPage() ? 'Articles' : 'Projects'}}

+
+ +
+
+ +
diff --git a/libs/route-pages/blog-portfolio/src/general-page.component.ts b/libs/route-pages/blog-portfolio/src/general-page.component.ts new file mode 100644 index 000000000..8c8e9011b --- /dev/null +++ b/libs/route-pages/blog-portfolio/src/general-page.component.ts @@ -0,0 +1,118 @@ +import { Component, OnDestroy, Type } from '@angular/core'; +import { NavigationEnd, Router } from '@angular/router'; +import { filter } from 'rxjs/operators'; +import { forkJoin, Subscription } from 'rxjs'; +import { + GetArticlesService, + IArticle, + GetPortfolioService, + IPortfolio, + titleRefactoring +} from '@valor-software/common-docs'; +import SwiperCore, { Pagination, SwiperOptions } from 'swiper'; + +SwiperCore.use([Pagination]); + +const generalPaths = { + BLOG: 'articles', + PORTFOLIO: 'projects' +}; + +@Component({ + // eslint-disable-next-line @angular-eslint/component-selector + selector: 'general-page', + templateUrl: './general-page.component.html' +}) +export class GeneralPageComponent implements OnDestroy { + routeUrl = ''; + $generalSubscription = new Subscription(); + articles?: IArticle[]; + firstArticles?: IArticle[]; + firstProjects?: IPortfolio[]; + projects?: IPortfolio[]; + activeArticle?: IArticle; + activeProject?: IPortfolio; + + swiperConfig: SwiperOptions = { + slidesPerView: 1, + spaceBetween: 40, + centeredSlides: true, + initialSlide: 0, + pagination: { + clickable: true + } + }; + + constructor( + private readonly router: Router, + private readonly getArticlesServ: GetArticlesService, + private readonly getPortfolio: GetPortfolioService, + ) { + this.$generalSubscription.add( + this.router.events.pipe( + filter(event => event instanceof NavigationEnd) + ).subscribe(event => { + this.routeUrl = this.router.parseUrl(this.router.url).root.children['primary']?.segments[0].path; + + this.isBlogPage() + ? this._initObserveFullListOfArticles() + : this._initObserveFullListOfPortfolio(); + })); + } + + isBlogPage() { + return this.routeUrl === generalPaths.BLOG; + } + + getFirstProjects(value: Type[]): Type[] { + return value.slice(0, 4); + } + + getRouteLink(link: string): any { + return titleRefactoring(link); + } + + filterFirstItems() { + if (this.activeArticle) { + this.firstArticles = this.firstArticles?.filter(item => item !== this.activeArticle); + } + + if (this.activeProject) { + this.firstProjects = this.firstProjects?.filter(item => item !== this.activeProject); + } + } + + ngOnDestroy() { + this.$generalSubscription.unsubscribe(); + } + + private _initObserveFullListOfPortfolio() { + this.$generalSubscription.add( + forkJoin( + this.getPortfolio.getFullListOfPortfolio() + ).subscribe((res?: IPortfolio[]) => { + if (res) { + this.projects = Object.assign(res); + this.firstProjects = this.getFirstProjects(res); + this.activeProject = this.firstProjects[0]; + this.filterFirstItems(); + } + }) + ); + } + + private _initObserveFullListOfArticles() { + this.$generalSubscription.add( + forkJoin( + this.getArticlesServ.getFullListOfArticles() + ).subscribe((res?: IArticle[]) => { + if (res) { + this.articles = res; + this.firstArticles = this.getFirstProjects(res); + this.activeArticle = this.firstArticles[0]; + this.filterFirstItems(); + } + }) + ); + } +} \ No newline at end of file diff --git a/libs/route-pages/blog-portfolio/src/genral-page.component.ts b/libs/route-pages/blog-portfolio/src/genral-page.component.ts deleted file mode 100644 index e8a399602..000000000 --- a/libs/route-pages/blog-portfolio/src/genral-page.component.ts +++ /dev/null @@ -1,108 +0,0 @@ -import { Component, OnDestroy, Type } from '@angular/core'; -import { NavigationEnd, Router } from "@angular/router"; -import { filter } from "rxjs/operators"; -import { forkJoin, Subscription } from "rxjs"; -import { - GetArticlesService, - IArticle, - GetPortfolioService, - IPortfolio, - titleRefactoring -} from "@valor-software/common-docs"; -import SwiperCore, { Pagination, SwiperOptions } from "swiper"; - -SwiperCore.use([Pagination]); - -const generalPaths = { - BLOG: 'articles', - PORTFOLIO: 'projects' -}; - -@Component({ - // eslint-disable-next-line @angular-eslint/component-selector - selector: 'general-page', - templateUrl: './general-page.component.html' -}) -export class GeneralPageComponent implements OnDestroy{ - routeUrl?: string; - $generalSubscription?: Subscription; - articles?: IArticle[]; - firstArticles?: IArticle[]; - firstProjects?: IPortfolio[]; - projects?: IPortfolio[]; - activeArticle?: IArticle; - activeProject?: IPortfolio; - - swiperConfig: SwiperOptions = { - slidesPerView: 1, - spaceBetween: 40, - centeredSlides: true, - initialSlide: 0, - pagination: { - clickable: true - } - }; - - constructor( - private router: Router, - private getArticlesServ: GetArticlesService, - private getPortfolio: GetPortfolioService, - ) { - this.router.events - .pipe( - filter(event => event instanceof NavigationEnd) - ) - .subscribe(event => { - this.routeUrl = this.router.parseUrl(this.router.url).root.children["primary"]?.segments[0].path; - if (this.isBlogPage()) { - this.$generalSubscription = forkJoin(this.getArticlesServ.getFullListOfArticles()).subscribe((res: IArticle[] | undefined) => { - if (res) { - this.articles = res; - this.firstArticles = this.getFirstProjects(res); - this.activeArticle = this.firstArticles[0]; - this.filterFirstItems(); - } - }); - return; - } - - this.$generalSubscription = forkJoin(this.getPortfolio.getFullListOfPortfolio()).subscribe((res: IPortfolio[] | undefined) => { - if (res) { - this.projects = Object.assign(res); - this.firstProjects = this.getFirstProjects(res); - this.activeProject = this.firstProjects[0]; - this.filterFirstItems(); - } - }); - }); - } - - isBlogPage() { - return this.routeUrl === generalPaths.BLOG; - } - - getFirstProjects (value: Type[]): Type[] { - return value.slice(0,4); - } - - getRouteLink(link: string): any { - return titleRefactoring(link); - } - - filterFirstItems() { - if (this.activeArticle){ - this.firstArticles = this.firstArticles?.filter(item => item !== this.activeArticle); - } - - if (this.activeProject) { - this.firstProjects = this.firstProjects?.filter(item => item !== this.activeProject); - } - } - - ngOnDestroy() { - if (this.$generalSubscription) { - this.$generalSubscription.unsubscribe(); - } - } - -} \ No newline at end of file diff --git a/libs/route-pages/blog-portfolio/src/routes.ts b/libs/route-pages/blog-portfolio/src/routes.ts index b7318ef6b..30c74a5c7 100644 --- a/libs/route-pages/blog-portfolio/src/routes.ts +++ b/libs/route-pages/blog-portfolio/src/routes.ts @@ -1,4 +1,4 @@ -import { GeneralPageComponent } from "./genral-page.component"; +import { GeneralPageComponent } from "./general-page.component"; import { GeneralItemComponent } from "./general-item.component"; import { Routes } from "@angular/router";