Adds components for design of dashboard, selected currency, donate and buy-sell components

web/src/app/app.component.html

@@ -4,7 +4,7 @@
     <mat-sidenav #sidenav mode="side" class="sidebar" opened="true">
         <mat-nav-list>
             <mat-list-item routerLink="dashboard" routerLinkActive="dashboard-highlight">
-                <mat-icon>trending_up</mat-icon>&nbsp;
+                <mat-icon>view_quilt</mat-icon>&nbsp;
                 <h3>Dashboard</h3>
             </mat-list-item>
             <mat-list-item routerLink="wallet" routerLinkActive="wallet-highlight">
@@ -24,6 +24,8 @@
                 <h3>Settings</h3>
             </mat-list-item>
         </mat-nav-list>
+        <div class="flex-spacer"></div>
+        <app-donate></app-donate>
     </mat-sidenav>
 
     <router-outlet class="main"></router-outlet>

web/src/app/app.module.ts

@@ -54,6 +54,13 @@ import { Wallet } from './shared/classes/wallet';
 
 
 import * as Rx from 'rxjs/Rx';
+import { TradeHistoryComponent } from './shared/trade-history/trade-history.component';
+import { PriceHistoryComponent } from './shared/price-history/price-history.component';
+import { MyOrdersComponent } from './shared/my-orders/my-orders.component';
+import { OrdersComponent } from './shared/orders/orders.component';
+import { BuySellComponent } from './shared/buy-sell/buy-sell.component';
+import { DonateComponent } from './shared/donate/donate.component';
+import { SelectedCurrencyComponent } from './shared/selected-currency/selected-currency.component';
 
 
 @NgModule({
@@ -69,6 +76,13 @@ import * as Rx from 'rxjs/Rx';
     SidebarComponent,
     WalletComponent,
     ThemePickerComponent,
+    TradeHistoryComponent,
+    PriceHistoryComponent,
+    MyOrdersComponent,
+    OrdersComponent,
+    BuySellComponent,
+    DonateComponent,
+    SelectedCurrencyComponent,
   ],
   imports: [
     BrowserModule,

web/src/app/pages/dashboard/dashboard.component.html

@@ -1 +1,17 @@
-<app-all-enabled-currency-tickers></app-all-enabled-currency-tickers>
+<mat-grid-list cols="3" rowHeight="300px">
+  <mat-grid-tile [colspan]="1" [rowspan]="2">
+    <app-trade-history></app-trade-history>
+  </mat-grid-tile>
+  <mat-grid-tile [colspan]="2" [rowspan]="1">
+    <app-price-history></app-price-history>
+  </mat-grid-tile>
+  <mat-grid-tile [colspan]="1" [rowspan]="1">
+    <app-my-orders></app-my-orders>
+  </mat-grid-tile>
+  <mat-grid-tile [colspan]="1" [rowspan]="1">
+    <app-orders></app-orders>
+  </mat-grid-tile>
+</mat-grid-list>
+
+
+<app-all-enabled-currency-tickers></app-all-enabled-currency-tickers>

web/src/app/pages/dashboard/dashboard.component.scss

@@ -0,0 +1,10 @@
+app-trade-history, app-orders, app-price-history, app-my-orders {
+    height:100%;
+    width:100%;
+    margin: 15px;
+}
+
+.my-orders-card, .orders-card,.trade-history-card,.price-history-card {
+    height: 90%;
+    width:90%;
+}

web/src/app/shared/buy-sell/buy-sell.component.html

@@ -0,0 +1,3 @@
+<p>
+  buy-sell works!
+</p>

web/src/app/shared/buy-sell/buy-sell.component.spec.ts

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

web/src/app/shared/buy-sell/buy-sell.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-buy-sell',
+  templateUrl: './buy-sell.component.html',
+  styleUrls: ['./buy-sell.component.scss']
+})
+export class BuySellComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

web/src/app/shared/donate/donate.component.html

@@ -0,0 +1 @@
+<button mat-button>Donate!</button>

web/src/app/shared/donate/donate.component.spec.ts

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

web/src/app/shared/donate/donate.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-donate',
+  templateUrl: './donate.component.html',
+  styleUrls: ['./donate.component.scss']
+})
+export class DonateComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

web/src/app/shared/my-orders/my-orders.component.html

@@ -0,0 +1,5 @@
+<mat-card class="my-orders-card" flex="33">
+  <mat-card-header>
+      <mat-card-title>My Orders</mat-card-title>
+  </mat-card-header>
+</mat-card>

web/src/app/shared/my-orders/my-orders.component.spec.ts

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

web/src/app/shared/my-orders/my-orders.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-my-orders',
+  templateUrl: './my-orders.component.html',
+  styleUrls: ['./my-orders.component.scss']
+})
+export class MyOrdersComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

web/src/app/shared/orders/orders.component.html

@@ -0,0 +1,5 @@
+<mat-card class="orders-card" flex="33">
+  <mat-card-header>
+      <mat-card-title>Orders</mat-card-title>
+  </mat-card-header>
+</mat-card>

web/src/app/shared/orders/orders.component.spec.ts

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

web/src/app/shared/orders/orders.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-orders',
+  templateUrl: './orders.component.html',
+  styleUrls: ['./orders.component.scss']
+})
+export class OrdersComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

web/src/app/shared/price-history/price-history.component.html

@@ -0,0 +1,5 @@
+<mat-card class="price-history-card" flex="33">
+  <mat-card-header>
+      <mat-card-title>Price History</mat-card-title>
+  </mat-card-header>
+</mat-card>

web/src/app/shared/price-history/price-history.component.spec.ts

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

web/src/app/shared/price-history/price-history.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-price-history',
+  templateUrl: './price-history.component.html',
+  styleUrls: ['./price-history.component.scss']
+})
+export class PriceHistoryComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

web/src/app/shared/selected-currency/selected-currency.component.html

@@ -0,0 +1,3 @@
+<p>
+  selected-currency works!
+</p>

web/src/app/shared/selected-currency/selected-currency.component.spec.ts

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

web/src/app/shared/selected-currency/selected-currency.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-selected-currency',
+  templateUrl: './selected-currency.component.html',
+  styleUrls: ['./selected-currency.component.scss']
+})
+export class SelectedCurrencyComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

web/src/app/shared/trade-history/trade-history.component.html

@@ -0,0 +1,5 @@
+<mat-card class="trade-history-card" flex="33">
+  <mat-card-header>
+      <mat-card-title>Trade History</mat-card-title>
+  </mat-card-header>
+</mat-card>

web/src/app/shared/trade-history/trade-history.component.spec.ts

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

web/src/app/shared/trade-history/trade-history.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-trade-history',
+  templateUrl: './trade-history.component.html',
+  styleUrls: ['./trade-history.component.scss']
+})
+export class TradeHistoryComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}