79 lines
3.0 KiB
JavaScript
79 lines
3.0 KiB
JavaScript
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')
|
|
.then(function(response) {
|
|
response.json().then(function(data) {
|
|
console.debug(data);
|
|
_this.setState({serverList: data})
|
|
});
|
|
})
|
|
.catch(function(err){
|
|
console.error(err);
|
|
});
|
|
},
|
|
getInitialState: function(){return{
|
|
nvScriptReady: 0,
|
|
serverList: []
|
|
}},
|
|
componentWillMount: function(){
|
|
var _this = this;
|
|
|
|
this.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",
|
|
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");
|
|
_this.loadScript("https://cdnjs.cloudflare.com/ajax/libs/nvd3/1.8.5/nv.d3.js",
|
|
function(){ _this.setState({nvScriptReady: _this.state.nvScriptReady+1}); console.info('nv - ok'); },
|
|
function(){ _this.setState({nvScriptReady: -5}); console.error('nv - error'); }
|
|
);
|
|
},
|
|
function(){ _this.setState({nvScriptReady: -5}); console.error('d3 - error'); }
|
|
);
|
|
|
|
this.requestServerList();
|
|
},
|
|
render: function(){
|
|
var element;
|
|
if (this.state.nvScriptReady === 3) {
|
|
var serverListItems = [];
|
|
this.state.serverList.forEach(function(item){
|
|
serverListItems.push(ce(ServerListItem, {title: item}));
|
|
});
|
|
|
|
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]'}, ce(NvLineChart)))
|
|
);
|
|
} else if (this.state.nvScriptReady < 0) {
|
|
element = ce('span', null, 'error');
|
|
} else {
|
|
element = ce('span', null, 'loading...');
|
|
}
|
|
|
|
return(
|
|
ce(Panel, {title: 'Серверы'}, element)
|
|
)
|
|
}
|
|
});
|