diff --git a/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ImagePreviewer.java b/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ImagePreviewer.java index 277f7c5..a4ea206 100644 --- a/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ImagePreviewer.java +++ b/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ImagePreviewer.java @@ -21,10 +21,11 @@ public class ImagePreviewer implements EntryPoint { public void onModuleLoad() { // decomment for testing purpose - //test(); + // test(); } + @SuppressWarnings("unused") private void test(){ // random images for test diff --git a/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ui/Carousel.java b/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ui/Carousel.java index 79d21cb..7a58404 100644 --- a/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ui/Carousel.java +++ b/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ui/Carousel.java @@ -87,8 +87,8 @@ public class Carousel extends Composite{ horizontaFooterPanel.setCellHorizontalAlignment(nextButton, HorizontalPanel.ALIGN_RIGHT); // set central buttons' cell widths to be equal TODO - //horizontaFooterPanel.setCellWidth(downloadButton, "200px"); - //horizontaFooterPanel.setCellWidth(closeButton, "200px"); + horizontaFooterPanel.setCellWidth(downloadButton, "200px"); + horizontaFooterPanel.setCellWidth(closeButton, "200px"); // set vertical alignment horizontaFooterPanel.setCellVerticalAlignment(nextButton, VerticalPanel.ALIGN_MIDDLE); @@ -104,9 +104,6 @@ public class Carousel extends Composite{ prevButton.setIconSize(IconSize.LARGE); nextButton.setIconSize(IconSize.LARGE); - // TODO hide close button (for now) - closeButton.setVisible(false); - //on user click on the image, go on shownImage.addClickHandler(new ClickHandler() { @@ -143,7 +140,6 @@ public class Carousel extends Composite{ String downloadUrl = listOfAttachmentsToShow.get(currentPreviewPosition).getDownloadUrl(); if(downloadUrl != null){ - mainModalPanel.hide(); Window.open(downloadUrl, "_blank", ""); } diff --git a/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ui/Carousel.ui.xml b/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ui/Carousel.ui.xml index 3d068ab..8ef7ca0 100644 --- a/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ui/Carousel.ui.xml +++ b/src/main/java/org/gcube/portlets/widgets/imagepreviewerwidget/client/ui/Carousel.ui.xml @@ -9,26 +9,49 @@ left: 50%; margin-right: -50%; transform: translate(-50%, -50%); - max-height: 400px; + max-height: 95%; width: auto; } .image-loading { - display: block; - margin-left: auto; - margin-right: auto; - margin-top: 35%; - margin-bottom: 35%; + position: relative; + top: 50%; + left: 50%; + margin-right: -50%; + transform: translate(-50%, -50%); } .arrow { color: #3B5998; } + @external .modal; + .modal { + position: fixed; + top: 10%; + left: 15%; + margin-left: -5%; + width: 80%; + height: 80%; + background-color: #fff; + border: 1px solid #999; + border: 1px solid rgba(0, 0, 0, 0.3); + -webkit-border-radius: 6px; + -moz-border-radius: 6px; + border-radius: 6px; + outline: 0; + -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); + -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); + box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); + -webkit-background-clip: padding-box; + -moz-background-clip: padding-box; + background-clip: padding-box; + } + @external .modal-header; .modal-header { font-family: "Helvetica Neue", Arial, sans-serif; - height: 20px; + height: 5%; color: #3B5998 !important; } @@ -39,7 +62,8 @@ @external .modal-body; .modal-body { position: relative; - height: 400px; + height: 90%; + max-height: 100%; padding: 0; overflow: hidden; } @@ -48,6 +72,7 @@ .modal-footer { padding: 10px 10px 10px; margin-bottom: 0px; + height: 5%; text-align: right; background-color: #F5F5F5; border-top: 1px solid #DDD;