ztimson/zakscode
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

Updated

Browse Source
This commit is contained in:
Zakary Timson
2022-05-02 21:10:15 -04:00
parent 200574099b
commit 8e818b179b
60 changed files with 617 additions and 879 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
src/app/admin/admin.component.html
View File

@@ -1,58 +0,0 @@
<div class="w-100">
<div class="container d-flex align-items-center" style="height: 300px">
<div class="w-100 text-center">
<typewriter text="Admin Panel" [delay]="500"></typewriter>
</div>
</div>
<div class="container mb-md-5 p-0 bg-white">
<div class="p-4">
<h3>Users</h3>
<table class="table mt-3">
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th class="text-center">Admin</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let user of adminService.users | async">
<td>{{user.firstName}}</td>
<td>{{user.lastName}}</td>
<td>{{user.email}}</td>
<td class="text-center">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="adminCheck" [checked]="user.admin"
disabled>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="p-4">
<h3>Quotes</h3>
<table class="table mt-3">
<thead>
<tr>
<th>Quote</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let quote of store.quotes | async">
<td>{{quote.text}}</td>
</tr>
<tr>
<td>
<a routerLink="">+ Add Quote</a>
</td>
</tr>
</tbody>
</table>
</div>
<footer class="p-1 bg-dark text-center" style="color: grey">
© 2019 ZaksCode
</footer>
</div>
</div>

11
src/app/admin/admin.component.ts
View File

@@ -1,11 +0,0 @@
import {Component} from '@angular/core';
import {AdminService} from './admin.service';
import {AppStore} from '../app.store';
@Component({
selector: 'admin',
templateUrl: 'admin.component.html'
})
export class AdminComponent {
constructor(public adminService: AdminService, public store: AppStore) {}
}

15
src/app/admin/admin.service.ts
View File

@@ -1,15 +0,0 @@
import {Observable} from 'rxjs';
import {DbUser} from '../models/dbUser';
import {AngularFirestore} from '@angular/fire/firestore';
import {Injectable} from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class AdminService {
users: Observable<DbUser[]>;
constructor(private firestore: AngularFirestore) {
this.users = this.firestore.collection<DbUser>('users').valueChanges();
}
}

10
src/app/app.component.html
View File

@@ -1,10 +0,0 @@
<div style="position: absolute; top: 1em; right: 1em">
<div *ngIf="loggedIn">
<a routerLink="/admin" class="mr-3">Admin Panel</a>
<a routerLink="" (click)="authService.logout()">Logout</a>
</div>
<div *ngIf="!loggedIn">
<a routerLink="" (click)="authService.googleLogin()">Login</a>
</div>
</div>
<router-outlet></router-outlet>

20
src/app/app.component.ts
View File

@@ -1,20 +0,0 @@
import {Component} from '@angular/core';
import {AuthService} from './auth.service';
import {ActivatedRoute} from '@angular/router';
@Component({
selector: 'app-root',
templateUrl: 'app.component.html'
})
export class AppComponent {
loggedIn = false;
set title(title: string) {
document.getElementsByTagName('title')[0].innerHTML = `Zaks Code${title ? ` - ${title}` : ''}`;
}
constructor(private route: ActivatedRoute, public authService: AuthService) {
this.route.url.subscribe(() => this.title = ''); // Clear the title on nav event
this.authService.user.subscribe(user => this.loggedIn = !!user);
}
}

17
src/app/app.module.ts
View File

