wbaumbach/cardWorkoutApp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

initial commit ;)

Browse Source
This commit is contained in:
Will Baumbach
2020-04-21 20:51:21 -04:00
parent ec9f05e7e1
commit 917d369990
71 changed files with 382 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,20 +1 @@
<!--The content below is only a placeholder and can be replaced.-->
<div style="text-align:center">
<h1>
Welcome to {{ title }}!
</h1>
<img width="300" alt="Angular Logo" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==">
</div>
<h2>Here are some links to help you start: </h2>
<ul>
<li>
<h2><a target="_blank" rel="noopener" href="https://angular.io/tutorial">Tour of Heroes</a></h2>
</li>
<li>
<h2><a target="_blank" rel="noopener" href="https://angular.io/cli">CLI Documentation</a></h2>
</li>
<li>
<h2><a target="_blank" rel="noopener" href="https://blog.angular.io/">Angular blog</a></h2>
</li>
</ul>
<main></main>

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

@@ -1,16 +1,25 @@
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {ReactiveFormsModule, FormsModule} from '@angular/forms'
import { AppComponent } from './app.component';
import { MainComponent } from './components/main/main.component';
import { CardComponent } from './components/card/card.component';
@NgModule({
declarations: [
AppComponent
AppComponent,
MainComponent,
CardComponent,
],
imports: [
BrowserModule
BrowserModule,
ReactiveFormsModule,
FormsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
export class AppModule {
}

3
src/app/components/card/card.component.css Normal file
View File

@@ -0,0 +1,3 @@
.margins {
margin: 12px;
}

2
src/app/components/card/card.component.html Normal file
View File

@@ -0,0 +1,2 @@
<!-- <img class="margins" *ngIf="!flipped" (click)="flipCard()" src="../../../assets/back.png" width="161" height="225"> -->
<img class="margins" src="../../../assets/{{fileString}}.png" width="161" height="225">

25
src/app/components/card/card.component.spec.ts Normal file
View File

@@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { CardComponent } from './card.component';
describe('CardComponent', () => {
let component: CardComponent;
let fixture: ComponentFixture<CardComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ CardComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(CardComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

33
src/app/components/card/card.component.ts Normal file
View File

@@ -0,0 +1,33 @@
import { Component, OnInit, Input, Output, SimpleChanges, ChangeDetectorRef } from '@angular/core';
import { EventEmitter } from '@angular/core';
@Component({
selector: 'card',
templateUrl: './card.component.html',
styleUrls: ['./card.component.css']
})
export class CardComponent implements OnInit {
@Input() public number;
@Input() public suit;
public fileString: string;
@Output() cardEmitter: EventEmitter<any> = new EventEmitter();
constructor(private changeDetector: ChangeDetectorRef) { }
ngOnInit() {
console.log(this.number);
if (this.number < 10) {
this.fileString = this.suit + '0' + this.number;
} if (this.number >= 10) {
this.fileString = this.suit + this.number;
}
}
ngOnChanges(changes: SimpleChanges): void {
//Called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.
//Add '${implements OnChanges}' to the class.
this.ngOnInit();
this.changeDetector.detectChanges();
}
}

26
src/app/components/main/exercises.json Normal file
View File

@@ -0,0 +1,26 @@
{
"c": [
"Pull Up",
"Table/Desk Inverted Row",
"Rear Delt Fly (Dumbbell or Milk Jug",
"Upright Row (Backpack or Milk Jug)"
],
"d": [
"Bicep Curl",
"Skullcrushers (on a table) or Close Grip Pus-Ups",
"Bicycle Crunch or Reverse Crunch",
"Standing Calf Raise"
],
"h": [
"Walking Lunge (Dumbbell or backpack to load)",
"Bulgarian Split Squat",
"Single Leg Hip Thrust",
"Nordic Ham Curl"
],
"s": [
"Push-Up or Incline Push-Up",
"Pike Push-Up or Vertical Push-Up",
"Standing Press (Milk jug or dumbbells)",
"Milk Jug Lateral Raise or Doorway Lateral Raise (for time)"
]
}

16
src/app/components/main/main.component.css Normal file
View File

@@ -0,0 +1,16 @@
.container {
margin-top: 2em;
}
.alert {
text-align: center;
}
.center {
display: flex;
justify-content: center;
}
.sticky-card {
max-height: 50%;
width: 100%;
}

63
src/app/components/main/main.component.html Normal file
View File

@@ -0,0 +1,63 @@
<div class="container">
<div class="row">
<div class="col">
<div class="card">
<div class="card-header">
Card Workout!
</div>
<div class="card-body">
<div class="form-group">
<label for="numCards">Number of cards</label>
<input type="number" class="form-control" id="numCards" [(ngModel)]="numCards">
</div>
<button href="#" class="btn btn-primary" (click)="createCards()">Submit</button>
<button style="margin-left: 1em" href="#" class="btn btn-danger" (click)="resetCards()">Reset</button>
</div>
</div>
</div>
</div>
</div>
<div *ngIf="workoutDeck && showCards" class="container">
<div class="row">
<!-- Previous card -->
<div class="col">
<div class="alert alert-danger" role="alert">
Previous Card
</div>
</div>
<!-- Current card -->
<div class="col">
<div class="alert alert-success" role="alert">
Current Card
</div>
</div>
<!-- Exercise info -->
<div class="col">
<div class="alert alert-success" role="alert">
Current Exercise
</div>
</div>
</div>
<div class="row">
<!-- Previous card -->
<div class="col center">
<card *ngIf="previousCardNumber > -1" class="" [number]="workoutDeck[previousCardNumber].value" [suit]="workoutDeck[previousCardNumber].suit"
(cardEmitter)="displayExercise($event)" (click)="decrementCardCounter()"></card>
</div>
<!-- Current card -->
<div class="col center">
<card *ngIf="currentCardNumber < workoutDeck.length" class="" [number]="workoutDeck[currentCardNumber].value"
[suit]="workoutDeck[currentCardNumber].suit" (click)="incrementCardCounter()"></card>
</div>
<!-- Exercise info -->
<div class="col center">
<div *ngIf="exercise && reps" class="card sticky-card">
<div class="card-body">
<h5 class="card-title">{{exercise}}</h5>
<p class="card-text">{{reps}} reps</p>
</div>
</div>
</div>
</div>
</div>

25
src/app/components/main/main.component.spec.ts Normal file
View File

@@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MainComponent } from './main.component';
describe('MainComponent', () => {
let component: MainComponent;
let fixture: ComponentFixture<MainComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ MainComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(MainComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

130
src/app/components/main/main.component.ts Normal file
View File

@@ -0,0 +1,130 @@
import { Component, OnInit, ChangeDetectorRef } from '@angular/core';
@Component({
selector: 'main',
templateUrl: './main.component.html',
styleUrls: ['./main.component.css']
})
export class MainComponent implements OnInit {
public deck;
public numCards: number = 20;
public showCards: boolean;
public workoutDeck: any;
public previousCardNumber: number = -1;
public currentCardNumber: number = 0;
public defaultCardNumber: number = 20;
public suits = ['s', 'd', 'c', 'h'];
public values = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13'];
public reps: number;
public rest: boolean;
public exercise: any;
public exercisesJson = require('./exercises.json');
public cCounter: number = 0;
public dCounter: number = 0;
public hCounter: number = 0;
public sCounter: number = 0;
constructor(private changeDetector: ChangeDetectorRef) { }
public ngOnInit() {
this.deck = this.createDeck();
this.shuffleDeck(this.deck);
}
public createCards(): void {
this.showCards = true;
this.workoutDeck = this.deck.slice(0,this.numCards);
this.displayExercise();
}
public resetCards(): void {
this.showCards = false;
this.deck = undefined;
this.deck = this.createDeck();
this.shuffleDeck(this.deck);
this.workoutDeck = this.deck.slice(0,this.numCards);
this.showCards = true;
this.reps = undefined;
this.rest = false;
this.exercise = undefined;
this.currentCardNumber = 0;
this.previousCardNumber = -1;
}
public createDeck() {
let deck = new Array();
let card;
for(let i=0; i < this.suits.length; i++) {
for(let n=0; n < this.values.length; n++) {
card = {value: this.values[n], suit: this.suits[i]};
deck.push(card);
}
}
return deck;
}
public shuffleDeck(deck) {
let location1;
let location2;
let temp;
for(let i = 0; i < 2000; i++) {
location1 = Math.floor((Math.random() * deck.length));
location2 = Math.floor((Math.random() * deck.length));
temp = deck[location1];
deck[location1] = deck[location2];
deck[location2] = temp;
}
}
public displayExercise() {
const currentCard = this.workoutDeck[this.currentCardNumber]
console.log(currentCard);
if (currentCard.value !== 1) {
this.rest = undefined
this.reps = Number(currentCard.value)+10;
if (currentCard.suit === 'c') {
this.exercise = this.exercisesJson.c[this.cCounter];
this.cCounter += 1;
} else if (currentCard.suit === 'd') {
this.exercise = this.exercisesJson.d[this.dCounter];
this.dCounter += 1;
} else if (currentCard.suit === 'h') {
this.exercise = this.exercisesJson.h[this.hCounter];
this.hCounter += 1;
} else if (currentCard.suit === 's') {
this.exercise = this.exercisesJson.s[this.sCounter];
this.sCounter += 1;
}
if (this.cCounter > 3) {
this.cCounter = 0;
} else if (this.dCounter > 3) {
this.dCounter = 0;
} else if (this.hCounter > 3) {
this.hCounter = 0;
} else if (this.sCounter > 3) {
this.sCounter = 0;
}
} else {
this.exercise = undefined;
this.reps = undefined;
this.rest = true;
}
}
public incrementCardCounter() {
this.displayExercise();
this.currentCardNumber += 1;
this.previousCardNumber += 1;
}
public decrementCardCounter() {
this.displayExercise()
this.currentCardNumber -= 1;
this.previousCardNumber -= 1;
}
}