integrated with nanogallery

This commit is contained in:
Francesco Mangiacrapa 2021-07-19 18:04:14 +02:00
parent 0ad1937951
commit e806c20462
9 changed files with 272 additions and 127 deletions

View File

@ -1,4 +1,4 @@
eclipse.preferences.version=1
lastWarOutDir=/home/francescomangiacrapa/git/geoportal-data-viewer-app/target/geoportal-data-viewer-app-1.1.0
lastWarOutDir=/home/francescomangiacrapa/git/geoportal-data-viewer-app/target/geoportal-data-viewer-app-1.2.0-SNAPSHOT
warSrcDir=src/main/webapp
warSrcDirIsOutput=false

View File

@ -4,6 +4,13 @@
All notable changes to this project will be documented in this file.
This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
## [v1.2.0-SNAPSHOT] - 2021-07-19
#### Enhancements
Moved to maven-portal-bom v.3.6.3
## [v1.1.0] - 2020-12-21
#### Enhancements

14
pom.xml
View File

@ -14,7 +14,7 @@
<groupId>org.gcube.portlets.user</groupId>
<artifactId>geoportal-data-viewer-app</artifactId>
<packaging>war</packaging>
<version>1.1.0</version>
<version>1.2.0-SNAPSHOT</version>
<name>GeoPortal Data Viewer App</name>
<description>The GeoPortal Data Viewer App is an application to access, discovery and navigate the GeoNa products by a Web-Map Interface</description>
@ -54,7 +54,7 @@
<dependency>
<groupId>org.gcube.distribution</groupId>
<artifactId>maven-portal-bom</artifactId>
<version>3.6.0</version>
<version>3.6.3-SNAPSHOT</version>
<type>pom</type>
<scope>import</scope>
<exclusions>
@ -109,6 +109,16 @@
<version>${gwt.version}</version>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>org.gcube.portal</groupId>
<artifactId>oidc-library-portal</artifactId>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>org.gcube.common</groupId>
<artifactId>oidc-library</artifactId>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>com.github.tdesjardins</groupId>
<artifactId>gwt-ol3</artifactId>

View File

@ -11,8 +11,11 @@
<inherits name='ol.GwtOL' />
<inherits name="com.github.gwtbootstrap.Bootstrap" />
<inherits name='org.gcube.application.geoportalcommon.GeoportalDataCommon' />
<inherits
name='org.gcube.application.geoportalcommon.GeoportalDataCommon' />
<inherits name="com.google.gwt.json.JSON" />
<!-- <inherits name='com.google.gwt.user.theme.chrome.Chrome'/> -->
<!-- <inherits name='com.google.gwt.user.theme.dark.Dark'/> -->

View File