@@ -1,24 +1,17 @@
import {BrowserModule} from '@angular/platform-browser';
import {NgModule} from '@angular/core';
import {AngularFireModule} from '@angular/fire';
import {AngularFirestoreModule, FirestoreSettingsToken} from '@angular/fire/firestore';
import {HomeComponent} from './home/home.component';
import {HomeComponent} from './views/home/home.component';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {MaterialModule} from './material.module';
import {FormsModule} from '@angular/forms';
import {TypewriterComponent} from './components/typewriter/typewriter.component';
import {SlideShowComponent} from './components/slideShow/slideShow.component';
import {environment} from '../environments/environment';
import {AppComponent} from './app.component';
import {AppComponent} from './views/app/app.component';
import {AppRouting} from './app.routing';
import {AdminComponent} from './admin/admin.component';
import {AngularFireAuthModule} from '@angular/fire/auth';
import {ConsoleComponent} from './components/console/console.component';
@NgModule({
declarations: [
AdminComponent,
AppComponent,
ConsoleComponent,
HomeComponent,
@@ -26,18 +19,12 @@ import {ConsoleComponent} from './components/console/console.component';
TypewriterComponent
],
imports: [
AngularFireAuthModule,
AngularFireModule.initializeApp(environment.firebase),
AngularFirestoreModule,
AppRouting,
BrowserModule,
BrowserAnimationsModule,
FormsModule,
MaterialModule,
],
providers: [
{ provide: FirestoreSettingsToken, useValue: {} }
],
bootstrap: [AppComponent]
})
export class AppModule { }

5
src/app/app.routing.ts
View File

