From 0f47798cc6e4a0f1fe28db9754f6d4e4ece964bf Mon Sep 17 00:00:00 2001
From: Matthias Konitzny <konitzny@ibr.cs.tu-bs.de>
Date: Fri, 1 Oct 2021 14:26:54 +0200
Subject: [PATCH] Implemented video tag option.
---
display/overlays/nodeinfo.js | 35 +++++++++++++++++++++++++++++------
kg-style.css | 15 ++++++++++++++-
2 files changed, 43 insertions(+), 7 deletions(-)
diff --git a/display/overlays/nodeinfo.js b/display/overlays/nodeinfo.js
index e94bba4..cdf2511 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 79aa80f..a260472 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 {
--
GitLab