From 99a1d787b7cd4deeac80e61ae8392011c8345f92 Mon Sep 17 00:00:00 2001
From: DmitriyMX <dimon550@gmail.com>
Date: Sat, 25 Mar 2017 04:28:57 +0300
Subject: [PATCH] =?UTF-8?q?MCSM:=20=D1=81=D0=BF=D0=B8=D1=81=D0=BE=D0=BA=20?=
 =?UTF-8?q?=D1=81=D0=B5=D1=80=D0=B2=D0=B5=D1=80=D0=BE=D0=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/main/resources/components.js          | 12 +++++++
 mcserver-manager/src/main/resources/module.js | 32 +++++++++++--------
 2 files changed, 30 insertions(+), 14 deletions(-)

diff --git a/mcserver-manager/src/main/resources/components.js b/mcserver-manager/src/main/resources/components.js
index 5d5307d..208f84a 100644
--- a/mcserver-manager/src/main/resources/components.js
+++ b/mcserver-manager/src/main/resources/components.js
@@ -52,3 +52,15 @@ var NvLineChart = React.createClass({
         });
     }
 });
+
+var ServerList = React.createClass({
+    render: function(){return(
+        ce('div', {className: 'list-group'},
+            ce('button', {className: 'list-group-item', type: 'button'}, 'Server 1'),
+            ce('button', {className: 'list-group-item', type: 'button'}, 'Server 2'),
+            ce('button', {className: 'list-group-item', type: 'button'}, 'Server 3'),
+            ce('button', {className: 'list-group-item', type: 'button'}, 'Server 4'),
+            ce('button', {className: 'list-group-item', type: 'button'}, 'Server 5')
+        )
+    )}
+});
diff --git a/mcserver-manager/src/main/resources/module.js b/mcserver-manager/src/main/resources/module.js
index 39acd04..ef5ed8a 100644
--- a/mcserver-manager/src/main/resources/module.js
+++ b/mcserver-manager/src/main/resources/module.js
@@ -20,34 +20,38 @@ var ContentModule = React.createClass({
     componentWillMount: function(){
         var _this = this;
 
-        this.loadScript("/mcsmanager/components.js");
-        this.loadScript(
-            "https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js",
+        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: 1}); console.info('nv ok'); },
-                    function(){ _this.setState({nvScriptReady: 2}); console.error('nv error load'); }
+                _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: 2}); console.error('d3 error load'); }
+            function(){ _this.setState({nvScriptReady: -5}); console.error('d3 - error'); }
         );
     },
     render: function(){
         var element;
-        if (this.state.nvScriptReady == 1) {
-            element = ce(NvLineChart);
-        } else if (this.state.nvScriptReady == 2) {
+        if (this.state.nvScriptReady == 3) {
+            element = ce('div', {className: 'row'},
+                          ce('div', {className: 'col-md-4'}, ce(ServerList)),
+                          ce('div', {className: 'col-md-8'}, ce(NvLineChart))
+                      );
+        } else if (this.state.nvScriptReady < 0) {
             element = ce('span', null, 'error');
         } else {
             element = ce('span', null, 'loading...');
         }
 
         return(
-            ce(Panel, {title: 'MC Server Manager'},
-                element
-            )
+            ce(Panel, {title: 'Серверы'}, element)
         )
     }
 });