added limit to 9 images show

git-svn-id: http://svn.research-infrastructures.eu/public/d4science/gcube/trunk/portlets/user/my-vres@139784 82a268e6-3cf1-43bd-a215-b396298e98cf

src/main/java/org/gcube/portlet/user/my_vres/client/VresPanel.java

@@ -25,6 +25,7 @@ import com.google.gwt.user.client.ui.VerticalPanel;
  */
 public class VresPanel extends Composite {
 	public static final String loading = GWT.getModuleBaseURL() + "../images/loading.gif";
+	private static final int LOAD_MAX_IMAGE_NO = 10;
 	private final MyVREsServiceAsync myVREsService = GWT.create(MyVREsService.class);
 	private FlowPanel flowPanel;
 	private VerticalPanel mainPanel = new VerticalPanel();
@@ -32,6 +33,8 @@ public class VresPanel extends Composite {
 	private HorizontalPanel imagesPanel = new HorizontalPanel();
 	private Image loadingImage = new Image(loading);
 	private LinkedHashMap<String, ArrayList<VRE>> cachedVREs = null;
+	
+	
 
 	boolean hasVres = false;
 
@@ -73,6 +76,7 @@ public class VresPanel extends Composite {
 		boolean hasVREs = false;
 		mainPanel.clear();		
 		mainPanel.setHorizontalAlignment(HasAlignment.ALIGN_LEFT);
+		int i = 0;
 		for (String cat : cachedVREs.keySet()) {
 			if (! cachedVREs.get(cat).isEmpty()) {
 				SimplePanel catPanel = new SimplePanel();
@@ -87,13 +91,15 @@ public class VresPanel extends Composite {
 				for (VRE vre: cachedVREs.get(cat)) {
 					if (vre.getName().compareTo("")!= 0)
 						hasVREs = true;
-					ClickableVRE vreButton = new ClickableVRE(vre);
+					ClickableVRE vreButton = new ClickableVRE(vre, (i < LOAD_MAX_IMAGE_NO));
 					flowPanel.add(vreButton);
+					i++;
 				}
 				
 				mainPanel.add(flowPanel);
 			}
 		}
+		GWT.log("i="+i);
 
 		if (! hasVREs) {
 			mainPanel.clear();		

src/main/java/org/gcube/portlet/user/my_vres/client/widgets/ClickableVRE.java

@@ -5,10 +5,11 @@ import org.gcube.portlet.user.my_vres.shared.VRE;
 import com.google.gwt.core.client.GWT;
 import com.google.gwt.event.dom.client.ClickEvent;
 import com.google.gwt.event.dom.client.ClickHandler;
+import com.google.gwt.event.dom.client.MouseOverEvent;
+import com.google.gwt.event.dom.client.MouseOverHandler;
 import com.google.gwt.user.client.Timer;
 import com.google.gwt.user.client.Window.Location;
 import com.google.gwt.user.client.ui.HTML;
-import com.google.gwt.user.client.ui.Image;
 
 /**
  * 
@@ -25,30 +26,34 @@ public class ClickableVRE extends HTML {
 	private int imageWidth = 0;
 
 	public static final String LOADING_IMAGE = GWT.getModuleBaseURL() + "../images/loading.gif";
-	public static final String MORE_IMAGE = GWT.getModuleBaseURL() + "../images/More.png";
+	public static final String VLAB_IMAGE = GWT.getModuleBaseURL() + "../images/vlab.png";
-	Image img = new Image(LOADING_IMAGE);
+	private  	String html = "";
+
 
 	public ClickableVRE() {
 		super();
 	}
 
-	public ClickableVRE(final VRE vre) {
+	public ClickableVRE(final VRE vre, final boolean showImage) {
 		super.setPixelSize(WIDTH, HEIGHT);
 		setPixelSize(WIDTH, HEIGHT);
-		String html = "";
 		if (vre.getName() == null || vre.getName().compareTo("") == 0) {
 			html = "<div class=\"more-vre\"></div>";
 		} else {
 			imageWidth = WIDTH - 12;
-			imageUrl = vre.getImageURL();
 			name = (vre.getName().length() > 15) ? vre.getName().substring(0, 13) + ".." : vre.getName();
+			imageUrl = vre.getImageURL();
 			html = "<div class=\"vreCaption\">" +name + "</div>";
-			html +=  "<div style=\"display: table; text-align:center; width: 100%; height: 75px;\">" +
+			if (showImage) {
-					"<span style=\"vertical-align:middle; display: table-cell;\"><img style=\"width: " + imageWidth + "px;\" src=\"" +imageUrl + "\" /></span>" +
+				html +=  "<div style=\"display: table; text-align:center; width: 100%; height: 75px;\">" +
-					"</div>";
+						"<span style=\"vertical-align:middle; display: table-cell;\"><img style=\"width: " + imageWidth + "px;\" src=\"" +imageUrl + "\" /></span>" +
+						"</div>";
+			} else {
+				html += "<div style=\"display: table; text-align:center; width: 100%; height: 75px;\" class=\"vlab-default\"></div>";
+			}
 		}
 		this.setTitle("Enter");
-		
+
 		setHTML(html);
 		setStyleName("vreButton");
 
@@ -66,7 +71,23 @@ public class ClickableVRE extends HTML {
 				};
 				timer.schedule(50);
 			}					
-		}); 			
+		}); 
+		
+		addMouseOverHandler(new MouseOverHandler() {			
+			@Override
+			public void onMouseOver(MouseOverEvent event) {
+				imageWidth = WIDTH - 12;
+				name = (vre.getName().length() > 15) ? vre.getName().substring(0, 13) + ".." : vre.getName();
+				imageUrl = vre.getImageURL();
+				html = "<div class=\"vreCaption\">" +name + "</div>";
+				if (!showImage) {
+					html +=  "<div style=\"display: table; text-align:center; width: 100%; height: 75px;\">" +
+							"<span style=\"vertical-align:middle; display: table-cell;\"><img style=\"width: " + imageWidth + "px;\" src=\"" +imageUrl + "\" /></span>" +
+							"</div>";
+				} 
+				setHTML(html);
+			}
+		});
 	}
 
 }

src/main/java/org/gcube/portlet/user/my_vres/server/MyVREsServiceImpl.java

@@ -163,6 +163,7 @@ public class MyVREsServiceImpl extends RemoteServiceServlet implements	MyVREsSer
 		
 		final String categoryNameOne = "gCubeApps";	
 		final String categoryNameTwo = "BlueBRIDGE";	
+		final String categoryNameThree = "GEMex";	
 		//			
 		VRE cool_EM_VRE = new VRE();
 		cool_EM_VRE.setName("BiodiversityResearchEnvironment");
@@ -220,9 +221,23 @@ public class MyVREsServiceImpl extends RemoteServiceServlet implements	MyVREsSer
 		ArrayList<VRE> toAdd2 = new ArrayList<VRE>();
 		toAdd2.add(demo);
 		toAdd2.add(vreGCM);
+		toAdd2.add(cool_EM_VRE3);
+		toAdd2.add(cool_EM_VRE);
+		toAdd2.add(cool_EM_VRE2);
+		toAdd2.add(cool_EM_VRE3);
+		
+		ArrayList<VRE> toAdd3 = new ArrayList<VRE>();
+		toAdd3.add(demo);
+		toAdd3.add(vreGCM);
+		toAdd3.add(cool_EM_VRE2);
+		toAdd3.add(cool_EM_VRE3);
+		toAdd3.add(cool_EM_VRE);
+		toAdd3.add(cool_EM_VRE2);
+		toAdd3.add(cool_EM_VRE3);
 		
 		toReturn.put(categoryNameOne, toAdd);
 		toReturn.put(categoryNameTwo, toAdd2);
+		toReturn.put(categoryNameThree, toAdd3);
 		
 		return toReturn;
 	}

src/main/webapp/MyVREs.css

@@ -98,6 +98,10 @@ a.vrelink:hover {
 	background: url(images/More.png) 50% 50% no-repeat;
 }
 
+.vlab-default {
+	background: url("images/vlab.png") 50% 50% no-repeat;
+}
+
 .item-vre {
 	background-image: url("images/vres.png");
 }