diff --git a/display/overlays/nodeinfo.js b/display/overlays/nodeinfo.js index e94bba4aeca0096a7906aae460eb4eaadda1bf13..cdf25114b4210edf07441826d70819f3ea42e278 100644 --- a/display/overlays/nodeinfo.js +++ b/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"); } diff --git a/kg-style.css b/kg-style.css index 79aa80f84d7ca62ed71b08b781cb9fab98e6c5c4..a260472b0d2499bc5bb017f04ece348765fe10a7 100644 --- a/kg-style.css +++ b/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 {