d0zingcat/gocryptotrader
1
0
Fork 0
mirror of https://github.com/d0zingcat/gocryptotrader.git synced 2026-05-15 23:16:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updates to latest Angular, AngularCLI, Angular Material

Browse Source
This commit is contained in:
GloriousCode
2017-10-13 20:25:52 +11:00
parent d793030846
commit a36f5cc13e
13 changed files with 10340 additions and 10062 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20027
web/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

29
web/package.json
View File

@@ -46,25 +46,28 @@
"e2e": "protractor ./protractor.conf.js"
},
"dependencies": {
"@angular/animations": "^4.3.4",
"@angular/cdk": "^2.0.0-beta.10",
"@angular/common": "4.3.0",
"@angular/compiler": "4.3.0",
"@angular/core": "4.3.4",
"@angular/forms": "4.3.0",
"@angular/http": "4.3.0",
"@angular/material": "^2.0.0-beta.10",
"@angular/platform-browser": "4.3.0",
"@angular/platform-browser-dynamic": "4.3.0",
"@angular/router": "4.3.0",
"@angular/animations": "^4.4.5",
"@angular/cdk": "^2.0.0-beta.12",
"@angular/common": "4.4.5",
"@angular/compiler": "4.4.5",
"@angular/core": "4.4.5",
"@angular/forms": "4.4.5",
"@angular/http": "4.4.5",
"@angular/material": "^2.0.0-beta.12",
"@angular/platform-browser": "4.4.5",
"@angular/platform-browser-dynamic": "4.4.5",
"@angular/router": "4.4.5",
"@ngtools/webpack": "^1.7.4",
"core-js": "2.4.1",
"enhanced-resolve": "3.3.0",
"extract-text-webpack-plugin": "^3.0.1",
"html-webpack-plugin": "^2.30.1",
"rxjs": "^5.4.3",
"zone.js": "0.8.12"
},
"devDependencies": {
"@angular/cli": "1.2.1",
"@angular/compiler-cli": "4.3.0",
"@angular/cli": "^1.4.7",
"@angular/compiler-cli": "4.4.5",
"@types/bluebird": "3.5.8",
"@types/core-js": "0.9.36",
"@types/jasmine": "2.5.53",

36
web/src/app/app.component.html
View File

@@ -1,21 +1,21 @@
<app-navbar class="navbar"></app-navbar>
<md-sidenav-container class="container">
<md-sidenav #sidenav mode="side" class="sidebar" opened="true">
<md-nav-list>
<md-list-item routerLink="dashboard" routerLinkActive="dashboard-highlight">
<md-icon >trending_up</md-icon>&nbsp;<h3>Dashboard</h3>
</md-list-item>
<md-list-item routerLink="wallet" routerLinkActive="wallet-highlight">
<md-icon >account_balance_wallet</md-icon>&nbsp;<h3>Wallet</h3>
</md-list-item>
<md-list-item routerLink="trading" routerLinkActive="trading-highlight">
<md-icon >history</md-icon>&nbsp;<h3>Trading</h3>
</md-list-item>
<md-list-item routerLink="settings" routerLinkActive="settings-highlight">
<md-icon >settings</md-icon>&nbsp;<h3>Settings</h3>
</md-list-item>
</md-nav-list>
</md-sidenav>
<mat-sidenav-container class="container">
<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;<h3>Dashboard</h3>
</mat-list-item>
<mat-list-item routerLink="wallet" routerLinkActive="wallet-highlight">
<mat-icon >account_balance_wallet</mat-icon>&nbsp;<h3>Wallet</h3>
</mat-list-item>
<mat-list-item routerLink="trading" routerLinkActive="trading-highlight">
<mat-icon >history</mat-icon>&nbsp;<h3>Trading</h3>
</mat-list-item>
<mat-list-item routerLink="settings" routerLinkActive="settings-highlight">
<mat-icon >settings</mat-icon>&nbsp;<h3>Settings</h3>
</mat-list-item>
</mat-nav-list>
</mat-sidenav>
<router-outlet class="main"></router-outlet>
</md-sidenav-container>
</mat-sidenav-container>

4
web/src/app/app.component.ts
View File

@@ -1,6 +1,6 @@
import { Component, OnInit,ViewChild } from '@angular/core';
import { ElectronService } from './providers/electron.service';
import { MdSidenav } from '@angular/material';
import { MatSidenav } from '@angular/material';
import { SidebarService } from './services/sidebar/sidebar.service';
import { Router, NavigationEnd } from '@angular/router';
@@ -12,7 +12,7 @@ import { Router, NavigationEnd } from '@angular/router';
export class AppComponent {
sidebarService: SidebarService
public currentUrl:string;
@ViewChild('sidenav') public sidenav: MdSidenav;
@ViewChild('sidenav') public sidenav: MatSidenav;
constructor(public electronService: ElectronService,something: SidebarService, private router:Router) {

48
web/src/app/app.module.ts
View File

@@ -9,18 +9,18 @@ import { NgModule, Injectable } from '@angular/core';
import { FormsModule } from '@angular/forms';
import {
MdButtonModule,
MdCardModule,
MdMenuModule,
MdToolbarModule,
MdIconModule,
MdFormFieldModule,
MdInputModule,
MdCheckboxModule,
MdGridListModule,
MdProgressSpinnerModule,
MdSidenavModule,
MdListModule,
MatButtonModule,
MatCardModule,
MatMenuModule,
MatToolbarModule,
MatIconModule,
MatFormFieldModule,
MatInputModule,
MatCheckboxModule,
MatGridListModule,
MatProgressSpinnerModule,
MatSidenavModule,
MatListModule,
} from '@angular/material';
@@ -68,18 +68,18 @@ import * as Rx from 'rxjs/Rx';
HttpModule,
AppRoutingModule,
BrowserAnimationsModule,
MdButtonModule,
MdMenuModule,
MdCardModule,
MdToolbarModule,
MdIconModule,
MdFormFieldModule,
MdInputModule,
MdCheckboxModule,
MdGridListModule,
MdProgressSpinnerModule,
MdSidenavModule,
MdListModule,
MatButtonModule,
MatMenuModule,
MatCardModule,
MatToolbarModule,
MatIconModule,
MatFormFieldModule,
MatInputModule,
MatCheckboxModule,
MatGridListModule,
MatProgressSpinnerModule,
MatSidenavModule,
MatListModule,
],
providers: [ElectronService,WebsocketService,WebsocketHandlerService, SidebarService],
bootstrap: [AppComponent]

134
web/src/app/pages/settings/settings.component.html
View File

@@ -1,92 +1,92 @@
<div class="loading-spinner" *ngIf="settings === null">
<md-progress-spinner mode="indeterminate"></md-progress-spinner>
<mat-progress-spinner mode="indeterminate"></mat-progress-spinner>
</div>
<div *ngIf="settings !== null">
<button (click)="saveSettings()" md-fab color="accent" class="md-fab md-fab-bottom-right">Save</button>
<button (click)="saveSettings()" mat-fab color="accent" class="mat-fab mat-fab-bottom-right">Save</button>
<form *ngIf="settings.SMSGlobal != null">
<md-card class="exchange-card card">
<md-card-header>
<md-card-title>SMS Global Settings</md-card-title>
</md-card-header>
<md-card-content>
<mat-card class="exchange-card card">
<mat-card-header>
<mat-card-title>SMS Global Settings</mat-card-title>
</mat-card-header>
<mat-card-content>
<table cellspacing="0">
<tr>
<td>
<md-checkbox name="smsEnabled" [(ngModel)]="settings.SMSGlobal.Enabled">Enabled</md-checkbox>
<mat-checkbox name="smsEnabled" [(ngModel)]="settings.SMSGlobal.Enabled">Enabled</mat-checkbox>
</td>
</tr>
</table>
<md-grid-list cols="2" rowHeight="3:1">
<md-grid-tile>
<md-form-field>
<input mdInput name="smsUsername" [(ngModel)]="settings.SMSGlobal.Username" [disabled]="!settings?.SMSGlobal.Enabled" placeholder="Username">
</md-form-field>
</md-grid-tile>
<md-grid-tile>
<md-form-field>
<input mdInput name="smsPassword" [(ngModel)]="settings.SMSGlobal.Password" [disabled]="!settings?.SMSGlobal.Enabled" placeholder="Password">
</md-form-field>
</md-grid-tile>
</md-grid-list>
<md-grid-list cols="3" rowHeight="2:1" *ngFor="let contact of settings.SMSGlobal?.Contacts">
<md-grid-tile>
<md-checkbox name="contactEnabled" [disabled]="!settings?.SMSGlobal.Enabled" [(ngModel)]="contact.Enabled">Enabled</md-checkbox>
</md-grid-tile>
<md-grid-tile>
<md-form-field>
<input mdInput name="contactUsername" [(ngModel)]="contact.Name" [disabled]="!settings.SMSGlobal.Enabled || !contact.Enabled" placeholder="Contact Name">
</md-form-field>
</md-grid-tile>
<md-grid-tile>
<md-form-field>
<input mdInput name="contactPassword" [(ngModel)]="contact.Number" [disabled]="!settings.SMSGlobal.Enabled || !contact.Enabled" placeholder="Contact Number">
</md-form-field>
</md-grid-tile>
</md-grid-list>
</md-card-content>
</md-card>
<mat-grid-list cols="2" rowHeight="3:1">
<mat-grid-tile>
<mat-form-field>
<input matInput name="smsUsername" [(ngModel)]="settings.SMSGlobal.Username" [disabled]="!settings?.SMSGlobal.Enabled" placeholder="Username">
</mat-form-field>
</mat-grid-tile>
<mat-grid-tile>
<mat-form-field>
<input matInput name="smsPassword" [(ngModel)]="settings.SMSGlobal.Password" [disabled]="!settings?.SMSGlobal.Enabled" placeholder="Password">
</mat-form-field>
</mat-grid-tile>
</mat-grid-list>
<mat-grid-list cols="3" rowHeight="2:1" *ngFor="let contact of settings.SMSGlobal?.Contacts">
<mat-grid-tile>
<mat-checkbox name="contactEnabled" [disabled]="!settings?.SMSGlobal.Enabled" [(ngModel)]="contact.Enabled">Enabled</mat-checkbox>
</mat-grid-tile>
<mat-grid-tile>
<mat-form-field>
<input matInput name="contactUsername" [(ngModel)]="contact.Name" [disabled]="!settings.SMSGlobal.Enabled || !contact.Enabled" placeholder="Contact Name">
</mat-form-field>
</mat-grid-tile>
<mat-grid-tile>
<mat-form-field>
<input matInput name="contactPassword" [(ngModel)]="contact.Number" [disabled]="!settings.SMSGlobal.Enabled || !contact.Enabled" placeholder="Contact Number">
</mat-form-field>
</mat-grid-tile>
</mat-grid-list>
</mat-card-content>
</mat-card>
</form>
<form *ngFor="let exchange of settings?.Exchanges">
<md-card class="exchange-card card">
<md-card-header>
<md-card-title>{{exchange.Name}} Exchange Settings</md-card-title>
</md-card-header>
<md-card-content>
<mat-card class="exchange-card card">
<mat-card-header>
<mat-card-title>{{exchange.Name}} Exchange Settings</mat-card-title>
</mat-card-header>
<mat-card-content>
<table cellspacing="0">
<tr>
<td>
<md-checkbox name="exchangeEnabled" [(ngModel)]="exchange.Enabled">Enabled</md-checkbox>
<mat-checkbox name="exchangeEnabled" [(ngModel)]="exchange.Enabled">Enabled</mat-checkbox>
</td>
</tr>
</table>
<md-grid-list cols="3" rowHeight="2:1">
<md-grid-tile>
<md-form-field>
<input mdInput name="apiKey" [(ngModel)]="exchange.APIKey" [disabled]="!exchange.Enabled" placeholder="Exchange API Key">
</md-form-field>
</md-grid-tile>
<md-grid-tile>
<md-form-field>
<input mdInput name="apiSecretKey" [(ngModel)]="exchange.APISecret" [disabled]="!exchange.Enabled" placeholder="Exchange API Secret Key">
</md-form-field>
</md-grid-tile>
<md-grid-tile>
<md-form-field>
<input mdInput name="apiClientId" [(ngModel)]="exchange.ClientID" [disabled]="!exchange.Enabled" placeholder="Exchange API ClientID (optional)">
</md-form-field>
</md-grid-tile>
</md-grid-list>
<mat-grid-list cols="3" rowHeight="2:1">
<mat-grid-tile>
<mat-form-field>
<input matInput name="apiKey" [(ngModel)]="exchange.APIKey" [disabled]="!exchange.Enabled" placeholder="Exchange API Key">
</mat-form-field>
</mat-grid-tile>
<mat-grid-tile>
<mat-form-field>
<input matInput name="apiSecretKey" [(ngModel)]="exchange.APISecret" [disabled]="!exchange.Enabled" placeholder="Exchange API Secret Key">
</mat-form-field>
</mat-grid-tile>
<mat-grid-tile>
<mat-form-field>
<input matInput name="apiClientId" [(ngModel)]="exchange.ClientID" [disabled]="!exchange.Enabled" placeholder="Exchange API ClientID (optional)">
</mat-form-field>
</mat-grid-tile>
</mat-grid-list>
<label>Enabled Currencies</label>
<md-grid-list cols="6" rowHeight="2:1">
<md-grid-tile *ngFor="let currency of exchange.AvailablePairs.split(',')">
<md-checkbox name="availableCurrency" [disabled]="true || !exchange.Enabled">{{currency}}</md-checkbox>
</md-grid-tile>
</md-grid-list>
</md-card-content>
</md-card>
<mat-grid-list cols="6" rowHeight="2:1">
<mat-grid-tile *ngFor="let currency of exchange.AvailablePairs.split(',')">
<mat-checkbox name="availableCurrency" [disabled]="true || !exchange.Enabled">{{currency}}</mat-checkbox>
</mat-grid-tile>
</mat-grid-list>
</mat-card-content>
</mat-card>
</form>

2
web/src/app/pages/settings/settings.component.scss
View File

@@ -8,7 +8,7 @@
}
// FAB
.md-fab {
.mat-fab {
top: auto;
right: 20px;
bottom: 20px;

42
web/src/app/pages/wallet/wallet.component.html
View File

@@ -1,28 +1,28 @@
<md-card *ngIf="wallet !== null" class="wallet-card card">
<md-card-header>
<md-card-title>Wallet Summary</md-card-title>
</md-card-header>
<md-card-content>
<mat-card *ngIf="wallet !== null" class="wallet-card card">
<mat-card-header>
<mat-card-title>Wallet Summary</mat-card-title>
</mat-card-header>
<mat-card-content>
<table cellspacing="0">
<tr>
<td>
</td>
</tr>
</table>
<md-grid-list cols="2" rowHeight="3:1">
<md-grid-tile>
</md-grid-tile>
<md-grid-tile>
</md-grid-tile>
</md-grid-list>
<md-grid-list cols="3" rowHeight="2:1" *ngFor="let total of wallet?.CoinTotal">
<md-grid-tile>
<mat-grid-list cols="2" rowHeight="3:1">
<mat-grid-tile>
</mat-grid-tile>
<mat-grid-tile>
</mat-grid-tile>
</mat-grid-list>
<mat-grid-list cols="3" rowHeight="2:1" *ngFor="let total of wallet?.CoinTotal">
<mat-grid-tile>
{{total.coin}} - {{total.balance}}
</md-grid-tile>
<md-grid-tile>
</md-grid-tile>
<md-grid-tile>
</md-grid-tile>
</md-grid-list>
</md-card-content>
</md-card>
</mat-grid-tile>
<mat-grid-tile>
</mat-grid-tile>
<mat-grid-tile>
</mat-grid-tile>
</mat-grid-list>
</mat-card-content>
</mat-card>

20
web/src/app/services/sidebar/sidebar.service.ts
View File

@@ -1,34 +1,34 @@
import { Injectable } from '@angular/core';
import { MdSidenav, MdDrawerToggleResult } from '@angular/material';
import { MatSidenav, MatDrawerToggleResult } from '@angular/material';
@Injectable()
export class SidebarService {
private sidenav: MdSidenav;
private sidenav: MatSidenav;
/**
* Setter for sidenav.
*
* @param {MdSidenav} sidenav
* @param {MatSidnav} sidenav
*/
public setSidenav(sidenav: MdSidenav) {
public setSidenav(sidenav: MatSidenav) {
this.sidenav = sidenav;
}
/**
* Open this sidenav, and return a Promise that will resolve when it's fully opened (or get rejected if it didn't).
*
* @returns Promise<MdSidenavToggleResult>
* @returns Promise<MatSidnavToggleResult>
*/
public open(): Promise<MdDrawerToggleResult> {
public open(): Promise<MatDrawerToggleResult> {
return this.sidenav.open();
}
/**
* Close this sidenav, and return a Promise that will resolve when it's fully closed (or get rejected if it didn't).
*
* @returns Promise<MdSidenavToggleResult>
* @returns Promise<MatSidnavToggleResult>
*/
public close(): Promise<MdDrawerToggleResult> {
public close(): Promise<MatDrawerToggleResult> {
return this.sidenav.close();
}
@@ -37,9 +37,9 @@ export class SidebarService {
*
* @param {boolean} isOpen Whether the sidenav should be open.
*
* @returns {Promise<MdSidenavToggleResult>}
* @returns {Promise<MatSidnavToggleResult>}
*/
public toggle(isOpen?: boolean): Promise<MdDrawerToggleResult> {
public toggle(isOpen?: boolean): Promise<MatDrawerToggleResult> {
return this.sidenav.toggle(isOpen);
}
}

10
web/src/app/shared/all-enabled-currency-tickers/all-enabled-currency-tickers.component.html
View File

@@ -1,8 +1,8 @@
<div class="loading-spinner" *ngIf="tickerCards === null || tickerCards.length === 0">
<md-progress-spinner mode="indeterminate"></md-progress-spinner>
<mat-progress-spinner mode="indeterminate"></mat-progress-spinner>
</div>
<md-grid-list cols="4" rowHeight="4:3" >
<md-grid-tile *ngFor="let ticker of tickerCards">
<mat-grid-list cols="4" rowHeight="4:3" >
<mat-grid-tile *ngFor="let ticker of tickerCards">
<app-exchange-currency-ticker [ticker]="ticker" ></app-exchange-currency-ticker>
</md-grid-tile>
</md-grid-list>
</mat-grid-tile>
</mat-grid-list>

40
web/src/app/shared/exchange-currency-ticker/exchange-currency-ticker.component.html
View File

@@ -1,28 +1,28 @@
<md-card class="exchange-card one-time-animation" >
<md-card-header>
<md-card-title>{{ticker?.Exchange}} {{ticker?.CurrencyPair}} Ticker update</md-card-title>
</md-card-header>
<md-card-content>
<md-grid-list cols="3" rowHeight="16:9" >
<md-grid-tile>
<mat-card class="exchange-card one-time-animation" >
<mat-card-header>
<mat-card-title>{{ticker?.Exchange}} {{ticker?.CurrencyPair}} Ticker update</mat-card-title>
</mat-card-header>
<mat-card-content>
<mat-grid-list cols="3" rowHeight="16:9" >
<mat-grid-tile>
<p>Last: {{ticker?.Last | number:'1.0-1'}}</p>
</md-grid-tile>
<md-grid-tile>
</mat-grid-tile>
<mat-grid-tile>
<p> Low: {{ticker?.Low | number:'1.0-1'}}</p>
</md-grid-tile>
<md-grid-tile>
</mat-grid-tile>
<mat-grid-tile>
<p> High: {{ticker?.High | number:'1.0-1'}}</p>
</md-grid-tile>
</mat-grid-tile>
<md-grid-tile>
<mat-grid-tile>
<p> Bid: {{ticker?.Bid | number:'1.0-1'}}</p>
</md-grid-tile>
<md-grid-tile>
</mat-grid-tile>
<mat-grid-tile>
<p> Ask: {{ticker?.Ask | number:'1.0-1'}}</p>
</md-grid-tile>
<md-grid-tile>
</mat-grid-tile>
<mat-grid-tile>
<p>Volume: {{ticker?.Volume | number:'1.0-1'}}</p>
</md-grid-tile>
</md-grid-list>
</md-card-content>
</mat-grid-tile>
</mat-grid-list>
</mat-card-content>

6
web/src/app/shared/navbar/navbar.component.html
View File

@@ -1,10 +1,10 @@
<!-- TODO: figure out if the <nav> should go inside of a <header> element. -->
<nav class="docs-navbar">
<md-toolbar color="primary" class="md-elevation-z25">
<mat-toolbar color="primary" class="mat-elevation-z25">
<a (click)="sidebarService.toggle()" class="material-icons">&#xE5D2;</a>
<a md-button class="docs-button" routerLink="/" aria-label="Angular Material">
<a mat-button class="docs-button" routerLink="/" aria-label="Angular Material">
<span>GoCryptoTrader</span>
</a>
<div class="flex-spacer"></div>
</md-toolbar>
</mat-toolbar>
</nav>

4
web/src/app/shared/sidebar/sidebar.component.ts
View File

@@ -1,5 +1,5 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { MdSidenav } from '@angular/material';
import { MatSidenav } from '@angular/material';
import { SidebarService } from './../../services/sidebar/sidebar.service';
import { Router, NavigationEnd } from '@angular/router';
@@ -9,7 +9,7 @@ import { Router, NavigationEnd } from '@angular/router';
styleUrls: ['./sidebar.component.scss']
})
export class SidebarComponent implements OnInit {
@ViewChild('sidenav') public sidenav: MdSidenav;
@ViewChild('sidenav') public sidenav: MatSidenav;
sidebarService: SidebarService
public currentUrl:string;