Display popup with image just below the preview image
Before we were centering the popup which doesn't work if the image for
which the popup should be shown is right below it.
Change-Id: Ie661ab772dea8916d5bb3b77195f5542f1ce9595
Signed-off-by: Edwin Kempin <edwin.kempin@sap.com>
diff --git a/src/main/java/com/googlesource/gerrit/plugins/imagare/client/UploadStagePanel.java b/src/main/java/com/googlesource/gerrit/plugins/imagare/client/UploadStagePanel.java
index 62cb40c..179631a 100644
--- a/src/main/java/com/googlesource/gerrit/plugins/imagare/client/UploadStagePanel.java
+++ b/src/main/java/com/googlesource/gerrit/plugins/imagare/client/UploadStagePanel.java
@@ -147,9 +147,13 @@
if (!popup.isVisible()) {
Image previewImg = new Image(dataUrl);
previewImg.setStyleName("imagare-image-popup");
+ previewImg.getElement().setAttribute("style",
+ previewImg.getElement().getAttribute("style")
+ + "position: absolute; top: " + (img.getAbsoluteTop() + img.getHeight() + 20) + "px; "
+ + "left: " + img.getAbsoluteLeft() + "px;");
popup.add(previewImg);
- popup.center();
+ popup.show();
popup.setVisible(true);
}
diff --git a/src/main/java/com/googlesource/gerrit/plugins/imagare/client/UploadedImagesPanel.java b/src/main/java/com/googlesource/gerrit/plugins/imagare/client/UploadedImagesPanel.java
index 0a91809..fb7192a 100644
--- a/src/main/java/com/googlesource/gerrit/plugins/imagare/client/UploadedImagesPanel.java
+++ b/src/main/java/com/googlesource/gerrit/plugins/imagare/client/UploadedImagesPanel.java
@@ -57,7 +57,7 @@
fileNameLabel.setStyleName("imagare-uploaded-image-title");
add(fileNameLabel);
- Image img = new Image(url);
+ final Image img = new Image(url);
img.setStyleName("imagare-uploaded-image-preview");
add(img);
@@ -67,9 +67,13 @@
if (!popup.isVisible()) {
Image previewImg = new Image(url);
previewImg.setStyleName("imagare-image-popup");
+ previewImg.getElement().setAttribute("style",
+ previewImg.getElement().getAttribute("style")
+ + "position: absolute; top: " + (img.getAbsoluteTop() + img.getHeight() + 20) + "px; "
+ + "left: " + img.getAbsoluteLeft() + "px;");
popup.add(previewImg);
- popup.center();
+ popup.show();
popup.setVisible(true);
}
}
diff --git a/src/main/java/com/googlesource/gerrit/plugins/imagare/public/imagare.css b/src/main/java/com/googlesource/gerrit/plugins/imagare/public/imagare.css
index c84dfb9..f6b3343 100644
--- a/src/main/java/com/googlesource/gerrit/plugins/imagare/public/imagare.css
+++ b/src/main/java/com/googlesource/gerrit/plugins/imagare/public/imagare.css
@@ -104,6 +104,7 @@
}
.imagare-image-popup {
+ border: 1px solid #B3B2B2;
max-width: 500px;
max-height: 500px;
}
