From 1beac8a8811bff100e9e2bb760cf3bc297b5dcdd Mon Sep 17 00:00:00 2001
From: coolneng <akasroua@gmail.com>
Date: Sun, 7 Feb 2021 21:18:30 +0100
Subject: [PATCH] Add Jitsi Meet iframe

---
 jitsi-iframe.html | 102 ++++++++++++++++++++++++++++++++++++++++++++++
 shell.nix         |   9 ----
 2 files changed, 102 insertions(+), 9 deletions(-)
 create mode 100644 jitsi-iframe.html
 delete mode 100644 shell.nix
diff --git a/jitsi-iframe.html b/jitsi-iframe.html
new file mode 100644
index 0000000..c4924ab
--- /dev/null
+++ b/jitsi-iframe.html
@@ -0,0 +1,102 @@
+<html itemscope itemtype="http://schema.org/Product" prefix="og: http://ogp.me/ns#" xmlns="http://www.w3.org/1999/html">
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="content-type" content="text/html; charset=utf-8">
+    <style>
+        * {
+            box-sizing: border-box;
+        }
+
+        .row {
+            display: flex;
+            justify-content: center;
+        }
+
+        /* Clear floats after the columns */
+        .row:after {
+            content: "";
+            display: table;
+            clear: both;
+        }
+
+</style>
+    <script src="https://meet.jit.si/external_api.js"></script>  <!-- Include the script from here. It should be included in your jitsi installation. -->
+</head>
+
+<body>
+    <div class="row">
+        <div id=meet></div>
+    </div>
+</body>
+<script>
+    const domain = "meet.jit.si"; //Here goes your domain where the meeting takes place.
+    var isStreamOn = false; //This is a variable I've defined to use later.
+    const options = {
+        roomName: "Coacecursolod", //This is the name of the room. Quite obvious.
+        width: 800,                //Well, you know.
+        height: 480,                //Same as above, just vertical.
+        parentNode: document.querySelector('#meet') //Now, you declare here which element should parent your stream.
+    }
+    const api = new JitsiMeetExternalAPI(domain, options); //This is where the iframe is actually constructed
+    //The function below turns on the Tile View everytime a participant joins. Practically it makes Tile View the default mode
+    api.addEventListener(`videoConferenceJoined`, () => {
+        const listener = ({ enabled }) => {
+            api.removeEventListener(`tileViewChanged`, listener);
+
+            if (!enabled) {
+                api.executeCommand(`toggleTileView`);
+            }
+        };
+    });
+
+   
+
+    function streamHandler() {
+        try {
+            if (!isStreamOn) {
+                document.getElementById("streamingResponseMsg").innerHTML = "Starting streaming...";
+                //The function below starts the stream or recording, according to its "mode"
+                api.executeCommand('startRecording', {
+                    mode: 'stream', //recording mode, either `file` or `stream`.
+                    rtmpStreamKey: '', //This where you *should* put your favoured rtmp stream server along with your key, like "rtmp:\/\/some.address/norecord/stream-key"
+                    youtubeStreamKey: 'rtmp:\/\/some.address/norecord/stream-key', //the youtube stream key.
+                });
+            } else {
+                document.getElementById("streamingResponseMsg").innerHTML = "Stopping streaming...";
+                //The function below stops the stream or recording, according to the string you pass. Official guide shows an object, while it should be a string
+                api.executeCommand('stopRecording', 'stream');
+            }
+
+        }
+        catch (e){
+            if (isStreamOn){
+                document.getElementById("streamingResponseMsg").innerHTML = "Error while stopping stream.";
+                console.log("Exception while stopping stream.", e);
+            }else{
+                document.getElementById("streamingResponseMsg").innerHTML = "Error while starting stream.";
+                console.log("Exception while starting stream.", e);
+
+            }    
+            this.isStreamOn = false;
+         }
+    };
+        //This part doesn't work without making some changes to the code as per this; https://github.com/team-ai-repo/jitsi-meet/pull/4/files
+    api.addEventListener("recordingStarted", () => {
+        document.getElementById("stream-btn").innerHTML="Stop Streaming";
+        document.getElementById("streamingResponseMsg").innerHTML = "Stream is on";
+        this.isStreamOn = true;
+        console.log("Example Stream On", this.isStreamOn);
+        });
+
+        api.addEventListener("recordingStopped", () => {
+        document.getElementById("stream-btn").innerHTML="Start Streaming";
+        document.getElementById("streamingResponseMsg").innerHTML = "Stream is off";
+        console.log("Example Stream Off", this.isStreamOn);
+        this.isStreamOn = false;
+    });
+
+
+</script>
+
+</html>
diff --git a/shell.nix b/shell.nix
deleted file mode 100644
index 81c823e..0000000
--- a/shell.nix
+++ /dev/null
@@ -1,9 +0,0 @@
-{ pkgs ? import <nixpkgs> {} }:
-
-with pkgs;
-
-mkShell {
-  buildInputs = [
-
-  ];
-}
