improved the css

2020-11-18 15:35:24 +01:00 · 2020-11-18 15:35:24 +01:00 · 9920698d75
parent 294bc2aa66
commit 9920698d75
5 changed files with 74 additions and 33 deletions
--- a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/GeoportalDataViewer.java
+++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/GeoportalDataViewer.java
@ -14,6 +14,8 @@ import com.google.gwt.core.client.EntryPoint;
 import com.google.gwt.core.client.GWT;
 import com.google.gwt.core.client.Scheduler;
 import com.google.gwt.core.client.Scheduler.ScheduledCommand;
+import com.google.gwt.event.logical.shared.ResizeEvent;
+import com.google.gwt.event.logical.shared.ResizeHandler;
 import com.google.gwt.event.shared.HandlerManager;
 import com.google.gwt.user.client.Window;
 import com.google.gwt.user.client.rpc.AsyncCallback;
@ -66,7 +68,7 @@ public class GeoportalDataViewer implements EntryPoint {
 	 */
 	public void onModuleLoad() {

-		mainPanel = new GeonaDataViewMainPanel(eventBus, 600);
+		mainPanel = new GeonaDataViewMainPanel(eventBus, getClientHeight());

 		RootPanel.get(APP_DIV).add(mainPanel);

@ -78,17 +80,16 @@ public class GeoportalDataViewer implements EntryPoint {
 				olMapMng = new OLMapManager(mainPanel.getMapPanel().getElement().getId(),layerManager.getEventBus());
 				layerManager.setOlMap(olMapMng.getOLOSMMap());
 				mainPanel.setMap(olMapMng.getOLOSMMap());
-				
+				updateSize();
 			}
 		});

-//		Window.addResizeHandler(new ResizeHandler() {
-//			@Override
-//			public void onResize(ResizeEvent event) {
-//				GWT.log("onWindowResized width: " + event.getWidth() + " height: " + event.getHeight());
-//				mainPanel.setMapHeight(event.getHeight() - 200);
-//			}
-//		});
+		Window.addResizeHandler(new ResizeHandler() {
+			@Override
+			public void onResize(ResizeEvent event) {
+				updateSize();
+			}
+		});

 		paramWmsRequest = Window.Location.getParameter(GeoportalDataViewerConstants.GET_WMS_PARAMETER);
 		paramGeonaItemType = Window.Location.getParameter(GeoportalDataViewerConstants.GET_GEONA_ITEM_TYPE);
@ -160,6 +161,25 @@ public class GeoportalDataViewer implements EntryPoint {
 		bindEvents();
 	}
 	
+	/**
+	 * Update window size.
+	 */
+	public void updateSize() {
+
+		int rootHeight = getClientHeight();
+		int height = rootHeight;
+		mainPanel.setPanelsHeight(height);
+		GWT.log("Set height: "+height);	
+	
+	}
+	
+	public int getClientHeight() {
+		RootPanel principalDiv = RootPanel.get(APP_DIV);
+		int topBorder = principalDiv.getAbsoluteTop();
+		int rootHeight = Window.getClientHeight() - topBorder;
+		return rootHeight;
+	}
+	
 	/**
 	 * Bind events.
 	 */
