Skip to content

Commit c56e333

Browse files
authored
Merge pull request #14 from k-rister/cdm
API updates and initial CDM work
2 parents 85bfcb7 + 14d40cb commit c56e333

31 files changed

+347247
-542
lines changed

README.md

Lines changed: 498 additions & 475 deletions
Large diffs are not rendered by default.

cdm-tests/package.json

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"name": "jschart_cdm-test",
3+
"version": "0.1.0",
4+
"private": true,
5+
"license": "EPL-1.0",
6+
"dependencies": {
7+
"axios": "^0.18.0",
8+
"d3": "3.5.17",
9+
"jschart": "file:../jschart",
10+
"react": "^16.5.1",
11+
"react-dom": "^16.5.1",
12+
"react-scripts": "1.1.5",
13+
"file-loader": "3.0.1"
14+
},
15+
"scripts": {
16+
"start": "react-scripts start",
17+
"build": "react-scripts build",
18+
"test": "react-scripts test --env=jsdom",
19+
"eject": "react-scripts eject"
20+
}
21+
}

cdm-tests/public/favicon.ico

43.6 KB
Binary file not shown.

cdm-tests/public/index.html

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
6+
<meta name="theme-color" content="#000000">
7+
<!--
8+
manifest.json provides metadata used when your web app is added to the
9+
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
10+
-->
11+
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
12+
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
13+
<!--
14+
Notice the use of %PUBLIC_URL% in the tags above.
15+
It will be replaced with the URL of the `public` folder during the build.
16+
Only files inside the `public` folder can be referenced from the HTML.
17+
18+
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
19+
work correctly both with client-side routing and a non-root public URL.
20+
Learn how to configure a non-root public URL by running `npm run build`.
21+
-->
22+
<title>JSChart Test</title>
23+
</head>
24+
<body>
25+
<noscript>
26+
You need to enable JavaScript to run this app.
27+
</noscript>
28+
<div id="root"></div>
29+
<!--
30+
This HTML file is a template.
31+
If you open it directly in the browser, you will see an empty page.
32+
33+
You can add webfonts, meta tags, or analytics to this file.
34+
The build step will place the bundled scripts into the <body> tag.
35+
36+
To begin the development, run `npm start` or `yarn start`.
37+
To create a production bundle, use `npm run build` or `yarn build`.
38+
-->
39+
</body>
40+
</html>

cdm-tests/public/manifest.json

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"short_name": "JSChart Test",
3+
"name": "JSChart Testing Environment",
4+
"icons": [
5+
{
6+
"src": "favicon.ico",
7+
"sizes": "64x64 32x32 24x24 16x16",
8+
"type": "image/x-icon"
9+
}
10+
],
11+
"start_url": "./index.html",
12+
"display": "standalone",
13+
"theme_color": "#000000",
14+
"background_color": "#ffffff"
15+
}

cdm-tests/src/App.js

