Merge branch 'master' into horizontal-vbox

client/src/components/instance.create.form.jsx

@@ -30,7 +30,7 @@ class InstanceCreateForm extends Component {
 
         this.sendInstanceNew = sendInstanceNew.bind(this);
 
-        this.nameChange = this.nameChange.bind(this);
+        this.nameInput = this.nameInput.bind(this);
         this.playersChange = this.playersChange.bind(this);
         this.handleSubmit = this.handleSubmit.bind(this);
     }
@@ -39,7 +39,7 @@ class InstanceCreateForm extends Component {
         this.setState({ players: Number(event.target.value) });
     }
 
-    nameChange(event) {
+    nameInput(event) {
         this.setState({ name: event.target.value });
     }
 
@@ -63,7 +63,7 @@ class InstanceCreateForm extends Component {
                         disabled={disabled}
                         value={this.state.name}
                         placeholder="name"
-                        onChange={this.nameChange}
+                        onInput={this.nameInput}
                     />
                     <label htmlFor="playerSelect">players</label>
                     <select id="playerSelect"

client/src/components/spawn.button.jsx

@@ -7,12 +7,13 @@ class SpawnButton extends Component {
 
         this.state = { value: null, enabled: false };
 
-        this.handleChange = this.handleChange.bind(this);
+        this.handleInput = this.handleInput.bind(this);
         this.handleSubmit = this.handleSubmit.bind(this);
         this.enable = this.enable.bind(this);
     }
 
-    handleChange(event) {
+    handleInput(event) {
+        console.log(event.target.value);
         this.setState({ value: event.target.value });
     }
 
@@ -41,7 +42,7 @@ class SpawnButton extends Component {
                         disabled={!this.state.enabled}
                         value={this.state.value}
                         placeholder="name"
-                        onChange={this.handleChange}
+                        onInput={this.handleInput}
                     />
                     <button
                         className="login-btn"

client/src/socket.jsx

@@ -28,14 +28,18 @@ function createSocket(events) {
     // -------------
     //   Outgoing
     // -------------
-    let ping = Date.now();
     function send(msg) {
-        console.log('outgoing msg', msg);
-        ping = Date.now();
+        if (msg.method !== 'ping') console.log('outgoing msg', msg);
         msg.token = account && account.token && account.token;
         ws.send(cbor.encode(msg));
     }
 
+    let ping;
+    function sendPing() {
+        ping = Date.now();
+        send({ method: 'ping', params: {} });
+    }
+
     function sendAccountLogin(name, password) {
         send({ method: 'account_login', params: { name, password } });
     }
@@ -230,6 +234,11 @@ function createSocket(events) {
         events.setVboxInfo(info);
     }
 
+    function pong() {
+        events.setPing(Date.now() - ping);
+        setTimeout(sendPing, 1000);
+    }
+
     // -------------
     //   Setup
     // -------------
@@ -248,6 +257,7 @@ function createSocket(events) {
         zone_close: res => console.log(res),
         instance_state: instanceState,
         vbox_info: vboxInfo,
+        pong,
     };
 
     function logout() {
@@ -277,8 +287,7 @@ function createSocket(events) {
         const res = cbor.decode(blob);
         const { method, params } = res;
 
-        console.log(res);
-        events.setPing(Date.now() - ping);
+        if (method !== 'pong' ) console.log(res);
 
         // check for error and split into response type and data
         if (res.err) return errHandler(res.err);
@@ -303,6 +312,8 @@ function createSocket(events) {
                 sendAccountCryps();
             }
 
+            sendPing();
+
             return true;
         });