diff --git a/mcserver-manager/build.gradle b/mcserver-manager/build.gradle
index 81254d9..d3ab670 100644
--- a/mcserver-manager/build.gradle
+++ b/mcserver-manager/build.gradle
@@ -1,5 +1,5 @@
group = 'asys'
-version = '0.8.5-SNAPSHOT'
+version = '0.8.6-SNAPSHOT'
apply plugin: 'osgi'
diff --git a/mcserver-manager/src/main/resources/components.js b/mcserver-manager/src/main/resources/components.js
index c601ce7..f51f1b2 100644
--- a/mcserver-manager/src/main/resources/components.js
+++ b/mcserver-manager/src/main/resources/components.js
@@ -1,24 +1,22 @@
+/**
+ * График.
+ * this.props.datum - данные в формате D3
+ */
var NvLineChart = React.createClass({
chart: null,
d3ChartData: null,
+ /*--------------------*/
render: function(){return(
ce('div', {id: 'chart'}, ce('svg', {style: {'height': '500px'}}))
)},
componentDidMount: function() {
- console.debug('nvd3: componentDidMount');
var _this = this;
-
nv.addGraph(function() {
_this.chart = nv.models.lineChart().useInteractiveGuideline(true);
_this.chart.xAxis.axisLabel('Time').tickFormat(function(d){ return d3.time.format('%X')(new Date(d)); });
_this.chart.yAxis.axisLabel('Players').tickFormat(d3.format('d'));
- _this.d3ChartData = d3.select('#chart svg').datum([{
- key: 'Online players',
- color: '#37d668',
- area: true,
- values: _this.props.chartData
- }]);
+ _this.d3ChartData = d3.select('#chart svg').datum(_this.props.datum);
_this.d3ChartData.transition().duration(500).call(_this.chart);
nv.utils.windowResize(_this.chart.update);
@@ -26,50 +24,44 @@ var NvLineChart = React.createClass({
});
},
componentDidUpdate: function() {
- console.debug('nvd3: componentDidUpdate');
if (this.d3ChartData === null) return;
- this.d3ChartData.datum([{
- key: 'Online players',
- color: '#37d668',
- area: true,
- values: this.props.chartData
- }]);
+ this.d3ChartData.datum(this.props.datum);
this.d3ChartData.transition().duration(500).call(this.chart);
nv.utils.windowResize(this.chart.update);
}
});
var ServerInfo = React.createClass({
- sin2: function(){
- var sin2 = [];
- for (var i = 0; i < 100; i++) {
- sin2.push({x: i, y: Math.sin(i/10) *0.25 + 0.5});
- }
- return sin2;
- },
getInitialState: function(){return {
- title: this.props.title,
- //Data is represented as an array of {x,y} pairs.
- //example: chartData.push({x: i, y: Math.sin(i/10) *0.25 + 0.5})
- chartData: []
+ title: null,
+ data: []
}},
- render: function(){return(
- ce('div', null,
- ce('div', {className: 'pull-right'},
- ce('div', {className: 'btn-group'},
- ce(Button, {btnSize: 'xs'},
- ce('span', {className: 'glyphicon glyphicon-play'}), nbsp+'запуск'),
- ce(Button, {btnSize: 'xs'},
- ce('span', {className: 'glyphicon glyphicon-stop'}), nbsp+'остановка')
+ render: function(){
+ if (this.state.title === null) {
+ return ce('div', null, 'no data');
+ } else {
+ return(
+ ce('div', null,
+ ce('h2', {style: {'margin-top': '0px'}}, this.state.title),
+ ce(NvLineChart, {datum: [{
+ key: 'Online players',
+ color: '#37d668',
+ area: true,
+ values: this.state.data
+ }]})
)
- ),
- ce('h2', {style: {'margin-top': '0px'}}, this.state.title),
- ce(NvLineChart, {chartData: this.state.chartData})
- )
- )}
+ )
+ }
+ }
});
+/**
+ * Пункт списка серверов.
+ * this.props.title - заголовок / clientId
+ * this.props.onClick - callback события клика
+ * this.props.active - состояние активности (true/false)
+ */
var ServerListItem = React.createClass({
render: function(){
return(
diff --git a/mcserver-manager/src/main/resources/module.js b/mcserver-manager/src/main/resources/module.js
index 695d0e7..c00d0b3 100644
--- a/mcserver-manager/src/main/resources/module.js
+++ b/mcserver-manager/src/main/resources/module.js
@@ -1,19 +1,4 @@
var ContentModule = React.createClass({
- loadScript: function(url, fnLoad, fnError) {
- const script = document.createElement("script");
- script.src = url;
- script.onload = fnLoad;
- script.onerror = fnError;
- document.body.appendChild(script);
- },
- loadStyle: function(url, fnLoad, fnError) {
- const style = document.createElement("link");
- style.rel = "stylesheet";
- style.href = url;
- style.onload = fnLoad;
- style.onerror = fnError;
- document.body.appendChild(style);
- },
requestServerList: function() {
var _this = this;
fetch('/mcsmanager/servers.json')
@@ -50,6 +35,7 @@ var ContentModule = React.createClass({
console.error(err);
});
},
+ /*--------------------*/
getInitialState: function(){return{
nvScriptReady: 0,
serverList: []
@@ -57,12 +43,12 @@ var ContentModule = React.createClass({
componentWillMount: function(){
var _this = this;
- this.loadScript("/mcsmanager/components.js",
+ loadScript("/mcsmanager/components.js",
function(){ _this.setState({nvScriptReady: _this.state.nvScriptReady+1}); console.debug('components - ok'); },
function(){ _this.setState({nvScriptReady: -5}); console.debug('components - error'); }
);
- this.loadScript("https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js",
+ loadScript("https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js",
function(){
_this.setState({nvScriptReady: _this.state.nvScriptReady+1}); console.info('d3 - ok');
_this.loadStyle("https://cdnjs.cloudflare.com/ajax/libs/nvd3/1.8.5/nv.d3.min.css");
@@ -87,7 +73,7 @@ var ContentModule = React.createClass({
element = ce('div', {className: 'row'},
ce('div', {className: 'col-md-4'}, ce(ServerList, null, serverListItems)),
- ce('div', {className: 'col-md-8'}, ce(ServerInfo, {title: 'Server 2 [skywars-1]', ref: "serverInfo"}))
+ ce('div', {className: 'col-md-8'}, ce(ServerInfo, {ref: "serverInfo"}))
);
} else if (this.state.nvScriptReady < 0) {
element = ce('span', null, 'error');
diff --git a/webinterface/build.gradle b/webinterface/build.gradle
index eb52012..b10045b 100644
--- a/webinterface/build.gradle
+++ b/webinterface/build.gradle
@@ -1,5 +1,5 @@
group = 'asys'
-version = '0.18.2-SNAPSHOT'
+version = '0.18.3-SNAPSHOT'
buildscript {
repositories {
diff --git a/webinterface/src/main/resources/static/components.js b/webinterface/src/main/resources/static/components.js
index ec655cf..bfbf03e 100644
--- a/webinterface/src/main/resources/static/components.js
+++ b/webinterface/src/main/resources/static/components.js
@@ -1,6 +1,25 @@
const ce = React.createElement;
const nbsp = '\u00a0';
+// -- Functions -- //
+
+function loadScript(url, fnLoad, fnError) {
+ const script = document.createElement("script");
+ script.src = url;
+ script.onload = fnLoad;
+ script.onerror = fnError;
+ document.body.appendChild(script);
+}
+
+function loadStyle(url, fnLoad, fnError) {
+ const style = document.createElement("link");
+ style.rel = "stylesheet";
+ style.href = url;
+ style.onload = fnLoad;
+ style.onerror = fnError;
+ document.body.appendChild(style);
+}
+
// -- Bootstrap -- //
var MainMenuItem = React.createClass({