Skip to content

Commit a842b95

Browse files
ashok1994ashok1994
committed
Design change
1 parent 9c4d79d commit a842b95

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

51 files changed

+13917
-1099
lines changed

‎package-lock.json‎

Lines changed: 10760 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@
5656
"angularjs2-tabs": "0.0.1-beta.1",
5757
"bootstrap": "^3.3.7",
5858
"core-js": "^2.4.1",
59-
"fusioncharts": "^3.12.1",
59+
"fusioncharts": "^3.12.2",
6060
"prismjs": "^1.6.0",
6161
"rxjs": "^5.4.1",
6262
"zone.js": "^0.8.14"
@@ -65,10 +65,12 @@
6565
"@angular/cli": "1.2.4",
6666
"@angular/compiler-cli": "^4.0.0",
6767
"@angular/language-service": "^4.0.0",
68+
"@ctrl/ngx-codemirror": "^1.3.7",
6869
"@types/jasmine": "~2.5.53",
6970
"@types/jasminewd2": "~2.0.2",
7071
"@types/node": "~6.0.60",
7172
"codelyzer": "~3.0.1",
73+
"codemirror": "^5.39.2",
7274
"jasmine-core": "~2.6.2",
7375
"jasmine-spec-reporter": "~4.1.0",
7476
"karma": "~1.7.0",
@@ -86,4 +88,4 @@
8688
"engines": {
8789
"node": ">=4.4.1"
8890
}
89-
}
91+
}

‎src/app/app.component.html‎

Lines changed: 466 additions & 230 deletions
Large diffs are not rendered by default.

‎src/app/app.component.ts‎

Lines changed: 39 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,55 @@
11
import {Component, ViewEncapsulation} from '@angular/core';
2+
import { Router } from "@angular/router";
23
import '../../node_modules/prismjs/prism.js';
4+
import 'codemirror/mode/javascript/javascript';
5+
import 'codemirror/mode/htmlembedded/htmlembedded';
6+
import CodeSnippets from "./quickstart-snippet";
7+
import SelectedSingleton from './fusioncharts/services/selected.singleton';
8+
import SampleCode from './fusioncharts/samplecode';
39

