3 files changed, 42 insertions, 5 deletions

diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index b46caf3ea..719a0203b 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -39,6 +39,8 @@ library.add(faCloudUploadAlt);
 library.add(faSyncAlt);
 library.add(faShare);
 
+export type CloseCall = (toBeDeleted: DocumentView[]) => void;
+
 @observer
 export class DocumentDecorations extends React.Component<{}, { value: string }> {
     static Instance: DocumentDecorations;
@@ -69,6 +71,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
     @observable public isAnimatingFetch = false;
     @observable public isAnimatingPulse = false;
     @observable public openHover = false;
+    @observable private addedCloseCalls: CloseCall[] = [];
+
 
     constructor(props: Readonly<{}>) {
         super(props);
@@ -77,6 +81,14 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
         reaction(() => SelectionManager.SelectedDocuments().slice(), docs => this._edtingTitle = false);
     }
 
+    addCloseCall = (handler: CloseCall) => {
+        const currentOffset = this.addedCloseCalls.length - 1;
+        this.addedCloseCalls.push((toBeDeleted: DocumentView[]) => {
+            this.addedCloseCalls.splice(currentOffset, 1);
+            handler(toBeDeleted);
+        });
+    }
+
     @action titleChanged = (event: any) => { this._title = event.target.value; };
     @action titleBlur = () => { this._edtingTitle = false; };
     @action titleEntered = (e: any) => {
@@ -239,10 +251,12 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
         e.stopPropagation();
         if (e.button === 0) {
             const recent = Cast(CurrentUserUtils.UserDocument.recentlyClosed, Doc) as Doc;
-            SelectionManager.SelectedDocuments().map(dv => {
+            const selectedDocuments = SelectionManager.SelectedDocuments();
+            selectedDocuments.map(dv => {
                 recent && Doc.AddDocToList(recent, "data", dv.props.Document, undefined, true, true);
                 dv.props.removeDocument && dv.props.removeDocument(dv.props.Document);
             });
+            this.addedCloseCalls.forEach(handler => handler(selectedDocuments));
             SelectionManager.DeselectAll();
             document.removeEventListener("pointermove", this.onCloseMove);
             document.removeEventListener("pointerup", this.onCloseUp);
diff --git a/src/client/views/webcam/DashWebRTC.ts b/src/client/views/webcam/DashWebRTC.ts
index c61469cb8..195f1f0c4 100644
--- a/src/client/views/webcam/DashWebRTC.ts
+++ b/src/client/views/webcam/DashWebRTC.ts
@@ -283,10 +283,15 @@ export namespace DashWebRTC {
         console.log('Remote stream removed. Event: ', event);
     }
 
-    function hangup() {
+    export function hangup() {
         console.log('Hanging up.');
-        stop();
-        sendMessage('bye');
+        if (pc) {
+            stop();
+            sendMessage('bye');
+        }
+        //stop local tracks on hang-up
+        //localVideo.srcObject!.getTracks().forEach(track => track.stop());
+
     }
 
     function handleRemoteHangup() {
diff --git a/src/client/views/webcam/DashWebRTCVideo.tsx b/src/client/views/webcam/DashWebRTCVideo.tsx
index 0c4e594e4..a763fd64c 100644
--- a/src/client/views/webcam/DashWebRTCVideo.tsx
+++ b/src/client/views/webcam/DashWebRTCVideo.tsx
@@ -3,13 +3,16 @@ import React = require("react");
 import { CollectionFreeFormDocumentViewProps } from "../nodes/CollectionFreeFormDocumentView";
 import { FieldViewProps, FieldView } from "../nodes/FieldView";
 import { observable } from "mobx";
-import { DocumentDecorations } from "../DocumentDecorations";
+import { DocumentDecorations, CloseCall } from "../DocumentDecorations";
 import { InkingControl } from "../InkingControl";
 import "../../views/nodes/WebBox.scss";
 import "./DashWebRTC.scss";
 import adapter from 'webrtc-adapter';
 import { DashWebRTC } from "./DashWebRTC";
 import { DocServer } from "../../DocServer";
+import { DocumentView } from "../nodes/DocumentView";
+import { Utils } from "../../../Utils";
+import { MessageStore } from "../../../server/Message";
 
 
 
@@ -39,6 +42,20 @@ export class DashWebRTCVideo extends React.Component<CollectionFreeFormDocumentV
     private startButton: HTMLButtonElement | undefined;
     private hangupButton: HTMLButtonElement | undefined;
     private roomText: HTMLInputElement | undefined;
+    private roomOfCam: string = "";
+
+    componentDidMount() {
+        DocumentDecorations.Instance.addCloseCall(this.closeConnection);
+    }
+
+    closeConnection: CloseCall = () => {
+        //Utils.Emit(DocServer._socket, MessageStore.NotifyRoommates, { message: 'bye', room: this.roomOfCam });
+        DashWebRTC.hangup();
+    }
+
+    componentWillUnmount() {
+        // DocumentDecorations.Instance.removeCloseCall(this.closeConnection);
+    }
 
     // componentDidMount() {
     //     // DashWebRTC.setVideoObjects(this.localVideoEl!, this.peerVideoEl!);
@@ -289,6 +306,7 @@ export class DashWebRTCVideo extends React.Component<CollectionFreeFormDocumentV
             let submittedTitle = this.roomText!.value;
             this.roomText!.value = "";
             this.roomText!.blur();
+            this.roomOfCam = submittedTitle;
             DashWebRTC.init(submittedTitle);
         }
     }