@ -24,6 +24,7 @@ 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.core.client.ScriptInjector;
import com.google.gwt.event.logical.shared.ResizeEvent;
import com.google.gwt.event.logical.shared.ResizeHandler;
import com.google.gwt.event.shared.HandlerManager;
@ -87,95 +88,108 @@ public class GeoportalDataViewer implements EntryPoint {
mainPanel = new GeonaDataViewMainPanel(applicationBus, getClientHeight());
RootPanel.get(APP_DIV).add(mainPanel);
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
@Override
public void execute() {
olMapMng = new OLMapManager(mainPanel.getMapPanel().getElement().getId(),layerManager.getLayerManagerBus());
layerManager.setOlMap(olMapMng.getOLOSMMap());
mainPanel.setMap(olMapMng.getOLOSMMap());
updateSize();
}
});
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);
//paramUUID = Window.Location.getParameter(GeoportalDataViewerConstants.GET_UUID_PARAMETER);
paramGeonaItemID = Window.Location.getParameter(GeoportalDataViewerConstants.GET_GEONA_ITEM_ID);
paramLayerTitle = Window.Location.getParameter(GeoportalDataViewerConstants.GET_LAYER_TITLE);
GWT.log(GeoportalDataViewerConstants.GET_WMS_PARAMETER + " = " + paramWmsRequest);
GWT.log(GeoportalDataViewerConstants.GET_GEONA_ITEM_TYPE + " = " + paramGeonaItemType);
GWT.log(GeoportalDataViewerConstants.GET_GEONA_ITEM_ID + " = " + paramGeonaItemID);
//GWT.log(GeoportalDataViewerConstants.GET_UUID_PARAMETER + " = " + paramUUID);
GWT.log(GeoportalDataViewerConstants.GET_LAYER_TITLE + " = " + paramLayerTitle);
//VALIDATING THE LONG FORMAT FOR GID
try {
if(paramGeonaItemID!=null)
Long.parseLong(paramGeonaItemID);
}catch (Exception e) {
Window.alert("Bad format for parameter "+GeoportalDataViewerConstants.GET_GEONA_ITEM_ID+". It must be a Long");
paramGeonaItemID = null;
}
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
Timer t = new Timer() {
@Override
public void execute() {
GeoportalDataViewerServiceAsync.Util.getInstance().getGeoNaDataViewProfile(new AsyncCallback<GeoNaDataViewerProfile>() {
public void run() {
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
@Override
public void onFailure(Throwable caught) {
Window.alert(caught.getMessage());
}
@Override
public void onSuccess(GeoNaDataViewerProfile profile) {
geonaDataViewerProfile = profile;
GWT.log("Profile: "+geonaDataViewerProfile);
Iterator<String> it;
String theItemType = paramGeonaItemType;
if(theItemType==null) {
it = geonaDataViewerProfile.getMapLayers().keySet().iterator();
it.hasNext();
theItemType= it.next();
}
LayerItem layerItem = geonaDataViewerProfile.getMapLayers().get(theItemType);
if(layerItem==null) {
Window.alert("Not detected any layer with type: "+theItemType);
return;
}
GWT.log("The layerItem is: "+layerItem);
layerManager.addLayer(theItemType, null, null, layerItem.getWmsLink(), false, false, null, true);
if(paramGeonaItemID!=null) {
if(paramGeonaItemType==null) {
Window.alert("Missing parameter "+GeoportalDataViewerConstants.GET_GEONA_ITEM_TYPE +" (GeoNa Data Type) where to search the item id: "+paramGeonaItemID);
return;
}
GeoNaItemRef gir = new GeoNaItemRef(new Long(paramGeonaItemID), paramGeonaItemType);
applicationBus.fireEvent(new ShowDetailsEvent(gir, null, null));
}
public void execute() {
olMapMng = new OLMapManager(mainPanel.getMapPanel().getElement().getId(),layerManager.getLayerManagerBus());
layerManager.setOlMap(olMapMng.getOLOSMMap());
mainPanel.setMap(olMapMng.getOLOSMMap());
updateSize();
ScriptInjector.fromUrl("//cdn.jsdelivr.net/npm/nanogallery2@3/dist/jquery.nanogallery2.min.js")
.setWindow(ScriptInjector.TOP_WINDOW).inject();
}
});
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);
//paramUUID = Window.Location.getParameter(GeoportalDataViewerConstants.GET_UUID_PARAMETER);
paramGeonaItemID = Window.Location.getParameter(GeoportalDataViewerConstants.GET_GEONA_ITEM_ID);
paramLayerTitle = Window.Location.getParameter(GeoportalDataViewerConstants.GET_LAYER_TITLE);
GWT.log(GeoportalDataViewerConstants.GET_WMS_PARAMETER + " = " + paramWmsRequest);
GWT.log(GeoportalDataViewerConstants.GET_GEONA_ITEM_TYPE + " = " + paramGeonaItemType);
GWT.log(GeoportalDataViewerConstants.GET_GEONA_ITEM_ID + " = " + paramGeonaItemID);
//GWT.log(GeoportalDataViewerConstants.GET_UUID_PARAMETER + " = " + paramUUID);
GWT.log(GeoportalDataViewerConstants.GET_LAYER_TITLE + " = " + paramLayerTitle);
//VALIDATING THE LONG FORMAT FOR GID
try {
if(paramGeonaItemID!=null)
Long.parseLong(paramGeonaItemID);
}catch (Exception e) {
Window.alert("Bad format for parameter "+GeoportalDataViewerConstants.GET_GEONA_ITEM_ID+". It must be a Long");
paramGeonaItemID = null;
}
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
@Override
public void execute() {
GeoportalDataViewerServiceAsync.Util.getInstance().getGeoNaDataViewProfile(new AsyncCallback<GeoNaDataViewerProfile>() {
@Override
public void onFailure(Throwable caught) {
Window.alert(caught.getMessage());
}
@Override
public void onSuccess(GeoNaDataViewerProfile profile) {
geonaDataViewerProfile = profile;
GWT.log("Profile: "+geonaDataViewerProfile);
Iterator<String> it;
String theItemType = paramGeonaItemType;
if(theItemType==null) {
it = geonaDataViewerProfile.getMapLayers().keySet().iterator();
it.hasNext();
theItemType= it.next();
}
LayerItem layerItem = geonaDataViewerProfile.getMapLayers().get(theItemType);
if(layerItem==null) {
Window.alert("Not detected any layer with type: "+theItemType);
return;
}
GWT.log("The layerItem is: "+layerItem);
layerManager.addLayer(theItemType, null, null, layerItem.getWmsLink(), false, false, null, true);
if(paramGeonaItemID!=null) {
if(paramGeonaItemType==null) {
Window.alert("Missing parameter "+GeoportalDataViewerConstants.GET_GEONA_ITEM_TYPE +" (GeoNa Data Type) where to search the item id: "+paramGeonaItemID);
return;
}
GeoNaItemRef gir = new GeoNaItemRef(new Long(paramGeonaItemID), paramGeonaItemType);
applicationBus.fireEvent(new ShowDetailsEvent(gir, null, null));
}
}
});
}
});
bindEvents();
}
});
bindEvents();
};
t.schedule(3000);
}
/**

View File

@ -0,0 +1,92 @@
package org.gcube.portlets.user.geoportaldataviewer.client.ui.gallery;
import java.util.List;
import org.gcube.portlets.user.geoportaldataviewer.shared.products.content.WorkspaceContentDV;
import org.gcube.portlets.user.geoportaldataviewer.shared.products.model.UploadedImageDV;
import com.google.gwt.core.client.JavaScriptObject;
import com.google.gwt.json.client.JSONArray;
import com.google.gwt.json.client.JSONObject;
import com.google.gwt.json.client.JSONString;
import com.google.gwt.user.client.ui.HTMLPanel;
public class ImagesGallery {
HTMLPanel galleryPanel = new HTMLPanel("<div id='nanogallery'></div>");
private List<UploadedImageDV> listImages;
private native void showGallery(JavaScriptObject json_array_images) /*-{
console.log("showing: " + json_array_images)
var waitForJQuery = setInterval(
function() {
if (typeof $wnd.$ != 'undefined') {
$wnd
.$("#nanogallery")
.nanogallery2(
{
thumbnailHeight : '200',
thumbnailWidth : 'auto',
thumbnailAlignment : 'fillWidth',
thumbnailDisplayTransition : 'slideDown',
thumbnailDisplayTransitionDuration : 500,
thumbnailDisplayInterval : 30,
// THUMBNAIL'S HOVER ANIMATION
thumbnailHoverEffect2 : 'imageScaleIn80',
touchAnimation : true,
touchAutoOpenDelay : 800,
viewerToolbar : {
display : true,
standard : 'minimizeButton, label',
minimized : 'minimizeButton, label, fullscreenButton, downloadButton'
},
viewerTools : {
topLeft : 'pageCounter',
topRight : 'playPauseButton, zoomButton, fullscreenButton, downloadButton, closeButton'
},
// DEEP LINKING
locationHash : false,
items : json_array_images
})
clearInterval(waitForJQuery);
}
}, 200);
}-*/;
public ImagesGallery(List<UploadedImageDV> immagini) {
this.listImages = immagini;
}
public HTMLPanel getGalleryPanel() {
return galleryPanel;
}
public void fillGallery() {
JSONArray jsonArray = new JSONArray();
int index = 0;
for (UploadedImageDV image : listImages) {
for (WorkspaceContentDV imageContent : image.getListWsContent()) {
JSONObject json = new JSONObject();
json.put("src", new JSONString(imageContent.getLink()));
json.put("srct", new JSONString(imageContent.getLink()));
json.put("title", new JSONString(image.getDidascalia()));
//json.put("description", new JSONString(image.getDidascalia()));
json.put("downloadURL", new JSONString(imageContent.getLink()));
jsonArray.set(index, json);
index++;
}
}
showGallery(jsonArray.getJavaScriptObject());
}
}