410
@Component({
511
selector: 'app',
612
styleUrls: [
713
'./app.component.css',
8-
'../../node_modules/bootstrap/dist/css/bootstrap.css',
914
'../../node_modules/prismjs/themes/prism.css',
10-
'./themes/fusioncharts.theme.fusion.css'
15+
'./themes/fusioncharts.theme.fusion.css',
16+
'./themes/github-css/codemirror.css',
17+
'./themes/github-css/dracula.css',
18+
'./themes/github-css/style.css'
1119
],
1220
encapsulation: ViewEncapsulation.None,
1321
templateUrl: './app.component.html',
1422
})
1523
export class AppComponent {
24+
25+
installCode = CodeSnippets.installCode;
26+
installFusionCharts = CodeSnippets.installFusionCharts;
27+
includeInModule = CodeSnippets.importCode;
28+
useDirective = CodeSnippets.useDirective;
29+
renderFusionMaps = CodeSnippets.renderFusionMaps;
30+
mapHtml = CodeSnippets.mapHtml;
31+
32+
modalClasses = 'show fade in';
33+
isModalOpen = false;
34+
35+
sampleCode = SampleCode;
36+
selectedTitle = '';
37+
38+
toggleModal = (state) => {
39+
this.isModalOpen = state;
40+
}
41+
42+
openPage = (route) =>{
43+
this.isModalOpen = false;
44+
this.router.navigate([route]);
45+
}
46+
47+
constructor(private router:Router){
48+
SelectedSingleton.on = (value) => {
49+
this.selectedTitle = value;
50+
}
51+
}
52+
1653
updateId (id) {
1754

1855
}

‎src/app/app.module.ts‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import { HttpModule } from '@angular/http';
99

1010
import { CodePrev } from './fusioncharts/codepreview';
1111
import { TabsModule } from "angularjs2-tabs";
12+
import { CodemirrorModule } from '@ctrl/ngx-codemirror';
1213

1314
import { Ex1 } from './fusioncharts/ex1/ex1';
1415
import { Ex2 } from './fusioncharts/ex2/ex2';
@@ -25,6 +26,8 @@ import { Ex11 } from './fusioncharts/ex11/ex11';
2526
import { Ex12 } from "./fusioncharts/ex12/ex12";
2627
import { Ex13 } from "./fusioncharts/ex13/ex13";
2728
import { Ex14 } from "./fusioncharts/ex14/ex14";
29+
import TabbedCode from "./fusioncharts/tabbedComponent/tabbed.code.component";
30+
2831
import { Navigation, NavService, ObservingComponent, MyAppComponent } from './observable/observable.component';
2932

3033
import { FusionChartsSample } from './fusioncharts/fusioncharts.component';
@@ -81,7 +84,8 @@ FusionChartsModule.fcRoot(FusionCharts, Charts, Ocean, PowerCharts, Widgets, Map
8184

8285
CodePrev,
8386
AppComponent,
84-
FusionChartsSample
87+
FusionChartsSample,
88+
TabbedCode
8589
],
8690
imports: [
8791
BrowserModule,
@@ -90,7 +94,8 @@ FusionChartsModule.fcRoot(FusionCharts, Charts, Ocean, PowerCharts, Widgets, Map
9094
HttpModule,
9195
TabsModule,
9296
FusionChartsModule,
93-
RouterModule.forRoot(rootRouterConfig, { useHash: true })
97+
RouterModule.forRoot(rootRouterConfig, { useHash: true }),
98+
CodemirrorModule
9499
],
95100
providers: [
96101
NavService

‎src/app/fusioncharts/ex1/ex1.html‎

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,16 @@
1+
<div class="card shadow">
2+
<div class="card-body chart-wrapper">
3+
<div class="chart-wrapper-inner">
4+
<fusioncharts
5+
[chartConfig]=chartConfig
6+
[dataSource]=dataSource>
7+
</fusioncharts>
8+
</div>
9+
</div>
10+
</div>
111

2-
<fusioncharts
3-
[chartConfig]=chartConfig
4-
[dataSource]=dataSource >
5-
</fusioncharts>
6-
7-
<tabs>
8-
<tab tabTitle="Module"><ng-prism class="codepreview language-javascript" >{{ sampleCode[demoId].module }}</ng-prism></tab>
9-
<tab tabTitle="Component"><ng-prism class="codepreview language-javascript" >{{ sampleCode[demoId].component }}</ng-prism></tab>
10-
<tab tabTitle="Template" ><ng-prism class="codepreview language-html" >{{ sampleCode[demoId].template }}</ng-prism></tab>
11-
</tabs>
12+
<tabbed-code
13+
moduleCode="{{sampleCode[demoId].module}}"
14+
componentCode="{{sampleCode[demoId].component}}"
15+
templateCode="{{sampleCode[demoId].template}}">
16+
</tabbed-code>

‎src/app/fusioncharts/ex1/ex1.ts‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import {
44
} from '@angular/core';
55

66
import fcDemos from '../samplecode';
7+
import SelectedSingleton from '../services/selected.singleton';
78

89
declare var Prism;
910

@@ -17,12 +18,13 @@ export class Ex1 implements AfterViewInit {
1718
sampleCode = fcDemos;
1819
dataSource: Object;
1920
chartConfig: Object;
21+
tabOptions:string[];
2022

2123
constructor() {
2224
this.sampleCode = fcDemos;
2325

2426
this.chartConfig = {
25-
width: '700',
27+
width: '100%',
2628
height: '400',
2729
type: "column2d",
2830
dataFormat: "json",
@@ -66,6 +68,13 @@ export class Ex1 implements AfterViewInit {
6668
};
6769

6870
}
71+
72+
ngOnInit(){
73+
setTimeout(() => {
74+
SelectedSingleton.change(this.sampleCode['ex1'].title);
75+
})
76+
}
77+
6978
ngAfterViewInit() {
7079
Prism && Prism.highlightAll();
7180
}

‎src/app/fusioncharts/ex10/ex10.html‎

Lines changed: 39 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,48 @@
11
<style >
2-
.btn { font-family: 'Source Sans Pro'; }
3-
.btn.btn-primary { background: #4a4d8c; transition: all 300ms;}
4-
.btn.btn-primary:hover{ background: #5c62b5; }
5-
.btn.btn-primary:active{ background:#4a4d8c }
2+
.btn.btn-outline-secondary.btn-sm:hover{
3+
color:white;
4+
}
5+
.btn.btn-outline-secondary.btn-sm:active{
6+
color:gray;
7+
}
68
div>a{
79
margin: 0px 10px;
810
}
911
</style>
1012

11-
<fusioncharts
12-
width="600"
13-
height="400"
14-
type="column2D"
15-
[dataSource]="dataSource"
16-
>
17-
</fusioncharts>
18-
19-
<fusioncharts
20-
width="600"
21-
height="400"
22-
type="stackedcolumn2d"
23-
dataFormat="json"
24-
[dataSource]="stackedColumnData">
25-
</fusioncharts>
26-
27-
<div style="display: flex;justify-content: center">
28-
<button (click)="exportChart($event)" class="btn btn-primary">Export both charts as a single PDF</button>
13+
<div class="card shadow">
14+
<div class="card-body chart-wrapper">
15+
<div class="chart-wrapper-inner">
16+
<fusioncharts
17+
width="800"
18+
height="400"
19+
type="column2D"
20+
[dataSource]="dataSource">
21+
</fusioncharts>
22+
23+
<fusioncharts
24+
width="800"
25+
height="400"
26+
type="stackedcolumn2d"
27+
dataFormat="json"
28+
[dataSource]="stackedColumnData">
29+
</fusioncharts>
30+
31+
<div style="display: flex;justify-content: center">
32+
<button (click)="exportChart($event)" class="btn btn-outline-secondary btn-sm">
33+
Export both charts as a single PDF
34+
</button>
35+
</div>
36+
</div>
37+
</div>
2938
</div>
3039

31-
<tabs>
32-
<tab tabTitle="Module"><ng-prism class="codepreview language-javascript" >{{ sampleCode[demoId].module }}</ng-prism></tab>
33-
<tab tabTitle="Component"><ng-prism class="codepreview language-javascript" >{{ sampleCode[demoId].component }}</ng-prism></tab>
34-
<tab tabTitle="Template" ><ng-prism class="codepreview language-html" >{{ sampleCode[demoId].template }}</ng-prism></tab>
35-
</tabs>
40+
41+
42+
43+
<tabbed-code
44+
moduleCode="{{sampleCode[demoId].module}}"
45+
componentCode="{{sampleCode[demoId].component}}"
46+
templateCode="{{sampleCode[demoId].template}}">
47+
</tabbed-code>
3648

0 commit comments

Comments
 (0)