Refactored PlayWebSocket

assets/js/PlayWebSocket.js

@@ -345,3 +345,5 @@ export default class PlayWebSocket {
     chessboard.view.visualizeInputState();
   }
 }
+
+export const playWebSocket = new PlayWebSocket();

assets/js/pages/play/online/CreateGameModal.js

@@ -1,7 +1,7 @@
 import Modal from 'bootstrap/js/dist/modal.js';
 import { onlinePlayersModal } from './OnlinePlayersModal.js';
 import AbstractComponent from '../../../AbstractComponent.js';
-import ws from '../../../playWs.js';
+import { playWebSocket } from '../../../PlayWebSocket.js';
 import * as mode from '../../../../mode.js';
 
 export class CreateGameModal extends AbstractComponent {
@@ -16,7 +16,7 @@ export class CreateGameModal extends AbstractComponent {
         submode: 'online'
       };
       localStorage.setItem('color', formData.get('color'));
-      ws.send(`/start ${formData.get('variant')} ${mode.PLAY} "${JSON.stringify(add).replace(/"/g, '\\"')}"`);
+      playWebSocket.send(`/start ${formData.get('variant')} ${mode.PLAY} "${JSON.stringify(add).replace(/"/g, '\\"')}"`);
       this.props.onlinePlayersModal.props.modal.show();
     });
   }

assets/js/pages/play/online/DrawModal.js

@@ -1,17 +1,17 @@
 import Modal from 'bootstrap/js/dist/modal.js';
 import AbstractComponent from '../../../AbstractComponent.js';
-import ws from '../../../playWs.js';
+import { playWebSocket } from '../../../PlayWebSocket.js';
 
 export class DrawModal extends AbstractComponent {
   mount() {
     this.props.form.children.item(0).addEventListener('click', async (event) => {
       event.preventDefault();
-      ws.send('/draw accept');
+      playWebSocket.send('/draw accept');
     });
 
     this.props.form.children.item(1).addEventListener('click', async (event) => {
       event.preventDefault();
-      ws.send('/draw decline');
+      playWebSocket.send('/draw decline');
     });
   }
 }

assets/js/pages/play/online/EnterInviteCodeModal.js

@@ -1,13 +1,13 @@
 import Modal from 'bootstrap/js/dist/modal.js';
 import AbstractComponent from '../../../AbstractComponent.js';
-import ws from '../../../playWs.js';
+import { playWebSocket } from '../../../PlayWebSocket.js';
 
 export class EnterInviteCodeModal extends AbstractComponent {
   mount() {
     this.props.form.addEventListener('submit', event => {
       event.preventDefault();
       const formData = new FormData(this.props.form);
-      ws.send(`/accept ${formData.get('hash')}`);
+      playWebSocket.send(`/accept ${formData.get('hash')}`);
     });
   }
 }

assets/js/pages/play/online/OnlinePlayersModal.js

@@ -1,6 +1,6 @@
 import Modal from 'bootstrap/js/dist/modal.js';
 import AbstractComponent from '../../../AbstractComponent.js';
-import ws from '../../../playWs.js';
+import { playWebSocket } from '../../../PlayWebSocket.js';
 
 export class OnlinePlayersModal extends AbstractComponent {
   mount() {
@@ -20,7 +20,7 @@ export class OnlinePlayersModal extends AbstractComponent {
         tr.appendChild(variantTd);
         if (localStorage.getItem('hash') !== game.hash) {
           tr.addEventListener('click', () => {
-            ws.send(`/accept ${game.hash}`);
+            playWebSocket.send(`/accept ${game.hash}`);
           });
         } else {
           timeTd.style.cursor = 'default';

assets/js/pages/play/online/PlayFriendModal.js

@@ -1,7 +1,7 @@
 import Modal from 'bootstrap/js/dist/modal.js';
 import { copyInviteCodeModal } from './CopyInviteCodeModal.js';
 import AbstractComponent from '../../../AbstractComponent.js';
-import ws from '../../../playWs.js';
+import { playWebSocket } from '../../../PlayWebSocket.js';
 import * as mode from '../../../../mode.js';
 import * as variant from '../../../../variant.js';
 
@@ -29,7 +29,7 @@ export class PlayFriendModal extends AbstractComponent {
         ...(formData.get('fen') && {fen: formData.get('fen')})
       };
       localStorage.setItem('color', formData.get('color'));
-      ws.send(`/start ${formData.get('variant')} ${mode.PLAY} "${JSON.stringify(add).replace(/"/g, '\\"')}"`);
+      playWebSocket.send(`/start ${formData.get('variant')} ${mode.PLAY} "${JSON.stringify(add).replace(/"/g, '\\"')}"`);
       this.props.modal.hide();
       this.props.copyInviteCodeModal.props.modal.show();
     });

assets/js/pages/play/online/RematchModal.js

@@ -1,17 +1,17 @@
 import Modal from 'bootstrap/js/dist/modal.js';
 import AbstractComponent from '../../../AbstractComponent.js';
-import ws from '../../../playWs.js';
+import { playWebSocket } from '../../../PlayWebSocket.js';
 
 export class RematchModal extends AbstractComponent {
   mount() {
     this.props.form.addEventListener('submit', event => {
       event.preventDefault();
-      ws.send('/rematch accept');
+      playWebSocket.send('/rematch accept');
     });
 
     this.props.form.children.item(1).addEventListener('click', async (event) => {
       event.preventDefault();
-      ws.send('/rematch decline');
+      playWebSocket.send('/rematch decline');
     });
   }
 }

assets/js/pages/play/online/TakebackModal.js

@@ -1,18 +1,18 @@
 import Modal from 'bootstrap/js/dist/modal.js';
 import AbstractComponent from '../../../AbstractComponent.js';
-import ws from '../../../playWs.js';
+import { playWebSocket } from '../../../PlayWebSocket.js';
 
 export class TakebackModal extends AbstractComponent {
   mount() {
     this.props.form.children.item(0).addEventListener('click', async (event) => {
       event.preventDefault();
-      ws.send('/takeback accept');
-      ws.send('/undo');
+      playWebSocket.send('/takeback accept');
+      playWebSocket.send('/undo');
     });
 
     this.props.form.children.item(1).addEventListener('click', async (event) => {
       event.preventDefault();
-      ws.send('/takeback decline');
+      playWebSocket.send('/takeback decline');
     });
   }
 }

assets/js/pages/play/online/index.js

@@ -6,13 +6,13 @@ import { playFriendModal } from './PlayFriendModal.js';
 import boardActionsDropdown from '../../boardActionsDropdown.js';
 import chessboard from '../../chessboard.js';
 import historyButtons from '../../historyButtons.js';
-import ws from '../../../playWs.js';
+import { playWebSocket } from '../../../PlayWebSocket.js';
 
 localStorage.clear();
 
 chessboard.state.inputWhiteEnabled = false;
 chessboard.state.inputBlackEnabled = false;
 
-await ws.connect();
+await playWebSocket.connect();
 
-ws.send('/online_games');
+playWebSocket.send('/online_games');