config(EJ2-9641): Added Stock chart sample.

This commit is contained in:
ROOT\gowrimathis 2018-07-16 18:02:20 +05:30 коммит произвёл Bharath
Родитель 7537568dcb
Коммит c17c74821a
59 изменённых файлов: 68288 добавлений и 2 удалений

60
.angular-cli.json Normal file
Просмотреть файл

@ -0,0 +1,60 @@
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {
"name": "ej2-ng-stock-chart"
},
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": [
"assets",
"favicon.ico"
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"styles": [
"styles.css"
],
"scripts": [],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"lint": [
{
"project": "src/tsconfig.app.json",
"exclude": "**/node_modules/**"
},
{
"project": "src/tsconfig.spec.json",
"exclude": "**/node_modules/**"
},
{
"project": "e2e/tsconfig.e2e.json",
"exclude": "**/node_modules/**"
}
],
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "css",
"component": {}
}
}

12
.gitignore поставляемый Normal file
Просмотреть файл

@ -0,0 +1,12 @@
dist/
*d.ts
*.map
.vscode/
src/**/*.js
*.ngstyle.ts
src/**/*.map
node_modules/
npm-debug.log
*ngfactory.ts
*metadata.json
*ngsummary.json

Просмотреть файл

@ -1,2 +1,27 @@
# ej2-showcase-ng-stockchart
Demo application for track and visualize stock price of any company over a specific period using charting and range tools.
# Essential JS 2 for Angular - Stock Chart
This Stock Chart demo application showcases the usage of Chart and Range Navigator in a real world application scenario. You can use this application to track and visualize stock price of any company over a specific period using charting and range tools
## Deployment
### Install
To install all dependent packages, use the below command
```
npm install
```
### Run
To run the sample, use the below command
```
ng serve
```
## Demo
#### <a href="https://ej2.syncfusion.com/showcase/angular/stockchart/" target="_blank">https://ej2.syncfusion.com/showcase/angular/stockchart/</a>
Check all the showcase samples from <a href="https://ej2.syncfusion.com/home/angular.html" target="_blank">here</a>.

10
license Normal file
Просмотреть файл

@ -0,0 +1,10 @@
Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license.
To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusions terms and conditions.
Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options.
Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusions license containing all terms and conditions.
The Syncfusion license that contains the terms and conditions can be found at
https://www.syncfusion.com/content/downloads/syncfusion_license.pdf

14701
package-lock.json сгенерированный Normal file

Разница между файлами не показана из-за своего большого размера Загрузить разницу

70
package.json Normal file
Просмотреть файл

@ -0,0 +1,70 @@
{
"name": "@syncfusion/ej2-ng-stock-chart",
"version": "0.0.1",
"description": "Essential JS 2 for Angular - Stock Chart application",
"author": "Syncfusion Inc.",
"license": "SEE LICENSE IN license",
"dependencies": {
"rxjs": "^5.0.1",
"tslint": "4.0.2",
"zone.js": "^0.8.4",
"core-js": "^2.4.1",
"systemjs": "^0.19.40",
"gulp-print": "^2.0.1",
"gulp-tslint": "^7.0.1",
"browser-sync": "2.11.2",
"gulp-sass-lint": "^1.1.1",
"reflect-metadata": "^0.1.9",
"tslint-microsoft-contrib": "^4.0.0",
"@angular/core": "~5.0.0",
"@angular/http": "~5.0.0",
"@angular/forms": "~5.0.0",
"@angular/router": "^5.0.0",
"@angular/common": "~5.0.0",
"@angular-devkit/core": "^0.4.5",
"@angular/upgrade": "^5.0.0",
"@angular/compiler": "~5.0.0",
"@angular/platform-browser": "~5.0.0",
"@angular/platform-browser-dynamic": "~5.0.0",
"@syncfusion/ej2-ng-base": "*",
"@syncfusion/ej2-ng-charts": "*",
"@syncfusion/ej2-ng-popups": "*"
},
"devDependencies": {
"@angular/cli": "1.5.6",
"@angular/compiler-cli": "5.0.0",
"@angular/platform-server": "5.0.0",
"@types/jasmine": "^2.2.29",
"@types/requirejs": "^2.1.26",
"@types/node": "^6.0.46",
"gulp": "^3.9.0",
"webpack": "2.5.1",
"shelljs": "^0.7.0",
"typescript": "~2.4.2",
"gulp-sass": "^3.1.0",
"gulp-clean": "^0.3.2",
"run-sequence": "2.2.0",
"webpack-stream": "^3.2.0",
"karma-systemjs": "^0.16.0",
"gulp-typescript": "^2.13.0",
"es6-module-loader": "^0.17.11",
"systemjs-plugin-babel": "0.0.17"
},
"keywords": [
"ej2",
"samples",
"loan-calculator",
"syncfusion",
"ej2-samples",
"ej2-ng-loan-calculator",
"ej2-showcase-samples",
"syncfusion-samples",
"syncfusion-loan-calculator"
],
"scripts": {
"build": "npm run scripts && gulp styles && gulp bundle",
"scripts": "ngc -p tsconfig-aot.json",
"bundle": "gulp bundle",
"ci-publish": "gulp publish-samples"
}
}

Просмотреть файл

