The widget size has been enlarged to be the 80% (for both width and height) of the browser's window. Moreover, when the user clicks on the download button, the widget is not closed anymore. Finally, the close button has been added.
git-svn-id: http://svn.research-infrastructures.eu/public/d4science/gcube/trunk/portlets/widgets/image-previewer-widget@122522 82a268e6-3cf1-43bd-a215-b396298e98cf
This commit is contained in:
parent
1e0706c639
commit
96523d5efb
|
@ -25,6 +25,7 @@ public class ImagePreviewer implements EntryPoint {
|
|||
|
||||
}
|
||||
|
||||
@SuppressWarnings("unused")
|
||||
private void test(){
|
||||
|
||||
// random images for test
|
||||
|
|
|
@ -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", "");
|
||||
}
|
||||
|
||||
|
|
|
@ -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;
|
||||
|
|
Loading…
Reference in New Issue