From f9df9100f92ff1ca243dc6d4c22c624756b19727 Mon Sep 17 00:00:00 2001
From: Costantino Perciante <costantino.perciante@isti.cnr.it>
Date: Tue, 26 Jan 2016 11:02:14 +0000
Subject: [PATCH] The height of the carousel is now fixed. The image shown has
 been centered too.

git-svn-id: http://svn.research-infrastructures.eu/public/d4science/gcube/trunk/portlets/widgets/image-previewer-widget@122514 82a268e6-3cf1-43bd-a215-b396298e98cf
---
 .../client/ImagePreviewer.java                |  4 ++--
 .../client/ui/Carousel.ui.xml                 | 19 ++++++++++++-------
 2 files changed, 14 insertions(+), 9 deletions(-)

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 9be6ffd..6957b90 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,7 +21,7 @@ public class ImagePreviewer implements EntryPoint {
 	public void onModuleLoad() {
 
 		// decomment for testing purpose
-		//test();
+		test();
 
 	}
 
@@ -51,7 +51,7 @@ public class ImagePreviewer implements EntryPoint {
 
 			}
 		});
-		b.setText("Show images");
+		b.setText("Show preview");
 
 		RootPanel.get("image-previewer-div").add(b);
 	}
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 31c096c..3d068ab 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
@@ -3,17 +3,22 @@
 	xmlns:g="urn:import:com.google.gwt.user.client.ui" xmlns:b="urn:import:com.github.gwtbootstrap.client.ui">
 	<ui:style>
 	.image {
-		margin: auto;
-		width: 100%;
-		display: block;
+		margin: 0;
+		position: relative;
+		top: 50%;
+		left: 50%;
+		margin-right: -50%;
+		transform: translate(-50%, -50%);
+		max-height: 400px;
+		width: auto;
 	}
 	
 	.image-loading {
 		display: block;
 		margin-left: auto;
 		margin-right: auto;
-		margin-top: 30%;
-		margin-bottom: 30%;
+		margin-top: 35%;
+		margin-bottom: 35%;
 	}
 	
 	.arrow {
@@ -34,9 +39,9 @@
 	@external .modal-body;
 	.modal-body {
 		position: relative;
-		max-height: 500px;
+		height: 400px;
 		padding: 0;
-		overflow-y: hidden;
+		overflow: hidden;
 	}
 	
 	@external .modal-footer;