@ -0,0 +1,183 @@
<div class='about-overall' id='about-overall'>
<div class='about-heading'>{{title}}</div>
<div class='about-description'>{{description}}</div>
<div class='list-heading'>{{listTitle}}</div>
<div class='about-component'>
<div class='control-item' *ngFor="let item of controlList">
<span class="icon-{{item.control | lowercase}} e-sb-icon control-icon"></span>
<a class='control-name' href="{{item.link}}" target="_blank">{{item.control}}</a>
</div>
</div>
</div>
<style>
.about-overall {
padding-left: 5%;
padding-right: 5%;
min-height: 511px;
}
.about-heading {
font-size: 18px;
font-weight: bold;
color: #666666;
font-size: 18px;
padding: 30px 0 18px 0;
font-family: "SegoeUI-Semibold";
}
@font-face {
font-family: 'sb-icons';
src: url("images/fonts/controls.ttf?gcjn6a") format("truetype"), url("images/fonts/controls.woff?gcjn6a") format("woff"), url("images/fonts/controls.svg?gcjn6a#sbicons") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'icons';
src: url('images/fonts/icons.ttf?gcjn6a') format('truetype'), url('images/fonts/icons.woff?gcjn6a') format('woff'), url('images/fonts/icons.svg?gcjn6a#sbicons') format('svg');
font-weight: normal;
font-style: normal;
}
.list-heading {
font-size: 18px;
font-weight: bold;
color: #666666;
font-size: 18px;
font-family: "SegoeUI-Semibold";
}
.about-description {
text-align: justify;
color: #666666;
font-size: 14px;
line-height: 24px;
padding-bottom: 24px;
font-family: "SegoeUI";
}
.about-component {
color: #485058;
font-size: 14px;
padding-bottom: 24px;
font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.control-item {
color: #4a90e2;
display: flex;
line-height: 30px;
display: inline-block;
width: 168px;
}
.icon-button::before {
content: '\e904';
}
.icon-chart::before {
content: '\e906';
}
.icon-checkbox::before {
content: '\e907';
}
.icon-datepicker::before {
content: '\e90f';
}
.icon-daterangepicker::before {
content: '\e90c';
}
.icon-dropdownbutton::before {
content: '\e702';
}
.icon-rangenavigator::before {
content: '\e714';
}
.icon-toolbar::before {
content: '\e928';
}
.icon-dialog::before {
content: '\e911';
}
.icon-dropdownlist::before {
content: '\e913';
}
.icon-grid::before {
content: '\e916';
}
.icon-multiselect::before {
content: '\e91d';
}
.icon-numerictextbox::before {
content: '\e91f';
}
.icon-radiobutton::before {
content: '\e924';
}
.icon-slider::before {
content: '\e929';
}
.icon-timepicker::before {
content: '\e92c';
}
.icon-textboxes::before {
content: '\e92b';
}
.icon-tooltip::before {
content: '\e92e';
}
.add-icon::before {
content: '\e7ba';
}
.control-icon {
font-size: 18px;
margin-right: 15px;
}
.control-name {
font-size: 14px;
}
.about-component {
margin-left: 20px;
}
body.about-page {
background: #fff;
}
.e-icon {
font-family: 'icons';
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.e-sb-icon {
font-family: 'sb-icons';
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
</style>

Просмотреть файл

@ -0,0 +1,59 @@
import { LowerCasePipe } from '@angular/common';
import { Directive, HostListener } from '@angular/core';
import { Component, ViewEncapsulation, OnInit } from '@angular/core';
import { MenuComponent } from '../menu/menu.component';
@Component({
templateUrl: 'about.component.html',
encapsulation: ViewEncapsulation.None,
})
export class AboutComponent implements OnInit {
public title: string;
public listTitle: string;
public description: string;
public controlList: Object[];
/** Configurations for the About page */
constructor(
public menu: MenuComponent
) {
this.title = 'About this sample';
this.listTitle = 'List of EJ2 components used in this sample';
this.description = 'This stock chart demo application showcases using Essential JS 2 '
+ 'components together in a real-world application scenario. You can further explore the source '
+ 'code of this application and use it as a reference for integrating Essential JS 2 components '
+ 'into your applications.';
this.controlList = [
{ 'control': 'Chart', 'link': 'http://ej2.syncfusion.com/angular/documentation/chart/getting-started.html' },
{ 'control': 'Button', 'link': 'http://ej2.syncfusion.com/angular/documentation/button/getting-started.html' },
{ 'control': 'DropDownButton', 'link': 'http://ej2.syncfusion.com/angular/documentation/drop-down-button/getting-started.html' },
{ 'control': 'Toolbar', 'link': 'http://ej2.syncfusion.com/angular/documentation/toolbar/getting-started.html' },
{ 'control': 'DateRangePicker', 'link': 'http://ej2.syncfusion.com/angular/documentation/daterangepicker/getting-started.html' },
{ 'control': 'RangeNavigator', 'link': 'http://ej2.syncfusion.com/angular/documentation/daterangepicker/getting-started.html' },
];
this.handleResize();
}
public ngOnInit(): void {
}
public handleResize(): void {
setTimeout(() => {
if (document.documentElement.offsetWidth > 1400) {
document.getElementById('about-overall').style.minHeight = 'auto';
document.getElementById('about-overall').style.minHeight = document.documentElement.offsetHeight + 'px';
}
}, 100);
}
@HostListener('window:resize', ['$event'])
onResize(event: any): void {
/** Document height alignment corrections for high resoultion screens */
this.handleResize();
}
}

Просмотреть файл

@ -0,0 +1 @@
<menu style="padding-left: 0px; margin: 0px 0px 0px 0px"></menu>

12
src/app/app.component.ts Normal file
Просмотреть файл

@ -0,0 +1,12 @@
import { Component, OnInit, ViewChild } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent implements OnInit {
public ngOnInit(): void {
}
}

40
src/app/app.module.ts Normal file
Просмотреть файл

@ -0,0 +1,40 @@
import { NgModule } from '@angular/core';
import { APP_BASE_HREF, HashLocationStrategy, Location, LocationStrategy} from '@angular/common';
import { BrowserModule } from '@angular/platform-browser';
import { ChartAllModule, RangeNavigatorAllModule } from '@syncfusion/ej2-ng-charts';
import { DialogAllModule } from '@syncfusion/ej2-ng-popups';
import { routing } from './app.router';
import { ChartComponent } from '../app/chart/chart.component';
import { MenuComponent } from '../app/menu/menu.component';
import { AboutComponent } from '../app/about/about.component';
import { AppComponent } from './app.component';
@NgModule({
imports: [
BrowserModule,
ChartAllModule,
DialogAllModule,
RangeNavigatorAllModule,
routing
],
declarations: [
ChartComponent,
MenuComponent,
AboutComponent,
AppComponent
],
entryComponents: [
AppComponent,
ChartComponent
],
bootstrap: [AppComponent],
providers: [ {provide: APP_BASE_HREF, useValue : '/' }, Location, {provide: LocationStrategy, useClass: HashLocationStrategy} ]
})
export class AppModule {
private location: Location;
constructor(location: Location) { this.location = location; }
}

14
src/app/app.router.ts Normal file
Просмотреть файл

@ -0,0 +1,14 @@
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AboutComponent } from './about/about.component';
import { ChartComponent } from './chart/chart.component';
import { MenuComponent } from './menu/menu.component';
// Route Configuration
export const routes: Routes = [
{ path: '', redirectTo: 'stockChart', pathMatch: 'full' },
{ path: 'stockChart', component: ChartComponent},
{ path: 'about', component: AboutComponent }
];
export const routing: ModuleWithProviders = RouterModule.forRoot(routes);

Просмотреть файл

@ -0,0 +1,64 @@
<div id="waitingpopup" class="loader" align="center">
</div>
<div class="stock-details" id="stock-details" style="visibility: hidden">
<div id="stockRange" style="font-family: SegoeUI-Semibold;
font-weight: 600;
font-size: 17px;
color: #666666;
line-height: 26px;">
<div id="title">Alphabet Inc. (GOOG) 2012-2015</div>
<div id="close" style=" font-size:17px">
<div id="value" style="float: left;">$534.07</div>
<div id="inc" style="color: #2ECD71;">&nbsp;&nbsp;&nbsp;+5.83 (+0.51%)</div>
</div>
<div id="atClose" style=" font-family: SegoeUI;
font-size: 14px;
line-height: 26px;">At Close: 4:00 PM EDT</div>
</div>
<div class='container-control'>
<div class="range-element">
<ejs-rangenavigator #range align='center' back id='range' labelPosition='Outside' valueType='DateTime' [width]='width' (changed)='rangeChanged($event)'
[theme]='theme' disableRangeSelector=true [dataSource]='data' xName='x' yName='close' [periodSelectorSettings]='periods'
animationDuration=500 (loaded)='rangeLoaded($event)' (selectorRender)='selectorRender($event)'>
</ejs-rangenavigator>
</div>
<div class="chart-element">
<ejs-chart #chart id='chartStock' [enableSideBySidePlacement]='sidePlacement' [chartArea]='chartArea' [width]='width' align='center' style="display:block;" [primaryXAxis]='primaryXAxis'
[primaryYAxis]='primaryYAxis' [tooltip]='tooltip' [crosshair]='crosshair' (tooltipRender)='tooltipRender($event)'
(pointRender)='pointRender($event)' (chartMouseMove)='chartMouseMove' (chartMouseUp)='chartMouseLeave()' (chartMouseLeave)='chartMouseLeave()' [axes]='axes'
[rows]='rows' [legendSettings]='legendSettings' [theme]='theme' [zoomSettings]='zoomSettings' (axisLabelRender)='axisLabelRender($event)'
(loaded)='loaded($event)' (load)='chartLoad($event)' (chartMouseClick)='chartClick($event)'>
<e-annotations>
<e-annotation content='<div class="e-annotation"id="annotation"></div>' coordinateUnits='Pixel' region='Chart' x='3%' y='12%'
verticalAlignment='Bottom' horizontalAlignment='Far'>
</e-annotation>
<e-annotation [content]="firstContent" coordinateUnits='Pixel' region='Chart' x='1%' y='5' verticalAlignment='Bottom' horizontalAlignment='Far'>
</e-annotation>
</e-annotations>
<e-series-collection>
<e-series [dataSource]='data' type='Column' yAxisName='secondary' xName='x' yName='volume' low='low' high='high' close='close'
volume='volume' open='open'> </e-series>
<e-series [dataSource]='data' width='2' type='Candle' xName='x' yName='close' high='high' low='low' open='open' close='close'
volume='volume' name='Apple Inc' bearFillColor='#2ecd71' bullFillColor='#e74c3d'>
<e-trendlines>
<e-trendline type='Polynomial' width=0 fill='#9D36F1' [enableTooltip]=trendLineTooltip></e-trendline>
</e-trendlines>
</e-series>
<e-series [dataSource]='data' type='Candle' xName='x' high='high' low='low' [opacity]='opacity' open='open' close='close'
volume='volume' bearFillColor='#2ecd71' bullFillColor='#e74c3d' [animation]='animation'> </e-series>
<e-series [dataSource]='secondaryData' fill="#ad6eff" name="AAPL" [opacity]='secondaryOpacity' type='Spline' xName='x' yName='close'
width='2' [animation]='animation' high='high' low='low' open='open' close='close' volume='volume' [visible] = false> </e-series>
<e-series [dataSource]='thirdData' fill="rgb(115, 211, 255)" name="GOOGL" [opacity]='thirdOpacity' type='Spline' xName='x'
yName='close' width='2' [animation]='animation' high='close' low='close' open='close' close='close' volume='close' [visible] = false>
</e-series>
<e-series [dataSource]='fourthData' name="AMZN" [opacity]='fourthOpacity' type='Spline' xName='x'
yName='close' width='2' [animation]='animation' high='close' low='close' open='close' close='close' volume='close' [visible] = false>
</e-series>
<e-series [dataSource]='fifthData' name="TSLA" [opacity]='fifthOpacity' type='Spline' xName='x'
yName='close' width='2' [animation]='animation' high='close' low='close' open='close' close='close' volume='close' [visible] = false>
</e-series>
</e-series-collection>
</ejs-chart>
</div>
</div>
</div>

Просмотреть файл

@ -0,0 +1,880 @@
import { Component, ViewChild, OnInit } from '@angular/core';
import { Browser, remove, EmitType } from '@syncfusion/ej2-base';
import { Directive, HostListener } from '@angular/core';
import { Chart, RangeNavigator, IRangeLoadedEventArgs, IRangeSelectorRenderEventArgs, ILoadEventArgs } from '@syncfusion/ej2-ng-charts';
import { ChartTheme, PeriodSelectorSettingsModel, IChangedEventArgs, ChartSeriesType } from '@syncfusion/ej2-ng-charts';
import { TechnicalIndicators, TechnicalIndicatorModel, TrendlineTypes, AxisModel, Axis } from '@syncfusion/ej2-charts';
import { ItemModel } from '@syncfusion/ej2-navigations';
import { ChartAreaModel, TooltipSettingsModel, CrosshairSettingsModel, ZoomSettingsModel, getElement } from '@syncfusion/ej2-ng-charts';
import { ITooltipRenderEventArgs, IPointEventArgs, IAxisLabelRenderEventArgs, ILoadedEventArgs } from '@syncfusion/ej2-ng-charts';
import { IMouseEventArgs, MarginModel, IPointRenderEventArgs, AnimationModel, withInBounds, Series } from '@syncfusion/ej2-ng-charts';
import { RowModel, LegendSettingsModel, IAxisRangeCalculatedEventArgs, VisibleLabels, ExportType } from '@syncfusion/ej2-ng-charts';
import { goog, googl, aapl, amzn, tsla, IVolume, IClose } from './stock-data';
import { DropDownButton, MenuEventArgs } from '@syncfusion/ej2-splitbuttons';
import { Button } from '@syncfusion/ej2-buttons';
@Component({
selector: 'stock',
templateUrl: 'chart.component.html',
})
export class ChartComponent implements OnInit {
//component initialization
@ViewChild('chart')
public chart: Chart;
@ViewChild('range')
public range: RangeNavigator;
// range navigator
public width: string = '90%';
public selectedTheme: string = location.hash.split('/')[1] ? location.hash.split('/')[1] : 'Material';
public theme: ChartTheme = <ChartTheme>(this.selectedTheme.charAt(0).toUpperCase() + this.selectedTheme.slice(1));
public periods: PeriodSelectorSettingsModel;
public rangeChanged: EmitType<IChangedEventArgs>;
public rangeLoaded: EmitType<IRangeLoadedEventArgs>;
public rangeLoad: EmitType<IRangeLoadedEventArgs>;
public chartLoad: EmitType<ILoadedEventArgs>;
public selectorRender: EmitType<IRangeSelectorRenderEventArgs>;
public data: Object[] = googl;
public secondaryData: Object[] = aapl;
public thirdData: Object[] = goog;
public fourthData: Object[] = amzn;
public fifthData: Object[] = tsla;
public firstContent: string;
public setValue: boolean = false;
public setValue1: boolean = false;
public setValue2: boolean = false;
public setValue3: boolean = false;
//chart initialization
public chartArea: ChartAreaModel;
public primaryXAxis: AxisModel;
public primaryYAxis: AxisModel;
public tooltip: TooltipSettingsModel;
public crosshair: CrosshairSettingsModel;
public tooltipRender: EmitType<ITooltipRenderEventArgs>;
public pointRender: EmitType<IPointRenderEventArgs>;
public margin: MarginModel;
public zoomSettings: ZoomSettingsModel;
public axisLabelRender: EmitType<IAxisLabelRenderEventArgs>;
public loaded: EmitType<ILoadedEventArgs>;
public chartClick: EmitType<IMouseEventArgs>;
public chartMouseMove: EmitType<IMouseEventArgs>;
public chartMouseLeave: EmitType<IMouseEventArgs>;
public axes: AxisModel[];
public rows: RowModel[];
public legendSettings: LegendSettingsModel;
public axisRangeCalculated: EmitType<IAxisRangeCalculatedEventArgs>;
public period: number;
public fastPeriod: number = 8;
public slowPeriod: number = 5;
public macdType: string = 'Both';
public annotationString: string = '<div id="annotation" class="e-annotation">';
public animation: AnimationModel = { enable: false };
public opacity: number;
public secondaryOpacity: number;
public thirdOpacity: number;
public fourthOpacity: number;
public fifthOpacity: number;
public trendLineTooltip: boolean;
public upperLine: object = {
color: '#FFE200',
width: 1
};
public periodLine: object = {
width: 2
};
public lowerLine: object = {
color: '#FAA512',
width: 1
};
public pointColors: string[] = [];
//private variables:
private indicators: TechnicalIndicators[] = [];
private secondayIndicators: TechnicalIndicators[] = [];
private secondaryValue: string = null;
private thirdValue: string = null;
private fourthValue: string = null;
private fifthValue: string = null;
private tmaValue: string = ': $124.79';
private bollingerValue: string = ': $9.979';
private rsiValue: string = ': $99.279';
private smaValue: string = ': $106.719';
private macdValue: string = ': 2.719';
public sidePlacement: boolean = false;
private candleValue: string = '534.07';
private content: string;
public ngOnInit(): void {
//range navigator
this.tmaValue = ': $124.79';
this.bollingerValue = ': $9.979';
this.rsiValue = ': $99.279';
this.smaValue = ': $106.719';
this.macdValue = ': 2.719';
this.content = this.candle(this.candleValue);
this.firstContent = this.candle('534.07');
this.periods = {
position: 'Top',
periods: [
{ text: '1M', interval: 1, intervalType: 'Months' },
{ text: '3M', interval: 3, intervalType: 'Months', selected: Browser.isDevice ? true : false },
{ text: '6M', interval: 6, intervalType: 'Months' }, { text: 'YTD' },
{ text: '1Y', interval: 1, intervalType: 'Years', selected: Browser.isDevice ? false : true },
{ text: '2Y', interval: 2, intervalType: 'Years' },
{ text: 'All' }
]
};
this.rangeChanged = (args: IChangedEventArgs) => {
let returnPoint: number;
if (args.selectedData.length > 2000) {
returnPoint = 10;
} else if (args.selectedData.length > 1000) {
returnPoint = 8;
} else if (args.selectedData.length > 600) {
returnPoint = 6;
} else if (args.selectedData.length > 100) {
returnPoint = 3;
} else {
returnPoint = 2;
}
let data: IVolume[] = googl.filter((data: IVolume, index: number) => {
return ((data['x'].getTime() >= (args.start as Date).getTime() &&
data['x'].getTime() <= (args.end as Date).getTime()) && index % returnPoint === 0);
});
let data1: IVolume[] = aapl.filter((data1: IVolume, index: number) => {
return ((data1['x'].getTime() >= (args.start as Date).getTime() &&
data1['x'].getTime() <= (args.end as Date).getTime()) && index % returnPoint === 0);
});
let data2: IClose[] = goog.filter((data2: IClose, index: number) => {
return ((data2['x'].getTime() >= (args.start as Date).getTime() &&
data2['x'].getTime() <= (args.end as Date).getTime()) && index % returnPoint === 0);
});
let data3: IClose[] = amzn.filter((data3: IClose, index: number) => {
/* tslint:disable:no-string-literal */
return ((data3['x'].getTime() >= (args.start as Date).getTime() &&
data3['x'].getTime() <= (args.end as Date).getTime()) && index % returnPoint === 0);
});
let data4: IClose[] = tsla.filter((data4: IClose, index: number) => {
/* tslint:disable:no-string-literal */
return ((data4['x'].getTime() >= (args.start as Date).getTime() &&
data4['x'].getTime() <= (args.end as Date).getTime()) && index % returnPoint === 0);
});
let diff: number = ((args.end as Date).getTime() - (args.start as Date).getTime()) / 1000;
diff /= (60 * 60 * 24 * 7 * 4);
let totalMonths: number = Math.abs(Math.round(diff));
if (totalMonths >= 13) {
this.chart.primaryXAxis.labelFormat = 'MMM yyy';
} else if (totalMonths <= 6) {
this.chart.primaryXAxis.labelFormat = 'MMM dd';
}
this.chart.series[0].animation.enable = false; this.chart.primaryXAxis.zoomPosition = 0;
this.chart.primaryXAxis.zoomFactor = 1; this.chart.series[1].animation.enable = false;
this.chart.primaryXAxis.stripLines = [{ visible: true }];
this.pointColors = []; this.chart.series[6].dataSource = data4;
this.chart.series[0].dataSource = data; this.chart.series[1].dataSource = data; this.chart.series[2].dataSource = data;
this.chart.series[3].dataSource = data1; this.chart.series[4].dataSource = data2; this.chart.series[5].dataSource = data3;
this.chart.refresh(); this.chart.setAnnotationValue(0, '<div id="annotation"></div>');
};
this.chartLoad = (args: ILoadedEventArgs) => {
if (document.documentElement.offsetHeight) {
let height: number = (document.documentElement.offsetHeight - 245);
args.chart.height = height > 450 ? (height + '') : null;
} else {
args.chart.height = null;
}
document.body.style.overflowY = args.chart.height ? 'hidden' : 'auto';
if (document.documentElement.offsetHeight > 700 && document.getElementById('_dialog-content')) {
document.getElementById('_dialog-content').style.overflowY = 'hidden';
}
document.getElementById('close').style.display = Browser.isDevice ? 'none' : 'block';
document.getElementById('atClose').style.display = Browser.isDevice ? 'none' : 'block';
document.getElementById('stockRange').style.paddingTop = Browser.isDevice ? '1%' : '0.5%';
document.getElementById('stockRange').style.paddingBottom = Browser.isDevice ? '1%' : '0.5%';
}
this.rangeLoaded = (args: IRangeLoadedEventArgs) => {
let calendar: Element = document.getElementById('customRange');
calendar.classList.add('e-flat');
let icon: Element = document.getElementById('dateIcon');
icon.classList.add('e-btn-icon');
let rect: ClientRect = document.getElementsByClassName('chart-element')[0].getBoundingClientRect();
let size: number = rect.width > 350 ? 10 : 18;
document.getElementById('range_Secondary_Element').style.transform = 'translateX(' + (rect.left - size) + 'px)';
document.getElementById('range_Secondary_Element').style.width = rect.width + 'px';
document.getElementById('stockRange').style.transform = 'translateX(' + (rect.left - 10) + 'px)';
let seriesType: DropDownButton = new DropDownButton({
items: [{ text: 'Line' }, { text: 'Hilo' }, { text: 'HiloOpenClose' },
{ text: 'Hollow Candle' }, { text: 'Spline' }, { text: 'Candle' }],
select: (args: MenuEventArgs) => {
if (args.item.text === 'Candle') {
this.chart.series[1].enableSolidCandles = true;
this.chart.series[1].type = 'Candle';
} else if (args.item.text === 'Hollow Candle') {
this.chart.series[1].enableSolidCandles = false;
this.chart.series[1].type = 'Candle';
} else {
this.chart.series[1].type = <ChartSeriesType>args.item.text;
}
this.chart.refresh();
this.removeSecondaryElement(0);
},
iconCss: 'e-icons e-add', cssClass: 'e-caret-hide'
});
seriesType.appendTo('#seriesType');
let comparision: DropDownButton = new DropDownButton({
items: [{ text: 'GOOG' }, { text: 'AAPL' }, { text: 'GOOGL' }, { text: 'AMZN' }, { text: 'TSLA' }],
select: (args: MenuEventArgs) => {
if (args.item.text === 'AAPL' && !this.setValue) {
this.secondaryValue = '467.5'
this.chart.series[3].opacity = 1;
this.chart.series[3].visible = true;
this.setValue = true;
this.chart.refresh();
} else if (args.item.text === 'GOOGL' && !this.setValue1) {
this.thirdValue = '467.5'
this.chart.series[4].opacity = 1;
this.chart.series[4].visible = true;
this.setValue1 = true;
this.chart.refresh();
} else if (args.item.text === 'AMZN' && !this.setValue2) {
this.fourthValue = '389.51'
this.chart.series[5].opacity = 1;
this.chart.series[5].visible = true;
this.setValue2 = true;
this.chart.refresh();
} else if (args.item.text === 'TSLA' && !this.setValue3) {
this.fifthValue = '205.27'
this.chart.series[6].opacity = 1;
this.chart.series[6].visible = true;
this.setValue3 = true;
this.chart.refresh();
}
this.removeSecondaryElement(0);
this.renderAnnotation();
},
iconCss: 'e-icons e-add', cssClass: 'e-caret-hide'
});
comparision.appendTo('#comparision');
let reset: Button = new Button({
iconCss: 'e-icons e-reset', cssClass: 'e-flat'
});
reset.appendTo('#resetClick');
let print: Button = new Button({
iconCss: 'e-icons e-play-icon', cssClass: 'e-flat'
});
print.appendTo('#print');
let exportChart: DropDownButton = new DropDownButton({
items: [{ text: 'JPEG' }, { text: 'PNG' }, { text: 'SVG' }],
iconCss: 'e-icons e-export', cssClass: 'e-caret-hide',
select: (args: MenuEventArgs) => {
let type: ExportType = <ExportType>args.item.text;
this.chart.export(type, 'chart');
}
});
exportChart.appendTo('#export');
document.getElementById('print').onclick = () => {
this.chart.print(['chartStock']);
};
document.getElementById('resetClick').onclick = () => {
while (this.chart.indicators.length) {
this.chart.indicators.pop();
}
this.indicators = [];
this.secondayIndicators = [];
this.chart.series[1].trendlines[0].width = 0;
this.chart.series[1].type = 'Candle';
this.secondaryValue = null;
this.secondaryOpacity = 0;
this.chart.series[3].opacity = 0;
this.chart.series[3].visible = false;
this.chart.indicatorElements = null;
this.setValue = false;
this.thirdValue = null;
this.fourthValue = null;
this.thirdOpacity = 0;
this.fourthOpacity = 0;
this.fifthValue = null;
this.fifthOpacity = 0;
this.chart.series[4].opacity = 0;
this.chart.series[4].visible = false;
this.setValue1 = false;
this.chart.series[5].opacity = 0;
this.chart.series[5].visible = false;
this.setValue2 = false;
this.chart.series[6].opacity = 0;
this.chart.series[6].visible = false;
this.setValue3 = false;
this.chart.rows = [
{ height: '15%' },
{ height: '85%' }
];
this.chart.axes = [{
name: 'secondary', opposedPosition: true, rowIndex: 0, desiredIntervals: 2,
majorGridLines: { width: 0, color: '#EDEDED' },
lineStyle: { width: 1, color: 'whitesmoke' }, majorTickLines: { width: 0 }, rangePadding: 'None'
}];
this.chart.primaryYAxis = {
crosshairTooltip: { enable: true },
labelFormat: 'n0', plotOffset: 25,
desiredIntervals: 5,
rowIndex: 1, opposedPosition: true,
lineStyle: { width: 1, color: 'whitesmoke' },
rangePadding: 'None',
majorGridLines: { width: 1, color: '#EDEDED' },
};
this.chart.refresh();
if (window.innerWidth > 450) {
this.range.periodSelectorModule.selectedIndex = 8;
this.range.rangeSlider.performAnimation(1398105000000, 1429641000000, this.range);
} else {
this.range.periodSelectorModule.selectedIndex = 4;
this.range.rangeSlider.performAnimation(1421971200000, 1429641000000, this.range);
}
this.chart.setAnnotationValue(1, this.candle(': $534.07'));
};
let indicatorType: DropDownButton = new DropDownButton({
items: [{ text: 'TMA' }, { text: 'Bollinger Bands' }, { text: 'RSI' }, { text: 'SMA' },
{ text: 'MACD' }],
iconCss: 'e-icons e-add', cssClass: 'e-caret-hide',
select: (args: MenuEventArgs) => {
let text: string = args.item.text.split(' ')[0].toLocaleLowerCase() + (args.item.text.split(' ')[1] ? args.item.text.split(' ')[1] : '');
text = text.substr(0, 1).toUpperCase() + text.substr(1);
let type: TechnicalIndicators = <TechnicalIndicators>text;
if (type === 'Tma' || type === 'BollingerBands' || type === 'Sma') {
if (this.indicators.indexOf(type) === -1) {
let indicator: TechnicalIndicatorModel[] = [{
type: type, period: 3, fastPeriod: 8, slowPeriod: 5,
seriesName: 'Apple Inc', macdType: 'Both', width: 2,
macdPositiveColor: '#6EC992', macdNegativeColor: '#FF817F',
fill: type === 'Sma' ? '#32CD32' : '#6063ff',
animation: { enable: false },
upperLine: { color: '#FFE200', width: 1 },
periodLine: { width: 2 },
bandColor: 'rgba(245, 203, 35, 0.12)',
lowerLine: { color: '#FAA512', width: 1 }
}];
this.indicators.push(type);
this.chart.indicators = this.chart.indicators.concat(indicator);
this.chart.refresh();
}
} else {
if (this.indicators.indexOf(type) === -1) {
this.indicators.push(type);
this.secondayIndicators.push(type);
let axis: AxisModel[];
let row: RowModel[]
let indicator: TechnicalIndicatorModel[];
let len: number = this.chart.rows.length;
this.chart.rows[this.chart.rows.length - 1].height = '15%';
row = [{ height: '' + (100 - len * 15) + 'px' }];
this.chart.rows = this.chart.rows.concat(row);
axis = [{
plotOffset: 10, name: type.toString(), opposedPosition: true, rowIndex: 0, desiredIntervals: 1,
majorGridLines: { width: 0, color: '#EDEDED' }, lineStyle: { width: 1, color: 'whitesmoke' },
majorTickLines: { width: 0 }, rangePadding: 'None'
}];
for (let i: number = 0; i < this.chart.axes.length; i++) {
this.chart.axes[i].rowIndex += 1;
}
this.chart.axes = this.chart.axes.concat(axis);
this.chart.primaryYAxis.rowIndex = len + 1;
indicator = [{
type: type, period: 3, fastPeriod: 8, slowPeriod: 5,
seriesName: 'Apple Inc', macdType: 'Both', width: 2,
macdPositiveColor: '#6EC992', macdNegativeColor: '#FF817F',
fill: '#6063ff', yAxisName: type.toString(), animation: { enable: false },
upperLine: { color: '#FFE200', width: 1 },
periodLine: { width: 2 },
bandColor: 'rgba(245, 203, 35, 0.12)',
lowerLine: { color: '#FAA512', width: 1 }
}];
this.chart.indicators = this.chart.indicators.concat(indicator);
this.chart.refresh();
}
}
this.removeSecondaryElement(0);
this.renderAnnotation();
},
});
indicatorType.appendTo('#indicatorType');
let trendType: DropDownButton = new DropDownButton({
items: [{ text: 'Linear' }, { text: 'Polynomial' }, { text: 'MovingAverage' }],
select: (args: MenuEventArgs) => {
let type: TrendlineTypes = <TrendlineTypes>args.item.text;
this.chart.series[1].trendlines[0].animation.enable = false;
this.chart.series[1].trendlines[0].width = 3;
this.chart.series[1].trendlines[0].type = type;
this.chart.refresh();
},
iconCss: 'e-icons e-add', cssClass: 'e-caret-hide'
});
trendType.appendTo('#trendType');
args.rangeNavigator.periodSelectorModule.toolbar.refreshOverflow();
};
this.selectorRender = (args: IRangeSelectorRenderEventArgs) => {
args.enableCustomFormat = true;
args.content = 'Date Range';
let seriesModel: ItemModel = {
template: ' <button id="seriesType" onclick="this.blur();">Series</button>', align: 'Left'
};
let indicatorModel: ItemModel = {
template: ' <button id="indicatorType" onclick="this.blur();">Indicators</button>', align: 'Left'
};
let comparisionModel: ItemModel = {
template: ' <button id="comparision" onclick="this.blur();">Comparison</button>', align: 'Left'
};
let trendLineModel: ItemModel = {
template: ' <button id="trendType" onclick="this.blur();">Trendline</button>', align: 'Left'
};
let resetModel: ItemModel = {
template: ' <button id="resetClick" onclick="this.blur();"></button>', align: 'Right', tooltipText: 'Reset'
};
let printModel: ItemModel = {
template: ' <button id="print" onclick="this.blur();"></button>', align: 'Right', tooltipText: 'Print'
};
let exportModel: ItemModel = {
template: ' <button id="export" onclick="this.blur();"></button>', align: 'Right', tooltipText: 'Export'
};
args.selector.splice(0, 0, trendLineModel);
args.selector.splice(0, 0, indicatorModel);
args.selector.splice(0, 0, comparisionModel);
args.selector.splice(0, 0, seriesModel);
args.selector.push(resetModel);
args.selector.push(printModel);
args.selector.push(exportModel);
};
//chart initialization
this.trendLineTooltip = false;
this.opacity = 0;
this.secondaryOpacity = 0;
this.thirdOpacity = 0;
this.fourthOpacity = 0;
this.fifthOpacity = 0;
this.primaryXAxis = {
valueType: 'DateTime', majorGridLines: { width: 0, color: '#EDEDED' }, crosshairTooltip: { enable: true },
edgeLabelPlacement: 'Hide'
};
this.primaryYAxis = {
crosshairTooltip: { enable: true },
labelFormat: 'n0', plotOffset: 25,
desiredIntervals: 5,
rowIndex: 1, opposedPosition: true,
lineStyle: { width: 1, color: 'whitesmoke' },
rangePadding: 'None',
majorGridLines: { width: 1, color: '#EDEDED' },
};
this.rows = [
{ height: '15%' },
{ height: '85%' }
];
this.axes = [{
name: 'secondary', opposedPosition: true, rowIndex: 0, desiredIntervals: 2,
majorGridLines: { width: 0, color: '#EDEDED' },
lineStyle: { width: 1, color: 'whitesmoke' }, majorTickLines: { width: 0 }, rangePadding: 'None'
}];
this.axisLabelRender = (args: IAxisLabelRenderEventArgs) => {
if (args.axis.name === 'secondary') {
args.text = Math.round((args.value / 10000000)) + 'B';
} else if (args.axis.orientation === 'Vertical') {
args.text = '$' + Math.round(args.value);
}
};
this.axisRangeCalculated = (args: IAxisRangeCalculatedEventArgs) => {
this.chart.setAnnotationValue(0, '<div></div>');
};
this.loaded = (args: ILoadedEventArgs) => {
document.getElementById('stock-details').style.visibility = 'visible';
document.getElementById('waitingpopup').style.display = 'none';
let labels: VisibleLabels[] = (args.chart.axisCollections[0]).visibleLabels;
let maxValue: number = args.chart.axisCollections[0].visibleRange.max;
if (args.chart.primaryXAxis.stripLines.length === 1) {
for (let i: number = 0; i < labels.length; i += 2) {
args.chart.primaryXAxis.stripLines.push({
start: new Date(labels[i].value), end: labels[i + 1] ? new Date(labels[i + 1].value) : new Date(maxValue),
zIndex: 'Behind', border: { width: 0, color: 'transparent' }, rotation: null,
opacity: 0.6, textStyle: {}, text: '', color: '#F1F5FB', visible: true
});
}
args.chart.refresh();
}
this.handleResize();
};
this.chartClick = (args: IMouseEventArgs) => {
if (args.target === 'tsla' || args.target === 'amzn' || args.target === 'aapl' || args.target === 'googl' || args.target === 'tma' || args.target === 'bollingerbands' || args.target === 'rsi' || args.target === 'sma' || args.target === 'macd') {
this.removeSecondaryElement(0);
if (args.target === 'aapl') {
this.secondaryValue = null;
this.secondaryOpacity = 0;
this.chart.series[3].opacity = 0;
this.chart.series[3].visible = false;
this.setValue = false;
}
if (args.target === 'googl') {
this.thirdValue = null;
this.thirdOpacity = 0;
this.chart.series[4].opacity = 0;
this.chart.series[4].visible = false;
this.setValue1 = false;
}
if (args.target === 'amzn') {
this.fourthValue = null;
this.fourthOpacity = 0;
this.chart.series[5].opacity = 0;
this.chart.series[5].visible = false;
this.setValue2 = false;
}
if (args.target === 'tsla') {
this.fifthValue = null;
this.fifthOpacity = 0;
this.chart.series[6].opacity = 0;
this.chart.series[6].visible = false;
this.setValue3 = false;
}
this.content = this.candle(this.candleValue);
this.indicators = [];
let removeIndex: number;
this.chart.indicators.map((indicator: TechnicalIndicatorModel, index: number) => {
let type: string = indicator.type.toLocaleLowerCase();
if (type === args.target) {
removeIndex = index;
if (type === 'macd' || type === 'rsi') {
this.secondayIndicators.splice(0, 1);
this.chart.rows.splice(0, 1);
let len: number = this.chart.rows.length;
this.chart.rows[this.chart.rows.length - 1].height = '' + (100 - (len - 1) * 15) + 'px';
for (let i: number = 0; i < this.chart.axes.length; i++) {
if (this.chart.axes[i].name.toLowerCase() === type) {
this.chart.axes.splice(i, 1);
break;
}
}
for (let i: number = 0; i < this.chart.axes.length; i++) {
this.chart.axes[i].rowIndex -= 1;
}
this.chart.primaryYAxis.rowIndex = len - 1;
}
type = null;
}
if (type === 'tma') {
this.indicators.push('Tma');
this.content += this.tma(this.tmaValue);
} else if (type === 'bollingerbands') {
this.indicators.push('BollingerBands');
this.content += this.bollinger(this.bollingerValue);
} else if (type === 'rsi') {
this.indicators.push('Rsi');
this.content += this.rsi(this.rsiValue);
} else if (type === 'sma') {
this.indicators.push('Sma');
this.content += this.sma(this.smaValue);
} else if (type === 'macd') {
this.indicators.push('Macd');
this.content += this.macd(this.macdValue);
}
});
if (removeIndex !== undefined) {
this.chart.indicators.splice(removeIndex, 1);
}
if (this.secondaryValue) {
this.content += this.compare(this.secondaryValue);
}
if (this.thirdValue) {
this.content += this.compare1(this.thirdValue);
}
if (this.fourthValue) {
this.content += this.compare2(this.fourthValue);
}
if (this.fifthValue) {
this.content += this.compare3(this.fifthValue);
}
if (document.getElementById('chartStock_Annotation_1').childNodes.length === 1) {
this.chart.indicatorElements = null;
}
if (this.chart.indicators.length === 0) {
this.chart.indicatorElements = null;
}
this.chart.refresh();
this.chart.setAnnotationValue(1, this.content);
}
};
this.tooltip = {
enable: true,
shared: true,
header: '',
format: '${point.x}<br/>High : <b>${point.high}</b><br/>Low :' +
' <b>${point.low}</b><br/>Open : <b>${point.open}</b><br/>Close : <b>${point.close}</b><br/>Volume : <b>${point.volume}</b>'
};
this.crosshair = {
enable: true, lineType: 'Both'
};
this.legendSettings = {
visible: false
};
this.period = 3;
this.chartArea = {
border: { width: 1, color: 'whitesmoke' }
};
this.zoomSettings = { enableMouseWheelZooming: true, mode: 'X', toolbarItems: [] };
this.tooltipRender = (args: ITooltipRenderEventArgs) => {
if (args.series.name === 'Apple Inc') {
this.content += this.candle(' :$' + args.text.split('<br/>')[4].split('<b>')[1].split('</b>')[0]);
}
if (args.series.type === 'Candle') {
this.chart.setAnnotationValue(0, this.annotationString + (this.getContent(args.text) + '</table>') + '</div>');
} else if (args.series.name === 'AAPL' && this.setValue) {
this.content += this.compare(args.text.split('<br/>')[4].split('<b>')[1].split('</b>')[0]);
} else if (args.series.name === 'GOOGL' && this.setValue1) {
this.content += this.compare1(args.text.split('<br/>')[4].split('<b>')[1].split('</b>')[0]);
} else if (args.series.name === 'AMZN' && this.setValue2) {
this.content += this.compare2(args.text.split('<br/>')[4].split('<b>')[1].split('</b>')[0]);
} else if (args.series.name === 'TSLA' && this.setValue3) {
this.content += this.compare3(args.text.split('<br/>')[4].split('<b>')[1].split('</b>')[0]);
} else {
/* tslint:disable:no-string-literal */
this.setIndicatorAnnotation(args.text, (args.series as Series)['parentObj']['type']);
}
args.text = '';
};
this.pointRender = (args: IPointRenderEventArgs) => {
if (args.series.type === 'Candle') {
this.pointColors.push(args.fill);
} else {
args.fill = this.pointColors[args.point.index];
}
};
this.chartMouseLeave = (args: IMouseEventArgs) => { this.removeSecondaryElement(); };
this.chartMouseMove = (args: IMouseEventArgs) => {
if (!withInBounds(this.chart.mouseX, this.chart.mouseY, this.chart.chartAxisLayoutPanel.seriesClipRect)) {
this.removeSecondaryElement();
}
};
}
public renderAnnotation(): void {
this.content = this.candle(this.candleValue);
if (this.secondaryValue) {
this.content += this.compare(this.secondaryValue);
}
if (this.thirdValue) {
this.content += this.compare1(this.thirdValue);
}
if (this.fourthValue) {
this.content += this.compare2(this.fourthValue);
}
if (this.fifthValue) {
this.content += this.compare3(this.fifthValue);
}
this.chart.indicators.map((indicator: TechnicalIndicatorModel) => {
let type: string = indicator.type.toLocaleLowerCase();
if (type === 'tma') {
this.content += this.tma(this.tmaValue);
} else if (type === 'bollingerbands') {
this.content += this.bollinger(this.bollingerValue);
} else if (type === 'rsi') {
this.content += this.rsi(this.rsiValue);
} else if (type === 'sma') {
this.content += this.sma(this.smaValue);
} else if (type === 'macd') {
this.content += this.macd(this.macdValue);
}
});
this.chart.setAnnotationValue(1, this.content);
}
public candle(value: string): string {
this.candleValue = value.indexOf('$') > -1 ? value.split('$')[1] : value;
return '<div style="height: 26px;margin-top:5px;padding: 5px;float:left;' +
' font-size: 13px;background: #fff; opacity:0.9; color: #464e56; ' +
' box-shadow:0 0 8px 0 rgba(70,78,86,.25);' +
' border-radius: 3px">' +
'<span style="float:left;height: 26px;margin-top:-5px;margin-left:-5px;' +
' border-top-left-radius: 2px;border-bottom-left-radius: 2px;background-color: rgb(0, 129, 242);width:5px;"></span>' +
'<span style="float:left;padding-left:5px;">GOOG: $' + this.candleValue + '</span></div>';
}
public tma(value: string): string {
this.tmaValue = value.indexOf(':') > -1 ? value.split(':')[1] : value;
return '<div style="margin-left:5px;float:left;margin-top:5px;height: 26px;padding: 5px;' +
' font-size: 13px;background: #fff; opacity:0.9; color: #464e56; ' +
' box-shadow:0 0 8px 0 rgba(70,78,86,.25);' +
' border-radius: 3px">' +
'<span style="float:left;padding-left:1px;">TMA:<span style="color:#6063ff">' + this.tmaValue + '</span></span>' +
'<span id="tma" class="e-icons e-close" style="padding-left:5px;padding-top:2px;float:right;cursor:pointer;"></span></div>';
};
public compare(value: string): string {
this.secondaryValue = value;
return '<div style="margin-left:5px;float:left;margin-top:5px;height: 26px;padding: 5px;' +
' font-size: 13px;background: #fff; opacity:0.9; color: #464e56; ' +
' box-shadow:0 0 8px 0 rgba(70,78,86,.25);' +
' border-radius: 3px">' +
'<span style="float:left;height: 26px;margin-top:-5px;margin-left:-5px;' +
' border-top-left-radius: 2px;border-bottom-left-radius: 2px;background-color: #ad6eff;width:5px;"></span>' +
'<span style="float:left;padding-left:5px;">AAPL: $' + value + '</span>' +
'<span id="aapl" class="e-icons e-close" style="padding-left:5px;padding-top:2px;float:right;cursor:pointer;"></span></div>';
};
public compare1(value: string): string {
this.thirdValue = value;
return '<div style="margin-left:5px;float:left;margin-top:5px;height: 26px;padding: 5px;' +
' font-size: 13px;background: #fff; opacity:0.9; color: #464e56; ' +
' box-shadow:0 0 8px 0 rgba(70,78,86,.25);' +
' border-radius: 3px">' +
'<span style="float:left;height: 26px;margin-top:-5px;margin-left:-5px;' +
' border-top-left-radius: 2px;border-bottom-left-radius: 2px;background-color: rgb(115, 211, 255);width:5px;"></span>' +
'<span style="float:left;padding-left:5px;">GOOGL: $' + value + '</span>' +
'<span id="googl" class="e-icons e-close" style="padding-left:5px;padding-top:2px;float:right;cursor:pointer;"></span></div>';
};
public compare2(value: string): string {
this.fourthValue = value;
return '<div style="margin-left:5px;float:left;margin-top:5px;height: 26px;padding: 5px;' +
' font-size: 13px;background: #fff; opacity:0.9; color: #464e56; ' +
' box-shadow:0 0 8px 0 rgba(70,78,86,.25);' +
' border-radius: 3px">' +
'<span style="float:left;height: 26px;margin-top:-5px;margin-left:-5px;' +
' border-top-left-radius: 2px;border-bottom-left-radius: 2px;background-color: #70ad47;width:5px;"></span>' +
'<span style="float:left;padding-left:5px;">AMZN: $' + value + '</span>' +
'<span id="amzn" class="e-icons e-close" style="padding-left:5px;padding-top:2px;float:right;cursor:pointer;"></span></div>';
};
public compare3(value: string): string {
this.fifthValue = value;
return '<div style="margin-left:5px;float:left;margin-top:5px;height: 26px;padding: 5px;' +
' font-size: 13px;background: #fff; opacity:0.9; color: #464e56; ' +
' box-shadow:0 0 8px 0 rgba(70,78,86,.25);' +
' border-radius: 3px">' +
'<span style="float:left;height: 26px;margin-top:-5px;margin-left:-5px;' +
' border-top-left-radius: 2px;border-bottom-left-radius: 2px;background-color: #dd8abd;width:5px;"></span>' +
'<span style="float:left;padding-left:5px;">TSLA: $' + value + '</span>' +
'<span id="tsla" class="e-icons e-close" style="padding-left:5px;padding-top:2px;float:right;cursor:pointer;"></span></div>';
};
public bollinger(value: string): string {
this.bollingerValue = value.indexOf(':') > -1 ? value.split(':')[1] : value;
return '<div style="margin-left:5px;float:left;margin-top:5px;height: 26px;padding: 5px;' +
' font-size: 13px;background: #fff; opacity:0.9; color: #464e56; ' +
' box-shadow:0 0 8px 0 rgba(70,78,86,.25);' +
' border-radius: 3px">' +
'<span style="float:left;padding-left:1px;">Bollinger: <span style="color:rgba(245, 203, 35, 1)">' + this.bollingerValue + '</span></span>' +
'<span id="bollingerbands" class="e-icons e-close" style="padding-left:5px;padding-top:2px;float:right;cursor:pointer;"></span></div>';
};
public rsi(value: string): string {
this.rsiValue = value.indexOf(':') > -1 ? value.split(':')[1] : value;
return '<div style="margin-left:5px;float:left;margin-top:5px;height: 26px;padding: 5px;' +
' font-size: 13px;background: #fff; opacity:0.9; color: #464e56; ' +
' box-shadow:0 0 8px 0 rgba(70,78,86,.25);' +
' border-radius: 3px">' +
'<span style="float:left;padding-left:1px;">RSI:<span style="color:#FAA512">' + this.rsiValue + '</span></span>' +
'<span id="rsi" class="e-icons e-close" style="padding-left:5px;padding-top:2px;float:right;cursor:pointer;"></span></div>';
};
public sma(value: string): string {
this.smaValue = value.indexOf(':') > -1 ? value.split(':')[1] : value;
return '<div style="margin-left:5px;float:left;margin-top:5px;height: 26px;padding: 5px;' +
' font-size: 13px;background: #fff; opacity:0.9; color: #464e56; ' +
' box-shadow:0 0 8px 0 rgba(70,78,86,.25);' +
' border-radius: 3px">' +
'<span style="float:left;padding-left:1px;">SMA:<span style="color:#32CD32">' + this.smaValue + '</span></span>' +
'<span id="sma" class="e-icons e-close" style="padding-left:5px;padding-top:2px;float:right;cursor:pointer;"></span></div>';
};
public macd(value: string): string {
this.macdValue = value.indexOf(':') > -1 ? value.split(':')[1] : value;
return '<div style="margin-left:5px;float:left;margin-top:5px;height: 26px;padding: 5px;' +
' font-size: 13px;background: #fff; opacity:0.9; color: #464e56; ' +
' box-shadow:0 0 8px 0 rgba(70,78,86,.25);' +
' border-radius: 3px">' +
'<span style="float:left;padding-left:1px;">MACD:<span style="color:#ff9933">' + this.macdValue + '</span></span>' +
'<span id="macd" class="e-icons e-close" style="padding-left:5px;padding-top:2px;float:right;cursor:pointer;"></span></div>';
};
public setIndicatorAnnotation(value: string, type: string): string {
if (value.indexOf('SignalLine') > -1) {
value = value.replace('SignalLine', '')
if (type === 'Tma') {
this.tmaValue = value.replace(' : ', ': $');
} else if (type === 'Macd') {
value = value;
this.macdValue = value;
} else if (type === 'BollingerBands') {
this.bollingerValue = value.replace(' : ', ': $');
} else if (type === 'Rsi') {
this.rsiValue = value.replace(' : ', ': $');
} else {
this.smaValue = value.replace(' : ', ': $');
}
}
this.renderAnnotation();
return this.content;
}
public getContent(value: string): string {
let text: string[] = value.split('<br/>'); let html: string = '<table>';
for (let i: number = 1; i < text.length; i++) {
let value: string[] = text[i].split(':');
if (i === text.length - 1) {
html += '<tr><td align = "left">' + value[0] + '</td><td align = "right">' +
Math.round(((+value[1].split('</b>')[0].split('<b>')[1]) / 10000000)) + 'B';
} else {
html += '<tr><td align = "left">' + value[0] + '</td><td>$' +
(+value[1].split(' <b>')[1].split('</b>')[0]).toFixed(2) + '</td></tr>';
}
}
return html;
};
public removeSecondaryElement = (time?: number): void => {
setTimeout(() => {
if (getElement('annotation')) {
remove(getElement('annotation'));
}
},
// tslint:disable-next-line:align
time === 0 ? this.chart.setAnnotationValue(0, '<div></div>') : 2000
);
}
public handleResize(): void {
document.getElementById('stock-details').style.minHeight = 'auto';
document.getElementById('stock-details').style.minHeight = document.documentElement.offsetHeight + 'px';
let elements: NodeList = document.querySelectorAll('.e-popup-open');
let length: number = elements.length;
for (let i: number = 0; i < length; i++) {
(elements[i] as HTMLElement).classList.remove('e-popup-open');
(elements[i] as HTMLElement).classList.add('e-popup-close');
}
}
@HostListener('window:resize', ['$event'])
onResize(event: any): void {
/** Document height alignment corrections for high resoultions screens */
this.handleResize();
}
}

3938
src/app/chart/stock-data.ts Normal file

Разница между файлами не показана из-за своего большого размера Загрузить разницу

3
src/app/main.ts Normal file
Просмотреть файл

@ -0,0 +1,3 @@
import { platformBrowser } from '@angular/platform-browser';
import { AppModule } from './app.module';
platformBrowser().bootstrapModule(AppModule);

Просмотреть файл

@ -0,0 +1,56 @@
<div style="margin-left: 0px; padding:0px 0px 0px 0px; background:white">
<div id='trade' class="e-icon e-trade" style="float:left"></div>
<div id='information' class="e-icon e-info" style="float:right" (click)='toggleMenu()'></div>
<div class="title">
<div class="title-text">
<span style="font-weight: 700">Stock &nbsp;</span>Analysis Demo
</div>
</div>
<div class="content container-fluid rightpane content-wrapper" style="background: #F1F5FB">
<router-outlet></router-outlet>
</div>
</div>
<!-- Render the confirmation Dialog -->
<ejs-dialog #confirmDialog [visible]='hidden' [position]='position' [header]='confirmHeader' [animationSettings]='animationSettings' [showCloseIcon]='confirmCloseIcon'
(open)="dialogOpen()" (close)="dialogClose()" [target]='target' [width]='confirmWidth'>
<ng-template #content>
<div class='about-description'>
<div class='about-overall' id='about-overall'>
<div class='about-description'>{{description}}</div>
<div class='list-heading'>{{listTitle}}</div>
<div class='about-component'>
<div class='control-item' *ngFor="let item of controlList">
<span class="icon-{{item.control | lowercase}} e-sb-icon control-icon"></span>
<a class='control-name' href="{{item.link}}" target="_blank">{{item.control}}</a>
</div>
</div>
</div>
</div>
</ng-template>
</ejs-dialog>
<style>
.e-btn-hide {
display: none;
}
.dlgbtn {
margin-right: 5%;
}
.title {
height: 40px;
background: linear-gradient(to right, #5487E7 77%, #0BE2D8 100%);
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.16);
}
.title-text {
padding-top: 3px;
padding-left: 24px;
color: white;
margin-left: 30px;
font-size: 24px;
font-family: 'HelveticaNeueLT-HeavyCond';
}
</style>

Просмотреть файл

@ -0,0 +1,101 @@
import { Component, Directive, ElementRef } from '@angular/core';
import { HostListener } from '@angular/core';
import { Browser, rippleEffect, isNullOrUndefined as isNOU, enableRipple } from '@syncfusion/ej2-base';
import { ViewChild, AfterViewInit } from '@angular/core';
import { DialogComponent } from '@syncfusion/ej2-ng-popups';
import { EmitType } from '@syncfusion/ej2-base';
enableRipple(true);
@Component({
selector: 'menu',
templateUrl: 'menu.component.html'
})
export class MenuComponent {
public menu: HTMLElement;
public userName: string;
public filterMenu: HTMLElement;
public overlay: HTMLElement;
// Define Dialog properties
@ViewChild('confirmDialog')
public confirmDialog: DialogComponent;
public confirmHeader: string = 'About';
public showCloseIcon: Boolean = false;
public visible: Boolean = true;
public hidden: Boolean = false;
public confirmCloseIcon: Boolean = true;
public position: object = { X: 'center', Y: 'center' };
public target: string = '.stock-details';
public confirmWidth: string = '50%';
public animationSettings: Object = { effect: 'None' };
public hide: any;
public title: string;
public listTitle: string;
public description: string;
public controlList: Object[];
public confirmHeight: string = '400px';
constructor(public eleRef: ElementRef) {
/** Loads the user data in the profile from the sidebar */
rippleEffect(document.body, { selector: '.ripple-element', rippleFlag: true });
this.title = 'About this sample';
this.listTitle = 'List of EJ2 components used in this sample';
this.description = ' This demo helps to track and visualize the stock price of various sectors/industries over a specific' +
' period using Essential JS 2 components. Different types of technical indicators' +
' in chart help you to track the price movement based on the past prices, and the time periods ' +
'can be selected using range navigator. In addition to this, the DateRangePicker helps you to ' +
'select custom periods to check the stock price. Different types of series help to visualize the' +
' open, high, low, and close values of the stock. You can further explore the source code of this ' +
'application and use it as a reference for integrating Essential JS 2 components into your applications.';
this.controlList = [
{ 'control': 'Chart', 'link': 'http://ej2.syncfusion.com/angular/documentation/chart/getting-started.html' },
{ 'control': 'Button', 'link': 'http://ej2.syncfusion.com/angular/documentation/button/getting-started.html' },
{ 'control': 'DropDownButton', 'link': 'http://ej2.syncfusion.com/angular/documentation/drop-down-button/getting-started.html' },
{ 'control': 'Toolbar', 'link': 'http://ej2.syncfusion.com/angular/documentation/toolbar/getting-started.html' },
{ 'control': 'Dialog', 'link': 'https://ej2.syncfusion.com/16.1.37/angular/documentation/dialog/getting-started.html' },
{ 'control': 'DateRangePicker', 'link': 'http://ej2.syncfusion.com/angular/documentation/daterangepicker/getting-started.html' },
{ 'control': 'RangeNavigator', 'link': 'https://ej2.syncfusion.com/angular/documentation/rangenavigator/getting-started.html ' },
];
}
public ngAfterViewInit(): void {
/** Holds the sidebar elements for later use */
this.menu = this.eleRef.nativeElement.querySelector('#sidebar-wrapper');
this.overlay = this.eleRef.nativeElement.querySelector('#overlay');
}
/** Toggles the sidebar open and close actions - for small resoultion */
public toggleMenu(): void {
this.confirmDialog.show();
this.dialogOpen();
}
public confirmDlgBtnClick: EmitType<object> = () => {
this.confirmDialog.hide();
}
// On Dialog close, show the buttons
public dialogClose: EmitType<object> = () => {
(document.querySelectorAll('.container-control')[0] as HTMLElement).classList.remove('disabled-elemment')
}
// On Dialog open, hide the buttons
public dialogOpen: EmitType<object> = () => {
(document.querySelectorAll('.container-control')[0] as HTMLElement).classList.add('disabled-elemment')
}
public handleResize(): void {
this.confirmDialog.refreshPosition();
}
@HostListener('window:resize', ['$event'])
onResize(event: any): void {
/** Document height alignment corrections for high resoultion screens */
this.handleResize();
}
}

18779
src/app/stock-data.ts Normal file

Разница между файлами не показана из-за своего большого размера Загрузить разницу

Просмотреть файл

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
<title>path1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Stock-Copy-27" transform="translate(-63.000000, -179.000000)" fill="#666666" fill-rule="nonzero">
<path d="M75.8534918,189.176751 L75.8714918,189.311744 L75.8714918,190.055706 C75.8714918,190.461435 75.8654925,190.840916 75.8534918,191.194147 C75.8429918,191.54663 75.8309925,191.888612 75.8182425,192.219345 L75.8182425,194.24874 C75.8182425,194.594472 75.8369925,194.913957 75.8714918,195.20644 C75.9067425,195.498926 75.9629918,195.672166 76.040241,195.725414 C76.115991,195.777911 76.232991,195.804159 76.391991,195.804159 L76.6649895,195.804159 L76.7527388,196.074146 C76.7182387,196.134892 76.6484887,196.187391 76.5419895,196.231638 C76.4362395,196.277385 76.3537403,196.284135 76.295241,196.254887 L73.7025015,196.254887 L73.4385022,196.254887 C73.332003,196.254887 73.2382537,196.224888 73.1557538,196.164142 L73.1557538,195.939153 C73.2262537,195.849158 73.338003,195.804159 73.4910023,195.804159 L73.8082507,195.804159 C73.962,195.713415 74.05275,195.62192 74.08125,195.531174 C74.1104993,195.440429 74.1255,195.280687 74.1255,195.053449 C74.1494993,194.84121 74.16075,194.613222 74.16075,194.370984 C74.16075,194.128746 74.1667492,193.931507 74.1787492,193.780014 L74.1787492,193.210794 L74.1787492,192.028105 C74.1787492,191.497131 74.1637492,191.15965 74.1345,191.016406 C74.106,190.872414 74.06625,190.694673 74.019,190.483184 C73.91475,190.528932 73.7872507,190.581429 73.6402515,190.641426 C73.4932522,190.701423 73.397253,190.731421 73.350003,190.731421 L73.262253,190.596429 C73.262253,190.461435 73.338003,190.340691 73.4910023,190.234947 L73.8082507,190.009958 C73.91475,189.949962 74.019,189.893715 74.1255,189.841217 C74.2319993,189.788719 74.3609985,189.732472 74.5139978,189.671726 C74.702247,189.551731 74.9039963,189.450487 75.1222455,189.367242 C75.338994,189.284746 75.5834925,189.220999 75.8534918,189.176751 Z M75.0600698,184.397003 C75.2483085,184.397003 75.4192972,184.464503 75.5707868,184.599503 C75.724527,184.734504 75.8565173,184.900254 75.9682605,185.095253 C76.080753,185.291004 76.1355,185.471004 76.1355,185.636004 C76.1355,186.012505 76.027506,186.305005 75.8092703,186.515005 C75.5925353,186.726505 75.4327958,186.845755 75.3330533,186.876505 C75.2340585,186.906505 75.119316,186.921505 74.990325,186.921505 C74.8598333,186.921505 74.7338423,186.887755 74.6108497,186.820255 C74.4863588,186.752005 74.3663655,186.628255 74.2501238,186.447505 C74.1316312,186.267505 74.0558865,186.080005 74.0191388,185.884254 C73.996641,185.628504 74.0558865,185.358504 74.1968775,185.072754 C74.3378678,184.787754 74.5073572,184.592003 74.7075938,184.486253 C74.849334,184.427003 74.9655773,184.397003 75.0600698,184.397003 Z M75,180.553993 C69.2400055,180.553993 64.5532837,185.240005 64.5532837,191 C64.5532837,196.76075 69.2400055,201.44674 75,201.44674 C80.7600405,201.44674 85.446762,196.76075 85.446762,191 C85.446762,185.240005 80.7600405,180.553993 75,180.553993 Z M75,179 C81.6172485,179 87,184.383507 87,191 C87,197.617248 81.6172485,203 75,203 C68.3827515,203 63,197.617248 63,191 C63,184.383507 68.3827515,179 75,179 Z" id="path1"></path>
</g>
</g>
</svg>

После

Ширина:  |  Высота:  |  Размер: 3.5 KiB

Просмотреть файл

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
<title>path1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Stock-Copy-27" transform="translate(-63.000000, -179.000000)" fill="#79A1EC" fill-rule="nonzero">
<path d="M75.8534918,189.176751 L75.8714918,189.311744 L75.8714918,190.055706 C75.8714918,190.461435 75.8654925,190.840916 75.8534918,191.194147 C75.8429918,191.54663 75.8309925,191.888612 75.8182425,192.219345 L75.8182425,194.24874 C75.8182425,194.594472 75.8369925,194.913957 75.8714918,195.20644 C75.9067425,195.498926 75.9629918,195.672166 76.040241,195.725414 C76.115991,195.777911 76.232991,195.804159 76.391991,195.804159 L76.6649895,195.804159 L76.7527388,196.074146 C76.7182387,196.134892 76.6484887,196.187391 76.5419895,196.231638 C76.4362395,196.277385 76.3537403,196.284135 76.295241,196.254887 L73.7025015,196.254887 L73.4385022,196.254887 C73.332003,196.254887 73.2382537,196.224888 73.1557538,196.164142 L73.1557538,195.939153 C73.2262537,195.849158 73.338003,195.804159 73.4910023,195.804159 L73.8082507,195.804159 C73.962,195.713415 74.05275,195.62192 74.08125,195.531174 C74.1104993,195.440429 74.1255,195.280687 74.1255,195.053449 C74.1494993,194.84121 74.16075,194.613222 74.16075,194.370984 C74.16075,194.128746 74.1667492,193.931507 74.1787492,193.780014 L74.1787492,193.210794 L74.1787492,192.028105 C74.1787492,191.497131 74.1637492,191.15965 74.1345,191.016406 C74.106,190.872414 74.06625,190.694673 74.019,190.483184 C73.91475,190.528932 73.7872507,190.581429 73.6402515,190.641426 C73.4932522,190.701423 73.397253,190.731421 73.350003,190.731421 L73.262253,190.596429 C73.262253,190.461435 73.338003,190.340691 73.4910023,190.234947 L73.8082507,190.009958 C73.91475,189.949962 74.019,189.893715 74.1255,189.841217 C74.2319993,189.788719 74.3609985,189.732472 74.5139978,189.671726 C74.702247,189.551731 74.9039963,189.450487 75.1222455,189.367242 C75.338994,189.284746 75.5834925,189.220999 75.8534918,189.176751 Z M75.0600698,184.397003 C75.2483085,184.397003 75.4192972,184.464503 75.5707868,184.599503 C75.724527,184.734504 75.8565173,184.900254 75.9682605,185.095253 C76.080753,185.291004 76.1355,185.471004 76.1355,185.636004 C76.1355,186.012505 76.027506,186.305005 75.8092703,186.515005 C75.5925353,186.726505 75.4327958,186.845755 75.3330533,186.876505 C75.2340585,186.906505 75.119316,186.921505 74.990325,186.921505 C74.8598333,186.921505 74.7338423,186.887755 74.6108497,186.820255 C74.4863588,186.752005 74.3663655,186.628255 74.2501238,186.447505 C74.1316312,186.267505 74.0558865,186.080005 74.0191388,185.884254 C73.996641,185.628504 74.0558865,185.358504 74.1968775,185.072754 C74.3378678,184.787754 74.5073572,184.592003 74.7075938,184.486253 C74.849334,184.427003 74.9655773,184.397003 75.0600698,184.397003 Z M75,180.553993 C69.2400055,180.553993 64.5532837,185.240005 64.5532837,191 C64.5532837,196.76075 69.2400055,201.44674 75,201.44674 C80.7600405,201.44674 85.446762,196.76075 85.446762,191 C85.446762,185.240005 80.7600405,180.553993 75,180.553993 Z M75,179 C81.6172485,179 87,184.383507 87,191 C87,197.617248 81.6172485,203 75,203 C68.3827515,203 63,197.617248 63,191 C63,184.383507 68.3827515,179 75,179 Z" id="path1"></path>
</g>
</g>
</svg>

После

Ширина:  |  Высота:  |  Размер: 3.5 KiB

Просмотреть файл

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="22px" height="24px" viewBox="0 0 22 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
<title>Stroke 5 Copy</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Stock-Copy-27" transform="translate(-64.000000, -95.000000)" fill="#FFFFFF" fill-rule="nonzero">
<path d="M79.1401486,99.051557 L76.9353177,96.8473347 L85.3830722,95 L82.3899986,102.30051 L80.2062366,100.117351 L75.1762404,104.978294 L69.0261283,104.106091 L65.4700718,111.030666 L64.1292923,110.34212 L68.175482,102.463127 L74.6585358,103.382547 L79.1401486,99.051557 Z M64,119 L64,114.483289 L67.0111404,114.483289 L67.0111404,119 L64,119 Z M70.0222809,119 L70.0222809,109.966579 L73.0334213,109.966579 L73.0334213,119 L70.0222809,119 Z M76.0445618,119 L76.0445618,106.955438 L79.0557022,106.955438 L79.0557022,119 L76.0445618,119 Z M82.0668426,119 L82.0668426,103.944298 L85.0779831,103.944298 L85.0779831,119 L82.0668426,119 Z" id="Stroke-5-Copy"></path>
</g>
</g>
</svg>

После

Ширина:  |  Высота:  |  Размер: 1.2 KiB

Просмотреть файл

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="22px" height="24px" viewBox="0 0 22 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
<title>Stroke 5 Copy</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Stock-Copy-27" transform="translate(-64.000000, -95.000000)" fill="#79A1EC" fill-rule="nonzero">
<path d="M79.1401486,99.051557 L76.9353177,96.8473347 L85.3830722,95 L82.3899986,102.30051 L80.2062366,100.117351 L75.1762404,104.978294 L69.0261283,104.106091 L65.4700718,111.030666 L64.1292923,110.34212 L68.175482,102.463127 L74.6585358,103.382547 L79.1401486,99.051557 Z M64,119 L64,114.483289 L67.0111404,114.483289 L67.0111404,119 L64,119 Z M70.0222809,119 L70.0222809,109.966579 L73.0334213,109.966579 L73.0334213,119 L70.0222809,119 Z M76.0445618,119 L76.0445618,106.955438 L79.0557022,106.955438 L79.0557022,119 L76.0445618,119 Z M82.0668426,119 L82.0668426,103.944298 L85.0779831,103.944298 L85.0779831,119 L82.0668426,119 Z" id="Stroke-5-Copy"></path>
</g>
</g>
</svg>

После

Ширина:  |  Высота:  |  Размер: 1.2 KiB

Просмотреть файл

@ -0,0 +1,19 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 109 109" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
<g transform="matrix(1,0,0,1,-337.5,-112.5)">
<g id="Page-8" serif:id="Page 8" transform="matrix(6.77083,0,0,6.77083,337.5,112.5)">
<rect x="0" y="0" width="16" height="16" style="fill:none;"/>
<clipPath id="_clip1">
<rect x="0" y="0" width="16" height="16"/>
</clipPath>
<g clip-path="url(#_clip1)">
<g transform="matrix(0.147692,0,0,0.147692,-49.8462,-16.6154)">
<g id="Layer-1" serif:id="Layer 1">
<path d="M391.667,220.833C361.796,220.833 337.5,196.538 337.5,166.667C337.5,136.796 361.796,112.5 391.667,112.5C421.538,112.5 445.833,136.796 445.833,166.667C445.833,196.538 421.538,220.833 391.667,220.833ZM402.895,192.625L402.895,188.501C398.605,188.501 396.511,187.425 396.612,185.258L396.612,155.864L380.506,155.864L380.506,159.98C384.652,159.98 386.717,161.085 386.717,163.303L386.717,185.258C386.717,187.425 384.652,188.501 380.506,188.501L380.506,192.625L402.895,192.625ZM397.478,143.73C397.478,145.413 396.886,146.872 395.709,148.093C394.532,149.32 393.073,149.934 391.34,149.934C390.473,149.934 389.664,149.768 388.92,149.429C388.176,149.096 387.519,148.656 386.97,148.093C386.421,147.544 385.966,146.886 385.634,146.15C385.295,145.399 385.128,144.59 385.128,143.73C385.128,141.997 385.742,140.538 386.97,139.361C388.198,138.176 389.657,137.584 391.34,137.584C393.022,137.584 394.467,138.191 395.673,139.39C396.879,140.596 397.478,142.048 397.478,143.73Z" style="fill:white;"/>
</g>
</g>
</g>
</g>
</g>
</svg>

После

Ширина:  |  Высота:  |  Размер: 2.0 KiB

Двоичные данные
src/assets/images/Stock_Analysis.png Normal file

Двоичный файл не отображается.

После

Ширина:  |  Высота:  |  Размер: 2.5 KiB

Двоичные данные
src/assets/images/fonts/Expense-Analysis-Sample.eot Normal file

Двоичный файл не отображается.

Просмотреть файл

@ -0,0 +1,12 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Generated by IcoMoon</metadata>
<defs>
<font id="Expense-Analysis-Sample" horiz-adv-x="1024">
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
<glyph unicode="&#xe900;" glyph-name="Filters" d="M118.187 686.507h484.267v-37.547c0.233-10.744 8.882-19.393 19.605-19.626h141.675c10.744 0.233 19.393 8.882 19.626 19.605v37.569h122.88c18.144 0 32.853 14.709 32.853 32.853s-14.709 32.853-32.853 32.853v0h-123.307v37.12c-0.233 10.744-8.882 19.393-19.605 19.626h-141.675c-10.84 0-19.627-8.787-19.627-19.627v0-37.547h-483.84c-18.144 0-32.853-14.709-32.853-32.853s14.709-32.853 32.853-32.853v0zM640 770.133h101.547v-101.547h-101.547zM905.813 480.427h-484.267v37.547c0.003 0.128 0.005 0.28 0.005 0.431 0 10.691-8.548 19.386-19.183 19.622h-141.249c-0.001 0-0.003 0-0.005 0-10.84 0-19.627-8.787-19.627-19.627 0-0.15 0.002-0.3 0.005-0.449v0.022-37.547h-123.307c-1.122 0.136-2.421 0.213-3.738 0.213-18.144 0-32.853-14.709-32.853-32.853s14.709-32.853 32.853-32.853c1.317 0 2.616 0.078 3.893 0.228l-0.155-0.015h123.307v-37.973c0-10.84 8.787-19.627 19.627-19.627h141.227c10.654 0.239 19.2 8.933 19.2 19.622 0 0.002 0 0.003 0 0.005v0 37.973h484.267c1.122-0.136 2.421-0.213 3.738-0.213 18.144 0 32.853 14.709 32.853 32.853s-14.709 32.853-32.853 32.853c-1.317 0-2.616-0.078-3.893-0.228l0.155 0.015zM384 397.227h-103.253v101.547h103.253zM905.813 209.493h-303.36v37.547c0 0.001 0 0.003 0 0.005 0 10.604-8.596 19.2-19.2 19.2-0.15 0-0.3-0.002-0.449-0.005h-140.778c-0.001 0-0.003 0-0.005 0-10.689 0-19.383-8.546-19.622-19.178v-37.569h-304.213c-18.144 0-32.853-14.709-32.853-32.853s14.709-32.853 32.853-32.853h303.36v-37.12c0.233-10.744 8.882-19.393 19.605-19.626h140.822c10.84 0 19.627 8.787 19.627 19.627v0 37.547h303.787c18.144 0 32.853 14.709 32.853 32.853s-14.709 32.853-32.853 32.853v0zM564.48 124.16h-103.253v103.68h101.973z" />
<glyph unicode="&#xe901;" glyph-name="Mobile-Menu" d="M938.667 746.667h-853.333c-23.564 0-42.667-19.103-42.667-42.667s19.103-42.667 42.667-42.667v0h853.333c23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667v0zM796.587 490.667h-711.253c-23.564 0-42.667-19.103-42.667-42.667s19.103-42.667 42.667-42.667v0h711.253c23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667v0zM654.080 234.667h-568.747c-23.564 0-42.667-19.103-42.667-42.667s19.103-42.667 42.667-42.667v0h568.747c23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667v0z" />
</font></defs></svg>

После

Ширина:  |  Высота:  |  Размер: 2.6 KiB

Двоичные данные
src/assets/images/fonts/Expense-Analysis-Sample.ttf Normal file

Двоичный файл не отображается.

Двоичные данные
src/assets/images/fonts/Expense-Analysis-Sample.woff Normal file

Двоичный файл не отображается.

Двоичные данные
src/assets/images/fonts/controls.eot Normal file

Двоичный файл не отображается.

Различия файлов скрыты, потому что одна или несколько строк слишком длинны

После

Ширина:  |  Высота:  |  Размер: 94 KiB

Двоичные данные
src/assets/images/fonts/controls.ttf Normal file

Двоичный файл не отображается.

Двоичные данные
src/assets/images/fonts/controls.woff Normal file

Двоичный файл не отображается.

Двоичные данные
src/assets/images/fonts/icons.eot Normal file

Двоичный файл не отображается.

Различия файлов скрыты, потому что одна или несколько строк слишком длинны

После

Ширина:  |  Высота:  |  Размер: 94 KiB

Двоичные данные
src/assets/images/fonts/icons.ttf Normal file

Двоичный файл не отображается.

Двоичные данные
src/assets/images/fonts/icons.woff Normal file

Двоичный файл не отображается.

Просмотреть файл

@ -0,0 +1,34 @@
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="129" height="28" viewBox="0 0 129 28">
<defs>
<style>
.cls-1 {
fill: #5d5d5d;
}
</style>
</defs>
<title>Artboard 2</title>
<g>
<g>
<path class="cls-1" d="M36.21,13.13H29.09a2.7,2.7,0,0,0-1.68.43,1.63,1.63,0,0,0-.53,1.36A1.35,1.35,0,0,0,27.33,16a2.13,2.13,0,0,0,1.36.37H32.5a5,5,0,0,1,3.35.89,3.82,3.82,0,0,1,1,3,3.87,3.87,0,0,1-1.15,3.1,5.48,5.48,0,0,1-3.62,1H24.42V21.93h7.21a3.12,3.12,0,0,0,1.73-.36,1.36,1.36,0,0,0,.5-1.19,1.46,1.46,0,0,0-.46-1.22,2.61,2.61,0,0,0-1.58-.36h-3.4A5.2,5.2,0,0,1,25,17.86a3.72,3.72,0,0,1-1.09-3A4,4,0,0,1,25,11.71a5.47,5.47,0,0,1,3.64-1h7.54Z"/>
<path class="cls-1" d="M42.74,22.16h2.12V14.35h2.65v9.75A4.1,4.1,0,0,1,46.58,27a3.8,3.8,0,0,1-2.84,1H38.57V26h4.72a1.68,1.68,0,0,0,1.17-.37,1.38,1.38,0,0,0,.41-1.07v-.17H42.53a4.65,4.65,0,0,1-3.2-.88,3.87,3.87,0,0,1-1-3V14.35H41v6a2.27,2.27,0,0,0,.34,1.49A2,2,0,0,0,42.74,22.16Z"/>
<path class="cls-1" d="M49.59,14.35h5a4.86,4.86,0,0,1,3.22.85,3.58,3.58,0,0,1,1,2.82v6.35H56.11v-6a2.11,2.11,0,0,0-.35-1.46,2.08,2.08,0,0,0-1.39-.33H52.24v7.81H49.59Z"/>
<path class="cls-1" d="M66.2,22.22H69v2.14h-3.6a7.54,7.54,0,0,1-2.25-.28,3.87,3.87,0,0,1-1.53-.92,4.81,4.81,0,0,1-1.09-1.68,5.59,5.59,0,0,1-.39-2.09,5.93,5.93,0,0,1,.39-2.17,4.57,4.57,0,0,1,1.1-1.68,3.92,3.92,0,0,1,1.55-.91,7.44,7.44,0,0,1,2.23-.28H69v2.17H66.2a3.87,3.87,0,0,0-2.57.64,2.94,2.94,0,0,0-.71,2.24,3.52,3.52,0,0,0,.29,1.52,2.3,2.3,0,0,0,.89,1,2.07,2.07,0,0,0,.69.25A9.06,9.06,0,0,0,66.2,22.22Z"/>
<path class="cls-1" d="M71.38,16.35H69.49v-2h1.89v-1a2.82,2.82,0,0,1,.57-2.06,3.24,3.24,0,0,1,2.17-.53h2.51v1.92H75.37a1.67,1.67,0,0,0-1,.21.8.8,0,0,0-.29.7v.81h2.51v2H74.12v8H71.38Z"/>
<path class="cls-1" d="M86.7,24.36h-5a4.71,4.71,0,0,1-3.17-.87,3.56,3.56,0,0,1-1-2.79V14.35h2.62v6.14a1.88,1.88,0,0,0,.35,1.34,2.07,2.07,0,0,0,1.39.34h2.13V14.35H86.7Z"/>
<path class="cls-1" d="M88.64,22.27h5.57A2,2,0,0,0,95.3,22a1,1,0,0,0,0-1.48,2,2,0,0,0-1.08-.23H91.93a4.32,4.32,0,0,1-2.74-.62,2.83,2.83,0,0,1-.71-2.21,3,3,0,0,1,.86-2.38A3.94,3.94,0,0,1,92,14.35h5.7v2.09H93a3.47,3.47,0,0,0-1.49.2.76.76,0,0,0-.34.72.8.8,0,0,0,.3.69,1.63,1.63,0,0,0,1,.22h2.4a3.67,3.67,0,0,1,2.5.76,2.78,2.78,0,0,1,.86,2.21,3.29,3.29,0,0,1-.77,2.26,2.5,2.5,0,0,1-2,.87H88.64Z"/>
<path class="cls-1" d="M102.56,13.22H99.8V10.74h2.76Zm0,11.14H99.8v-10h2.76Z"/>
<path class="cls-1" d="M114.56,19.36a5,5,0,0,1-1.43,3.76,6,6,0,0,1-7.75,0,5,5,0,0,1-1.45-3.76,5,5,0,0,1,1.45-3.77,6,6,0,0,1,7.74,0A5,5,0,0,1,114.56,19.36Zm-7.87,0a3.35,3.35,0,0,0,.67,2.23,2.61,2.61,0,0,0,3.75,0,3.32,3.32,0,0,0,.68-2.23,3.31,3.31,0,0,0-.68-2.22,2.61,2.61,0,0,0-3.75,0A3.32,3.32,0,0,0,106.69,19.36Z"/>
<path class="cls-1" d="M115.87,14.35h5a4.86,4.86,0,0,1,3.22.85A3.58,3.58,0,0,1,125,18v6.35h-2.65v-6a2.12,2.12,0,0,0-.35-1.46,2.09,2.09,0,0,0-1.39-.33h-2.12v7.81h-2.65Z"/>
</g>
<rect class="cls-1" x="0.74" y="3.29" width="6.23" height="6.23"/>
<rect class="cls-1" x="18.25" y="1.3" width="6.35" height="6.35" transform="translate(4.14 17.91) rotate(-49.66)"/>
<rect class="cls-1" x="8.15" y="3.29" width="6.23" height="6.23"/>
<rect class="cls-1" x="0.74" y="10.7" width="6.23" height="6.23"/>
<rect class="cls-1" x="8.15" y="10.7" width="6.23" height="6.23"/>
<rect class="cls-1" x="15.58" y="10.7" width="6.23" height="6.23"/>
<rect class="cls-1" x="0.75" y="18.12" width="6.23" height="6.23"/>
<rect class="cls-1" x="8.16" y="18.12" width="6.23" height="6.23"/>
<rect class="cls-1" x="15.59" y="18.12" width="6.23" height="6.23"/>
<path class="cls-1" d="M128.26,13.85a1.62,1.62,0,1,1-1.6-1.62A1.62,1.62,0,0,1,128.26,13.85Zm-2.63-.9a1.36,1.36,0,0,0,1,2.26,1.36,1.36,0,0,0,0-2.72A1.33,1.33,0,0,0,125.63,12.95Zm1.68,1.86H127l-.49-.71v.71h-.27V12.93h.32c.41,0,.62.19.62.54a.48.48,0,0,1-.43.51Zm-.73-1.08c.21,0,.31-.1.31-.27s-.1-.27-.34-.27h-.06v.55Z"/>
</g>
</svg>

После

Ширина:  |  Высота:  |  Размер: 3.9 KiB

Просмотреть файл

@ -0,0 +1,21 @@
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="27.5" height="26" viewBox="0 0 27.5 26">
<defs>
<style>
.cls-1 {
fill: #5d5d5d;
}
</style>
</defs>
<title>Sync-logo</title>
<g>
<rect class="cls-1" x="1.17" y="4.12" width="6.23" height="6.23"/>
<rect class="cls-1" x="18.68" y="2.13" width="6.35" height="6.35" transform="translate(3.67 18.53) rotate(-49.66)"/>
<rect class="cls-1" x="8.58" y="4.12" width="6.23" height="6.23"/>
<rect class="cls-1" x="1.17" y="11.53" width="6.23" height="6.23"/>
<rect class="cls-1" x="8.58" y="11.53" width="6.23" height="6.23"/>
<rect class="cls-1" x="16.01" y="11.53" width="6.23" height="6.23"/>
<rect class="cls-1" x="1.18" y="18.94" width="6.23" height="6.23"/>
<rect class="cls-1" x="8.59" y="18.94" width="6.23" height="6.23"/>
<rect class="cls-1" x="16.02" y="18.94" width="6.23" height="6.23"/>
</g>
</svg>

После

Ширина:  |  Высота:  |  Размер: 955 B

Двоичные данные
src/assets/images/sb-icons/fonts/icons.eot Normal file

Двоичный файл не отображается.

Просмотреть файл

@ -0,0 +1,57 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Generated by IcoMoon</metadata>
<defs>
<font id="EJ2-SB-Icons-v1" horiz-adv-x="1024">
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
<glyph unicode="&#xe900;" glyph-name="Accordion" d="M981.333 892.16h-938.667c-17.673 0-32-14.327-32-32v0-277.333c0-17.673 14.327-32 32-32v0h938.667c17.673 0 32 14.327 32 32v0 277.333c0 17.673-14.327 32-32 32v0zM949.333 614.827h-874.24v213.333h873.813zM893.44 757.76h-142.080l70.827-72.533 71.253 72.533zM100.267 762.88h423.68v-85.333h-423.68v85.333zM981.333 513.28h-938.667c-17.673 0-32-14.327-32-32v0-445.44c0-17.673 14.327-32 32-32v0h938.667c17.673 0 32 14.327 32 32v0 445.44c0 17.673-14.327 32-32 32v0zM949.333 67.84h-874.24v380.16h873.813zM822.187 377.173l-70.827-72.107h142.080l-71.253 72.107zM100.267 384h423.68v-85.333h-423.68v85.333zM100.267 217.173h793.173v-85.333h-793.173v85.333z" />
<glyph unicode="&#xe901;" glyph-name="API-Configuration" d="M760.747 428.8c1.584 11.494 2.513 24.815 2.56 38.344v0.056c-0.047 13.585-0.976 26.906-2.732 39.966l0.172-1.566 82.347 64.427c4.497 3.627 7.35 9.137 7.35 15.313 0 3.632-0.987 7.034-2.707 9.952l0.050-0.092-79.787 135.253c-3.46 5.895-9.767 9.79-16.984 9.79-2.483 0-4.858-0.461-7.044-1.302l0.134 0.045-95.573-39.253c-19.087 14.944-40.878 27.83-64.255 37.696l-1.878 0.704-14.933 103.68c-1.306 9.446-9.327 16.641-19.029 16.641-0.060 0-0.12 0-0.181-0.001h-156.151c-0.051 0-0.111 0.001-0.171 0.001-9.701 0-17.722-7.195-19.017-16.54l-0.011-0.101-14.933-103.68c-25.248-10.735-47.023-23.608-66.823-38.913l0.69 0.513-97.28 39.253c-2.102 0.861-4.543 1.361-7.099 1.361-7.188 0-13.453-3.95-16.744-9.798l-0.050-0.096-78.080-135.253c-1.751-2.84-2.788-6.281-2.788-9.964 0-6.172 2.912-11.664 7.438-15.176l0.044-0.033 82.347-64.427c-1.569-11.479-2.497-24.799-2.56-38.325v-0.075c0.063-13.601 0.991-26.921 2.733-39.985l-0.173 1.585-82.347-66.133c-4.497-3.627-7.35-9.137-7.35-15.313 0-3.632 0.987-7.034 2.707-9.952l-0.050 0.092 78.080-133.547c3.46-5.895 9.767-9.79 16.984-9.79 2.483 0 4.858 0.461 7.044 1.302l-0.134-0.045 97.28 39.253c19.087-14.944 40.878-27.83 64.255-37.696l1.878-0.704 14.933-103.68c1.306-9.446 9.327-16.641 19.029-16.641 0.060 0 0.12 0 0.181 0.001h156.578c0.051 0 0.111-0.001 0.171-0.001 9.701 0 17.722 7.195 19.017 16.54l0.011 0.101 14.933 103.68c25.083 10.767 46.714 23.634 66.384 38.906l-0.678-0.506 97.28-39.253c2.102-0.861 4.543-1.361 7.099-1.361 7.188 0 13.453 3.95 16.744 9.798l0.050 0.096 78.080 135.253c1.67 2.826 2.657 6.228 2.657 9.86 0 6.176-2.853 11.686-7.312 15.284l-0.038 0.029zM469.333 330.24c-75.641 0-136.96 61.319-136.96 136.96s61.319 136.96 136.96 136.96c75.641 0 136.96-61.319 136.96-136.96v0c0-75.641-61.319-136.96-136.96-136.96v0z" />
<glyph unicode="&#xe902;" glyph-name="API" d="M685.653 595.627l-113.493 110.933-302.080-295.68v-110.933h113.92zM775.253 680.96c5.757 5.318 9.35 12.906 9.35 21.333s-3.593 16.015-9.33 21.315l-0.020 0.018-70.827 70.4c-5.518 5.331-13.042 8.616-21.333 8.616s-15.816-3.285-21.342-8.624l0.009 0.008-58.88-58.027 113.493-110.933zM149.333 211.627h725.333v-118.187h-725.333v118.187z" />
<glyph unicode="&#xe903;" glyph-name="Autocomplete" d="M983.893 436.053h-943.787c-17.673 0-32 14.327-32 32v0 278.613c0 17.673 14.327 32 32 32v0h943.787c17.673 0 32-14.327 32-32v0-277.333c0.016-0.382 0.026-0.83 0.026-1.28 0-17.673-14.327-32-32-32-0.009 0-0.018 0-0.027 0h0.001zM72.107 500.053h879.787v213.333h-879.787zM87.893 648.107h341.333v-85.333h-341.333v85.333zM981.333 366.080v-226.133h-951.040v226.133h951.040zM1002.667 387.413h-993.707v-268.8h993.28v268.8z" />
<glyph unicode="&#xe904;" glyph-name="Button" d="M987.733 202.667h-951.467c-17.673 0-32 14.327-32 32v0 426.667c0 17.673 14.327 32 32 32v0h951.467c17.673 0 32-14.327 32-32v0-426.667c0-17.673-14.327-32-32-32v0zM68.267 266.667h887.467v362.667h-887.467zM206.507 551.68h610.56c23.564 0 42.667-19.103 42.667-42.667v-122.453c0-23.564-19.103-42.667-42.667-42.667h-610.56c-23.564 0-42.667 19.103-42.667 42.667v122.453c0 23.564 19.103 42.667 42.667 42.667z" />
<glyph unicode="&#xe905;" glyph-name="Calendar" d="M780.8 755.2h-38.4v76.8h-76.8v-76.8h-307.2v76.8h-76.8v-76.8h-38.4c-42.318-0.241-76.559-34.482-76.8-76.777v-537.623c0.241-42.318 34.482-76.559 76.777-76.8h537.623c42.318 0.241 76.559 34.482 76.8 76.777v537.623c-0.241 42.318-34.482 76.559-76.777 76.8h-0.023zM780.8 140.8h-537.6v422.4h537.6zM339.2 505.6h150.613v-115.2h-150.613v115.2zM534.187 505.6h150.613v-115.2h-150.613v115.2zM339.2 323.413h150.613v-115.2h-150.613v115.2zM534.187 323.413h150.613v-115.2h-150.613v115.2z" />
<glyph unicode="&#xe906;" glyph-name="Chart" d="M822.187 758.187h-124.16c-17.202 0-31.147-13.945-31.147-31.147v-558.507c0-17.202 13.945-31.147 31.147-31.147v0h124.16c17.202 0 31.147 13.945 31.147 31.147v0 558.933c-0.241 17.017-14.092 30.72-31.144 30.72-0.001 0-0.002 0-0.003 0v0zM791.040 199.68h-61.867v496.64h61.867zM573.867 603.307h-123.733c-17.202 0-31.147-13.945-31.147-31.147v0-403.2c0-17.202 13.945-31.147 31.147-31.147v0h124.16c17.202 0 31.147 13.945 31.147 31.147v403.2c0 0.001 0 0.002 0 0.003 0 17.202-13.945 31.147-31.147 31.147-0.15 0-0.3-0.001-0.449-0.003h0.023zM542.72 200.107h-61.867v341.333h61.867zM325.973 448h-124.16c-17.202 0-31.147-13.945-31.147-31.147v0-248.32c0-17.202 13.945-31.147 31.147-31.147h124.16c17.202 0 31.147 13.945 31.147 31.147v0 248.32c0 17.202-13.945 31.147-31.147 31.147v0zM294.827 199.68h-62.293v186.453h62.293z" />
<glyph unicode="&#xe907;" glyph-name="Circular-Gauge" d="M512 733.013c-259.206 0-469.333-210.128-469.333-469.333v0c0-13.227 0-27.733 0-42.667 0-32.519 26.361-58.88 58.88-58.88v0h194.133v76.8h-177.493c0 8.533 0 16.213 0 23.893 0 216.79 175.743 392.533 392.533 392.533s392.533-175.743 392.533-392.533v0c0-7.68 0-15.36 0-24.32-17.067 0-42.667 0-74.24 0h-103.68v-76.8h194.56c0.644-0.025 1.4-0.039 2.159-0.039 32.754 0 59.307 26.552 59.307 59.307 0 0.614-0.009 1.226-0.028 1.835l0.002-0.089c0 14.933 0 28.16 0 42.667-0.97 258.471-210.725 467.627-469.33 467.627-0.001 0-0.002 0-0.003 0h-0.001zM384 538.027l76.8-346.027c1.945-8.259 5.185-15.533 9.536-21.996l-0.15 0.236c12.060-15.297 30.59-25.027 51.393-25.027 36.053 0 65.28 29.227 65.28 65.28 0 11.7-3.078 22.681-8.468 32.177l0.169-0.323z" />
<glyph unicode="&#xe908;" glyph-name="Combobox" d="M981.333 436.053h-938.667c-17.673 0-32 14.327-32 32v0 278.613c0.706 17.114 14.751 30.72 31.974 30.72 0.009 0 0.018 0 0.027 0h938.665c17.673 0 32-14.327 32-32v0-277.333c0-17.673-14.327-32-32-32v0zM75.093 500.053h873.813v213.333h-873.813zM822.187 570.453l-70.827 72.533h142.080l-71.253-72.533zM100.267 648.107h588.373v-85.333h-588.373v85.333zM983.893 366.080v-226.133h-950.613v226.133h950.613zM1005.227 387.413h-993.28v-268.8h993.28v268.8z" />
<glyph unicode="&#xe909;" glyph-name="Context-menu" d="M241.493 572.587h512c11.782 0 21.333 9.551 21.333 21.333s-9.551 21.333-21.333 21.333v0h-512c-11.782 0-21.333-9.551-21.333-21.333s9.551-21.333 21.333-21.333v0zM241.493 424.96h512c11.782 0 21.333 9.551 21.333 21.333s-9.551 21.333-21.333 21.333v0h-512c-11.782 0-21.333-9.551-21.333-21.333s9.551-21.333 21.333-21.333v0zM241.493 277.333h512c11.782 0 21.333 9.551 21.333 21.333s-9.551 21.333-21.333 21.333v0h-512c-11.782 0-21.333-9.551-21.333-21.333s9.551-21.333 21.333-21.333v0zM957.44 797.867h-890.88c-17.673 0-32-14.327-32-32v0-635.733c0-17.673 14.327-32 32-32v0h890.88c17.673 0 32 14.327 32 32v0 635.733c0 17.673-14.327 32-32 32v0zM925.44 162.133h-826.88v571.733h826.88z" />
<glyph unicode="&#xe90a;" glyph-name="Copy-to-clipboard" d="M669.013 762.027h-418.987v-488.533h-69.547v488.533c0 0 0 0.001 0 0.001 0 38.495 31.085 69.73 69.547 69.972h418.987zM773.973 692.48v0c38.645 0 69.973-31.328 69.973-69.973v-488.533c0-38.645-31.328-69.973-69.973-69.973h-384c-38.645 0-69.973 31.328-69.973 69.973v488.533c0 0 0 0.001 0 0.001 0 38.495 31.085 69.73 69.547 69.972h384zM389.547 133.973h384v488.533h-384z" />
<glyph unicode="&#xe90b;" glyph-name="Currency" d="M512 874.667c-235.641 0-426.667-191.025-426.667-426.667s191.025-426.667 426.667-426.667c235.641 0 426.667 191.025 426.667 426.667v0c0 235.641-191.025 426.667-426.667 426.667v0zM572.16 188.16v-81.493h-113.92v82.347c-74.965 9.152-133.342 69.431-139.483 144.499l-0.037 0.568h85.333c4.267-42.667 34.987-79.787 113.067-79.787s102.4 42.667 102.4 67.84c0 35.413-18.773 68.693-113.92 91.307-105.813 25.6-178.347 69.12-178.347 156.587-1.707 73.387 56.747 121.173 130.987 136.96v82.347h113.92v-85.333c68.668-13.986 119.884-73.091 121.597-144.458l0.003-0.182h-85.333c0 47.36-27.307 79.787-94.72 79.787s-102.4-29.013-102.4-69.973 27.733-59.307 113.92-81.493 178.347-59.307 178.347-166.827c1.28-75.947-57.173-118.613-131.413-132.693z" />
<glyph unicode="&#xe90c;" glyph-name="date-range-picker" d="M780.8 755.2h-38.4v76.8h-76.8v-76.8h-307.2v76.8h-76.8v-76.8h-38.4c-42.318-0.241-76.559-34.482-76.8-76.777v-537.623c0.241-42.318 34.482-76.559 76.777-76.8h537.623c42.318 0.241 76.559 34.482 76.8 76.777v537.623c-0.241 42.318-34.482 76.559-76.777 76.8h-0.023zM780.8 140.8h-537.6v422.4h537.6v-422.4zM300.8 511.147h422.827v-105.813h-422.827v105.813zM300.8 340.48h211.2v-105.813h-211.2v105.813z" />
<glyph unicode="&#xe90d;" glyph-name="Datepicker" d="M780.8 755.2h-38.4v76.8h-76.8v-76.8h-307.2v76.8h-76.8v-76.8h-38.4c-42.318-0.241-76.559-34.482-76.8-76.777v-537.623c0.241-42.318 34.482-76.559 76.777-76.8h537.623c42.318 0.241 76.559 34.482 76.8 76.777v537.623c-0.241 42.318-34.482 76.559-76.777 76.8h-0.023zM780.8 140.8h-537.6v422.4h537.6v-422.4zM300.8 511.147h170.667v-170.667h-170.667v170.667z" />
<glyph unicode="&#xe90e;" glyph-name="Dialog" d="M938.667 853.333h-853.333c-11.782 0-21.333-9.551-21.333-21.333v0-768c0-11.782 9.551-21.333 21.333-21.333v0h853.333c11.782 0 21.333 9.551 21.333 21.333v0 768c0 11.782-9.551 21.333-21.333 21.333v0zM917.333 810.667v-356.267h-810.667v356.267zM106.667 433.067h394.667v-347.733h-394.667zM522.667 85.333v347.733h394.667v-347.733zM413.013 353.28c-2.87 2.944-6.875 4.769-11.307 4.769s-8.436-1.826-11.303-4.766l-0.003-0.003-134.4-157.867-49.067 60.16c-2.935 3.469-7.292 5.657-12.16 5.657-8.78 0-15.897-7.117-15.897-15.897 0-3.912 1.413-7.494 3.757-10.263l-0.019 0.023 62.72-74.667c2.988-3.408 7.349-5.547 12.211-5.547 0.057 0 0.114 0 0.171 0.001h-1.716c0.048-0.001 0.105-0.001 0.162-0.001 4.862 0 9.224 2.14 12.195 5.529l0.016 0.019 145.493 170.667c2.57 2.799 4.144 6.546 4.144 10.662 0 4.542-1.918 8.637-4.989 11.517l-0.009 0.008zM816.213 352.427c-2.917 2.841-6.907 4.593-11.307 4.593s-8.389-1.752-11.31-4.596l0.004 0.003-73.813-75.093-73.813 73.813c-2.976 4.139-7.778 6.803-13.203 6.803-8.954 0-16.213-7.259-16.213-16.213 0-5.424 2.664-10.227 6.755-13.17l0.048-0.033 73.813-73.813-74.24-72.96c-1.882-2.614-3.011-5.881-3.011-9.411 0-8.954 7.259-16.213 16.213-16.213 3.53 0 6.797 1.128 9.459 3.044l-0.048-0.033 74.24 75.52 73.813-73.813c2.976-4.139 7.778-6.803 13.203-6.803 8.954 0 16.213 7.259 16.213 16.213 0 5.424-2.664 10.227-6.755 13.17l-0.048 0.033-73.813 72.533 73.813 73.813c2.841 2.917 4.593 6.907 4.593 11.307s-1.752 8.389-4.596 11.31l0.003-0.004zM220.587 675.413h590.080c11.782 0 21.333 9.551 21.333 21.333s-9.551 21.333-21.333 21.333v0h-590.080c-11.782 0-21.333-9.551-21.333-21.333s9.551-21.333 21.333-21.333v0zM220.587 555.947h344.747c11.782 0 21.333 9.551 21.333 21.333s-9.551 21.333-21.333 21.333v0h-344.747c-11.782 0-21.333-9.551-21.333-21.333s9.551-21.333 21.333-21.333v0z" />
<glyph unicode="&#xe90f;" glyph-name="Dropdown" d="M321.28 576l190.72-256 190.72 256h-381.44z" />
<glyph unicode="&#xe910;" glyph-name="Dropdownlist" d="M977.493 436.053h-930.987c-17.673 0-32 14.327-32 32v0 278.613c0 17.673 14.327 32 32 32v0h930.987c17.673 0 32-14.327 32-32v0-277.333c0.016-0.382 0.026-0.83 0.026-1.28 0-17.673-14.327-32-32-32-0.009 0-0.018 0-0.027 0h0.001zM78.507 500.053h866.987v213.333h-866.987zM987.307 366.080v-226.133h-950.613v226.133h950.613zM1008.64 387.413h-993.28v-268.8h993.28v268.8zM819.2 570.453l-71.253 72.533h142.080l-70.827-72.533z" />
<glyph unicode="&#xe911;" glyph-name="Editinplunkr" d="M192 261.12v-133.12h133.12l393.387 393.387-133.12 133.12-393.387-393.387zM821.76 624.213c6.36 6.4 10.292 15.221 10.292 24.96s-3.931 18.56-10.293 24.962l-85.331 85.331c-6.4 6.36-15.221 10.292-24.96 10.292s-18.56-3.931-24.962-10.293l0.002 0.002-63.147-66.987 133.547-133.547z" />
<glyph unicode="&#xe912;" glyph-name="Form-validator" d="M621.653 759.040h-581.12c-17.673 0-32-14.327-32-32v0-213.333c0-17.673 14.327-32 32-32v0h581.12c17.673 0 32 14.327 32 32v0 213.333c0 17.673-14.327 32-32 32v0zM589.653 545.707h-517.12v149.333h517.12zM621.653 414.293h-581.12c-17.673 0-32-14.327-32-32v0-213.333c0-17.673 14.327-32 32-32v0h581.12c17.673 0 32 14.327 32 32v0 213.333c0 17.673-14.327 32-32 32v0zM589.653 200.96h-517.12v149.333h517.12zM814.507 512.427c5.855-6.995 14.56-11.435 24.306-11.52h0.014c0.028 0 0.061 0 0.094 0 9.663 0 18.325 4.283 24.193 11.054l0.034 0.040 148.907 174.933c4.987 5.663 8.031 13.143 8.031 21.333 0 17.867-14.484 32.351-32.351 32.351-9.676 0-18.361-4.248-24.289-10.982l-0.031-0.036-124.16-147.2-40.107 47.787c-5.993 6.865-14.759 11.178-24.533 11.178-17.956 0-32.511-14.556-32.511-32.511 0-8.182 3.022-15.657 8.011-21.372l-0.033 0.038zM926.293 277.333l85.333 85.333c7.537 5.911 12.335 15.017 12.335 25.244 0 17.673-14.327 32-32 32-11.196 0-21.048-5.749-26.767-14.457l-0.075-0.121-85.333-85.333-85.333 85.333c-5.699 5.321-13.376 8.588-21.815 8.588-17.673 0-32-14.327-32-32 0-8.44 3.267-16.116 8.606-21.834l-0.017 0.019 85.333-85.333-85.333-85.333c-6.274-5.858-10.185-14.178-10.185-23.412 0-17.673 14.327-32 32-32 9.234 0 17.554 3.911 23.394 10.166l0.017 0.019 85.333 85.333 85.333-85.333c5.882-5.576 13.847-9.004 22.613-9.004 18.169 0 32.898 14.729 32.898 32.898 0 9.403-3.945 17.884-10.269 23.879l-0.015 0.014z" />
<glyph unicode="&#xe913;" glyph-name="Grid" d="M170.667 789.333v-682.667h682.667v682.667zM472.747 168.533h-232.533v128h232.533zM472.747 352.427h-232.533v128h232.533zM472.747 536.32h-232.533v128h232.533zM776.96 168.533h-239.36v128h239.36zM776.96 352.427h-239.36v128h239.36zM776.96 536.32h-239.36v128h239.36z" />
<glyph unicode="&#xe914;" glyph-name="Hamburger" d="M128 277.333h768v-85.333h-768v85.333zM128 490.667h768v-85.333h-768v85.333zM128 704h768v-85.333h-768v85.333z" />
<glyph unicode="&#xe915;" glyph-name="Home" d="M433.92 115.627v234.667h156.16v-234.667h195.84v312.747h117.333l-391.253 352-391.253-352h117.333v-312.747h195.84z" />
<glyph unicode="&#xe916;" glyph-name="Linear-gauge" d="M682.667 326.4l-160 298.667h320l-160-298.667zM981.333 526.933h-167.253l-45.653-85.333h170.667v-128h-239.36l-17.067-32-17.067 32h-580.267v128h512l-45.653 85.333h-509.013c-23.564 0-42.667-19.103-42.667-42.667v0-213.333c0-23.564 19.103-42.667 42.667-42.667v0h938.667c23.564 0 42.667 19.103 42.667 42.667v0 213.333c0 23.564-19.103 42.667-42.667 42.667v0z" />
<glyph unicode="&#xe917;" glyph-name="Listview" d="M418.56 789.333v-60.587h498.773v60.587zM106.667 853.333v-186.88h186.88v186.88zM170.667 789.333v-60.587h60.587v60.587zM106.667 541.44v-186.88h186.88v186.88zM170.667 479.147v-62.293h60.587v62.293zM420.267 479.147v-62.293h497.067v62.293zM106.667 229.547v-186.88h186.88v186.88zM170.667 167.253v-60.587h60.587v60.587zM420.267 167.253v-60.587h497.067v60.587z" />
<glyph unicode="&#xe918;" glyph-name="Localization" d="M512 874.667c-235.641 0-426.667-191.025-426.667-426.667s191.025-426.667 426.667-426.667c235.641 0 426.667 191.025 426.667 426.667v0c0 235.641-191.025 426.667-426.667 426.667v0zM807.68 618.667h-125.013c-14.76 57.735-34.919 108.279-60.616 155.367l1.736-3.474c78.598-27.913 142.316-81.406 182.594-150.278l0.873-1.615zM512 789.333c34.171-48.97 61.956-105.654 80.383-166.409l1.11-4.258h-162.987c19.56 65.011 47.344 121.693 82.794 172.641l-1.3-1.974zM181.76 362.667c-7.019 25.601-11.053 54.996-11.053 85.333s4.033 59.733 11.593 87.679l-0.54-2.345h144.213c-3.525-25.38-5.687-54.959-5.971-84.987l-0.003-0.347c0.287-30.374 2.449-59.953 6.376-88.971l-0.403 3.638zM216.747 277.333h124.587c14.832-57.754 34.986-108.292 60.631-155.409l-1.751 3.516c-78.598 27.913-142.316 81.406-182.594 150.278l-0.873 1.615zM341.333 618.667h-124.587c41.447 70.693 105.637 124.242 182.355 151.162l2.392 0.731c-24.319-43.604-44.888-94.108-59.094-147.212l-1.066-4.681zM512 106.667c-34.149 48.974-61.933 105.656-80.38 166.4l-1.114 4.266h162.987c-19.537-65.012-47.323-121.696-82.789-172.633l1.296 1.966zM611.84 362.667h-199.68c-4.018 25.4-6.488 54.931-6.824 84.974l-0.003 0.36c0.321 30.385 2.791 59.917 7.267 88.785l-0.441-3.452h199.68c4.014-25.397 6.483-54.927 6.823-84.969l0.003-0.364c-0.363-30.424-2.832-59.954-7.269-88.834l0.443 3.501zM622.507 125.44c24.387 43.616 44.96 94.127 59.11 147.257l1.050 4.636h128c-42.232-71.252-107.687-124.949-185.752-151.191l-2.408-0.702zM698.027 362.667c3.525 25.38 5.687 54.959 5.971 84.987l0.003 0.347c-0.287 30.374-2.449 59.953-6.376 88.971l0.403-3.638h144.213c7.047-25.599 11.097-54.993 11.097-85.333s-4.050-59.734-11.638-87.671l0.541 2.338z" />
<glyph unicode="&#xe919;" glyph-name="Maskedtextbox" d="M987.733 481.707h-951.467c-17.673 0-32 14.327-32 32v0 213.333c0 17.673 14.327 32 32 32v0h951.467c17.673 0 32-14.327 32-32v0-213.333c0-17.673-14.327-32-32-32v0zM68.267 545.707h887.467v149.333h-887.467zM987.733 136.96h-951.467c-17.673 0-32 14.327-32 32v0 213.333c0 17.673 14.327 32 32 32v0h951.467c17.673 0 32-14.327 32-32v0-213.333c0-17.673-14.327-32-32-32v0zM68.267 200.96h887.467v149.333h-887.467zM224.853 599.040h-89.173c-11.782 0-21.333 9.551-21.333 21.333s9.551 21.333 21.333 21.333v0h89.173c11.782 0 21.333-9.551 21.333-21.333s-9.551-21.333-21.333-21.333v0zM857.6 599.040h-138.667c-11.782 0-21.333 9.551-21.333 21.333s9.551 21.333 21.333 21.333v0h138.667c11.782 0 21.333-9.551 21.333-21.333s-9.551-21.333-21.333-21.333v0zM626.773 599.040h-313.173c-11.782 0-21.333 9.551-21.333 21.333s9.551 21.333 21.333 21.333v0h313.173c11.782 0 21.333-9.551 21.333-21.333s-9.551-21.333-21.333-21.333v0zM224.853 254.293h-89.173c-11.782 0-21.333 9.551-21.333 21.333s9.551 21.333 21.333 21.333v0h89.173c11.782 0 21.333-9.551 21.333-21.333s-9.551-21.333-21.333-21.333v0zM857.6 254.293h-138.667c-11.782 0-21.333 9.551-21.333 21.333s9.551 21.333 21.333 21.333v0h138.667c11.782 0 21.333-9.551 21.333-21.333s-9.551-21.333-21.333-21.333v0zM626.773 254.293h-313.173c-11.782 0-21.333 9.551-21.333 21.333s9.551 21.333 21.333 21.333v0h313.173c11.782 0 21.333-9.551 21.333-21.333s-9.551-21.333-21.333-21.333v0z" />
<glyph unicode="&#xe91a;" glyph-name="Multiselect" d="M986.88 695.893h-949.76c-17.673 0-32-14.327-32-32v0-431.787c0-17.673 14.327-32 32-32v0h949.76c17.673 0 32 14.327 32 32v0 431.787c0 17.673-14.327 32-32 32v0zM954.88 264.533h-885.76v367.36h885.76zM127.147 566.613h185.173v-85.333h-185.173v85.333zM127.147 413.44h413.44v-85.333h-413.44v85.333zM581.547 413.44h308.48v-85.333h-308.48v85.333zM360.533 566.613h221.013v-85.333h-221.013v85.333zM635.307 566.613h255.147v-85.333h-255.147v85.333z" />
<glyph unicode="&#xe91b;" glyph-name="Next" d="M298.667 186.88l263.68 261.12-263.68 261.12 81.067 80.213 345.6-341.333-345.6-341.333-81.067 80.213z" />
<glyph unicode="&#xe91c;" glyph-name="Numeric-Textbox" d="M987.733 160h-951.467c-17.673 0-32 14.327-32 32v0 512c0 17.673 14.327 32 32 32v0h951.467c17.673 0 32-14.327 32-32v0-512c0-17.673-14.327-32-32-32v0zM68.267 224h887.467v448h-887.467zM803.413 276.053l-96 115.627h191.573l-95.573-115.627zM801.28 619.947l96-115.627h-191.573l95.573 115.627zM132.693 512h381.867v-128h-381.867v128z" />
<glyph unicode="&#xe91d;" glyph-name="Popout" d="M777.387 182.613h-530.773v530.773h265.387v75.947h-265.387c-41.944 0-75.947-34.002-75.947-75.947v0-530.773c0-41.944 34.002-75.947 75.947-75.947v0h530.773c41.944 0 75.947 34.002 75.947 75.947v0 265.387h-75.947zM587.947 789.333v-75.947h136.107l-372.907-372.907 53.333-53.333 372.907 372.907v-136.107h75.947v265.387h-265.387z" />
<glyph unicode="&#xe91e;" glyph-name="Popup" d="M957.44 797.867h-890.88c-17.673 0-32-14.327-32-32v0-635.733c0-17.673 14.327-32 32-32v0h890.88c17.673 0 32 14.327 32 32v0 635.733c0 17.673-14.327 32-32 32v0zM925.44 162.133h-826.88v571.733h826.88zM597.333 448c3.867-3.898 9.225-6.31 15.147-6.31s11.28 2.413 15.145 6.309l80.641 80.641 78.933-80.64c3.876-3.876 9.232-6.274 15.147-6.274 11.83 0 21.421 9.59 21.421 21.421 0 5.915-2.398 11.27-6.274 15.147v0l-81.067 78.507 80.64 80.64c3.876 3.876 6.274 9.232 6.274 15.147 0 11.83-9.59 21.421-21.421 21.421-5.915 0-11.27-2.398-15.147-6.274v0l-80.213-80.64-80.64 80.64c-3.876 3.876-9.232 6.274-15.147 6.274-11.83 0-21.421-9.59-21.421-21.421 0-5.915 2.398-11.27 6.274-15.147l80.64-80.64-78.933-80.64c-3.295-3.736-5.306-8.673-5.306-14.080s2.011-10.344 5.326-14.103l-0.020 0.023z" />
<glyph unicode="&#xe91f;" glyph-name="Previous" d="M725.333 186.88l-263.68 261.12 263.68 261.12-81.067 80.213-345.6-341.333 345.6-341.333 81.067 80.213z" />
<glyph unicode="&#xe920;" glyph-name="Responsive" d="M170.667 704h768v85.333h-768c-47.128 0-85.333-38.205-85.333-85.333v0-469.333h-85.333v-128h597.333v128h-426.667zM981.333 618.667h-256c-23.564 0-42.667-19.103-42.667-42.667v0-426.667c0-23.564 19.103-42.667 42.667-42.667v0h256c23.564 0 42.667 19.103 42.667 42.667v0 426.667c0 23.564-19.103 42.667-42.667 42.667v0zM938.667 234.667h-170.667v298.667h170.667z" />
<glyph unicode="&#xe921;" glyph-name="Search" d="M672.427 351.573h-32.427l-13.227 11.093c41.633 48.289 66.989 111.635 66.989 180.904 0 153.403-124.357 277.76-277.76 277.76s-277.76-124.357-277.76-277.76c0-153.403 124.357-277.76 277.76-277.76 69.269 0 132.615 25.356 181.264 67.293l-0.36-0.304 11.52-11.947v-33.707l213.333-213.333 63.573 63.573zM416.427 351.573c-106.039 0-192 85.961-192 192s85.961 192 192 192c106.039 0 192-85.961 192-192v0c0-0.127 0-0.277 0-0.427 0-105.803-85.77-191.573-191.573-191.573-0.15 0-0.3 0-0.45 0.001h0.023z" />
<glyph unicode="&#xe922;" glyph-name="Selection" d="M387.84 299.093l-162.987 160.427-54.187-53.333 217.173-214.187 465.493 458.667-54.187 53.333-411.307-404.907z" />
<glyph unicode="&#xe923;" glyph-name="Settings-Preferences" d="M554.667 661.333c0-94.257-76.41-170.667-170.667-170.667s-170.667 76.41-170.667 170.667c0 94.257 76.41 170.667 170.667 170.667s170.667-76.41 170.667-170.667zM981.333 618.667c23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667v0h-384c2.741-12.827 4.31-27.563 4.31-42.667s-1.569-29.84-4.554-44.056l0.244 1.389zM42.667 618.667h128c-2.686 12.827-4.224 27.567-4.224 42.667s1.538 29.839 4.466 44.072l-0.242-1.406h-128c-23.564 0-42.667-19.103-42.667-42.667s19.103-42.667 42.667-42.667v0zM981.333 277.333h-128c2.686-12.827 4.224-27.567 4.224-42.667s-1.538-29.839-4.466-44.072l0.242 1.406h128c23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667v0zM42.667 277.333c-23.564 0-42.667-19.103-42.667-42.667s19.103-42.667 42.667-42.667v0h384c-2.741 12.827-4.31 27.563-4.31 42.667s1.569 29.84 4.554 44.056l-0.244-1.389zM810.667 234.667c0-94.257-76.41-170.667-170.667-170.667s-170.667 76.41-170.667 170.667c0 94.257 76.41 170.667 170.667 170.667s170.667-76.41 170.667-170.667z" />
<glyph unicode="&#xe924;" glyph-name="Slider" d="M653.653 618.667c-0.137 0-0.299 0.001-0.462 0.001-92.371 0-167.253-74.882-167.253-167.253 0-1.2 0.013-2.398 0.038-3.592l-0.003 0.178c2.143-94.428 78.974-170.213 173.609-170.667h0.044c0.137 0 0.299-0.001 0.462-0.001 92.371 0 167.253 74.882 167.253 167.253 0 1.2-0.013 2.398-0.038 3.592l0.003-0.178c-2.143 94.428-78.974 170.213-173.609 170.667h-0.044zM971.947 490.667h-106.667c2.792-12.826 4.391-27.56 4.391-42.667s-1.599-29.841-4.637-44.041l0.246 1.374h105.813c23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667v0zM447.147 490.667h-395.093c-23.564 0-42.667-19.103-42.667-42.667s19.103-42.667 42.667-42.667v0h396.373c-2.78 12.826-4.373 27.56-4.373 42.667s1.592 29.84 4.618 44.044l-0.246-1.377z" />
<glyph unicode="&#xe925;" glyph-name="Tab" d="M163.84 435.627c0-11.782 9.551-21.333 21.333-21.333v0h615.253c11.782 0 21.333 9.551 21.333 21.333s-9.551 21.333-21.333 21.333v0h-615.253c-11.782 0-21.333-9.551-21.333-21.333v0zM697.173 309.333h-512c-11.782 0-21.333-9.551-21.333-21.333s9.551-21.333 21.333-21.333v0h512c11.782 0 21.333 9.551 21.333 21.333s-9.551 21.333-21.333 21.333v0zM957.44 614.827v119.040c0 23.564-19.103 42.667-42.667 42.667v0h-170.667c-23.564 0-42.667-19.103-42.667-42.667v0-118.613h-47.787v118.613c0 23.564-19.103 42.667-42.667 42.667v0h-170.667c-23.564 0-42.667-19.103-42.667-42.667v0-118.613h-61.867v139.52c0 17.673-14.327 32-32 32v0h-237.227c-17.673 0-32-14.327-32-32v0-635.307c0-17.673 14.327-32 32-32v0h890.88c17.673 0 32 14.327 32 32v0 463.36c0 17.673-14.327 32-32 32v0zM925.44 149.333h-826.88v573.867h174.080v-139.52c0-17.673 14.327-32 32-32v0h620.8z" />
<glyph unicode="&#xe926;" glyph-name="Textboxes" d="M989.44 481.707h-954.88c-17.673 0-32 14.327-32 32v0 213.333c0 17.673 14.327 32 32 32v0h954.88c17.673 0 32-14.327 32-32v0-213.333c0-17.673-14.327-32-32-32v0zM66.56 545.707h890.88v149.333h-890.88zM989.44 136.96h-954.88c-17.673 0-32 14.327-32 32v0 213.333c0 17.673 14.327 32 32 32v0h954.88c17.673 0 32-14.327 32-32v0-213.333c0-17.673-14.327-32-32-32v0zM66.56 200.96h890.88v149.333h-890.88zM101.973 307.627h264.107v-64h-264.107v64zM101.973 652.373h524.8v-64h-524.8v64z" />
<glyph unicode="&#xe927;" glyph-name="Timepicker" d="M657.067 354.987l-114.773 64.853v236.8c0 17.202-13.945 31.147-31.147 31.147s-31.147-13.945-31.147-31.147v0-256c-0.030-0.51-0.047-1.106-0.047-1.707s0.017-1.197 0.051-1.789l-0.004 0.082v-18.773h4.693l130.56-73.813c4.42-2.531 9.716-4.024 15.36-4.024 17.303 0 31.33 14.027 31.33 31.33 0 11.659-6.368 21.83-15.816 27.226l-0.154 0.081zM512 874.667c-235.641 0-426.667-191.025-426.667-426.667s191.025-426.667 426.667-426.667c235.641 0 426.667 191.025 426.667 426.667v0c0 235.641-191.025 426.667-426.667 426.667v0zM539.307 90.453v62.293h-54.613v-62.293c-168.46 13.295-303.456 140.995-327.866 304.806l-0.241 1.968h64.427v54.187h-67.84c2.175 186.935 146.792 339.412 330.26 354.052l1.26 0.081v-62.293h54.187v62.293c184.728-14.721 329.345-167.198 331.518-353.917l0.002-0.216h-64v-54.187h61.013c-24.65-165.779-159.647-293.479-326.856-306.694l-1.251-0.079z" />
<glyph unicode="&#xe928;" glyph-name="Toolbar" d="M983.893 778.667h-943.787c-17.673 0-32-14.327-32-32v0-597.333c0-17.673 14.327-32 32-32v0h943.787c17.673 0 32 14.327 32 32v0 597.333c0 17.673-14.327 32-32 32v0zM951.893 181.333h-879.787v533.333h879.787zM165.547 666.88h170.667v-170.667h-170.667v170.667zM426.667 666.88h170.667v-170.667h-170.667v170.667zM688.213 666.88h170.667v-170.667h-170.667v170.667zM165.547 404.48h170.667v-170.667h-170.667v170.667zM426.667 404.48h170.667v-170.667h-170.667v170.667zM688.213 404.48h170.667v-170.667h-170.667v170.667z" />
<glyph unicode="&#xe929;" glyph-name="Tooltip" d="M252.16 641.707h519.68c11.782 0 21.333 9.551 21.333 21.333s-9.551 21.333-21.333 21.333v0h-519.68c-11.782 0-21.333-9.551-21.333-21.333s9.551-21.333 21.333-21.333v0zM252.16 513.707h519.68c11.782 0 21.333 9.551 21.333 21.333s-9.551 21.333-21.333 21.333v0h-519.68c-11.782 0-21.333-9.551-21.333-21.333s9.551-21.333 21.333-21.333v0zM252.16 385.707h302.507c11.782 0 21.333 9.551 21.333 21.333s-9.551 21.333-21.333 21.333v0h-302.507c-11.782 0-21.333-9.551-21.333-21.333s9.551-21.333 21.333-21.333v0zM957.44 861.867h-890.88c-17.673 0-32-14.327-32-32v0-635.733c0-17.673 14.327-32 32-32v0h294.827l128-119.467c5.635-5.057 13.123-8.149 21.333-8.149s15.698 3.092 21.363 8.175l-0.030-0.026 125.013 119.040h298.667c17.673 0 32 14.327 32 32v0 636.16c0 0.014 0 0.030 0 0.046 0 17.073-13.37 31.023-30.211 31.951l-0.082 0.004zM925.44 226.133h-279.467c-8.622-0.006-16.445-3.42-22.196-8.969l0.010 0.009-111.787-107.093-116.053 107.52c-5.692 5.288-13.345 8.533-21.756 8.533-0.001 0-0.003 0-0.004 0h-275.626v571.733h826.88z" />
<glyph unicode="&#xe92a;" glyph-name="Tree-Down" d="M768 546.133l-256-256.427-256 256.427 60.16 60.16 195.84-195.84 195.84 195.84 60.16-60.16z" />
<glyph unicode="&#xe92b;" glyph-name="Treeview" d="M640 320v-64h-128v128h64v256h-256v-64h-128v128h64v192h-192v-192h64v-192h192v-128h128v-192h192v-192h320v320h-320z" />
<glyph unicode="&#xe92c;" glyph-name="Palette" d="M512 832c-212.077 0-384-171.923-384-384s171.923-384 384-384v0c0.013 0 0.027 0 0.042 0 35.346 0 64 28.654 64 64 0 16.623-6.337 31.765-16.727 43.143l0.045-0.050c-10.202 11.235-16.448 26.223-16.448 42.67 0 35.111 28.463 63.573 63.573 63.573 0.232 0 0.464-0.001 0.696-0.004h75.485c117.821 0 213.333 95.513 213.333 213.333v0c0 188.587-170.667 341.333-384 341.333zM277.333 448c-35.346 0-64 28.654-64 64s28.654 64 64 64c35.346 0 64-28.654 64-64v0c0-35.346-28.654-64-64-64v0zM405.333 618.667c-35.346 0-64 28.654-64 64s28.654 64 64 64c35.346 0 64-28.654 64-64v0c0-35.346-28.654-64-64-64v0zM618.667 618.667c-35.346 0-64 28.654-64 64s28.654 64 64 64c35.346 0 64-28.654 64-64v0c0-35.346-28.654-64-64-64v0zM746.667 448c-35.346 0-64 28.654-64 64s28.654 64 64 64c35.346 0 64-28.654 64-64v0c0-35.346-28.654-64-64-64v0z" />
<glyph unicode="&#xe92d;" glyph-name="Code" d="M341.333 704l-256-256 256-256 59.733 59.733-196.267 196.267 196.267 196.267-59.733 59.733zM682.667 704l-59.733-59.733 196.267-196.267-196.267-196.267 59.733-59.733 256 256-256 256z" />
<glyph unicode="&#xe92e;" glyph-name="Demo" d="M810.667 832h-597.333c-47.128 0-85.333-38.205-85.333-85.333v0-597.333c0-47.128 38.205-85.333 85.333-85.333v0h597.333c47.128 0 85.333 38.205 85.333 85.333v0 597.333c0 47.128-38.205 85.333-85.333 85.333v0zM384 234.667h-85.333v298.667h85.333zM554.667 234.667h-85.333v426.667h85.333zM725.333 234.667h-85.333v170.667h85.333z" />
</font></defs></svg>

После

Ширина:  |  Высота:  |  Размер: 29 KiB

Двоичные данные
src/assets/images/sb-icons/fonts/icons.ttf Normal file

Двоичный файл не отображается.

Двоичные данные
src/assets/images/sb-icons/fonts/icons.woff Normal file

Двоичный файл не отображается.

Просмотреть файл

@ -0,0 +1,84 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 31 13" style="enable-background:new 0 0 31 13;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFFFFF;}
.st1{fill:url(#SVGID_1_);}
.st2{fill:url(#SVGID_2_);}
.st3{fill:url(#SVGID_5_);}
.st4{fill:none;stroke:#F3F3F3;stroke-width:2;stroke-miterlimit:10;}
.st5{fill:#F8F9FA;}
.st6{fill:#2E2E2E;}
.st7{fill:#4FA1D9;}
.st8{fill:url(#SVGID_6_);}
.st9{fill:url(#SVGID_7_);}
.st10{fill:url(#SVGID_8_);}
.st11{fill:none;stroke:#393939;stroke-miterlimit:10;}
.st12{fill:none;stroke:#DEDEDD;stroke-miterlimit:10;}
.st13{clip-path:url(#SVGID_18_);}
.st14{fill:#F3F3F3;}
.st15{fill:#C1C1C1;}
.st16{fill:#AAABAB;}
.st17{fill:#406187;}
.st18{fill:#66C1DC;}
.st19{fill:url(#SVGID_21_);}
.st20{fill:url(#SVGID_22_);}
.st21{fill:url(#SVGID_23_);}
.st22{fill:#F8FAFB;}
.st23{fill:#528FCC;}
.st24{fill:#6FBC46;}
.st25{fill:#F09521;}
.st26{fill:#E02228;}
.st27{fill:none;stroke:#F7F6F8;stroke-miterlimit:10;}
.st28{fill:#939393;}
.st29{fill:#DCDBDD;}
.st30{fill:url(#SVGID_26_);}
.st31{fill:url(#SVGID_27_);}
.st32{fill:url(#SVGID_28_);}
.st33{fill:url(#SVGID_29_);}
.st34{fill:url(#SVGID_30_);}
.st35{fill:url(#SVGID_31_);}
.st36{fill:url(#SVGID_32_);}
.st37{fill:url(#SVGID_33_);}
.st38{fill:url(#SVGID_34_);}
.st39{fill:url(#SVGID_35_);}
.st40{fill:url(#SVGID_36_);}
.st41{fill:#365677;}
.st42{fill:#5990BF;}
.st43{fill:none;stroke:#DCDBDD;stroke-width:2;stroke-miterlimit:10;}
.st44{fill:none;}
.st45{fill:#F9D8A1;}
.st46{fill:#519C9E;}
.st47{fill:#2F4F5E;}
.st48{fill:#9ED4DB;}
.st49{fill:#B78253;}
.st50{fill:#5B4324;}
.st51{fill:#286394;}
.st52{fill:#FFFFFF;stroke:#CCCCCC;stroke-miterlimit:10;}
.st53{fill:#6DBE46;}
.st54{fill:#EDB54C;}
.st55{fill:#1AB8D9;}
.st56{fill:#2A4551;}
.st57{fill:#3D6479;}
.st58{fill:#242322;}
.st59{fill:#8F652C;}
.st60{fill:#F8F7F9;}
.st61{fill:none;stroke:#75ABCB;stroke-miterlimit:10;}
.st62{fill:none;stroke:#ED1C24;stroke-miterlimit:10;}
.st63{fill:#CEDDA2;}
.st64{fill:url(#SVGID_37_);}
.st65{fill:#9CA76E;}
.st66{fill:#72723E;}
.st67{fill:#494728;}
</style>
<polygon class="st63" points="4,0 31,0 31,13 4,13 0,7 "/>
<g>
<path class="st66" d="M11.8,10h-1.3L7.2,4.9C7.1,4.7,7,4.6,7,4.4h0c0,0.1,0,0.5,0,1V10H5.9V3h1.4l3.2,5c0.1,0.2,0.2,0.4,0.3,0.4h0
c0-0.2,0-0.5,0-0.9V3h1.1V10z"/>
<path class="st66" d="M17.5,10h-3.9V3h3.8v1h-2.6v2h2.4v1h-2.4V9h2.8V10z"/>
<path class="st66" d="M27.6,3l-1.9,7h-1.3L23,5.1c-0.1-0.2-0.1-0.4-0.1-0.7h0c0,0.2-0.1,0.5-0.1,0.7L21.4,10h-1.3l-2-7h1.3l1.3,5.1
c0.1,0.2,0.1,0.4,0.1,0.7h0c0-0.2,0.1-0.4,0.1-0.7L22.4,3h1.2l1.3,5.2c0,0.2,0.1,0.4,0.1,0.6h0c0-0.2,0-0.4,0.1-0.6L26.4,3H27.6z"
/>
</g>
</svg>

После

Ширина:  |  Высота:  |  Размер: 2.8 KiB

Просмотреть файл

@ -0,0 +1,68 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 50 13" style="enable-background:new 0 0 50 13;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFFFFF;}
.st1{fill:url(#SVGID_1_);}
.st2{fill:url(#SVGID_2_);}
.st3{fill:url(#SVGID_5_);}
.st4{fill:none;stroke:#F3F3F3;stroke-width:2;stroke-miterlimit:10;}
.st5{fill:#F8F9FA;}
.st6{fill:#2E2E2E;}
.st7{fill:#4FA1D9;}
.st8{fill:url(#SVGID_6_);}
.st9{fill:url(#SVGID_7_);}
.st10{fill:none;stroke:#393939;stroke-miterlimit:10;}
.st11{fill:none;stroke:#DEDEDD;stroke-miterlimit:10;}
.st12{clip-path:url(#SVGID_15_);}
.st13{fill:#F3F3F3;}
.st14{fill:#C1C1C1;}
.st15{fill:#AAABAB;}
.st16{fill:#406187;}
.st17{fill:#66C1DC;}
.st18{fill:url(#SVGID_18_);}
.st19{fill:url(#SVGID_19_);}
.st20{fill:url(#SVGID_20_);}
.st21{fill:#F8FAFB;}
.st22{fill:#528FCC;}
.st23{fill:#6FBC46;}
.st24{fill:#F09521;}
.st25{fill:#E02228;}
.st26{fill:none;stroke:#F7F6F8;stroke-miterlimit:10;}
.st27{fill:#939393;}
.st28{fill:#DCDBDD;}
.st29{fill:url(#SVGID_23_);}
.st30{fill:url(#SVGID_24_);}
.st31{fill:url(#SVGID_25_);}
.st32{fill:url(#SVGID_26_);}
.st33{fill:url(#SVGID_27_);}
.st34{fill:url(#SVGID_28_);}
.st35{fill:url(#SVGID_29_);}
.st36{fill:url(#SVGID_30_);}
.st37{fill:url(#SVGID_31_);}
.st38{fill:url(#SVGID_32_);}
.st39{fill:url(#SVGID_33_);}
.st40{fill:#365677;}
.st41{fill:none;stroke:#DCDBDD;stroke-width:2;stroke-miterlimit:10;}
.st42{fill:none;}
.st43{fill:#F9D8A1;}
.st44{fill:#8F652C;}
</style>
<polygon class="st43" points="4,0 50,0 50,13 4,13 0,7 "/>
<g>
<path class="st44" d="M7.2,7.5V10H6V3h2.1C8.9,3,9.6,3.2,10,3.6s0.7,0.9,0.7,1.6S10.4,6.4,10,6.8S8.9,7.5,8.1,7.5H7.2z M7.2,4v2.6
h0.8c0.5,0,0.9-0.1,1.1-0.3c0.3-0.2,0.4-0.6,0.4-1C9.4,4.4,9,4,8,4H7.2z"/>
<path class="st44" d="M17.3,10h-1.4l-1.1-1.9c-0.1-0.2-0.2-0.3-0.3-0.4c-0.1-0.1-0.2-0.2-0.3-0.3S14,7.2,13.9,7.2s-0.2-0.1-0.4-0.1
H13V10h-1.2V3h2.3c0.3,0,0.6,0,0.9,0.1c0.3,0.1,0.5,0.2,0.7,0.4c0.2,0.2,0.4,0.4,0.5,0.6c0.1,0.2,0.2,0.5,0.2,0.8
c0,0.2,0,0.5-0.1,0.7C16.3,5.8,16.1,6,16,6.1c-0.1,0.2-0.3,0.3-0.5,0.4s-0.4,0.2-0.6,0.3v0C15,6.9,15.1,7,15.2,7.1
c0.1,0.1,0.2,0.2,0.3,0.3s0.2,0.2,0.3,0.3C15.8,7.7,15.9,7.9,16,8L17.3,10z M13,3.9v2.3h1c0.2,0,0.3,0,0.5-0.1
c0.2-0.1,0.3-0.1,0.4-0.2s0.2-0.2,0.3-0.4s0.1-0.3,0.1-0.5c0-0.3-0.1-0.6-0.3-0.8S14.4,3.9,14,3.9H13z"/>
<path class="st44" d="M22,10h-3.9V3h3.8v1h-2.6v2h2.4v1h-2.4V9H22V10z"/>
<path class="st44" d="M28.7,3l-2.5,7h-1.3l-2.5-7h1.3l1.7,5.3c0.1,0.2,0.1,0.4,0.1,0.6h0c0-0.2,0.1-0.4,0.1-0.6L27.5,3H28.7z"/>
<path class="st44" d="M30.9,10h-1.2V3h1.2V10z"/>
<path class="st44" d="M36.5,10h-3.9V3h3.8v1h-2.6v2h2.4v1h-2.4V9h2.8V10z"/>
<path class="st44" d="M46.6,3l-1.9,7h-1.3L42,5.1C42,4.9,42,4.7,41.9,4.4h0c0,0.2-0.1,0.5-0.1,0.7L40.5,10h-1.3l-2-7h1.3l1.3,5.1
c0.1,0.2,0.1,0.4,0.1,0.7h0c0-0.2,0.1-0.4,0.1-0.7L41.4,3h1.2l1.3,5.2C44,8.3,44,8.5,44,8.8h0c0-0.2,0-0.4,0.1-0.6L45.4,3H46.6z"/>
</g>
</svg>

После

Ширина:  |  Высота:  |  Размер: 3.1 KiB

Разница между файлами не показана из-за своего большого размера Загрузить разницу

После

Ширина:  |  Высота:  |  Размер: 222 KiB

22566
src/assets/index.css Normal file

Различия файлов скрыты, потому что одна или несколько строк слишком длинны

2976
src/assets/index.scss Normal file

Разница между файлами не показана из-за своего большого размера Загрузить разницу

Просмотреть файл

@ -0,0 +1,8 @@
// The file contents for the current environment will overwrite these during build.
// The build system defaults to the dev environment which uses `environment.ts`, but if you do
// `ng build --env=prod` then `environment.prod.ts` will be used instead.
// The list of which env maps to which file can be found in `.angular-cli.json`.
export const environment = {
production: false
};

Двоичные данные
src/favicon.ico Normal file

Двоичный файл не отображается.

После

Ширина:  |  Высота:  |  Размер: 6.4 KiB

32
src/index.html Normal file
Просмотреть файл

@ -0,0 +1,32 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Essential JS 2 for Angular - Stock chart</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="Essential JS 2 for Angular - Stock Chart">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
<link href="./styles.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.4.1/shim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/reflect-metadata/0.1.10/Reflect.min.js"></script>
<link href="node_modules/@syncfusion/ej2-buttons/styles/material.css" rel="stylesheet" />
<link href="node_modules/@syncfusion/ej2-calendars/styles/material.css" rel="stylesheet"/>
<link href="node_modules/@syncfusion/ej2-navigations/styles/material.css" rel="stylesheet"/>
<script type="text/javascript">
if (/MSIE \d|Trident.*rv:/.test(navigator.userAgent)) {
document.write('<script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.5/bluebird.min.js"><\/script>');
}
</script>
</head>
<body>
<app-root style="padding-left: 0px; margin: 0px 0px 0px 0px"></app-root>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/zone.js/0.8.18/zone.min.js"></script>
<script src="./dist/common.js"></script>
</html>

12
src/main.ts Normal file
Просмотреть файл

@ -0,0 +1,12 @@
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.log(err));

66
src/polyfills.ts Normal file
Просмотреть файл

@ -0,0 +1,66 @@
/**
* This file includes polyfills needed by Angular and is loaded before the app.
* You can add your own extra polyfills to this file.
*
* This file is divided into 2 sections:
* 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
* 2. Application imports. Files imported after ZoneJS that should be loaded before your main
* 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.
*
* Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
*/
/***************************************************************************************************
* BROWSER POLYFILLS
*/
/** IE9, IE10 and IE11 requires all of the following polyfills. **/
// import 'core-js/es6/symbol';
// import 'core-js/es6/object';
// import 'core-js/es6/function';
// import 'core-js/es6/parse-int';
// import 'core-js/es6/parse-float';
// import 'core-js/es6/number';
// import 'core-js/es6/math';
// import 'core-js/es6/string';
// import 'core-js/es6/date';
// import 'core-js/es6/array';
// import 'core-js/es6/regexp';
// import 'core-js/es6/map';
// import 'core-js/es6/weak-map';
// import 'core-js/es6/set';
/** IE10 and IE11 requires the following for NgClass support on SVG elements */
// import 'classlist.js'; // Run `npm install --save classlist.js`.
/** IE10 and IE11 requires the following for the Reflect API. */
// import 'core-js/es6/reflect';
/** Evergreen browsers require these. **/
// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
import 'core-js/es7/reflect';
/**
* Required to support Web Animations `@angular/platform-browser/animations`.
* Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation
**/
// import 'web-animations-js'; // Run `npm install --save web-animations-js`.
/***************************************************************************************************
* Zone JS is required by default for Angular itself.
*/
import 'zone.js/dist/zone'; // Included with Angular CLI.
/***************************************************************************************************
* APPLICATION IMPORTS
*/

2
src/styles.css Normal file
Просмотреть файл

@ -0,0 +1,2 @@
/* Add application styles & imports to this file! */
@import "./assets/index.css";

20
src/test.ts Normal file
Просмотреть файл

@ -0,0 +1,20 @@
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
import 'zone.js/dist/zone-testing';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
platformBrowserDynamicTesting
} from '@angular/platform-browser-dynamic/testing';
declare const require: any;
// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(
BrowserDynamicTestingModule,
platformBrowserDynamicTesting()
);
// Then we find all the tests.
const context = require.context('./', true, /\.spec\.ts$/);
// And load the modules.
context.keys().map(context);

13
src/tsconfig.app.json Normal file
Просмотреть файл

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

19
src/tsconfig.spec.json Normal file
Просмотреть файл

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

25
tsconfig-aot.json Normal file
Просмотреть файл

@ -0,0 +1,25 @@
{
"compilerOptions": {
"target": "es5",
"module": "es2015",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"declaration": true,
"lib": ["es2015", "dom"],
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true,
"types": ["requirejs"]
},
"exclude": [
"node_modules"
],
"files": [
"src/app/app.module.ts",
"src/app/main.ts"
],
"angularCompilerOptions": {
"skipMetadataEmit": true
}
}

28
tsconfig.json Normal file
Просмотреть файл

@ -0,0 +1,28 @@
{
"compilerOptions": {
"target": "es5",
"module": "amd",
"declaration": true,
"removeComments": true,
"noLib": false,
"lib": ["es2015", "dom"],
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"sourceMap": true,
"pretty": true,
"allowUnreachableCode": false,
"allowUnusedLabels": false,
"noImplicitAny": true,
"noImplicitReturns": true,
"noImplicitUseStrict": false,
"noFallthroughCasesInSwitch": true,
"allowJs": false,
"forceConsistentCasingInFileNames": true,
"moduleResolution": "node",
"types": ["requirejs"]
},
"exclude": [
"node_modules"
],
"compileOnSave": false
}