From ba5602f37072d672aa76a6e167a16dcccf5f027e Mon Sep 17 00:00:00 2001 From: pabloFuente Date: Wed, 6 Feb 2019 15:42:37 +0100 Subject: [PATCH] openvidu-recording tutorials updated to support 2.8.0 --- .../recording/java/MyRestController.java | 49 +++++---------- .../src/main/resources/static/app.js | 63 ++++++++++++------- .../src/main/resources/static/index.html | 42 ++++++++++--- .../src/main/resources/static/style.css | 40 ++++++++++-- openvidu-recording-node/public/app.js | 63 ++++++++++++------- openvidu-recording-node/public/index.html | 42 ++++++++++--- openvidu-recording-node/public/style.css | 40 ++++++++++-- openvidu-recording-node/server.js | 43 ++++--------- 8 files changed, 243 insertions(+), 139 deletions(-) diff --git a/openvidu-recording-java/src/main/java/io/openvidu/recording/java/MyRestController.java b/openvidu-recording-java/src/main/java/io/openvidu/recording/java/MyRestController.java index eaa4689b..7ce2f00b 100644 --- a/openvidu-recording-java/src/main/java/io/openvidu/recording/java/MyRestController.java +++ b/openvidu-recording-java/src/main/java/io/openvidu/recording/java/MyRestController.java @@ -23,6 +23,7 @@ import io.openvidu.java.client.OpenViduHttpException; import io.openvidu.java.client.OpenViduJavaClientException; import io.openvidu.java.client.OpenViduRole; import io.openvidu.java.client.Recording; +import io.openvidu.java.client.RecordingProperties; import io.openvidu.java.client.Session; import io.openvidu.java.client.TokenOptions; @@ -279,14 +280,22 @@ public class MyRestController { @RequestMapping(value = "/recording/start", method = RequestMethod.POST) public ResponseEntity startRecording(@RequestBody String param) throws ParseException { JSONObject json = (JSONObject) new JSONParser().parse(param); - String sessionId = (String) json.get("session"); - System.out.println("Starting recording | {sessionId}=" + sessionId); + String sessionId = (String) json.get("session"); + Recording.OutputMode outputMode = Recording.OutputMode.valueOf((String) json.get("outputMode")); + boolean hasAudio = (boolean) json.get("hasAudio"); + boolean hasVideo = (boolean) json.get("hasVideo"); + + RecordingProperties properties = new RecordingProperties.Builder().outputMode(outputMode).hasAudio(hasAudio) + .hasVideo(hasVideo).build(); + + System.out.println("Starting recording for session " + sessionId + " with properties {outputMode=" + outputMode + + ", hasAudio=" + hasAudio + ", hasVideo=" + hasVideo + "}"); try { - Recording recording = this.openVidu.startRecording(sessionId); + Recording recording = this.openVidu.startRecording(sessionId, properties); this.sessionRecordings.put(sessionId, true); - return new ResponseEntity<>(getJsonFromRecording(recording), HttpStatus.OK); + return new ResponseEntity<>(recording, HttpStatus.OK); } catch (OpenViduJavaClientException | OpenViduHttpException e) { return new ResponseEntity<>(e.getMessage(), HttpStatus.BAD_REQUEST); } @@ -302,7 +311,7 @@ public class MyRestController { try { Recording recording = this.openVidu.stopRecording(recordingId); this.sessionRecordings.remove(recording.getSessionId()); - return new ResponseEntity<>(getJsonFromRecording(recording), HttpStatus.OK); + return new ResponseEntity<>(recording, HttpStatus.OK); } catch (OpenViduJavaClientException | OpenViduHttpException e) { return new ResponseEntity<>(e.getMessage(), HttpStatus.BAD_REQUEST); } @@ -330,7 +339,7 @@ public class MyRestController { try { Recording recording = this.openVidu.getRecording(recordingId); - return new ResponseEntity<>(getJsonFromRecording(recording), HttpStatus.OK); + return new ResponseEntity<>(recording, HttpStatus.OK); } catch (OpenViduJavaClientException | OpenViduHttpException e) { return new ResponseEntity<>(e.getMessage(), HttpStatus.BAD_REQUEST); } @@ -344,7 +353,7 @@ public class MyRestController { try { List recordings = this.openVidu.listRecordings(); - return new ResponseEntity<>(getJsonArrayFromRecordingList(recordings), HttpStatus.OK); + return new ResponseEntity<>(recordings, HttpStatus.OK); } catch (OpenViduJavaClientException | OpenViduHttpException e) { return new ResponseEntity<>(e.getMessage(), HttpStatus.BAD_REQUEST); } @@ -359,32 +368,6 @@ public class MyRestController { return new ResponseEntity<>(json, HttpStatus.INTERNAL_SERVER_ERROR); } - @SuppressWarnings("unchecked") - private JSONObject getJsonFromRecording(Recording recording) { - JSONObject json = new JSONObject(); - json.put("createdAt", recording.getCreatedAt()); - json.put("duration", recording.getDuration()); - json.put("hasAudio", recording.hasAudio()); - json.put("hasVideo", recording.hasVideo()); - json.put("id", recording.getId()); - json.put("recordingLayout", recording.getRecordingLayout()); - json.put("name", recording.getName()); - json.put("sessionId", recording.getSessionId()); - json.put("size", recording.getSize()); - json.put("status", recording.getStatus()); - json.put("url", recording.getUrl()); - return json; - } - - @SuppressWarnings("unchecked") - private JSONArray getJsonArrayFromRecordingList(Collection recordings) { - JSONArray array = new JSONArray(); - for (Recording recording : recordings) { - array.add(getJsonFromRecording(recording)); - } - return array; - } - @SuppressWarnings("unchecked") protected JSONObject sessionToJson(Session session) { JSONObject json = new JSONObject(); diff --git a/openvidu-recording-java/src/main/resources/static/app.js b/openvidu-recording-java/src/main/resources/static/app.js index 29b9ee14..0de93909 100644 --- a/openvidu-recording-java/src/main/resources/static/app.js +++ b/openvidu-recording-java/src/main/resources/static/app.js @@ -124,8 +124,9 @@ function getToken(callback) { httpRequest( 'POST', - 'api/get-token', - { sessionName: sessionName }, + 'api/get-token', { + sessionName: sessionName + }, 'Request of TOKEN gone WRONG:', (response) => { token = response[0]; // Get token from response @@ -138,8 +139,10 @@ function getToken(callback) { function removeUser() { httpRequest( 'POST', - 'api/remove-user', - { sessionName: sessionName, token: token }, + 'api/remove-user', { + sessionName: sessionName, + token: token + }, 'User couldn\'t be removed from session', (response) => { console.warn("You have been removed from session " + sessionName); @@ -150,8 +153,9 @@ function removeUser() { function closeSession() { httpRequest( 'DELETE', - 'api/close-session', - { sessionName: sessionName }, + 'api/close-session', { + sessionName: sessionName + }, 'Session couldn\'t be closed', (response) => { console.warn("Session " + sessionName + " has been closed"); @@ -162,8 +166,9 @@ function closeSession() { function fetchInfo() { httpRequest( 'POST', - 'api/fetch-info', - { sessionName: sessionName }, + 'api/fetch-info', { + sessionName: sessionName + }, 'Session couldn\'t be fetched', (response) => { console.warn("Session info has been fetched"); @@ -175,8 +180,7 @@ function fetchInfo() { function fetchAll() { httpRequest( 'GET', - 'api/fetch-all', - {}, + 'api/fetch-all', {}, 'All session info couldn\'t be fetched', (response) => { console.warn("All session info has been fetched"); @@ -188,8 +192,10 @@ function fetchAll() { function forceDisconnect() { httpRequest( 'DELETE', - 'api/force-disconnect', - { sessionName: sessionName, connectionId: document.getElementById('forceValue').value }, + 'api/force-disconnect', { + sessionName: sessionName, + connectionId: document.getElementById('forceValue').value + }, 'Connection couldn\'t be closed', (response) => { console.warn("Connection has been closed"); @@ -200,8 +206,10 @@ function forceDisconnect() { function forceUnpublish() { httpRequest( 'DELETE', - 'api/force-unpublish', - { sessionName: sessionName, streamId: document.getElementById('forceValue').value }, + 'api/force-unpublish', { + sessionName: sessionName, + streamId: document.getElementById('forceValue').value + }, 'Stream couldn\'t be closed', (response) => { console.warn("Stream has been closed"); @@ -235,10 +243,17 @@ function httpRequest(method, url, body, errorMsg, callback) { } function startRecording() { + var outputMode = document.querySelector('input[name="outputMode"]:checked').value; + var hasAudio = !!document.querySelector("#has-audio-checkbox:checked"); + var hasVideo = !!document.querySelector("#has-video-checkbox:checked"); httpRequest( 'POST', - 'api/recording/start', - { session: session.sessionId }, + 'api/recording/start', { + session: session.sessionId, + outputMode: outputMode, + hasAudio: hasAudio, + hasVideo: hasVideo + }, 'Start recording WRONG', (response) => { console.log(response); @@ -253,8 +268,9 @@ function stopRecording() { var forceRecordingId = document.getElementById('forceRecordingId').value; httpRequest( 'POST', - 'api/recording/stop', - { recording: forceRecordingId }, + 'api/recording/stop', { + recording: forceRecordingId + }, 'Stop recording WRONG', (response) => { console.log(response); @@ -267,8 +283,9 @@ function deleteRecording() { var forceRecordingId = document.getElementById('forceRecordingId').value; httpRequest( 'DELETE', - 'api/recording/delete', - { recording: forceRecordingId }, + 'api/recording/delete', { + recording: forceRecordingId + }, 'Delete recording WRONG', () => { console.log("DELETE ok"); @@ -281,8 +298,7 @@ function getRecording() { var forceRecordingId = document.getElementById('forceRecordingId').value; httpRequest( 'GET', - 'api/recording/get/' + forceRecordingId, - {}, + 'api/recording/get/' + forceRecordingId, {}, 'Get recording WRONG', (response) => { console.log(response); @@ -294,8 +310,7 @@ function getRecording() { function listRecordings() { httpRequest( 'GET', - 'api/recording/list', - {}, + 'api/recording/list', {}, 'List recordings WRONG', (response) => { console.log(response); diff --git a/openvidu-recording-java/src/main/resources/static/index.html b/openvidu-recording-java/src/main/resources/static/index.html index 9c09e9ed..0cd0b071 100644 --- a/openvidu-recording-java/src/main/resources/static/index.html +++ b/openvidu-recording-java/src/main/resources/static/index.html @@ -39,7 +39,8 @@ title="GitHub Repository" target="_blank"> - + @@ -70,24 +71,49 @@

- - + +
+ + - +
-
+
+
+ + +
+
+ + +
+
+
- - - +
+ + +
diff --git a/openvidu-recording-java/src/main/resources/static/style.css b/openvidu-recording-java/src/main/resources/static/style.css index e0f49323..abac6a79 100644 --- a/openvidu-recording-java/src/main/resources/static/style.css +++ b/openvidu-recording-java/src/main/resources/static/style.css @@ -229,7 +229,7 @@ a:hover .demo-logo { } #session-header form { - display: inline; + display: inline-block; } #session-header input.btn { @@ -360,47 +360,75 @@ table i { height: 40%; } -#recording-btns #btns { +#recording-btns .btns { margin-top: 10px; } -#recording-btns #btns .form-control { +#recording-btns .btns .form-control { width: initial; - display: inline-block; + display: inline; +} + +#recording-btns .btns form { + display: inline; } #recording-btns #text-area { - display: inline-block; + display: inline; width: 100%; - height: 80%; + height: 74%; margin-top: 20px; } +.vertical-separator-bottom { + width: 2px; + height: 34px; + display: inline; + background-color: #cbcbcb; + margin: 0 8px 0 8px; + margin-bottom: -12px; +} + +.vertical-separator-top { + width: 2px; + height: 30px; + background-color: #cbcbcb; + margin: 20px 8px 0 15px; + float: right; +} + /* xs ans md screen resolutions*/ @media screen and (max-width: 991px) { #join { padding-top: inherit; } + #not-logged { padding-top: inherit; } + .container .navbar-header { margin-right: 0 !important; margin-left: 0 !important; } + .nav-icon { padding: 9px 8px 9px 8px; } + nav i.fa { font-size: 32px; } + .vertical-center { padding-top: 10px; } + #img-div { padding-bottom: 1em; } + #img-div img { height: 10%; } diff --git a/openvidu-recording-node/public/app.js b/openvidu-recording-node/public/app.js index 29b9ee14..0de93909 100644 --- a/openvidu-recording-node/public/app.js +++ b/openvidu-recording-node/public/app.js @@ -124,8 +124,9 @@ function getToken(callback) { httpRequest( 'POST', - 'api/get-token', - { sessionName: sessionName }, + 'api/get-token', { + sessionName: sessionName + }, 'Request of TOKEN gone WRONG:', (response) => { token = response[0]; // Get token from response @@ -138,8 +139,10 @@ function getToken(callback) { function removeUser() { httpRequest( 'POST', - 'api/remove-user', - { sessionName: sessionName, token: token }, + 'api/remove-user', { + sessionName: sessionName, + token: token + }, 'User couldn\'t be removed from session', (response) => { console.warn("You have been removed from session " + sessionName); @@ -150,8 +153,9 @@ function removeUser() { function closeSession() { httpRequest( 'DELETE', - 'api/close-session', - { sessionName: sessionName }, + 'api/close-session', { + sessionName: sessionName + }, 'Session couldn\'t be closed', (response) => { console.warn("Session " + sessionName + " has been closed"); @@ -162,8 +166,9 @@ function closeSession() { function fetchInfo() { httpRequest( 'POST', - 'api/fetch-info', - { sessionName: sessionName }, + 'api/fetch-info', { + sessionName: sessionName + }, 'Session couldn\'t be fetched', (response) => { console.warn("Session info has been fetched"); @@ -175,8 +180,7 @@ function fetchInfo() { function fetchAll() { httpRequest( 'GET', - 'api/fetch-all', - {}, + 'api/fetch-all', {}, 'All session info couldn\'t be fetched', (response) => { console.warn("All session info has been fetched"); @@ -188,8 +192,10 @@ function fetchAll() { function forceDisconnect() { httpRequest( 'DELETE', - 'api/force-disconnect', - { sessionName: sessionName, connectionId: document.getElementById('forceValue').value }, + 'api/force-disconnect', { + sessionName: sessionName, + connectionId: document.getElementById('forceValue').value + }, 'Connection couldn\'t be closed', (response) => { console.warn("Connection has been closed"); @@ -200,8 +206,10 @@ function forceDisconnect() { function forceUnpublish() { httpRequest( 'DELETE', - 'api/force-unpublish', - { sessionName: sessionName, streamId: document.getElementById('forceValue').value }, + 'api/force-unpublish', { + sessionName: sessionName, + streamId: document.getElementById('forceValue').value + }, 'Stream couldn\'t be closed', (response) => { console.warn("Stream has been closed"); @@ -235,10 +243,17 @@ function httpRequest(method, url, body, errorMsg, callback) { } function startRecording() { + var outputMode = document.querySelector('input[name="outputMode"]:checked').value; + var hasAudio = !!document.querySelector("#has-audio-checkbox:checked"); + var hasVideo = !!document.querySelector("#has-video-checkbox:checked"); httpRequest( 'POST', - 'api/recording/start', - { session: session.sessionId }, + 'api/recording/start', { + session: session.sessionId, + outputMode: outputMode, + hasAudio: hasAudio, + hasVideo: hasVideo + }, 'Start recording WRONG', (response) => { console.log(response); @@ -253,8 +268,9 @@ function stopRecording() { var forceRecordingId = document.getElementById('forceRecordingId').value; httpRequest( 'POST', - 'api/recording/stop', - { recording: forceRecordingId }, + 'api/recording/stop', { + recording: forceRecordingId + }, 'Stop recording WRONG', (response) => { console.log(response); @@ -267,8 +283,9 @@ function deleteRecording() { var forceRecordingId = document.getElementById('forceRecordingId').value; httpRequest( 'DELETE', - 'api/recording/delete', - { recording: forceRecordingId }, + 'api/recording/delete', { + recording: forceRecordingId + }, 'Delete recording WRONG', () => { console.log("DELETE ok"); @@ -281,8 +298,7 @@ function getRecording() { var forceRecordingId = document.getElementById('forceRecordingId').value; httpRequest( 'GET', - 'api/recording/get/' + forceRecordingId, - {}, + 'api/recording/get/' + forceRecordingId, {}, 'Get recording WRONG', (response) => { console.log(response); @@ -294,8 +310,7 @@ function getRecording() { function listRecordings() { httpRequest( 'GET', - 'api/recording/list', - {}, + 'api/recording/list', {}, 'List recordings WRONG', (response) => { console.log(response); diff --git a/openvidu-recording-node/public/index.html b/openvidu-recording-node/public/index.html index 7d99ba48..7798501f 100644 --- a/openvidu-recording-node/public/index.html +++ b/openvidu-recording-node/public/index.html @@ -39,7 +39,8 @@ title="GitHub Repository" target="_blank"> - +
@@ -70,24 +71,49 @@

- - + +
+ + - +
-
+
+
+ + +
+
+ + +
+
+
- - - +
+ + +
diff --git a/openvidu-recording-node/public/style.css b/openvidu-recording-node/public/style.css index e0f49323..abac6a79 100644 --- a/openvidu-recording-node/public/style.css +++ b/openvidu-recording-node/public/style.css @@ -229,7 +229,7 @@ a:hover .demo-logo { } #session-header form { - display: inline; + display: inline-block; } #session-header input.btn { @@ -360,47 +360,75 @@ table i { height: 40%; } -#recording-btns #btns { +#recording-btns .btns { margin-top: 10px; } -#recording-btns #btns .form-control { +#recording-btns .btns .form-control { width: initial; - display: inline-block; + display: inline; +} + +#recording-btns .btns form { + display: inline; } #recording-btns #text-area { - display: inline-block; + display: inline; width: 100%; - height: 80%; + height: 74%; margin-top: 20px; } +.vertical-separator-bottom { + width: 2px; + height: 34px; + display: inline; + background-color: #cbcbcb; + margin: 0 8px 0 8px; + margin-bottom: -12px; +} + +.vertical-separator-top { + width: 2px; + height: 30px; + background-color: #cbcbcb; + margin: 20px 8px 0 15px; + float: right; +} + /* xs ans md screen resolutions*/ @media screen and (max-width: 991px) { #join { padding-top: inherit; } + #not-logged { padding-top: inherit; } + .container .navbar-header { margin-right: 0 !important; margin-left: 0 !important; } + .nav-icon { padding: 9px 8px 9px 8px; } + nav i.fa { font-size: 32px; } + .vertical-center { padding-top: 10px; } + #img-div { padding-bottom: 1em; } + #img-div img { height: 10%; } diff --git a/openvidu-recording-node/server.js b/openvidu-recording-node/server.js index f49fb21f..271e3f68 100644 --- a/openvidu-recording-node/server.js +++ b/openvidu-recording-node/server.js @@ -68,7 +68,9 @@ app.post('/api/get-token', function (req, res) { console.log("Getting a token | {sessionName}={" + sessionName + "}"); // Build tokenOptions object with PUBLISHER role - var tokenOptions = { role: role } + var tokenOptions = { + role: role + } if (mapSessions[sessionName]) { // Session already exists @@ -258,11 +260,16 @@ app.delete('/api/force-unpublish', function (req, res) { // Start recording app.post('/api/recording/start', function (req, res) { // Retrieve params from POST body + var recordingProperties = { + outputMode: req.body.outputMode, + hasAudio: req.body.hasAudio, + hasVideo: req.body.hasVideo, + } var sessionId = req.body.session; console.log("Starting recording | {sessionId}=" + sessionId); - OV.startRecording(sessionId) - .then(recording => res.status(200).send(getJsonFromRecording(recording))) + OV.startRecording(sessionId, recordingProperties) + .then(recording => res.status(200).send(recording)) .catch(error => res.status(400).send(error.message)); }); @@ -273,7 +280,7 @@ app.post('/api/recording/stop', function (req, res) { console.log("Stopping recording | {recordingId}=" + recordingId); OV.stopRecording(recordingId) - .then(recording => res.status(200).send(getJsonFromRecording(recording))) + .then(recording => res.status(200).send(recording)) .catch(error => res.status(400).send(error.message)); }); @@ -295,7 +302,7 @@ app.get('/api/recording/get/:recordingId', function (req, res) { console.log("Getting recording | {recordingId}=" + recordingId); OV.getRecording(recordingId) - .then(recording => res.status(200).send(getJsonFromRecording(recording))) + .then(recording => res.status(200).send(recording)) .catch(error => res.status(400).send(error.message)); }); @@ -304,34 +311,10 @@ app.get('/api/recording/list', function (req, res) { console.log("Listing recordings"); OV.listRecordings() - .then(recordings => res.status(200).send(getJsonArrayFromRecordingList(recordings))) + .then(recordings => res.status(200).send(recordings)) .catch(error => res.status(400).send(error.message)); }); -function getJsonFromRecording(recording) { - return { - "createdAt": recording.createdAt, - "duration": recording.duration, - "hasAudio": recording.hasAudio, - "hasVideo": recording.hasVideo, - "id": recording.id, - "name": recording.name, - "recordingLayout": recording.recordingLayout, - "sessionId": recording.sessionId, - "size": recording.size, - "status": recording.status, - "url": recording.url - } -} - -function getJsonArrayFromRecordingList(recordings) { - var jsonArray = []; - recordings.forEach(recording => { - jsonArray.push(getJsonFromRecording(recording)); - }) - return jsonArray; -} - function sessionToJson(session) { var json = {}; json.sessionId = session.sessionId;