--- a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/GeonaDataViewMainPanel.java
+++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/GeonaDataViewMainPanel.java
@ -34,7 +34,11 @@ public class GeonaDataViewMainPanel extends Composite {
 //	Tab mapTabPanel;
 	
 	@UiField
-	HTMLPanel mainTabPanel;
+	HTMLPanel mainContainerPanel;
+	
+	@UiField
+	HTMLPanel mainToolBar;
+

 	@UiField
 	NavLink dataPointSelection;
@ -66,7 +70,7 @@ public class GeonaDataViewMainPanel extends Composite {
 		this.eventBus = eventBus;
 		mapPanel = new MapPanel(mapHeight+"px");
 		detailsPanel.setHeight(mapHeight+"px");
-		mainTabPanel.add(mapPanel);
+		mainContainerPanel.add(mapPanel);
 		bindHandlers();
 		dataPointSelection.setIcon(IconType.SCREENSHOT);
 		dataBoxSelection.setIcon(IconType.BOOKMARK);
@ -74,8 +78,10 @@ public class GeonaDataViewMainPanel extends Composite {
 		removeQuery.setIcon(IconType.REMOVE);
 	}

-	public void setMapHeight(int height) {
-		mapPanel.setHeight(height + "px");
+	public void setPanelsHeight(int height) {
+		String toH = height + "px";
+		mapPanel.setMapHeight(height);
+		detailsPanel.setHeight(toH);
 	}

 	public MapPanel getMapPanel() {
--- a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/GeonaDataViewMainPanel.ui.xml
+++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/GeonaDataViewMainPanel.ui.xml
@ -9,23 +9,21 @@
 	}
 	</ui:style>
 	<g:HTMLPanel ui:field="mainHTMLPanel">
-		<!-- <b:TabPanel ui:field="mainTabPanel" tabPosition="top"> -->
-		<!-- <b:Tab ui:field="mapTabPanel" active="true" heading="Map"> -->
-		<g:HTMLPanel ui:field="mainTabPanel">
-			<b:DropdownButton type="LINK" text="Query">
-				<!-- <b:ButtonGroup toggle="checkbox" ui:field="buttonGroup"> -->
-				<b:NavLink ui:field="dataPointSelection"
-					addStyleNames="{style.margin-right-10}">Data Point
-					Selection</b:NavLink>
-				<b:NavLink ui:field="dataBoxSelection" visible="false">Data Box
-					Selection</b:NavLink>
-				<!-- </b:ButtonGroup> -->
-			</b:DropdownButton>
-			<b:Button type="LINK" ui:field="removeQuery"
-				text="Remove Query" visible="false"></b:Button>
+		<g:HTMLPanel ui:field="mainContainerPanel">
+			<g:HTMLPanel ui:field="mainToolBar" addStyleNames="inner-toolbar">
+				<b:DropdownButton type="LINK" text="Query">
+					<!-- <b:ButtonGroup toggle="checkbox" ui:field="buttonGroup"> -->
+					<b:NavLink ui:field="dataPointSelection"
+						addStyleNames="{style.margin-right-10}">Data Point
+						Selection</b:NavLink>
+					<b:NavLink ui:field="dataBoxSelection" visible="false">Data Box
+						Selection</b:NavLink>
+					<!-- </b:ButtonGroup> -->
+				</b:DropdownButton>
+				<b:Button type="LINK" ui:field="removeQuery"
+					text="Remove Query" visible="false"></b:Button>
+			</g:HTMLPanel>
 		</g:HTMLPanel>
-		<!-- </b:Tab> -->
-		<!-- </b:TabPanel> -->
 		<c:DetailsPanel ui:field="detailsPanel"
 			addStyleNames="details-panel"></c:DetailsPanel>
 	</g:HTMLPanel>
--- a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/products/concessioni/ConcessioneView.java
+++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/products/concessioni/ConcessioneView.java
@ -16,7 +16,6 @@ import org.gcube.portlets.user.geoportaldataviewer.shared.products.model.Relazio
 import org.gcube.portlets.user.geoportaldataviewer.shared.products.model.UploadedImageDV;

 import com.github.gwtbootstrap.client.ui.Button;
-import com.github.gwtbootstrap.client.ui.NavLink;
 import com.github.gwtbootstrap.client.ui.PageHeader;
 import com.github.gwtbootstrap.client.ui.Paragraph;
 import com.github.gwtbootstrap.client.ui.Thumbnails;
--- a/src/main/webapp/GeoportalDataViewer.css
+++ b/src/main/webapp/GeoportalDataViewer.css
@ -1,8 +1,7 @@
 /** Add css rules here for your application. */
 /** Most GWT widgets already have a style name defined */
-
 body {
-    padding-top: 0px !important;
+	padding-top: 0px !important;
 }

 .gwt-DialogBox {
@ -169,13 +168,32 @@ body {
 	right: 0px;
 	background: #FFF;
 	width: 725px;
-	margin-top: 30px;
+	/*margin-top: 30px;*/
 	padding-left: 5px;
 	overflow-y: auto;
 	transition: width 0.2s;
+	z-index: 1000;
 }

 .overlay {
 	z-index: 1000;
 	opacity: 0.9;
+}
+
+.inner-toolbar {
+	position: absolute;
+	z-index: 500;
+	top: 8px;
+	left: 50px;
+}
+
+.inner-toolbar .btn-link {
+	  border: 1px solid #eee;
+	  background-color: #fcfcfc;
+		text-align: center;
+		margin: 1px;
+}
+.inner-toolbar .btn-link:hover, .inner-toolbar .btn-link:focus {
+	 background-color: #f3f3f3 !important;
+	 text-decoration: none;
 }