Fix mouse handler binding for talking book tool (BL-16366)

[StephenMcConnel]

Also a bit of cleanup in that general area as well. I'm not sure these changes are needed in 6.5 since the bug was not manifesting there.

---

This change is 

Devin review

[greptile-apps]

Greptile Summary

This PR fixes a bug (BL-16366) where talking book toolbar buttons stopped responding after the toolbox re-hydrated its DOM, destroying the nodes that held direct jQuery event handlers. The fix migrates all button bindings to namespaced delegated handlers on $(document), which survive DOM replacement, and adds proper lifecycle bind/unbind calls in setupForRecordingAsync and handleToolHiding.

• Delegated event handlers: All #audio-* button bindings are moved from direct .on() calls to $(document).on(event + ns, selector, handler) with a shared .audioRecorder namespace, enabling clean .off() on hide and preventing handler accumulation across re-opens.
• Media player re-wiring: getMediaPlayer() now tracks the last-wired HTMLMediaElement and re-attaches onerror/onended/ondurationchange whenever the toolbox replaces the #player node, since media events don't bubble and can't be delegated.
• WebSocket listener fixes: audioLevelListener and micErrorListener are now arrow-function class fields (fixing this binding), and WebSocketManager.removeListener gains a null guard to avoid crashing when called before any listeners are registered for a context.

Important Files Changed

Filename	Overview
src/BloomBrowserUI/bookEdit/toolbox/talkingBook/audioRecording.ts	Migrated all toolbar button handlers from direct element binding to namespaced delegated handlers on $(document); extracted getMediaPlayer() with re-wiring logic; converted audioLevelListener/micErrorListener to arrow-function class fields; added bind/unbind lifecycle hooks in setupForRecordingAsync and handleToolHiding.
src/BloomBrowserUI/utils/WebSocketManager.ts	Added a null guard in removeListener to safely return early when the clientContext has no registered callbacks, preventing an error when removeListener is called before any addListener call for that context.

_{Reviews (6): Last reviewed commit: "Fix mouse handler binding for talking bo..." | Re-trigger Greptile}

[JohnThomson]

@JohnThomson reviewed 1 file and all commit messages, and made 1 comment.
Reviewable status: 1 of 2 files reviewed, 1 unresolved discussion (waiting on StephenMcConnel).

---

src/BloomBrowserUI/bookEdit/toolbox/talkingBook/audioRecording.ts line 250 at r2 (raw file):

            .on("click" + ns, "#audio-next", () =>
                this.moveToNextAudioElement(),
            );

If I'm understanding right, since these are attached to the document, all clicks in any toolbox will activate all of them...then a filter will determine that the event didn't originate with the right element and ignore it. I don't suppose it matters very much, but I wonder if we should try to clean up when TB closes?
Of course then we have to reinstate them when it opens...and that's probably after the new buttons get created, so we could just attach them to the buttons, if we do it then (if I'm understanding the problem).
We could also just merge as-is. But it seemed worth asking.

[StephenMcConnel]

@StephenMcConnel made 1 comment.
Reviewable status: 1 of 2 files reviewed, 1 unresolved discussion (waiting on JohnThomson and StephenMcConnel).

---

src/BloomBrowserUI/bookEdit/toolbox/talkingBook/audioRecording.ts line 250 at r2 (raw file):

Previously, JohnThomson (John Thomson) wrote…

If I'm understanding right, since these are attached to the document, all clicks in any toolbox will activate all of them...then a filter will determine that the event didn't originate with the right element and ignore it. I don't suppose it matters very much, but I wonder if we should try to clean up when TB closes?
Of course then we have to reinstate them when it opens...and that's probably after the new buttons get created, so we could just attach them to the buttons, if we do it then (if I'm understanding the problem).
We could also just merge as-is. But it seemed worth asking.

Done.

[JohnThomson]

@JohnThomson made 1 comment and resolved 1 discussion.
Reviewable status: 1 of 2 files reviewed, 1 unresolved discussion (waiting on StephenMcConnel).

---

src/BloomBrowserUI/bookEdit/toolbox/talkingBook/audioRecording.ts line 529 at r3 (raw file):

    public async setupForRecordingAsync(): Promise<void> {
        this.isShowing = true;
        this.bindDocumentDelegatedHandlers();

If this happens every time the tool is opened, then do we still need to call it also in initializeTalkingBookToolAsync()? Given that it has the "off" calls it won't hurt much to do it twice, but better not?
Also, it feels like this method is now doing more than its name says (maybe already was). Time to rename it something like openTool()? There might also be a better way to word the comment about "when the tool is created", which suggests (contrary to the line before) that it only happens once.

[StephenMcConnel]

@StephenMcConnel made 1 comment.
Reviewable status: 1 of 2 files reviewed, 1 unresolved discussion (waiting on JohnThomson and StephenMcConnel).

---

src/BloomBrowserUI/bookEdit/toolbox/talkingBook/audioRecording.ts line 529 at r3 (raw file):

Previously, JohnThomson (John Thomson) wrote…

If this happens every time the tool is opened, then do we still need to call it also in initializeTalkingBookToolAsync()? Given that it has the "off" calls it won't hurt much to do it twice, but better not?
Also, it feels like this method is now doing more than its name says (maybe already was). Time to rename it something like openTool()? There might also be a better way to word the comment about "when the tool is created", which suggests (contrary to the line before) that it only happens once.

Removed from initializeTalkingBookToolAsync. I don't think the method needs to be renamed, but I did edit the comment to try to reflect reality more closely.

[JohnThomson]

I'm not sure we still need to move the event handlers up to document. But at this point this is soon-to-throw-away code and it's working.

@JohnThomson reviewed 1 file and all commit messages, and made 1 comment.
Reviewable status: all files reviewed, 1 unresolved discussion (waiting on StephenMcConnel).

[JohnThomson]

@JohnThomson resolved 1 discussion.
Reviewable status: complete! all files reviewed, all discussions resolved (waiting on StephenMcConnel).