Lines changed: 261 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,261 @@
1+
import React, { Component } from "react";
2+
import jschart from "jschart";
3+
import d3 from "d3";
4+
5+
import fio_cdm_1 from './data/fio-iops.json';
6+
import fio_cdm_2 from './data/fio-iops-host.json';
7+
import fio_cdm_3 from './data/fio-iops-host-per36-action.json';
8+
import fio_cdm_4 from './data/fio-iops-host-per84-action.json';
9+
import fio_cdm_5 from './data/fio-iops-host-perf36-action-job.json';
10+
import fio_cdm_6 from './data/fio-iops-host-perf84-action-job.json';
11+
import fio_cdm_7 from './data/fio-iops-host-action-job.json';
12+
13+
import iostat_cdm_1 from './data/iostat-iops.json';
14+
import iostat_cdm_2 from './data/iostat-iops-host.json';
15+
import iostat_cdm_3 from './data/iostat-iops-host-per36-dev-sda.json';
16+
import iostat_cdm_4 from './data/iostat-iops-host-per84-dev-nvme0n1.json';
17+
import iostat_cdm_5 from './data/iostat-iops-host-perf36-dev-sda-type.json';
18+
import iostat_cdm_6 from './data/iostat-iops-host-perf84-dev-nvme0n1-type.json';
19+
import iostat_cdm_7 from './data/iostat-iops-host-dev-type.json';
20+
21+
import mpstat_cdm_1 from './data/mpstat-busy.json';
22+
import mpstat_cdm_2 from './data/mpstat-busy-host.json';
23+
import mpstat_cdm_3 from './data/mpstat-busy-host-socket.json';
24+
import mpstat_cdm_4 from './data/mpstat-busy-host-socket-core.json';
25+
import mpstat_cdm_5 from './data/mpstat-busy-host-socket-core-id.json';
26+
import mpstat_cdm_6 from './data/mpstat-busy-host-socket-core-id-mode.json';
27+
28+
var fio_choices = [
29+
{
30+
"label": "Null",
31+
"object": { }
32+
},
33+
{
34+
"label": "IOPs",
35+
"object": { cdmjson_object: fio_cdm_1 }
36+
},
37+
{
38+
"label": "IOPs - Per Host",
39+
"object": { cdmjson_object: fio_cdm_2 }
40+
},
41+
{
42+
"label": "IOPs - host=perf36, per action",
43+
"object": { cdmjson_object: fio_cdm_3 }
44+
},
45+
{
46+
"label": "IOPs - host=perf84, per action",
47+
"object": { cdmjson_object: fio_cdm_4 }
48+
},
49+
{
50+
"label": "IOPs - host=perf36, per action, per job",
51+
"object": { cdmjson_object: fio_cdm_5 }
52+
},
53+
{
54+
"label": "IOPs - host=perf84, per action, per job",
55+
"object": { cdmjson_object: fio_cdm_6 }
56+
},
57+
{
58+
"label": "IOPs - per host, per action, per job",
59+
"object": { cdmjson_object: fio_cdm_7 }
60+
}
61+
];
62+
for (var i = 0; i < fio_choices.length; i++) {
63+
fio_choices[i].index = i;
64+
}
65+
66+
function change_fio_selection() {
67+
jschart.chart_set_title("jschart_cdm_fio", fio_choices[this.value].label);
68+
jschart.chart_set_y_axis_label("jschart_cdm_fio", "Y Axis");
69+
jschart.chart_set_x_axis_label("jschart_cdm_fio", "X Axis");
70+
jschart.chart_reload_options("jschart_cdm_fio", fio_choices[this.value].object);
71+
}
72+
73+
function setup_fio_chart_selection_box() {
74+
var myselect = d3.select("#select_fio_dataset")
75+
.append("select")
76+
.on("change", change_fio_selection)
77+
78+
myselect.selectAll(".options")
79+
.data(fio_choices)
80+
.enter()
81+
.append("option")
82+
.attr("value", function(d) { return d.index; })
83+
.text(function(d) { return d.label; });
84+
}
85+
86+
var iostat_choices = [
87+
{
88+
"label": "Null",
89+
"object": { }
90+
},
91+
{
92+
"label": "IOPs",
93+
"object": { cdmjson_object: iostat_cdm_1 }
94+
},
95+
{
96+
"label": "IOPs - Per Host",
97+
"object": { cdmjson_object: iostat_cdm_2 }
98+
},
99+
{
100+
"label": "IOPs - host=perf36,dev=sda",
101+
"object": { cdmjson_object: iostat_cdm_3 }
102+
},
103+
{
104+
"label": "IOPs - host=perf84,dev=nvme0n1",
105+
"object": { cdmjson_object: iostat_cdm_4 }
106+
},
107+
{
108+
"label": "IOPs - host=perf36,dev=sda, per type",
109+
"object": { cdmjson_object: iostat_cdm_5 }
110+
},
111+
{
112+
"label": "IOPs - host=perf84,dev=nvme0n1, per type",
113+
"object": { cdmjson_object: iostat_cdm_6 }
114+
},
115+
{
116+
"label": "IOPs - Per Host, Per Dev, Per Type",
117+
"object": { cdmjson_object: iostat_cdm_7 }
118+
}
119+
];
120+
for (i = 0; i < iostat_choices.length; i++) {
121+
iostat_choices[i].index = i;
122+
}
123+
124+
function change_iostat_selection() {
125+
jschart.chart_set_title("jschart_cdm_iostat", iostat_choices[this.value].label);
126+
jschart.chart_set_y_axis_label("jschart_cdm_iostat", "Y Axis");
127+
jschart.chart_set_x_axis_label("jschart_cdm_iostat", "X Axis");
128+
jschart.chart_reload_options("jschart_cdm_iostat", iostat_choices[this.value].object);
129+
}
130+
131+
function setup_iostat_chart_selection_box() {
132+
var myselect = d3.select("#select_iostat_dataset")
133+
.append("select")
134+
.on("change", change_iostat_selection)
135+
136+
myselect.selectAll(".options")
137+
.data(iostat_choices)
138+
.enter()
139+
.append("option")
140+
.attr("value", function(d) { return d.index; })
141+
.text(function(d) { return d.label; });
142+
}
143+
144+
var mpstat_choices = [
145+
{
146+
"label": "Null",
147+
"object": { }
148+
},
149+
{
150+
"label": "Busy",
151+
"object": { cdmjson_object: mpstat_cdm_1 }
152+
},
153+
{
154+
"label": "Busy - Per Host",
155+
"object": { cdmjson_object: mpstat_cdm_2 }
156+
},
157+
{
158+
"label": "Busy - Per Host, Per Socket",
159+
"object": { cdmjson_object: mpstat_cdm_3 }
160+
},
161+
{
162+
"label": "Busy - Per Host, Per Socket, Per Core",
163+
"object": { cdmjson_object: mpstat_cdm_4 }
164+
},
165+
{
166+
"label": "Busy - Per Host, Per Socket, Per Core, Per ID",
167+
"object": { cdmjson_object: mpstat_cdm_5 }
168+
},
169+
{
170+
"label": "Busy - Per Host, Per Socket, Per Core, Per ID, Per Mode",
171+
"object": { cdmjson_object: mpstat_cdm_6 }
172+
}
173+
];
174+
for (i = 0; i < mpstat_choices.length; i++) {
175+
mpstat_choices[i].index = i;
176+
}
177+
178+
function change_mpstat_selection() {
179+
jschart.chart_set_title("jschart_cdm_mpstat", mpstat_choices[this.value].label);
180+
jschart.chart_set_y_axis_label("jschart_cdm_mpstat", "Y Axis");
181+
jschart.chart_set_x_axis_label("jschart_cdm_mpstat", "X Axis");
182+
jschart.chart_reload_options("jschart_cdm_mpstat", mpstat_choices[this.value].object);
183+
}
184+
185+
function setup_mpstat_chart_selection_box() {
186+
var myselect = d3.select("#select_mpstat_dataset")
187+
.append("select")
188+
.on("change", change_mpstat_selection)
189+
190+
myselect.selectAll(".options")
191+
.data(mpstat_choices)
192+
.enter()
193+
.append("option")
194+
.attr("value", function(d) { return d.index; })
195+
.text(function(d) { return d.label; });
196+
}
197+
198+
class App extends Component {
199+
componentDidMount = () => {
200+
setup_fio_chart_selection_box();
201+
setup_iostat_chart_selection_box();
202+
setup_mpstat_chart_selection_box();
203+
204+
jschart.create_jschart(
205+
1,
206+
"timeseries",
207+
"jschart_cdm_fio",
208+
"FIO",
209+
"Time",
210+
"FIO",
211+
{}
212+
);
213+
jschart.create_jschart(
214+
1,
215+
"timeseries",
216+
"jschart_cdm_iostat",
217+
"IOSTAT",
218+
"Time",
219+
"IOSTAT",
220+
{}
221+
);
222+
jschart.create_jschart(
223+
1,
224+
"timeseries",
225+
"jschart_cdm_mpstat",
226+
"MPSTAT",
227+
"Time",
228+
"MPSTAT",
229+
{}
230+
);
231+
jschart.finish_page();
232+
};
233+
234+
render() {
235+
return (
236+
<div className="App">
237+
<header className="App-header">
238+
<h1 className="App-title">JSChart CDM Demo</h1>
239+
</header>
240+
<br></br>
241+
<div id="jschart_cdm_fio">
242+
<h3 id="select_fio_dataset">
243+
FIO Chart Dataset Selection:
244+
</h3>
245+
</div>
246+
<div id="jschart_cdm_iostat">
247+
<h3 id="select_iostat_dataset">
248+
IOSTAT Chart Dataset Selection:
249+
</h3>
250+
</div>
251+
<div id="jschart_cdm_mpstat">
252+
<h3 id="select_mpstat_dataset">
253+
MPSTAT Chart Dataset Selection:
254+
</h3>
255+
</div>
256+
</div>
257+
);
258+
}
259+
}
260+
261+
export default App;

cdm-tests/src/App.test.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import React from 'react';
2+
import ReactDOM from 'react-dom';
3+
import App from './App';
4+
5+
it('renders without crashing', () => {
6+
const div = document.createElement('div');
7+
ReactDOM.render(<App />, div);
8+
ReactDOM.unmountComponentAtNode(div);
9+
});

0 commit comments

Comments
 (0)