View File

@ -8,6 +8,7 @@ import org.gcube.portlets.user.geoportaldataviewer.client.GeoportalDataViewerSer
import org.gcube.portlets.user.geoportaldataviewer.client.gis.MapUtils;
import org.gcube.portlets.user.geoportaldataviewer.client.ui.ModalWindow;
import org.gcube.portlets.user.geoportaldataviewer.client.ui.dialogs.DialogShareableLink;
import org.gcube.portlets.user.geoportaldataviewer.client.ui.gallery.ImagesGallery;
import org.gcube.portlets.user.geoportaldataviewer.client.ui.images.ThumbnailImageView;
import org.gcube.portlets.user.geoportaldataviewer.client.ui.map.MapView;
import org.gcube.portlets.user.geoportaldataviewer.client.ui.util.CustomFlexTable;
@ -321,7 +322,12 @@ public class ConcessioneView extends Composite {
List<UploadedImageDV> immagini = concessioneDV.getImmaginiRappresentative();
if (immagini != null && immagini.size() > 0) {
imagesPanel.setVisible(true);
boolean addedImage = false;
ImagesGallery gallery = new ImagesGallery(immagini);
imagesPanel.add(gallery.getGalleryPanel());
gallery.fillGallery();
/*boolean addedImage = false;
imagesPanel.add(thumbNails);
for (UploadedImageDV uploadedImageDV : immagini) {
@ -339,7 +345,7 @@ public class ConcessioneView extends Composite {
if(!addedImage) {
imagesPanel.remove(thumbNails);
}
}*/
}
}

