From e3729a7bf35e0f43c06ffa601ca5bfdc5d1de736 Mon Sep 17 00:00:00 2001
From: Anton Georgiev <anto.georgiev@gmail.com>
Date: Mon, 12 Nov 2018 22:09:04 +0000
Subject: [PATCH] better updates
---
bbb-api-demo/src/main/webapp/demo_iframe.jsp | 52 ++++++++++++++-----
.../actions-dropdown/component.jsx | 1 +
.../ui/components/actions-bar/container.jsx | 16 +++++-
.../ui/components/actions-bar/service.js | 27 +++++++---
4 files changed, 77 insertions(+), 19 deletions(-)
diff --git a/bbb-api-demo/src/main/webapp/demo_iframe.jsp b/bbb-api-demo/src/main/webapp/demo_iframe.jsp
index f815961db0..96ca85ce66 100644
--- a/bbb-api-demo/src/main/webapp/demo_iframe.jsp
+++ b/bbb-api-demo/src/main/webapp/demo_iframe.jsp
@@ -134,13 +134,30 @@ if (request.getParameterMap().isEmpty()) {
%>
<script language="javascript" type="text/javascript">
+ var recButton = document.createElement("button");
+ var muteButton = document.createElement("button");
+
//EventListener(Getting message from iframe)
window.addEventListener('message', function(e) {
- console.error('message: ', e);
- document.getElementById("output-content").innerHTML = JSON.stringify(e.data.response);
- // document.getElementById("output-content").innerHTML = e.data.response;
+ handleMessage(e.data.response);
});
+ function handleMessage(e) {
+ switch(e) {
+ case 'readyToConnect': {
+ console.error('readdddy');
+ // get initial state
+ getInitialState(); break; }
+ case 'recordingStarted': { console.log('1'); recButton.innerHTML = "Stop Recording"; break;}
+ case 'recordingStopped': { console.log('2'); recButton.innerHTML = "Start Recording"; break;}
+ case 'selfMuted': { console.log('3'); muteButton.innerHTML = "Unmute me"; break;}
+ case 'selfUnmuted': { console.log('4'); muteButton.innerHTML = "Mute me"; break;}
+ default: console.log('neither', { e } );
+ }
+
+
+ }
+
/********************functions for the controls************************/
//Toggle Recording
function recToggle(){
@@ -153,9 +170,14 @@ if (request.getParameterMap().isEmpty()) {
}
///////////////////////////////////////////////////////////////////////
- //Clean up the body node before loading controls and the client
- console.log("Join URL = <%=joinURL%>");
+ function getInitialState() {
+ console.log('getting initial state');
+ document.getElementById("client-content").contentWindow.postMessage("c_recording_status","*");
+ }
+ ///////////////////////////////////////////////////////////////////////
+
+ //Clean up the body node before loading controls and the client
document.body.innerHTML = "";
//Node for the Client
@@ -164,9 +186,12 @@ if (request.getParameterMap().isEmpty()) {
var clientContent = document.createElement("iframe");
clientContent.setAttribute("id","client-content");
- clientContent.setAttribute("src","<%=joinURL%>");
+ // clientContent.setAttribute("src","<%=joinURL%>");
// clientContent.setAttribute("src","https://MYDOMAIN.com/demo/demoHTML5.jsp");
// clientContent.setAttribute("allow","microphone https://MYDOMAIN.com; camera https://MYDOMAIN.com");
+ clientContent.setAttribute("src","https://anton22.blindside-dev.com/demo/demoHTML5.jsp");
+ clientContent.setAttribute("allow","microphone https://anton22.blindside-dev.com; camera https://anton22.blindside-dev.com");
+
client.appendChild(clientContent);
@@ -178,15 +203,13 @@ if (request.getParameterMap().isEmpty()) {
/****************** Controls *****************************/
//Node for the control which controls recording functionality of the html5Client
- var recButton = document.createElement("button");
- recButton.innerHTML = "Start/Stop Recording";
recButton.setAttribute("onClick","recToggle();");
controls.appendChild(recButton);
- var muteButton = document.createElement("button");
- muteButton.innerHTML = "Toggle mute";
+ // var muteButton = document.createElement("button");
+ // muteButton.innerHTML = "Toggle mute";
muteButton.setAttribute("onClick","muteToggle();");
controls.appendChild(muteButton);
@@ -200,11 +223,16 @@ if (request.getParameterMap().isEmpty()) {
var outputContent = document.createElement("textarea");
outputContent.setAttribute("id","output-content");
- outputContent.setAttribute("rows","4");
+ outputContent.setAttribute("rows","2");
outputContent.setAttribute("cols","50");
-
output.appendChild(outputContent);
+ var currentStates = document.createElement("textarea");
+ currentStates.setAttribute("id","current-states");
+ currentStates.setAttribute("rows","2");
+ currentStates.setAttribute("cols","50");
+ output.appendChild(currentStates);
+
//Append the nodes of contents to the body node
document.body.appendChild(controls);
document.body.appendChild(output);
diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/actions-dropdown/component.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/actions-dropdown/component.jsx
index 28092cf025..0da0a77e1c 100755
--- a/bigbluebutton-html5/imports/ui/components/actions-bar/actions-dropdown/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/actions-bar/actions-dropdown/component.jsx
@@ -93,6 +93,7 @@ class ActionsDropdown extends Component {
componentDidMount() {
if (Meteor.settings.public.allowOutsideCommands.toggleRecording ||
getFromUserSettings('outsideToggleRecording', false)) {
+ ActionBarService.connectRecordingObserver();
window.addEventListener('message', ActionBarService.processOutsideToggleRecording);
}
}
diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx
index c929503b17..da38b1bec2 100644
--- a/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx
@@ -2,6 +2,8 @@ import React from 'react';
import { withTracker } from 'meteor/react-meteor-data';
import { Session } from 'meteor/session';
import getFromUserSettings from '/imports/ui/services/users-settings';
+import Meetings from '/imports/api/meetings';
+import Auth from '/imports/ui/services/auth';
import ActionsBar from './component';
import Service from './service';
import VideoService from '../video-provider/service';
@@ -9,7 +11,7 @@ import { shareScreen, unshareScreen, isVideoBroadcasting } from '../screenshare/
const ActionsBarContainer = props => <ActionsBar {...props} />;
-export default withTracker(({ }) => {
+export default withTracker(() => {
const togglePollMenu = () => {
const showPoll = Session.equals('isPollOpen', false) || !Session.get('isPollOpen');
@@ -27,6 +29,18 @@ export default withTracker(({ }) => {
return showPoll ? show() : hide();
};
+ Meetings.find({ meetingId: Auth.meetingID }).observeChanges({
+ changed: (id, fields) => {
+ if (fields.recordProp && fields.recordProp.recording) {
+ this.window.parent.postMessage({ response: 'recordingStarted' }, '*');
+ }
+
+ if (fields.recordProp && !fields.recordProp.recording) {
+ this.window.parent.postMessage({ response: 'recordingStopped' }, '*');
+ }
+ },
+ });
+
return {
isUserPresenter: Service.isUserPresenter(),
isUserModerator: Service.isUserModerator(),
diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/service.js b/bigbluebutton-html5/imports/ui/components/actions-bar/service.js
index 1d4c0babae..1e673ea031 100644
--- a/bigbluebutton-html5/imports/ui/components/actions-bar/service.js
+++ b/bigbluebutton-html5/imports/ui/components/actions-bar/service.js
@@ -5,16 +5,31 @@ import Meetings from '/imports/api/meetings';
import Breakouts from '/imports/api/breakouts';
const processOutsideToggleRecording = (e) => {
- if (e.data === 'c_record') {
- const newRecordingState = Meetings.findOne({ meetingId: Auth.meetingID }).recordProp.recording;
- makeCall('toggleRecording')
- .then(() => {
- this.window.parent.postMessage({ response: { newRecordingState } }, '*');
- });
+ switch (e.data) {
+ case 'c_record': {
+ makeCall('toggleRecording');
+ break;
+ }
+ case 'c_recording_status': {
+ const recordingState = Meetings.findOne({ meetingId: Auth.meetingID }).recordProp.recording;
+ const recordingMessage = recordingState ? 'recordingStarted' : 'recordingStopped';
+ this.window.parent.postMessage({ response: recordingMessage }, '*');
+ break;
+ }
+ default: {
+ // console.log(e.data);
+ }
}
};
+const connectRecordingObserver = () => {
+ // notify on load complete
+ this.window.parent.postMessage({ response: 'readyToConnect' }, '*');
+};
+
+
export default {
+ connectRecordingObserver: () => connectRecordingObserver(),
isUserPresenter: () => Users.findOne({ userId: Auth.userID }).presenter,
isUserModerator: () => Users.findOne({ userId: Auth.userID }).moderator,
recordSettingsList: () => Meetings.findOne({ meetingId: Auth.meetingID }).recordProp,
--
GitLab