@@ -1,14 +1,11 @@
import {NgModule} from '@angular/core';
import {RouterModule} from '@angular/router';
import {HomeComponent} from './home/home.component';
import {AdminComponent} from './admin/admin.component';
import {AuthService} from './auth.service';
import {HomeComponent} from './views/home/home.component';
@NgModule({
imports: [
RouterModule.forRoot([
{path: '', component: HomeComponent},
{path: 'admin', component: AdminComponent, canActivate: [AuthService]},
{path: '**', redirectTo: ''}
])
],

25
src/app/app.store.ts
View File

@@ -1,25 +0,0 @@
import {Injectable} from '@angular/core';
import {BehaviorSubject, Observable} from 'rxjs';
import {AngularFirestore} from '@angular/fire/firestore';
import {Quote} from './models/quote';
import {DbUser} from './models/dbUser';
@Injectable({
providedIn: 'root'
})
export class AppStore {
quotes: Observable<Quote[]>;
constructor(private firestore: AngularFirestore) {
this.quotes = this.firestore.collection<Quote>('quotes').valueChanges();
}
addQuote(text: string) {
return this.firestore.collection<Quote>('quotes').add({text: text});
}
async getUser(uid: string) {
let user = await this.firestore.collection<DbUser>('users').doc(uid).get().toPromise();
return user.data();
}
}

41
src/app/auth.service.ts
View File

@@ -1,41 +0,0 @@
import {Injectable} from '@angular/core';
import {AngularFireAuth} from '@angular/fire/auth';
import {CanActivate, Router} from '@angular/router';
import {BehaviorSubject, Observable} from 'rxjs';
import { auth } from 'firebase';
import {map} from 'rxjs/operators';
import {User} from './models/user';
import {AppStore} from './app.store';
import {tap} from 'rxjs/internal/operators/tap';
import {filter} from 'rxjs/internal/operators/filter';
@Injectable({
providedIn: 'root'
})
export class AuthService implements CanActivate {
user = new BehaviorSubject<User>(null);
constructor(private store: AppStore, private afAuth: AngularFireAuth, private router: Router) {
this.afAuth.user.subscribe(async user => {
this.user.next(user ? <User>Object.assign(await this.store.getUser(user.uid), user): null);
});
}
canActivate(): Observable<boolean> {
return this.user.pipe(
filter(user => !!user),
map(user => !user.isAnonymous),
tap(user => user ? null : this.googleLogin())
);
}
googleLogin() {
return this.afAuth.auth.signInWithPopup(new auth.GoogleAuthProvider());
}
async logout() {
await this.afAuth.auth.signOut();
this.router.navigate(['/']);
}
}

12
src/app/components/console/console.component.html
View File

@@ -1,8 +1,10 @@
<div clas="p-1" style="background-color: #353535; color: #fff;">
<div class="pl-2 pt-2" style="height: 10rem;">
<h4 *ngFor="let o of output">{{o}}</h4>
<div class="p-3 d-flex flex-column justify-content-end console overflow-hidden" [style.height]="height">
<div>
<h4 class="m-0" *ngFor="let o of output">{{o}}</h4>
</div>
<div class="pl-2 pb-2">
<h4 class="d-inline mr-2" style="color: #22ff22">></h4><typewriter [text]="input" (done)="enter()"></typewriter>
<div class="mt-2">
<h4 class="m-0">
{{prompt}} <typewriter class="pl-2" [text]="input" (done)="done()"></typewriter>
</h4>
</div>
</div>

49
src/app/components/console/console.component.ts
View File

@@ -1,32 +1,35 @@
import {Component} from '@angular/core';
import {AppStore} from '../../app.store';
import {map} from 'rxjs/operators';
import {Component, Input, ViewChild} from '@angular/core';
import { take } from 'rxjs';
import {TypewriterComponent} from '../typewriter/typewriter.component';
export type ConsoleConfig = {
input: string,
output: () => string
}
@Component({
selector: 'console',
templateUrl: './console.component.html'
templateUrl: './console.component.html',
styleUrls: ['./console.component.scss']
})
export class ConsoleComponent {
private done = false;
input = '';
output: string[] = [];
prompt = '>'
input = './motd.sh';
output = [];
quote;
done = () => {};
constructor(private store: AppStore) {
store.quotes.subscribe(quotes => {
const quote = quotes[Math.floor(Math.random() * quotes.length)];
this.quote = quote.text;
});
}
@Input() height: string = 'auto';
enter() {
if(this.done) return;
setTimeout(() => {
this.output.push(this.input);
this.input = '';
setTimeout(() => this.output.push(this.quote), 500);
}, 1500);
this.done = true;
}
@ViewChild(TypewriterComponent) typewriter!: TypewriterComponent;
exec(input: string, output: () => string) {
this.done = () => {
this.output.push(`${this.prompt} ${input}`);
console.log(output());
this.output.push(output());
this.input = '';
};
this.input = input;
}
}

9
src/app/components/slideShow/slideShow.component.ts
View File

@@ -1,10 +1,15 @@
import {Component, Input} from '@angular/core';
import {Slide} from '../../models/slide';
export type Slide = {
title: string;
description: string;
image: string;
}
@Component({
selector: 'slideshow',
templateUrl: 'slideShow.component.html'
})
export class SlideShowComponent {
@Input() slides: Slide[];
@Input() slides: Slide[] = [];
}

27
src/app/components/typewriter/typewriter.component.ts
View File

@@ -1,27 +1,30 @@
import {Component, EventEmitter, Input, Output} from '@angular/core';
import {Observable, timer} from 'rxjs';
import {Observable, of, timer} from 'rxjs';
import {filter, map, tap} from 'rxjs/operators';
@Component({
selector: 'typewriter',
template: `
<div class="d-inline typewriter"><h4 class="d-inline">{{output | async}}</h4></div>`,
template: `<span class="typewriter">{{output | async}}</span>`,
styleUrls: ['typewriter.component.scss']
})
export class TypewriterComponent {
output?: Observable<string>;
@Input() delay = 1500;
@Input() speed = 100;
@Input() set text(text: string) {
this.output = timer(this.delay, this.speed).pipe(
filter(n => n <= (text.length || 0)),
tap(n => {
if(n == text.length) this.done.emit();
}),
map(n => text.slice(0, n))
);
if(!text) {
this.output = of('');
} else {
this.output = timer(this.delay, this.speed).pipe(
filter(n => n <= (text.length || 0)),
tap(n => {
if(n == text.length) this.done.emit();
}),
map(n => text.slice(0, n))
);
}
}
@Output() done = new EventEmitter<void>();
output: Observable<string>;
}

67
src/app/home/home.component.html
View File

@@ -1,67 +0,0 @@
<div class="w-100">
<div class="w-100" style="height: calc(100vh - 140px)"></div>
<div class="container p-0 bg-white">
<div class="px-4" style="background-color: #732222">
<mat-card style="max-width: 600px; transform: translateY(-33%)">
<mat-card-content class="d-flex p-3">
<div class="d-none d-md-block pr-3">
<img src="assets/img/portrait.jpg" width="150px" height="150px" style="border-radius: 50%" alt="Zakary Timson">
</div>
<div>
<h1 class="mb-0">Zakary Timson</h1>
<h5 class="text-muted">FULL STACK SOFTWARE ENGINEER</h5>
<div class="mt-3">
<div><i class="mr-2 fa fa-map-marker-alt"></i> London Ontario, Canada</div>
<div><i class="mr-2 fa fa-envelope"></i> <a href="mailto:zaktimson@gmail.com">zaktimson@gmail.com</a>
</div>
<div><i class="mr-2 fab fa-github"></i> <a href="https://github.com/ztimson" target="_blank">github.com/ztimson</a></div>
</div>
</div>
</mat-card-content>
</mat-card>
</div>
<div class="p-4">
<console></console>
</div>
<div class="p-4">
<h3>About Me</h3>
<div class="d-flex align-items-center">
<div class="flex-grow-1">
<p>
Zak was born with a keyboard in hand and was learning his first programming language by thirteen. Nearly
entirely self taught, Zak challenged his programming courses through both highschool and college while
working in the industry to gain professional experience. He is very passionate about technology and as a
lifelong learner it has opened the door to many other hobbies like robotics, space and physics. Some of his
personal projects include a full sized arcade machine, home automation and a power wall for a home solar
system.
</p>
</div>
<div class="flex-shrink-1 p-3">
<img src="assets/img/keyboard-in-hand.jpg" height="150px" width="auto" style="border-radius: 50%">
</div>
</div>
</div>
<!-- <div class="p-4 text-white" style="background-color: #1c7fc1">
<h3>Projects</h3>
<div style="height: 400px">
<slideshow></slideshow>
</div>
</div> -->
<div class="p-4">
<h3>Resume & References</h3>
<a class="btn btn-outline-primary" href="https://docs.google.com/document/d/1xP6HASPerXKMJM_x6-PhHVvoYgq-Hym5IRO7g47EX8o/edit?usp=sharing" target="_blank">Resume</a>
<div class="ml-3 btn-group" role="group" aria-label="Basic example">
<a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyNWw0UDFzT0ZTeVU/view?usp=sharing" target="_blank">Manager</a>
<a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyaFBhcXBEaGp6YWc/view?usp=sharing" target="_blank">Contractor</a>
<a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyM0YtTWcxQzk0dEE/view?usp=sharing" target="_blank">Teacher</a>
<a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyX2owd0xURjh3RlE/view?usp=sharing" target="_blank">Principle</a>
<a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyMHdaM1BjZ1MwbWxva2lOY290NElwanN4b2JV/view?usp=sharing" target="_blank">CD Project Red</a>
</div>
</div>
<footer class="p-1 bg-dark text-center" style="color: grey">
Copyright © Zakary Timson 2019 | All Rights Reserved
</footer>
<div class="skirt"></div>
</div>
</div>

7
src/app/home/home.component.ts
View File

@@ -1,7 +0,0 @@
import { Component } from '@angular/core';
@Component({
selector: 'home',
templateUrl: './home.component.html'
})
export class HomeComponent { }

2
src/app/material.module.ts
View File

@@ -1,5 +1,5 @@
import {NgModule} from '@angular/core';
import {MatCardModule} from '@angular/material';
import {MatCardModule} from '@angular/material/card';
const MODULES = [
MatCardModule

6
src/app/models/dbUser.ts
View File

@@ -1,6 +0,0 @@
export interface DbUser {
admin: boolean;
email: string;
firstName: string;
lastName: string;
}

3
src/app/models/quote.ts
View File

@@ -1,3 +0,0 @@
export interface Quote {
text: string;
}

7
src/app/models/slide.ts
View File

@@ -1,7 +0,0 @@
import {SafeUrl} from '@angular/platform-browser';
export interface Slide {
title: string
description: string
image: string | SafeUrl
}

4
src/app/models/user.ts
View File

@@ -1,4 +0,0 @@
import {User as FirebaseUser} from 'firebase';
import {DbUser} from './dbUser';
export interface User extends FirebaseUser, DbUser { }

1
src/app/views/app/app.component.html Normal file
View File

@@ -0,0 +1 @@
<router-outlet></router-outlet>

17
src/app/views/app/app.component.ts Normal file
View File

@@ -0,0 +1,17 @@
import {Component} from '@angular/core';
import {Title} from '@angular/platform-browser';
import {ActivatedRoute} from '@angular/router';
@Component({
selector: 'app-root',
templateUrl: 'app.component.html'
})
export class AppComponent {
constructor(private route: ActivatedRoute, private title: Title) {
this.route.url.subscribe(() => this.setTitle(''));
}
setTitle(title: string) {
this.title.setTitle(`Zak's Code${title ? ` - ${title}` : ''}`);
}
}

69
src/app/views/home/home.component.html Normal file
View File

@@ -0,0 +1,69 @@
<div class="w-100">
<div class="w-100" style="height: calc(100vh - 140px)"></div>
<div class="container p-0 bg-white">
<div class="px-3" style="background-color: #732222">
<mat-card style="max-width: 600px; transform: translateY(-33%)">
<mat-card-content class="d-flex p-3">
<div class="d-none d-md-block pr-3">
<img src="assets/img/portrait.jpg" width="150px" height="150px" style="border-radius: 50%" alt="Zakary Timson">
</div>
<div>
<h1 class="mb-0">Zakary Timson</h1>
<h5 class="text-muted">DEVOPS & SOFTWARE ENGINEER</h5>
<div class="mt-3">
<div><i class="mr-2 fa fa-map-marker-alt"></i> London Ontario, Canada</div>
<div><i class="mr-2 fa fa-envelope"></i> <a href="mailto:zaktimson@gmail.com">zaktimson@gmail.com</a>
</div>
<div><i class="mr-2 fab fa-github"></i> <a href="https://github.com/ztimson" target="_blank">github.com/ztimson</a></div>
</div>
</div>
</mat-card-content>
</mat-card>
</div>
<div class="p-3">
<console height="12rem"></console>
</div>
<!-- <div class="p-3">-->
<!-- <h3>Projects</h3>-->
<!-- <iframe class="border-0" src="https://gitlab.zakscode.com/explore" width="100%" height="75vh">-->
<!-- </iframe>-->
<!-- </div>-->
<div class="p-3">
<h3>About Me</h3>
<div>
<img alt="Childhood" class="float-right m-3 m-md-0 ml-md-3" src="assets/img/keyboard-in-hand.jpg" height="150px" width="auto" style="border-radius: 50%">
<p>
Zak was born with a keyboard in hand and was learning his first programming language by thirteen. Nearly
entirely self taught, Zak challenged his programming courses through both high-school and college while
working in the industry to gain professional experience. He is very passionate about technology and as a
lifelong learner it has opened the door to many other hobbies like robotics, space and physics. Some of his
personal projects include a full sized arcade machine, home automation and a power wall for a home solar
system.
</p>
</div>
</div>
<div class="p-3 overflow-hidden">
<h3>Resume & References</h3>
<a class="mb-3 btn btn-outline-primary" href="https://docs.google.com/document/d/1xP6HASPerXKMJM_x6-PhHVvoYgq-Hym5IRO7g47EX8o/edit?usp=sharing" target="_blank">Resume</a>
<ul class="d-md-none list-group">
<a class="list-group-item list-group-item-action border-info text-info" href="https://docs.google.com/document/d/1xP6HASPerXKMJM_x6-PhHVvoYgq-Hym5IRO7g47EX8o/edit?usp=sharing" target="_blank">Resume</a>
<a class="list-group-item list-group-item-action border-info text-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyNWw0UDFzT0ZTeVU/view?usp=sharing" target="_blank">Manager</a>
<a class="list-group-item list-group-item-action border-info text-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyaFBhcXBEaGp6YWc/view?usp=sharing" target="_blank">Contractor</a>
<a class="list-group-item list-group-item-action border-info text-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyM0YtTWcxQzk0dEE/view?usp=sharing" target="_blank">Teacher</a>
<a class="list-group-item list-group-item-action border-info text-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyX2owd0xURjh3RlE/view?usp=sharing" target="_blank">Principle</a>
<a class="list-group-item list-group-item-action border-info text-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyMHdaM1BjZ1MwbWxva2lOY290NElwanN4b2JV/view?usp=sharing" target="_blank">CD Projekt Red</a>
</ul>
<div class="d-none d-md-block btn-group" role="group" aria-label="Basic example">
<a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyNWw0UDFzT0ZTeVU/view?usp=sharing" target="_blank">Manager</a>
<a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyaFBhcXBEaGp6YWc/view?usp=sharing" target="_blank">Contractor</a>
<a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyM0YtTWcxQzk0dEE/view?usp=sharing" target="_blank">Teacher</a>
<a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyX2owd0xURjh3RlE/view?usp=sharing" target="_blank">Principle</a>
<a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyMHdaM1BjZ1MwbWxva2lOY290NElwanN4b2JV/view?usp=sharing" target="_blank">CD Projekt Red</a>
</div>
</div>
<footer class="p-1 bg-dark text-center" style="color: grey">
Copyright © Zakary Timson 2019 | All Rights Reserved
</footer>
<div class="d-none d-sm-block skirt"></div>
</div>
</div>

15
src/app/views/home/home.component.ts Normal file
View File

@@ -0,0 +1,15 @@
import {Component, ViewChild} from '@angular/core';
import {ConsoleComponent, ConsoleConfig} from '../../components/console/console.component';
import {QuoteService} from '../../services/quote.service';
@Component({
selector: 'home',
templateUrl: './home.component.html'
})
export class HomeComponent {
@ViewChild(ConsoleComponent) console!: ConsoleComponent;
constructor(private quotes: QuoteService) {
setTimeout(() => this.console.exec('bash ./random-thought.sh', () => quotes.random()), 3000);
}
}

11
src/browserslist
View File

@@ -1,11 +0,0 @@
# This file is currently used by autoprefixer to adjust CSS to support the below specified browsers
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries
#
# For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed
> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11

10
src/environments/environment.prod.ts
View File

@@ -1,11 +1,3 @@
export const environment = {
production: true,
firebase: {
apiKey: "AIzaSyC1vKmDDzRR85DnOowPZvAkZEyzJ1EmjGI",
authDomain: "zaks-code.firebaseapp.com",
databaseURL: "https://zaks-code.firebaseio.com",
projectId: "zaks-code",
storageBucket: "zaks-code.appspot.com",
messagingSenderId: "430075133237"
}
production: true
};

23
src/environments/environment.ts
View File

@@ -1,11 +1,16 @@
// This file can be replaced during build by using the `fileReplacements` array.
// `ng build` replaces `environment.ts` with `environment.prod.ts`.
// The list of file replacements can be found in `angular.json`.
export const environment = {
production: false,
firebase: {
apiKey: 'AIzaSyC1vKmDDzRR85DnOowPZvAkZEyzJ1EmjGI',
authDomain: 'zaks-code.firebaseapp.com',
databaseURL: 'https://zaks-code.firebaseio.com',
projectId: 'zaks-code',
storageBucket: 'zaks-code.appspot.com',
messagingSenderId: '430075133237'
}
production: false
};
/*
* For easier debugging in development mode, you can import the following file
* to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
*
* This import should be commented out in production mode because it will have a negative impact
* on performance if an error is thrown.
*/
// import 'zone.js/plugins/zone-error'; // Included with Angular CLI.

35
src/index.html
View File

@@ -1,25 +1,28 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Zaks Code</title>
<base href="/">
<meta charset="utf-8">
<title>Zaks Code</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name=”robots” content=”index,nofollow” />
<meta property=”og:type” content=”website” />
<meta property=”og:title” content=”Zakary Timson” />
<meta property=”og:description” content=”Cloud Architecture & Software Engineering” />
<meta property=”og:image” content=”https://zakscode.com/assets/img/ZaksCode.png” />
<meta property=”og:url” content=”https://zakscode.com” />
<meta property=”og:site_name” content=”ZaksCode” />
<meta name=”twitter:title” content=”Zakary Timson” />
<meta name=”twitter:description” content=”Cloud Architecture & Software Engineering” />
<meta name=”twitter:image” content=”https://zakscode.com/assets/img/ZaksCode.png” />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name=”robots” content=”index,nofollow” />
<meta property=”og:type” content=”website” />
<meta property=”og:title” content=”Zakary Timson” />
<meta property=”og:description” content=”Cloud Architecture & Software Engineering” />
<meta property=”og:image” content=”https://zakscode.com/assets/img/ZaksCode.png” />
<meta property=”og:url” content=”https://zakscode.com” />
<meta property=”og:site_name” content=”ZaksCode” />
<meta name=”twitter:title” content=”Zakary Timson” />
<meta name=”twitter:description” content=”Cloud Architecture & Software Engineering” />
<meta name=”twitter:image” content=”https://zakscode.com/assets/img/ZaksCode.png” />
<link rel="icon" type="image/png" href="assets/img/logo.png">
<link rel="icon" type="image/png" href="assets/img/logo.png">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body>
<app-root></app-root>
<app-root></app-root>
</body>
</html>

32
src/karma.conf.js
View File

@@ -1,32 +0,0 @@
// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('@angular-devkit/build-angular/plugins/karma')
],
client: {
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: require('path').join(__dirname, '../coverage/ZaksCode'),
reports: ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
restartOnFileChange: true
});
};

