New maps in progress... (provisional arrows to nodes dialogs)
This commit is contained in:
parent
9376e9aa6d
commit
38f105f041
|
@ -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($("<div>").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,
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue