diff --git a/pandora_console/include/javascript/map/MapController.js b/pandora_console/include/javascript/map/MapController.js
index 2837c63f32..be2c3be26b 100644
--- a/pandora_console/include/javascript/map/MapController.js
+++ b/pandora_console/include/javascript/map/MapController.js
@@ -122,7 +122,7 @@ MapController.prototype.click_event = function(event) {
}
MapController.prototype.popup_map = function(self, event) {
- // Node position and dimension
+ // Node position and radius
nodeX = parseInt($(event.currentTarget).attr("cx"));
nodeY = parseInt($(event.currentTarget).attr("cy"));
nodeR = parseInt($(event.currentTarget).attr("r"));
@@ -141,28 +141,33 @@ MapController.prototype.popup_map = function(self, event) {
//To know the position of the dialog box
if (self.xOffset(map_width, nodeX, dialog_width) && self.yOffset(map_height, nodeY, dialog_height)) {
+ var dialogClass = "nodeDialogBottom";
var xPos = event.pageX - dialog_width + nodeR;
var yPos = event.clientY - dialog_height - nodeR - self._dialogNodeMargin;
}
else if (self.yOffset(map_height, nodeY, dialog_height)) {
+ var dialogClass = "nodeDialogBottom";
var xPos = event.pageX - nodeR;
var yPos = event.clientY + -dialog_height - nodeR - self._dialogNodeMargin;
}
else if (self.xOffset(map_width, nodeX, dialog_width)) {
+ var dialogClass = "nodeDialogTop";
var xPos = event.pageX - dialog_width + nodeR;
var yPos = event.clientY + nodeR + self._dialogNodeMargin;
}
else {
+ var dialogClass = "nodeDialogTop";
var xPos = event.pageX - nodeR;
var yPos = event.clientY + nodeR + self._dialogNodeMargin;
}
$(self._target + " svg").after($("
").attr("id", "dialog_popup"));
$("#dialog_popup").dialog({
+ dialogClass: dialogClass,
modal: false,
closeOnEscape: true,
show: {effect: 'fade', speed: 1000},
- title: "Ventana Modarrl!!",
+ title: "Node dialog",
resizable: false,
position: [xPos,yPos],
height: dialog_height,
diff --git a/pandora_console/include/styles/pandora.css b/pandora_console/include/styles/pandora.css
index d6833dad11..56e5127408 100644
--- a/pandora_console/include/styles/pandora.css
+++ b/pandora_console/include/styles/pandora.css
@@ -3123,3 +3123,87 @@ table#policy_modules td * {
transform: rotate(359deg);
}
}
+
+/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+/*++++++++++++++++++++++++++++++ PROVISIONAL +++++++++++++++++++++++++++++*/
+/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+
+/* Top arrow to nodes dialog (Networkmap) */
+.nodeDialogTop {
+ position: relative;
+ background: #82b92e;
+}
+.nodeDialogTop:after {
+ bottom: 100%;
+ left: 50%;
+ border: solid transparent;
+ content: " ";
+ height: 0;
+ width: 0;
+ position: absolute;
+ pointer-events: none;
+ border-color: transparent;
+ border-bottom-color: #82b92e;
+ border-width: 15px;
+ margin-left: -15px;
+}
+
+/* Bottom arrow to nodes dialog (Networkmap) */
+.nodeDialogBottom {
+ position: relative;
+ background: #82b92e;
+}
+.nodeDialogBottom:after {
+ top: 100%;
+ left: 50%;
+ border: solid transparent;
+ content: " ";
+ height: 0;
+ width: 0;
+ position: absolute;
+ pointer-events: none;
+ border-color: transparent;
+ border-top-color: #82b92e;
+ border-width: 15px;
+ margin-left: -15px;
+}
+
+/* Right arrow to nodes dialog (Networkmap) */
+.nodeDialogRight {
+ position: relative;
+ background: #82b92e;
+}
+.nodeDialogRight:after {
+ left: 100%;
+ top: 50%;
+ border: solid transparent;
+ content: " ";
+ height: 0;
+ width: 0;
+ position: absolute;
+ pointer-events: none;
+ border-color: transparent;
+ border-left-color: #82b92e;
+ border-width: 15px;
+ margin-top: -15px;
+}
+
+/* Left arrow to nodes dialog (Networkmap) */
+.nodeDialogLeft {
+ position: relative;
+ background: #82b92e;
+}
+.nodeDialogLeft:after {
+ right: 100%;
+ top: 50%;
+ border: #82b92e;
+ content: " ";
+ height: 0;
+ width: 0;
+ position: absolute;
+ pointer-events: none;
+ border-color: transparent;
+ border-right-color: #82b92e;
+ border-width: 15px;
+ margin-top: -15px;
+}