View File

@ -11,8 +11,11 @@
<inherits name='ol.GwtOL' />
<inherits name="com.github.gwtbootstrap.Bootstrap" />
<inherits name='org.gcube.application.geoportalcommon.GeoportalDataCommon' />
<inherits
name='org.gcube.application.geoportalcommon.GeoportalDataCommon' />
<inherits name="com.google.gwt.json.JSON" />
<!-- <inherits name='com.google.gwt.user.theme.chrome.Chrome'/> -->
<!-- <inherits name='com.google.gwt.user.theme.dark.Dark'/> -->

View File

@ -6,46 +6,56 @@
<!-- differences in layout. -->
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!-- -->
<!-- Consider inlining CSS to reduce the number of requested files -->
<!-- -->
<link type="text/css" rel="stylesheet" href="GeoportalDataViewer.css">
<link href="//cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.4.3/css/ol.css" rel="stylesheet" type="text/css">
<script src="//cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.4.3/build/ol.js" type="text/javascript"></script>
<!-- -->
<!-- Any title is fine -->
<!-- -->
<title>Web Application Starter Project</title>
<!-- -->
<!-- Consider inlining CSS to reduce the number of requested files -->
<!-- -->
<link type="text/css" rel="stylesheet" href="GeoportalDataViewer.css">
<!-- -->
<!-- This script loads your compiled module. -->
<!-- If you add any GWT meta tags, they must -->
<!-- be added before this line. -->
<!-- -->
<script type="text/javascript" language="javascript" src="GeoportalDataViewer/GeoportalDataViewer.nocache.js"></script>
</head>
<link
href="//cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.4.3/css/ol.css"
rel="stylesheet" type="text/css">
<script
src="//cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.4.3/build/ol.js"
type="text/javascript"></script>
<!-- -->
<!-- The body can have arbitrary html, or -->
<!-- you can leave the body empty if you want -->
<!-- to create a completely dynamic UI. -->
<!-- -->
<body>
<link
href="https://cdn.jsdelivr.net/npm/nanogallery2@3/dist/css/nanogallery2.min.css"
rel="stylesheet" type="text/css">
<!-- -->
<!-- Any title is fine -->
<!-- -->
<title>Web Application Starter Project</title>
<!-- OPTIONAL: include this if you want history support -->
<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0"></iframe>
<!-- -->
<!-- This script loads your compiled module. -->
<!-- If you add any GWT meta tags, they must -->
<!-- be added before this line. -->
<!-- -->
<script type="text/javascript" language="javascript"
src="GeoportalDataViewer/GeoportalDataViewer.nocache.js"></script>
</head>
<!-- RECOMMENDED if your web app will not function without JavaScript enabled -->
<noscript>
<div style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">
Your web browser must have JavaScript enabled
in order for this application to display correctly.
</div>
</noscript>
<div id="geoportal-data-viewer"></div>
</body>
<!-- -->
<!-- The body can have arbitrary html, or -->
<!-- you can leave the body empty if you want -->
<!-- to create a completely dynamic UI. -->
<!-- -->
<body>
<!-- OPTIONAL: include this if you want history support -->
<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1'
style="position: absolute; width: 0; height: 0; border: 0"></iframe>
<!-- RECOMMENDED if your web app will not function without JavaScript enabled -->
<noscript>
<div
style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">
Your web browser must have JavaScript enabled in order for this
application to display correctly.</div>
</noscript>
<div id="geoportal-data-viewer"></div>
</body>
</html>