From f383320958d82fe2546b629f3784c33a2d69698e Mon Sep 17 00:00:00 2001 From: Joachim Nielandt Date: Fri, 23 Mar 2018 17:28:04 +0100 Subject: [PATCH] Finished posts layout. --- src/app/app.component.html | 2 +- src/app/app.component.ts | 12 +++++++++ src/app/app.module.ts | 4 ++- src/app/components/post/post.component.html | 4 ++- src/app/components/post/post.component.ts | 5 ++-- .../post/posttag/posttag.component.html | 5 ++++ .../post/posttag/posttag.component.scss | 0 .../post/posttag/posttag.component.spec.ts | 25 +++++++++++++++++++ .../post/posttag/posttag.component.ts | 19 ++++++++++++++ src/app/model/post.ts | 3 ++- src/app/services/dataloader.service.ts | 5 ++-- src/assets/post/cupboard1/info.json | 2 +- src/assets/post/first/info.json | 2 +- src/assets/post/lxdarch/info.json | 2 +- src/assets/post/test/info.json | 5 ++-- src/assets/posts.json | 2 +- 16 files changed, 83 insertions(+), 14 deletions(-) create mode 100644 src/app/components/post/posttag/posttag.component.html create mode 100644 src/app/components/post/posttag/posttag.component.scss create mode 100644 src/app/components/post/posttag/posttag.component.spec.ts create mode 100644 src/app/components/post/posttag/posttag.component.ts diff --git a/src/app/app.component.html b/src/app/app.component.html index 5d1ec6b..7e86984 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -29,7 +29,7 @@
- Posts + {{getPageType()}}
diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 8987db2..03980a0 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit, AfterViewChecked } from "@angular/core"; +import {Router} from '@angular/router'; declare var $: any; @Component({ @@ -9,6 +10,17 @@ declare var $: any; export class AppComponent implements OnInit { title = 'Joachim Homepage'; + constructor(private router:Router) {} + ngOnInit() { } + + getPageType() { + switch (this.router.url) { + case '/posts': return 'Posts'; + case '/cv': return 'Curriculum Vitae'; + case '/home': return 'Home'; + default: return 'Unknown path'; + } + } } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 1f2df84..69e2268 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -13,6 +13,7 @@ import { PosttypepipePipe } from './pipes/posttypepipe.pipe'; import { TooltipModule } from 'ngx-bootstrap/tooltip'; import {SimpledatePipe} from './pipes/simpledate.pipe'; +import { PosttagComponent } from './components/post/posttag/posttag.component'; @NgModule({ declarations: [ @@ -22,7 +23,8 @@ import {SimpledatePipe} from './pipes/simpledate.pipe'; PostComponent, CvComponent, PosttypepipePipe, - SimpledatePipe + SimpledatePipe, + PosttagComponent ], imports: [ BrowserModule, diff --git a/src/app/components/post/post.component.html b/src/app/components/post/post.component.html index 9e75bb5..37f4933 100644 --- a/src/app/components/post/post.component.html +++ b/src/app/components/post/post.component.html @@ -7,7 +7,9 @@ {{post.title}}
- {{post.type}}(T)(P) +
+ +
diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index aa858b1..29b6c81 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -19,10 +19,11 @@ export class PostComponent implements OnInit { // console.log('post component has inited: '+this.post.id); // console.log(this.post); - console.log('PostComponent is loading: '+this.post.id); + //console.log('PostComponent is loading: '+this.post.id); + //console.log(this.post); this.dataloaderService.getPost(this.post.id).subscribe(content => { - console.log('PostComponent got content for '+this.post.id); + //console.log('PostComponent got content for '+this.post.id); //this is not the cause of the memory leak:\ this.htmlContainer.nativeElement.innerHTML = content; }); diff --git a/src/app/components/post/posttag/posttag.component.html b/src/app/components/post/posttag/posttag.component.html new file mode 100644 index 0000000..5d6fb7c --- /dev/null +++ b/src/app/components/post/posttag/posttag.component.html @@ -0,0 +1,5 @@ +
+ + + +
diff --git a/src/app/components/post/posttag/posttag.component.scss b/src/app/components/post/posttag/posttag.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/components/post/posttag/posttag.component.spec.ts b/src/app/components/post/posttag/posttag.component.spec.ts new file mode 100644 index 0000000..f52fad4 --- /dev/null +++ b/src/app/components/post/posttag/posttag.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PosttagComponent } from './posttag.component'; + +describe('PosttagComponent', () => { + let component: PosttagComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ PosttagComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(PosttagComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/post/posttag/posttag.component.ts b/src/app/components/post/posttag/posttag.component.ts new file mode 100644 index 0000000..e88e2b8 --- /dev/null +++ b/src/app/components/post/posttag/posttag.component.ts @@ -0,0 +1,19 @@ +import {Component, Input, OnInit} from '@angular/core'; +import {Post} from '../../../model/post'; + +@Component({ + selector: 'app-posttag', + templateUrl: './posttag.component.html', + styleUrls: ['./posttag.component.scss'] +}) +export class PosttagComponent implements OnInit { + + @Input() tag: string; + + constructor() { + } + + ngOnInit() { + } + +} diff --git a/src/app/model/post.ts b/src/app/model/post.ts index 0b5cbe0..b0be284 100644 --- a/src/app/model/post.ts +++ b/src/app/model/post.ts @@ -1,9 +1,10 @@ -export class Post { +export class Post { type: string; title: any; id:String; created_timestamp: Date; + tags: string[]; constructor(id:String) { this.id = id; diff --git a/src/app/services/dataloader.service.ts b/src/app/services/dataloader.service.ts index 219099c..f6b9f83 100644 --- a/src/app/services/dataloader.service.ts +++ b/src/app/services/dataloader.service.ts @@ -19,11 +19,12 @@ export class DataloaderService { for (const index in posts) { console.log('DataLoader.getPosts() index '+index); const post: any = posts[index]; - // console.log('got this key: '+post); - // console.log(post); + console.log('got this key: '+post); + console.log(post); const temp: Post = new Post(post.id); temp.title = post.info.title; temp.type = post.type; + temp.tags = post.info.tags; console.log('got this timestamp: ' + post.info.created_timestamp); temp.created_timestamp = new Date(post.info.created_timestamp * 1000); console.log('converted it to this: ' + temp.created_timestamp); diff --git a/src/assets/post/cupboard1/info.json b/src/assets/post/cupboard1/info.json index 5c425f1..7fb187c 100644 --- a/src/assets/post/cupboard1/info.json +++ b/src/assets/post/cupboard1/info.json @@ -1 +1 @@ -{"created_timestamp": 1515094644.215065, "title": "cupboard"} \ No newline at end of file +{"created_timestamp": 1515094644.215065, "title": "cupboard", "tags":["project"]} diff --git a/src/assets/post/first/info.json b/src/assets/post/first/info.json index b088614..431a308 100644 --- a/src/assets/post/first/info.json +++ b/src/assets/post/first/info.json @@ -1 +1 @@ -{"created_timestamp": 1515094679.342938, "title": "Who said Web 1.0 was dead anyway?"} \ No newline at end of file +{"created_timestamp": 1515094679.342938, "title": "Who said Web 1.0 was dead anyway?", "tags":["blog"]} diff --git a/src/assets/post/lxdarch/info.json b/src/assets/post/lxdarch/info.json index a5645d2..e01ecb7 100644 --- a/src/assets/post/lxdarch/info.json +++ b/src/assets/post/lxdarch/info.json @@ -1 +1 @@ -{"created_timestamp": 1515094644.215333, "title": "some things about lxc in arch"} \ No newline at end of file +{"created_timestamp": 1515094644.215333, "title": "some things about lxc in arch", "tags":["tech"]} diff --git a/src/assets/post/test/info.json b/src/assets/post/test/info.json index 673a936..2c83320 100644 --- a/src/assets/post/test/info.json +++ b/src/assets/post/test/info.json @@ -1,4 +1,5 @@ { "created_timestamp": 1515095948.838848, - "title": "Test title" -} \ No newline at end of file + "title": "Test title", + "tags":["tech", "blog"] +} diff --git a/src/assets/posts.json b/src/assets/posts.json index 3205ea1..091bb40 100644 --- a/src/assets/posts.json +++ b/src/assets/posts.json @@ -1 +1 @@ -[{"info": {"created_timestamp": 1515094679.342938, "title": "Who said Web 1.0 was dead anyway?"}, "id": "first"}, {"info": {"created_timestamp": 1515094644.215065, "title": "cupboard"}, "id": "cupboard1"}, {"info": {"created_timestamp": 1515095948.838848, "title": "Test title"}, "id": "test"}, {"info": {"created_timestamp": 1515094644.215333, "title": "some things about lxc in arch"}, "id": "lxdarch"}] \ No newline at end of file +[{"info": {"created_timestamp": 1515094679.342938, "tags": ["blog"], "title": "Who said Web 1.0 was dead anyway?"}, "id": "first"}, {"info": {"created_timestamp": 1515094644.215065, "tags": ["project"], "title": "cupboard"}, "id": "cupboard1"}, {"info": {"created_timestamp": 1515095948.838848, "tags": ["tech", "blog"], "title": "Test title"}, "id": "test"}, {"info": {"created_timestamp": 1515094644.215333, "tags": ["tech"], "title": "some things about lxc in arch"}, "id": "lxdarch"}] \ No newline at end of file