luisgulo/focalboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

cleanup OctoListener

Browse source
This commit is contained in:
Chen-I Lim 2020-10-21 09:32:36 -07:00
parent d179c9f704
commit 3ee92e570b
3 changed files with 24 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
webapp/src/components/cardDetail.tsx
View file

@ -32,8 +32,7 @@ type State = {
export default class CardDetail extends React.Component<Props, State> {
private titleRef = React.createRef<Editable>()
private keydownHandler: any
private cardListener: OctoListener
private cardListener?: OctoListener
constructor(props: Props) {
super(props)
@ -58,6 +57,11 @@ export default class CardDetail extends React.Component<Props, State> {
})
}
componentWillUnmount() {
this.cardListener?.close()
this.cardListener = undefined
}
render() {
const {boardTree} = this.props
const {cardTree} = this.state

22
webapp/src/octoListener.ts
View file

@ -11,13 +11,13 @@ class OctoListener {
}
readonly serverUrl: string
private ws: WebSocket
private ws?: WebSocket
notificationDelay = 200
constructor(serverUrl?: string) {
this.serverUrl = serverUrl || window.location.origin
console.log(`OctoListener serverUrl: ${this.serverUrl}`)
Utils.log(`OctoListener serverUrl: ${this.serverUrl}`)
}
open(blockId: string, onChange: (blockId: string) => void) {
@ -29,22 +29,22 @@ class OctoListener {
const url = new URL(this.serverUrl)
const wsServerUrl = `ws://${url.host}${url.pathname}ws/onchange?id=${encodeURIComponent(blockId)}`
console.log(`OctoListener initWebSocket wsServerUrl: ${wsServerUrl}`)
Utils.log(`OctoListener open: ${wsServerUrl}`)
const ws = new WebSocket(wsServerUrl)
this.ws = ws
ws.onopen = () => {
Utils.log('OctoListener webSocket opened.')
Utils.log(`OctoListener webSocket opened. blockId: ${blockId}`)
ws.send('{}')
}
ws.onerror = (e) => {
Utils.logError(`OctoListener websocket onerror. data: ${e}`)
Utils.logError(`OctoListener websocket onerror. blockId: ${blockId}, data: ${e}`)
}
ws.onclose = (e) => {
Utils.log(`OctoListener websocket onclose, code: ${e.code}, reason: ${e.reason}`)
if (this.isOpen) {
Utils.log(`OctoListener websocket onclose, blockId: ${blockId}, code: ${e.code}, reason: ${e.reason}`)
if (ws === this.ws) {
// Unexpected close, re-open
Utils.logError('Unexpected close, re-opening...')
this.open(blockId, onChange)
@ -52,7 +52,7 @@ class OctoListener {
}
ws.onmessage = (e) => {
Utils.log(`OctoListener websocket onmessage. data: ${e.data}`)
Utils.log(`OctoListener websocket onmessage. blockId: ${blockId}, data: ${e.data}`)
try {
const message = JSON.parse(e.data)
switch (message.action) {
@ -79,8 +79,12 @@ class OctoListener {
return
}
this.ws.close()
Utils.log(`OctoListener close: ${this.ws.url}`)
// Use this sequence so the onclose method doesn't try to re-open
const ws = this.ws
this.ws = undefined
ws.close()
}
}

7
webapp/src/pages/boardPage.tsx
View file

@ -31,7 +31,6 @@ export default class BoardPage extends React.Component<Props, State> {
updatePropertyLabelTimeout: number
private boardListener = new OctoListener()
private cardListener = new OctoListener()
constructor(props: Props) {
super(props)
@ -100,6 +99,8 @@ export default class BoardPage extends React.Component<Props, State> {
}
componentWillUnmount() {
Utils.log(`boardPage.componentWillUnmount: ${this.state.boardId}`)
this.boardListener.close()
document.removeEventListener('keydown', this.undoRedoHandler)
}
@ -160,9 +161,11 @@ export default class BoardPage extends React.Component<Props, State> {
private async attachToBoard(boardId: string, viewId?: string) {
Utils.log(`attachToBoard: ${boardId}`)
// this.boardListener.close()
// this.boardListener = new OctoListener()
this.boardListener.open(boardId, (blockId: string) => {
Utils.log(`boardListener.onChanged: ${blockId}`)
this.sync(boardId)
this.sync()
})
this.sync(boardId, viewId)