Merge remote-tracking branch 'gh-soichih/gh-pages' into gh-pages

* gh-soichih/gh-pages: fixed overrides mechanism to allow custom videochat url as well as custom jitsi room name added cid to the ip address key updated the way opened rooms are kept up.
datalad-datasets · Jun 26, 2020 · 762d046 · 762d046
2 parents 2917dd3 + 6abdae9
commit 762d046
Show file tree

Hide file tree

Showing 5 changed files with 102 additions and 77 deletions.
diff --git a/assets/css/room.css b/assets/css/room.css
@@ -0,0 +1,8 @@
+body, html {
+    margin: 0;
+    padding: 0;
+    height: 100%;
+}
+#meet {
+    height: 100%;
+}
diff --git a/assets/js/main.js b/assets/js/main.js
@@ -182,7 +182,7 @@ function getNodeType(jQuery, md5, url) {
  * @param {object} md5 md5 library object
  * @return {object} returns the rendered DataTable object
  */
-function directory(jQuery) {
+async function directory(jQuery) {
 
     // Embed the table placeholder
     jQuery('#content').prepend('<table id="directory" class="display"></table>');
@@ -217,18 +217,22 @@ function directory(jQuery) {
             {
                 targets: 4,//video
                 render(data, type, row) {
-                    /*
-                    return `
-                        <button type="button" onclick="openJit('https://meet.jit.si/ohbm2020-${row.number}', ${row.number})">
-                            Open
-                            <small>(<span id="jit_users_${row.number}">0</span> people)</small>
-                        </button>
-                    `
-                    */
-                    return `
-                        <a href="#" onclick="openJit('https://meet.jit.si/ohbm2020-${row.number}', ${row.number})">jitsi:ohbm2020-${row.number}</a>
-                        <!--<small>(<span id="jit_users_${row.number}">0</span> people)</small>-->
-                    `
+                    let name = "ohbm2020-"+row.number; //default
+                    if(row.videochat) name = row.videochat; //user can override it to another jitsi name
+                    if(row.videochat && row.videochat.startsWith("http")) {
+                        //or use custom url
+                        return `
+                            <a href="${row.videochat}" targer="ohbm2020_${row.number}">
+                                custom url
+                            </a>
+                        `;
+                    } else {
+                        return `
+                            <a href="#" onclick="openJit('${row.number}', '${name}')">
+                                jitsi://${name}
+                            </a>
+                        `;
+                    }
                 },
             },
             {
@@ -244,8 +248,6 @@ function directory(jQuery) {
                         return '<a href="https://github.com/datalad-datasets/ohbm2020-posters/pulls">[ADD]</a>';
                     } else {
                         return '<a href="' + row.pdf + '" target="_ohbm2020_pdf_' + row.number + '">PDF</a>';
-                        //return '<a href="#" onclick="openPdf('"+row.pdf+"', '"+row.number+"')">PDF</a>';
-                        //return '<a href="#" onclick="openPdf("'+row.pdf+'", 1)">PDF</a>';
                     }
                 },
             }
@@ -254,70 +256,52 @@ function directory(jQuery) {
     }); //end of DataTable
 
     //load posters
-    fetch("posters.json").then(res=>res.json()).then(data=>{
-        data.posters.forEach(p=>{
-            p.id = 'p'+p.number; //cannot be number (or string of number)
-            p.people = 0;
-        });
-        table.rows.add(data.posters).draw();
+    let res = await fetch("posters.json");
+    let data = await res.json();
+    data.posters.forEach(p=>{
+        p.id = 'p'+p.number; //cannot be number (or string of number)
+        p.people = 0;
+        p.videochat = null; //let's ignore this now (override only)
+    });
 
-        wss = new ReconnectingWebSocket("wss://dev1.soichi.us/ohbm2020/");
+    //load override and apply
+    res = await fetch("posters-overrides.json");
+    let override = await res.json();
+    override.posters.forEach(o=>{
+        let p = data.posters.find(p=>p.number == o.number);
+        Object.assign(p, o);
+    });
 
-        //connect to backend
-        wss.onopen = () => {
-            wss.send(JSON.stringify({action: "dump"}));
-        }
-        wss.onmessage = e => {
-            let msg = JSON.parse(e.data);
-            if(msg.dump) {
-                for(let key in msg.dump) {
-                    $("#jit_users_"+key).text(msg.dump[key]);
-                    let row = table.row("#p"+key);
-                    if(row.length == 1) {
-                        table.cell(row, 5).data(msg.dump[key]);
-                    }
+    table.rows.add(data.posters).draw();
+
+    wss = new ReconnectingWebSocket("wss://dev1.soichi.us/ohbm2020/");
+
+    //connect to backend
+    wss.onopen = () => {
+        wss.send(JSON.stringify({action: "dump"}));
+    }
+    wss.onmessage = e => {
+        let msg = JSON.parse(e.data);
+        if(msg.dump) {
+            for(let key in msg.dump) {
+                let row = table.row("#p"+key);
+                if(row.length == 1) {
+                    table.cell(row, 5).data(msg.dump[key]);
                 }
-                table.draw();
-            }
-            if(msg.update) {
-                $("#jit_users_"+msg.update.id).text(msg.update.count);
-                let row = table.row("#p"+msg.update.id);
-                table.cell(row, 5).data(msg.update.count).draw();
             }
+            table.draw();
         }
-    });
+        if(msg.update) {
+            let row = table.row("#p"+msg.update.id);
+            table.cell(row, 5).data(msg.update.count).draw();
+        }
+    }
 
     localStorage['ntCache'] = JSON.stringify(ntCache);
     return table;
 }
 
-let openJits = new Set();
-
-window.addEventListener("beforeunload", function(evt) {
-    openJits.forEach(id=>{
-        wss.send(JSON.stringify({action: "jitclose", id}));
-    });
-});
-
-function openJit(url, number) {
-    wss.send(JSON.stringify({action: "jit", id: number}));
-    openJits.add(number);
-    let child = window.open(url, "jit"+number);
-    let timer = setInterval(()=>{
-        console.log(openJits);
-        if(child.closed) {
-            wss.send(JSON.stringify({action: "jitclose", id: number}));
-            openJits.delete(number);
-            clearInterval(timer);
-        } else {
-            //still open.. let's let the server know that we are still here
-            wss.send(JSON.stringify({action: "jit", id: number}));
-        }
-    }, 1000*3);
-}
-
-function openPdf(url, number) {
-    window.open(pdf, "pdf"+number);
+function openJit(id, name) {
+    window.open("room.html#"+id+"."+name);
 }
 
-
diff --git a/backend/server.js b/backend/server.js
@@ -30,7 +30,7 @@ app.ws('/', function(ws, req) {
         try {
             //console.debug(data);
             let msg = JSON.parse(data);
-            let ip = req.headers["x-real-ip"];
+            let ip = req.headers["x-real-ip"]+"."+msg.cid; 
             let entry;
 
             switch(msg.action) {

diff --git a/posters-overrides.json b/posters-overrides.json
@@ -3082,7 +3082,7 @@
   },
   {
    "number": 1098,
-   "videochat": "<a href=\"https://meet.jit.si/cobidas_checklist\" target=\"_cobidas_checklist\">jitsi:cobidas_checklist</a>",
+   "videochat": "cobidas_checklist",
    "pdf": "https://drive.google.com/file/d/1CirkGPplmrbqilPOq7OdKQJYZzwc0AKc/view?usp=sharing"
   },
   {
@@ -3674,7 +3674,7 @@
   },
   {
    "number": 1302,
-   "videochat": "<a href=\"https://meet.jit.si/ohbm2020-412\" target=\"_ohbm2020-412\">jitsi:ohbm2020-412</a>",
+   "videochat": "ohbm2020-412",
    "pdf": "https://cdn-akamai.6connex.com//645/1827//TaskCCA_poster_1__15922324225571065.pdf"
   },
   {
@@ -4583,7 +4583,7 @@
   },
   {
    "number": 1621,
-   "videochat": "<a href=\"https://zoom.us/j/9545579483?pwd=QUM3Um55MWV2RmFuWTJkb3ZKV2xQdz09\" target=\"_ohbm2020-1621\">zoom:9545579483</a> (password: \"visualqc\")",
+   "videochat": "https://zoom.us/j/9545579483?pwd=QUM3Um55MWV2RmFuWTJkb3ZKV2xQdz09",
    "pdf": "https://crossinvalidation.com/2020/06/22/evaluating-visual-qc-protocols-for-freesurfer-parcellations-error-detection-rate-inter-rater-reliability-and-site-differences/"
   },
   {
@@ -5290,7 +5290,7 @@
   },
   {
    "number": 1860,
-   "videochat": "<a href=\"https://meet.jit.si/DeepPrimateBrainShapes\" target=\"_DeepPrimateBrainShapes\">jitsi:DeepPrimateBrainShapes</a>",
+   "videochat": "DeepPrimateBrainShapes",
    "pdf": "https://github.com/katjaq/brainscapes/blob/master/img/Heuer-Toro_BrainScapes_OHBM_2020.pdf"
   },
   {
@@ -5395,7 +5395,7 @@
   },
   {
    "number": 1895,
-   "videochat": "<a href=\"https://meet.jit.si/bids-derivatives\" target=\"_bids-derivatives\">jitsi:bids-derivatives</a>",
+   "videochat": "bids-derivatives",
    "pdf": "https://cdn-akamai.6connex.com/645/1827/poster_15922429379118925.pdf"
   },
   {
@@ -5503,7 +5503,7 @@
   },
   {
    "number": 1929,
-   "videochat": "<a href=\"https://meet.jit.si/rsHRF_toolbox\" target=\"_rsHRF_toolbox\">jitsi:rsHRF_toolbox</a>",
+   "videochat": "rsHRF_toolbox",
    "pdf": "https://github.com/sofievdbos/OHBM2020/blob/master/OHBM20_SVDB_interactive.pdf"
   },
   {

diff --git a/room.html b/room.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<html>
+<head>
+    <script src='https://meet.jit.si/external_api.js'></script>
+	<script type="text/javascript" charset="utf-8" src="assets/js/reconnecting-websocket.min.js"></script>
+    <link rel="stylesheet" type="text/css" href="assets/css/room.css">
+</head>
+<body>
+    <div id="meet"/>
+    <script>
+        let hash = location.hash.substring(1); //jitsi room name
+        let id = hash.split(".")[0];
+        let roomName = hash.split(".")[1];
+        let cid = Math.random().toString(); //client id
+
+        if(!roomName) alert("no room name set in hash");
+
+        console.log(roomName);
+        const api = new JitsiMeetExternalAPI("meet.jit.si", {
+            roomName,
+            parentNode: document.querySelector('#meet')
+        })
+
+        let wss = new ReconnectingWebSocket("wss://dev1.soichi.us/ohbm2020/");
+        wss.onopen = () => {
+            wss.send(JSON.stringify({action: "jit", id, cid}));
+        }
+        window.addEventListener("beforeunload", function(evt) {
+            wss.send(JSON.stringify({action: "jitclose", id, cid}));
+        });
+    </script>
+</body>
+</html>