Implemented video tag option.

display/overlays/nodeinfo.js

@@ -37,6 +37,7 @@ class NodeInfoOverlay {
         jQuery("#infoOverlayCloseButton").click(function () {
             jQuery("#infoOverlay").slideUp("fast");
         });
+        jQuery("#infoOverlay").hide();
     }
 
     createOverlayMainDiv() {
@@ -78,6 +79,14 @@ class NodeInfoOverlay {
             id: "infoOverlayDescription",
             innerText: "Default Text",
         });
+
+        const videoDiv = Helpers.createDiv("detail-view-video-div", infoArea);
+
+        const video = document.createElement("video");
+        video.id = "infoOverlayVideo";
+        video.controls = true;
+        video.className = "detail-view-video";
+        videoDiv.appendChild(video);
     }
 
     /**
@@ -85,17 +94,24 @@ class NodeInfoOverlay {
      * @param node
      */
     updateInfoOverlay(node) {
-        jQuery("#infoOverlayHeadline").text(node.name);
+        const headline = jQuery("#infoOverlayHeadline");
+        headline.text(node.name);
         if ("image" in node) {
-            jQuery("#infoOverlayImage").attr(
+            headline.css("margin-top", "0px");
+            //jQuery("#infoOverlayImage").removeClass("hidden-tab");
+            const overlayImage = jQuery("#infoOverlayImage");
+            overlayImage.show();
+            overlayImage.attr(
                 "src",
                 Config.PLUGIN_PATH + "datasets/images/" + node.image
             );
         } else {
-            jQuery("#infoOverlayImage").attr(
-                "src",
-                Config.PLUGIN_PATH + "datasets/images/default.jpg"
-            );
+            headline.css("margin-top", "25px");
+            jQuery("#infoOverlayImage").hide();
+            // jQuery("#infoOverlayImage").attr(
+            //     "src",
+            //     Config.PLUGIN_PATH + "datasets/images/default.jpg"
+            // );
         }
 
         if ("description" in node) {
@@ -104,6 +120,13 @@ class NodeInfoOverlay {
             jQuery("#infoOverlayDescription").text("Default Text");
         }
 
+        if ("video" in node) {
+            jQuery("#infoOverlayVideo").show();
+            jQuery("#infoOverlayVideo").attr("src", node.video);
+        } else {
+            jQuery("#infoOverlayVideo").hide();
+        }
+
         this.bottomMenu.updateTabs(node);
         jQuery("#infoOverlay").slideDown("fast");
     }

kg-style.css

@@ -112,7 +112,20 @@
     font-family: CuratorRegular, Helvetica Neue, Helvetica, Arial, sans-serif;
     word-wrap: break-word;
     hyphens: auto;
-    font-size: 2vw;
+    font-size: 1.6vw;
+    padding-left: 5px;
+    padding-right: 5px;
+}
+
+.detail-view-video-div {
+    width: 100%;
+    padding: 10px;
+}
+
+.detail-view-video {
+    object-fit: scale-down;
+    width: 100%;
+    height: auto;
 }
 
 .link-overlay {