1
src/main.ts
View File

@@ -1,4 +1,3 @@
import 'hammerjs';
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

20
src/polyfills.ts
View File

@@ -8,8 +8,8 @@
* file.
*
* The current setup is for so-called "evergreen" browsers; the last versions of browsers that
* automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
* Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
* automatically update themselves. This includes recent versions of Safari, Chrome (including
* Opera), Edge on the desktop, and iOS and Chrome on mobile.
*
* Learn more in https://angular.io/guide/browser-support
*/
@@ -18,16 +18,6 @@
* BROWSER POLYFILLS
*/
/** IE10 and IE11 requires the following for NgClass support on SVG elements */
// import 'classlist.js'; // Run `npm install --save classlist.js`.
/**
* Web Animations `@angular/platform-browser/animations`
* Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
* Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
*/
// import 'web-animations-js'; // Run `npm install --save web-animations-js`.
/**
* By default, zone.js will patch all possible macroTask and DomEvents
* user can disable parts of macroTask/DomEvents patch by setting following flags
@@ -35,7 +25,7 @@
* will put import in the top of bundle, so user need to create a separate file
* in this directory (for example: zone-flags.ts), and put the following flags
* into that file, and then add the following code before importing zone.js.
* import './zone-flags.ts';
* import './zone-flags';
*
* The flags allowed in zone-flags.ts are listed here.
*
@@ -43,7 +33,7 @@
*
* (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
* (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
* (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
* (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
*
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
* with the following flag, it will bypass `zone.js` patch for IE/Edge
@@ -55,7 +45,7 @@
/***************************************************************************************************
* Zone JS is required by default for Angular itself.
*/
import 'zone.js/dist/zone'; // Included with Angular CLI.
import 'zone.js'; // Included with Angular CLI.
/***************************************************************************************************

54
src/styles.scss
View File

@@ -1,3 +1,38 @@
// Custom Theming for Angular Material
// For more information: https://material.angular.io/guide/theming
@use '@angular/material' as mat;
// Plus imports for other components in your app.
// Include the common styles for Angular Material. We include this here so that you only
// have to load a single css file for Angular Material in your app.
// Be sure that you only ever include this mixin once!
@include mat.core();
// Define the palettes for your theme using the Material Design palettes available in palette.scss
// (imported above). For each palette, you can optionally specify a default, lighter, and darker
// hue. Available color palettes: https://material.io/design/color/
$zakscode-primary: mat.define-palette(mat.$indigo-palette);
$zakscode-accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);
// The warn palette is optional (defaults to red).
$zakscode-warn: mat.define-palette(mat.$red-palette);
// Create the theme object. A theme consists of configurations for individual
// theming systems such as "color" or "typography".
$zakscode-theme: mat.define-light-theme((
color: (
primary: $zakscode-primary,
accent: $zakscode-accent,
warn: $zakscode-warn,
)
));
// Include theme styles for core and each component used in your app.
// Alternatively, you can import and @include the theme mixins for each component
// that you are using.
@include mat.all-component-themes($zakscode-theme);
@import url("https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css");
@import url("https://use.fontawesome.com/releases/v5.8.1/css/all.css");
@import url("https://fonts.googleapis.com/icon?family=Material+Icons|Roboto:300,400,500");
@@ -18,17 +53,20 @@
}
html, body {
height: 100%;
height: 100%;
}
body {
margin: 0;
font-family: Roboto, sans-serif;
background: #354B72 url("/assets/img/ZaksCode.gif") no-repeat fixed center;
margin: 0;
font-family: Roboto, sans-serif;
background: #354B72 url("/assets/img/ZaksCode.gif") no-repeat fixed center;
}
.skirt {
height: 3rem;
width: 100%;
background-color: #354B72;
}
height: 3rem;
width: 100%;
background-color: #354B72;
}
html, body { height: 100%; }
body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }

12
src/test.ts
View File

@@ -1,19 +1,25 @@
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
import 'zone.js/dist/zone-testing';
import 'zone.js/testing';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
platformBrowserDynamicTesting
} from '@angular/platform-browser-dynamic/testing';
declare const require: any;
declare const require: {
context(path: string, deep?: boolean, filter?: RegExp): {
<T>(id: string): T;
keys(): string[];
};
};
// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(
BrowserDynamicTestingModule,
platformBrowserDynamicTesting()
platformBrowserDynamicTesting(),
);
// Then we find all the tests.
const context = require.context('./', true, /\.spec\.ts$/);
// And load the modules.

11
src/tsconfig.app.json
View File

@@ -1,11 +0,0 @@
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]
}

18
src/tsconfig.spec.json
View File

@@ -1,18 +0,0 @@
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/spec",
"types": [
"jasmine",
"node"
]
},
"files": [
"test.ts",
"polyfills.ts"
],
"include": [
"**/*.spec.ts",
"**/*.d.ts"
]
}

17
src/tslint.json
View File

@@ -1,17 +0,0 @@
{
"extends": "../tslint.json",
"rules": {
"directive-selector": [
true,
"attribute",
"app",
"camelCase"
],
"component-selector": [
true,
"element",
"app",
"kebab-case"
]
}
}