Skip to content
Snippets Groups Projects
Commit b722802a authored by Jérémie BRISON's avatar Jérémie BRISON
Browse files

feat(post) : add author + tag

parent e64b31e5
No related branches found
No related tags found
3 merge requests!103Recette,!102Dev,!87Feat/posts list
Hide whitespace changes
Inline Side-by-side
Showing
with 162 additions and 23 deletions
src/app/post/components/post-card/post-card.component.html
+ 18
− 7
View file @ b722802a
<div fxLayout="column" *ngIf="post" class="post" [ngClass]="class" fxLayoutGap="12px">
<div fxLayout="row" class="imageContainer" *ngIf="post.feature_image">
<img class="image" [src]="post.feature_image" />
</div>
<div fxLayout="row" class="title">
{{ post.title }}
<div fxLayout="column" fxLayoutGap="4px">
<div fxLayout="row" class="tag" fxLayoutAlign=" center" fxLayoutGap="12px" *ngIf="getIconOfTag(post.tags[0].slug)">
<app-svg-icon
[iconClass]="'icon-32'"
[iconColor]="'inherit'"
[type]="'post'"
[icon]="getIconOfTag(post.tags[0].slug)"
></app-svg-icon>
<span>{{ post.tags[0].name }}</span>
</div>
<div fxLayout="row" class="imageContainer" *ngIf="post.feature_image">
<img class="image" [src]="post.feature_image" />
</div>
<div fxLayout="row" class="title">
{{ post.title }}
</div>
</div>
<div fxLayout="row" class="description">
{{ post.custom_excerpt }}
{{ post.excerpt }}
</div>
<div fxLayout="column" class="informations">
<div fxLayout="row">
{{ post.published_at | date: 'shortDate' }}
</div>
<div fxLayout="row">par {{ post.primary_author.name }}</div>
<div fxLayout="row">par {{ post.author }}</div>
</div>
</div>
src/app/post/components/post-card/post-card.component.scss
+ 14
− 0
View file @ b722802a
......@@ -21,6 +21,13 @@
width: 195px;
}
}
.tag {
@include cn-bold-16;
text-transform: uppercase;
color: $secondary-color;
fill: $secondary-color;
stroke: $secondary-color;
}
.title {
@include cn-bold-20;
color: $grey-1;
......@@ -40,3 +47,10 @@
font-style: italic;
}
}
.project {
text-align: left;
.imageContainer,
.informations {
display: none !important;
}
}
src/app/post/components/post-card/post-card.component.ts
+ 29
− 1
View file @ b722802a
import { Component, Input, OnInit } from '@angular/core';
import { TagEnum } from '../../enum/tagEnum.enum';
import { Post } from '../../models/post.model';
@Component({
......@@ -9,7 +10,34 @@ import { Post } from '../../models/post.model';
export class PostCardComponent implements OnInit {
@Input() post: Post;
@Input() class: string;
test: string;
constructor() {}
ngOnInit(): void {}
ngOnInit(): void {
/*ùif (this.post) {
console.log(this.post);
this.test = this.post.html.replace(/<[^>]*>/g, '');
}*/
}
getIconOfTag(tag: string): string {
switch (tag) {
case TagEnum.aLaUne:
return 'a-la-une';
case TagEnum.formation:
return 'formationTag';
case TagEnum.projet:
return 'projetTag';
case TagEnum.ressource:
return 'ressourceTag';
case TagEnum.info:
return 'infoTag';
case TagEnum.etude:
return 'etudeTag';
case TagEnum.dossier:
return 'dossierTag';
default:
return null;
}
}
}
src/app/post/components/post-list/post-list.component.html
+ 6
− 0
View file @ b722802a
......@@ -32,6 +32,12 @@
<div class="project-content" fxLayout="column">
<app-svg-icon [iconClass]="'icon-80'" [iconColor]="'inherit'" [type]="'post'" [icon]="'project'"></app-svg-icon>
<h2>appels à projets</h2>
<app-post-card
[post]="news"
[class]="'project'"
[ngClass]="{ 'last-child': last }"
*ngFor="let news of projectsNew; let last = last"
></app-post-card>
</div>
</div>
</div>
......
src/app/post/components/post-list/post-list.component.scss
+ 3
− 3
View file @ b722802a
......@@ -13,8 +13,8 @@
text-transform: uppercase;
}
}
.test {
div {
.last-child {
::ng-deep .post {
border: 0;
}
}
......@@ -41,7 +41,7 @@
background: $white;
border-radius: 6px;
.project-content {
padding: 18px 32px 62px 36px;
padding: 18px 32px 26px 36px;
fill: $secondary-color;
stroke: $secondary-color;
text-align: center;
......
src/app/post/components/post-list/post-list.component.ts
+ 18
− 5
View file @ b722802a
......@@ -10,15 +10,15 @@ import { PostService } from '../../services/post.service';
})
export class PostListComponent implements OnInit {
constructor(private postService: PostService) {}
news: PostWithMeta;
leftColumnPosts: Post[] = [];
rightColumnPosts: Post[] = [];
projectsNew: Post[] = [];
bigNews: Post;
projectsNews: Post[];
ngOnInit(): void {
this.postService.getPosts().subscribe((news) => {
console.log(news);
news.posts.forEach((val, index) => {
val = this.addAuthorToPost(val);
if (index % 2 == 0) {
this.leftColumnPosts.push(val);
} else {
......@@ -26,11 +26,24 @@ export class PostListComponent implements OnInit {
}
});
});
this.postService.getPosts(['bignew']).subscribe((news) => {
this.bigNews = news.posts[0];
console.log(this.bigNews);
this.postService.getPosts(['a-la-une']).subscribe((news) => {
this.bigNews = this.addAuthorToPost(news.posts[0]);
});
this.postService.getPosts(['appels']).subscribe((news) => {
let projectNews = news.posts;
projectNews.forEach((news) => {
news = this.addAuthorToPost(news);
});
this.projectsNew = projectNews;
});
}
public publishNews(): void {}
//Transform excerpt post to have a custom author.
private addAuthorToPost(post: Post): Post {
post.author = post.excerpt;
post.excerpt = post.html.replace(/<[^>]*>/g, '');
return post;
}
}
src/app/post/enum/tagEnum.enum.ts 0 → 100644
+ 9
− 0
View file @ b722802a
export enum TagEnum {
aLaUne = 'a-la-une',
formation = 'formations',
projet = 'projets',
ressource = 'ressources',
info = 'infos',
etude = 'etudes',
dossier = 'dossiers',
}
src/app/post/models/post.model.ts
+ 6
− 1
View file @ b722802a
import { Tag } from './tag.model';
export class Post {
id: number;
published_at: Date;
title: string;
custom_excerpt: string;
excerpt: string;
feature_image: string;
html: string;
author: string;
tags: Tag[];
}
src/app/post/models/tag.model.ts 0 → 100644
+ 4
− 0
View file @ b722802a
export class Tag {
name: string;
slug: string;
}
src/app/post/services/post.service.ts
+ 1
− 6
View file @ b722802a
......@@ -11,15 +11,10 @@ export class PostService {
private readonly baseUrl = 'api/posts';
constructor(private http: HttpClient) {}
public getAllPostss(): Observable<PostWithMeta> {
return this.http
.get<PostWithMeta>(`${this.baseUrl}?include=tags,authors&filter=tag:-[getting-started,jeremie]`)
.pipe(map((item: PostWithMeta) => new PostWithMeta(item)));
}
public getPosts(tags?: string[]): Observable<PostWithMeta> {
if (!tags) {
return this.http
.get<PostWithMeta>(`${this.baseUrl}?include=tags,authors`)
.get<PostWithMeta>(`${this.baseUrl}?include=tags,authors&filter=tag:-[appels,a-la-une]`)
.pipe(map((item: PostWithMeta) => new PostWithMeta(item)));
}
let tagsString = '';
......
src/assets/post/sprite.svg
+ 54
− 0
View file @ b722802a
......@@ -8,4 +8,58 @@
<path fill-rule="evenodd" clip-rule="evenodd" d="M63.6036 39.4919C64.0749 38.3867 65.353 37.8728 66.4582 38.3441L75.7969 42.3267C76.9021 42.798 77.416 44.076 76.9447 45.1812C76.4734 46.2864 75.1953 46.8003 74.0901 46.329L64.7514 42.3464C63.6462 41.8751 63.1323 40.5971 63.6036 39.4919Z" stroke="none"/>
</symbol>
<symbol id="projetTag" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<mask id="path-1-inside-1" fill="white">
<path fill-rule="evenodd" clip-rule="evenodd" d="M4 7C4 5.34315 5.34315 4 7 4C8.65685 4 10 5.34315 10 7V24C10 25.6569 8.65685 27 7 27C5.34315 27 4 25.6569 4 24V7ZM7 26C8.10457 26 9 25.1046 9 24C9 22.8954 8.10457 22 7 22C5.89543 22 5 22.8954 5 24C5 25.1046 5.89543 26 7 26Z"/>
</mask>
<path d="M7 3C4.79086 3 3 4.79086 3 7H5C5 5.89543 5.89543 5 7 5V3ZM11 7C11 4.79086 9.20914 3 7 3V5C8.10457 5 9 5.89543 9 7H11ZM11 24V7H9V24H11ZM7 28C9.20914 28 11 26.2091 11 24H9C9 25.1046 8.10457 26 7 26V28ZM3 24C3 26.2091 4.79086 28 7 28V26C5.89543 26 5 25.1046 5 24H3ZM3 7V24H5V7H3ZM8 24C8 24.5523 7.55228 25 7 25V27C8.65685 27 10 25.6569 10 24H8ZM7 23C7.55228 23 8 23.4477 8 24H10C10 22.3431 8.65685 21 7 21V23ZM6 24C6 23.4477 6.44771 23 7 23V21C5.34315 21 4 22.3431 4 24H6ZM7 25C6.44772 25 6 24.5523 6 24H4C4 25.6569 5.34315 27 7 27V25Z" stroke="none" mask="url(#path-1-inside-1)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7 27H10L24 7H25.5L11.5 27H14L27.5 8L28 9.5L15.5 27H18L27.5 14L28 15.5L19.5 27H22L27.5 19.5L28 21L23.5 27H28V21V15.5V9.5V6H9.82929C9.93985 6.31278 10 6.64936 10 7V9L11.5 7H13L10 11.0909V14.4412L15.5 7H17L10 16.5789V21.0909L20 7H21.5L10 23.56V24C10 25.6569 8.65685 27 7 27Z" stroke="none"/>
<path d="M7 27H28V6.5H9.95852C9.9858 6.6626 10 6.82964 10 7V7.5H27V26H9.23611C8.68679 26.6137 7.8885 27 7 27Z" stroke="none"/>
<path d="M9 24C9 25.1046 8.10457 26 7 26C5.89543 26 5 25.1046 5 24C5 22.8954 5.89543 22 7 22C8.10457 22 9 22.8954 9 24Z" stroke="none"/>
</symbol>
<symbol id="ressourceTag" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<path d="M3.5 25V13.0495C7.32281 13.9728 11.7651 14.5 16.5 14.5C20.828 14.5 24.9112 14.0595 28.5 13.2789V25C28.5 25.2761 28.2761 25.5 28 25.5H4C3.72386 25.5 3.5 25.2761 3.5 25Z" fill="none"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M20 6H13V8H20V6ZM13 4C11.8954 4 11 4.89543 11 6V9H22V6C22 4.89543 21.1046 4 20 4H13Z" stroke="none"/>
<path d="M28.5 13.2602C27.6168 13.4803 26.8068 13.7326 26.0024 13.9831L25.9955 13.9852C24.3831 14.4874 22.7659 14.9905 20.5 15.2722V15C20.5 14.1716 19.8284 13.5 19 13.5H14C13.1716 13.5 12.5 14.1716 12.5 15V15.2709C9.84798 14.949 7.85358 14.3349 5.87723 13.7256L5.87212 13.724C5.09326 13.4839 4.31292 13.2433 3.5 13.0242V9C3.5 8.72386 3.72386 8.5 4 8.5H28C28.2761 8.5 28.5 8.72386 28.5 9V13.2602Z"/>
<path d="M3 13.4095C3.7817 13.6107 4.59178 13.795 5.42722 13.9611L3 17.4286V13.4095Z" stroke="none"/>
<path d="M29 13.6541V16L22 26L18.5 26L26.8278 14.1031C27.5713 13.9674 28.296 13.8174 29 13.6541Z" stroke="none"/>
<path d="M29 18.1429V23.1429L27 26H23.5L29 18.1429Z" stroke="none"/>
<path d="M28.7003 25.7138C28.788 25.6278 28.8598 25.5259 28.9112 25.4126L28.7003 25.7138Z" stroke="none"/>
<path d="M21.3318 14.8118C22.6365 14.7087 23.9059 14.5647 25.1318 14.3832L17 26H13.5L19.1037 17.9947C19.6073 17.9428 20 17.5173 20 17V16.7143L21.3318 14.8118Z" stroke="none"/>
<path d="M17.6 18L12 26H8.50001L14.1 18H17.6Z" stroke="none"/>
<path d="M13.0602 17.3426L7.00001 26H4C3.84543 26 3.69905 25.9649 3.56839 25.9023L11.35 14.7858C11.8954 14.8318 12.4472 14.8707 13.0047 14.9022C13.0016 14.9344 13 14.967 13 15V17C13 17.1203 13.0213 17.2357 13.0602 17.3426Z" stroke="none"/>
<path d="M6.75572 14.2061C7.78653 14.3818 8.8514 14.5304 9.94511 14.6498L3 24.5714V19.5714L6.75572 14.2061Z" stroke="none"/>
<rect x="13.5" y="14.5" width="6" height="3" rx="0.5" fill="none"/>
</symbol>
<symbol id="infoTag" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<path d="M23 25.5H9.44949C10.0978 24.8647 10.5 23.9793 10.5 23V5.5H25.5V23C25.5 24.3807 24.3807 25.5 23 25.5Z" fill="none"/>
<rect x="12" y="16" width="12" height="1" rx="0.5" stroke="none"/>
<rect x="12" y="19" width="12" height="1" rx="0.5" stroke="none"/>
<rect x="12" y="22" width="12" height="1" rx="0.5" stroke="none"/>
<rect x="12" y="8" width="12" height="6" rx="1" stroke="none"/>
<path d="M11 12V13.5L5.00001 20.5V17.2273L9.60001 12H11Z" stroke="none"/>
<path d="M5.00001 22.5V22.2273L11 15.4091L11 18.5L6 24.5C5.48214 24.0507 5.00001 23.1722 5.00001 22.5Z" stroke="none"/>
<path d="M7.06819 24.8771C7.36151 24.9569 7.67471 25 8.00001 25C9.65686 25 11 23.8807 11 22.5V20.4091L7.06819 24.8771Z" stroke="none"/>
<path d="M8 12H5.00001L5 15.5L8 12Z" stroke="none"/>
<path d="M5.5 12.5H10.5V23C10.5 24.3807 9.38071 25.5 8 25.5C6.61929 25.5 5.5 24.3807 5.5 23V12.5Z" fill="none"/>
</symbol>
<symbol id="formationTag" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M3 28V24.4C3 22.1088 4.1007 20.0762 5.79995 18.7998C4.80938 17.7598 4.2 16.3513 4.2 14.8C4.2 11.5967 6.79675 9 10 9C13.2033 9 15.8 11.5967 15.8 14.8C15.8 16.3513 15.1906 17.7598 14.2001 18.7998C15.8993 20.0762 17 22.1088 17 24.4V28H3ZM13.4307 19.4769C13.1256 19.2639 12.7998 19.0785 12.4568 18.9244C12.7774 18.7331 13.0738 18.5054 13.3403 18.2471C14.2405 17.3746 14.8 16.1527 14.8 14.8C14.8 12.149 12.651 10 10 10C7.34903 10 5.2 12.149 5.2 14.8C5.2 16.1527 5.75951 17.3746 6.65971 18.2471C6.92623 18.5054 7.2226 18.7331 7.54316 18.9244C7.20024 19.0785 6.87441 19.2639 6.56931 19.4769C5.01609 20.5613 4 22.362 4 24.4V27H16V24.4C16 22.362 14.9839 20.5613 13.4307 19.4769Z" stroke="none"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 6H30V22H16.5777C16.3879 21.4799 16.1381 20.9887 15.8369 20.5348L25.6379 7H24.1379L15.0488 19.5516C14.7868 19.2788 14.503 19.0273 14.2001 18.7998C15.1906 17.7598 15.8 16.3513 15.8 14.8C15.8 14.4589 15.7705 14.1246 15.7141 13.7996L20.6379 7H19.1379L15.2607 12.3543C14.8403 11.4515 14.1943 10.675 13.3952 10.0971L15.6379 7H14.1379L12.3353 9.48933C11.6208 9.17468 10.8308 9 10 9C9.70926 9 9.42352 9.02139 9.14426 9.06269L10.6379 7H9.13793L7.14742 9.74881C5.70291 10.5663 4.64387 11.9856 4.3108 13.666L3 15.4762V17.5476L4.28201 15.7772C4.46929 16.8805 4.96816 17.8775 5.68402 18.6744L5.28319 19.228C4.45784 19.9811 3.81311 20.9293 3.4223 22H2V6ZM29 7.19048V9.2619L20.5 21H19L29 7.19048ZM25.5 21H24L29 14.0952V16.1667L25.5 21ZM5.63793 7L3 10.6429V8.57143L4.13793 7H5.63793Z" stroke="none"/>
</symbol>
<symbol id="etudeTag" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<path d="M27.722 26.2329L22.4916 21.0959C24.0154 19.2877 24.9215 16.9452 24.9215 14.4384C24.8803 8.68493 20.2265 4 14.4607 4C8.69498 4 4 8.68493 4 14.4384C4 20.1918 8.69498 24.8767 14.4607 24.8767C16.9318 24.8767 19.2381 24.0137 21.009 22.5753L26.2394 27.7123C26.4453 27.9178 26.6924 28 26.9807 28C27.2278 28 27.5161 27.9178 27.722 27.7123C28.0927 27.3014 28.0927 26.6438 27.722 26.2329ZM6.0592 14.4384C6.0592 9.79452 9.80695 6.05479 14.4607 6.05479C19.1145 6.05479 22.8623 9.79452 22.8623 14.4384C22.8623 19.0822 19.1145 22.8219 14.4607 22.8219C9.80695 22.8219 6.0592 19.0411 6.0592 14.4384Z" stroke="none"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.7457 5.3282C14.0022 5.11446 13.2157 5 12.4015 5C12.2296 5 12.0588 5.00511 11.8895 5.01518L10.4509 6.97689C11.5862 6.37483 12.878 6.02499 14.2521 6.00129L14.7457 5.3282ZM13.0585 7.62894C9.87909 8.24863 7.5 11.0292 7.5 14.3836C7.5 14.6426 7.51448 14.8985 7.5427 15.1504L13.0585 7.62894ZM7.97683 16.8961L14.8566 7.51456C15.8686 7.57953 16.8194 7.85975 17.6638 8.30994L9.59266 19.316C8.89414 18.6378 8.33923 17.8141 7.97683 16.8961ZM6.34942 16.7776C6.12204 16.018 6 15.2141 6 14.3836C6 13.8626 6.04717 13.353 6.13749 12.8588L4.25314 15.4284C4.49144 16.3727 4.89089 17.2551 5.42099 18.0437L6.34942 16.7776ZM6.96335 18.2781C7.41071 19.1257 7.99942 19.8888 8.69862 20.5352L8.49887 20.8076C7.68288 20.3787 6.94656 19.8199 6.31708 19.1594L6.96335 18.2781ZM17.141 6.45253C16.8055 6.22416 16.4523 6.01946 16.084 5.84081L15.874 6.12727C16.3089 6.20341 16.7322 6.31273 17.141 6.45253ZM13.3275 21.1841C12.3621 21.0332 11.464 20.6823 10.6762 20.1762L18.8131 9.08041C19.5054 9.65324 20.0826 10.359 20.5064 11.159C20.5221 11.2167 20.5373 11.2746 20.5518 11.3328L13.3275 21.1841ZM21.157 12.9614C21.2528 13.4201 21.3031 13.8957 21.3031 14.3836C21.3031 17.9947 18.5458 20.9409 15.0011 21.2418L21.157 12.9614ZM9.9145 5.37067C6.48201 6.42403 4 9.60441 4 13.3836L4.00016 13.4357L9.9145 5.37067Z" stroke="none"/>
</symbol>
<symbol id="dossierTag" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 9C2 7.89543 2.89543 7 4 7H8C9.10457 7 10 7.89543 10 9V10H27C27.5523 10 28 10.4477 28 11V13H6.32973C5.84861 13 5.43568 13.3426 5.34691 13.8155L3.28171 24.8155C3.16616 25.431 3.63831 26 4.26454 26H3C2.44772 26 2 25.5523 2 25V9Z" stroke="none"/>
<path d="M5.72708 13.8721C5.78513 13.6528 5.98357 13.5 6.21044 13.5H29.1416C29.4697 13.5 29.7089 13.8107 29.6249 14.1279L26.7136 25.1279C26.6555 25.3472 26.4571 25.5 26.2302 25.5H3.2991C2.97097 25.5 2.73179 25.1893 2.81574 24.8721L5.72708 13.8721Z" fill="none"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M29.2607 17.2341L30.049 14.2559C30.1737 13.7846 29.9418 13.3205 29.5453 13.113L20.8378 26H23.3378L29.2607 17.2341ZM24.8378 26H26.1709C26.6247 26 27.0215 25.6945 27.1376 25.2559L28.2948 20.8837L24.8378 26ZM25.6216 13H28.1216L19.3378 26H16.8378L25.6216 13ZM24.1216 13H21.6216L12.8378 26H15.3378L24.1216 13ZM17.6216 13H20.1216L11.3378 26H8.83784L17.6216 13ZM16.1216 13H13.6216L4.83784 26H7.33784L16.1216 13ZM9.62162 13H12.1216L3.33784 26H3.20521C2.57898 26 2.10683 25.431 2.22239 24.8155L2.44717 23.6182L9.62162 13ZM8.12162 13H5.27041C5.26124 13 5.2521 13.0001 5.24299 13.0004L4.13187 14.6448L3.02434 20.544L8.12162 13Z" stroke="none"/>
</symbol>
</svg>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment