From e806c2046252d1fc6599ace8a0dd63c58ca11720 Mon Sep 17 00:00:00 2001 From: "francesco.mangiacrapa" Date: Mon, 19 Jul 2021 18:04:14 +0200 Subject: [PATCH 1/7] integrated with nanogallery --- .../com.gwtplugins.gdt.eclipse.core.prefs | 2 +- CHANGELOG.md | 7 + pom.xml | 14 +- .../GeoportalDataViewer.gwt.xml | 7 +- .../client/GeoportalDataViewer.java | 176 ++++++++++-------- .../client/ui/gallery/ImagesGallery.java | 92 +++++++++ .../products/concessioni/ConcessioneView.java | 10 +- .../GeoportalDataViewer.gwt.xml | 7 +- src/main/webapp/GeoportalDataViewer.html | 84 +++++---- 9 files changed, 272 insertions(+), 127 deletions(-) create mode 100644 src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java diff --git a/.settings/com.gwtplugins.gdt.eclipse.core.prefs b/.settings/com.gwtplugins.gdt.eclipse.core.prefs index 24ea67a..afbfdeb 100644 --- a/.settings/com.gwtplugins.gdt.eclipse.core.prefs +++ b/.settings/com.gwtplugins.gdt.eclipse.core.prefs @@ -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 diff --git a/CHANGELOG.md b/CHANGELOG.md index 13d7560..e67b547 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -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 diff --git a/pom.xml b/pom.xml index f5ae810..433770e 100644 --- a/pom.xml +++ b/pom.xml @@ -14,7 +14,7 @@ org.gcube.portlets.user geoportal-data-viewer-app war - 1.1.0 + 1.2.0-SNAPSHOT GeoPortal Data Viewer App The GeoPortal Data Viewer App is an application to access, discovery and navigate the GeoNa products by a Web-Map Interface @@ -54,7 +54,7 @@ org.gcube.distribution maven-portal-bom - 3.6.0 + 3.6.3-SNAPSHOT pom import @@ -109,6 +109,16 @@ ${gwt.version} provided + + org.gcube.portal + oidc-library-portal + provided + + + org.gcube.common + oidc-library + provided + com.github.tdesjardins gwt-ol3 diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/GeoportalDataViewer.gwt.xml b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/GeoportalDataViewer.gwt.xml index 6a5dd72..a673605 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/GeoportalDataViewer.gwt.xml +++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/GeoportalDataViewer.gwt.xml @@ -11,8 +11,11 @@ - - + + + + diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/GeoportalDataViewer.java b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/GeoportalDataViewer.java index db328a7..cc6f6b8 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/GeoportalDataViewer.java +++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/GeoportalDataViewer.java @@ -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() { + 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 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() { + + @Override + public void onFailure(Throwable caught) { + Window.alert(caught.getMessage()); + + } + + @Override + public void onSuccess(GeoNaDataViewerProfile profile) { + geonaDataViewerProfile = profile; + GWT.log("Profile: "+geonaDataViewerProfile); + Iterator 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); + + } /** diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java new file mode 100644 index 0000000..90254a3 --- /dev/null +++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java @@ -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("
"); + private List 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 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()); + } +} diff --git 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 index 19fa3f9..bfeca01 100644 --- 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 @@ -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 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); - } + }*/ } } diff --git a/src/main/resources/org/gcube/portlets/user/geoportaldataviewer/GeoportalDataViewer.gwt.xml b/src/main/resources/org/gcube/portlets/user/geoportaldataviewer/GeoportalDataViewer.gwt.xml index 6a5dd72..a673605 100644 --- a/src/main/resources/org/gcube/portlets/user/geoportaldataviewer/GeoportalDataViewer.gwt.xml +++ b/src/main/resources/org/gcube/portlets/user/geoportaldataviewer/GeoportalDataViewer.gwt.xml @@ -11,8 +11,11 @@ - - + + + + diff --git a/src/main/webapp/GeoportalDataViewer.html b/src/main/webapp/GeoportalDataViewer.html index 38a20f0..de8e1b3 100644 --- a/src/main/webapp/GeoportalDataViewer.html +++ b/src/main/webapp/GeoportalDataViewer.html @@ -6,46 +6,56 @@ - - + + - - - - - - - - - - - Web Application Starter Project + + + + - - - - - - - + + - - - - - - + + + + +Web Application Starter Project - - + + + + + + + - - -
- + + + + + + + + + + + + +
+ From 99c7266c4f0fe7d2118e594469580c66608ea1b4 Mon Sep 17 00:00:00 2001 From: "francesco.mangiacrapa" Date: Tue, 20 Jul 2021 15:18:33 +0200 Subject: [PATCH 2/7] updated css and nanogallery options --- .classpath | 6 +- .settings/org.eclipse.wst.common.component | 32 ++++++---- .../client/ui/gallery/ImagesGallery.java | 59 ++++++++++++++++--- src/main/webapp/GeoportalDataViewer.css | 24 +++++++- 4 files changed, 98 insertions(+), 23 deletions(-) diff --git a/.classpath b/.classpath index 5ef800e..285ac7e 100644 --- a/.classpath +++ b/.classpath @@ -1,12 +1,12 @@ - + - + @@ -36,5 +36,5 @@ - + diff --git a/.settings/org.eclipse.wst.common.component b/.settings/org.eclipse.wst.common.component index 4155b4e..0d454c2 100644 --- a/.settings/org.eclipse.wst.common.component +++ b/.settings/org.eclipse.wst.common.component @@ -1,58 +1,68 @@ - + - - + + + + - + + - + + - + + - + + - + + - + + - + + - + + diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java index 90254a3..22266a3 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java +++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java @@ -27,19 +27,55 @@ public class ImagesGallery { .$("#nanogallery") .nanogallery2( { + thumbnailHeight : '200 XS150 SM150', // RESPONSIVE THUMBNAIL HEIGHT: default=250px, XS resolution=200px, SM resolution=200px + thumbnailWidth : 'auto', // RESPONSIVE THUMBNAIL WIDTH: default=250px, XS resolution=150px, SM resolution=200px + thumbnailAlignment : 'left', + thumbnailBorderHorizontal : 0, + thumbnailBorderVertical : 0, + thumbnailGutterWidth : '10 XS10 SM10', + thumbnailGutterHeight : '10 XS10 SM10', - thumbnailHeight : '200', - thumbnailWidth : 'auto', - thumbnailAlignment : 'fillWidth', + // THUMBNAIL TOOLS & LABEL + thumbnailLabel : { + display : true, + position : 'onBottom', + align : 'left' + }, + thumbnailToolbarImage : { + bottomLeft : 'display' + }, + // replace the default DISPLAY tool icon + icons : { + thumbnailDisplay : ' display' + }, - thumbnailDisplayTransition : 'slideDown', - thumbnailDisplayTransitionDuration : 500, - thumbnailDisplayInterval : 30, + // DISPLAY ANIMATION + galleryDisplayTransition : 'slideUp', + galleryDisplayTransitionDuration : 1000, + thumbnailDisplayTransition : 'scaleDown', + thumbnailDisplayTransitionDuration : 300, + thumbnailDisplayInterval : 50, // THUMBNAIL'S HOVER ANIMATION - thumbnailHoverEffect2 : 'imageScaleIn80', + //thumbnailBuildInit2 : 'tools_font-size_1.5em|title_font-size_1.5em', + thumbnailHoverEffect2 : 'image_scale_1.00_1.20_1000|tools_opacity_0_1|tools_translateX_-30px_0px|title_opacity_1_0|title_translateX_0px_-30px', touchAnimation : true, touchAutoOpenDelay : 800, + + // GALLERY THEME + galleryTheme : { + thumbnail : { + borderRadius : '2px', + background : '#fff', + titleShadow : 'none', + titleColor : 'gray', + labelBackground : '#f3f3f3' + }, + thumbnailIcon : { + color : '#000', + shadow : 'none' + }, + }, viewerToolbar : { display : true, standard : 'minimizeButton, label', @@ -79,8 +115,15 @@ public class ImagesGallery { JSONObject json = new JSONObject(); json.put("src", new JSONString(imageContent.getLink())); json.put("srct", new JSONString(imageContent.getLink())); + List listAuthors = image.getResponsabili(); + String txtAuthors = listAuthors.size()>1 ? "Authors ": "Author "; + for (String author : listAuthors) { + txtAuthors+= " "+author +","; + } + String description = txtAuthors + ". ID Licenza: "+image.getLicenseID(); + txtAuthors = txtAuthors.substring(0,txtAuthors.length()-1); json.put("title", new JSONString(image.getDidascalia())); - //json.put("description", new JSONString(image.getDidascalia())); + json.put("description", new JSONString(description)); json.put("downloadURL", new JSONString(imageContent.getLink())); jsonArray.set(index, json); index++; diff --git a/src/main/webapp/GeoportalDataViewer.css b/src/main/webapp/GeoportalDataViewer.css index 9eb0fc3..7f83318 100644 --- a/src/main/webapp/GeoportalDataViewer.css +++ b/src/main/webapp/GeoportalDataViewer.css @@ -230,4 +230,26 @@ body { .info-interaction .gwt-Label { font-weight: bold; padding-bottom: 5px; -} \ No newline at end of file +} + + + +/** NanoGallery2 **/ + +.nanogallery_viewertheme_dark_nanogallery .nGY2Viewer { + background: rgba(4, 4, 4, 0.80) !important; +} + +.nanogallery_viewertheme_dark_nanogallery .nGY2Viewer .toolbarBackground { + background: rgba(4, 4, 4, 0.60) !important; +} + +.nGY2 .toolbar .ngbt { + font-size: 1em !important; + padding: 12px 12px !important; +} + +.nGY2 .toolbar .label .title { + font-size: .9em !important; + margin-bottom: 5px !important +} From ad5b11d5873076950abee9636c516e619227d6cc Mon Sep 17 00:00:00 2001 From: "francesco.mangiacrapa" Date: Tue, 20 Jul 2021 16:04:12 +0200 Subject: [PATCH 3/7] updated changelog --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index e67b547..07da32a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,7 +9,7 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm #### Enhancements -Moved to maven-portal-bom v.3.6.3 +[#21847] Integrated with an Image and LighBox gallery for images ## [v1.1.0] - 2020-12-21 From 9717b5917a2fde3e4614643d95df3178c5b657dc Mon Sep 17 00:00:00 2001 From: "francesco.mangiacrapa" Date: Wed, 21 Jul 2021 12:13:24 +0200 Subject: [PATCH 4/7] image gallery has been integrated --- .../client/ui/gallery/ImagesGallery.java | 51 +++++++++++++++---- .../products/concessioni/ConcessioneView.java | 26 ++++------ src/main/webapp/GeoportalDataViewer.css | 9 ++-- 3 files changed, 56 insertions(+), 30 deletions(-) diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java index 22266a3..950854c 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java +++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java @@ -9,14 +9,29 @@ 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.Random; import com.google.gwt.user.client.ui.HTMLPanel; + +/** + * The Class ImagesGallery. + * + * @author Francesco Mangiacrapa at ISTI-CNR (francesco.mangiacrapa@isti.cnr.it) + * + * Jul 21, 2021 + */ public class ImagesGallery { - HTMLPanel galleryPanel = new HTMLPanel("
"); + private HTMLPanel galleryPanel; private List listImages; + private String galleryDivId; - private native void showGallery(JavaScriptObject json_array_images) /*-{ + /** + * Show gallery. + * + * @param json_array_images the json array images + */ + private native void showGallery(JavaScriptObject json_array_images, String galleryDivId) /*-{ console.log("showing: " + json_array_images) var waitForJQuery = setInterval( @@ -24,11 +39,11 @@ public class ImagesGallery { if (typeof $wnd.$ != 'undefined') { $wnd - .$("#nanogallery") + .$("#"+galleryDivId) .nanogallery2( { - thumbnailHeight : '200 XS150 SM150', // RESPONSIVE THUMBNAIL HEIGHT: default=250px, XS resolution=200px, SM resolution=200px - thumbnailWidth : 'auto', // RESPONSIVE THUMBNAIL WIDTH: default=250px, XS resolution=150px, SM resolution=200px + thumbnailHeight : '200 XS150 SM150', // RESPONSIVE THUMBNAIL HEIGHT: default=200px, XS resolution=150px, SM resolution=150px + thumbnailWidth : 'auto', // RESPONSIVE THUMBNAIL WIDTH: auto thumbnailAlignment : 'left', thumbnailBorderHorizontal : 0, thumbnailBorderVertical : 0, @@ -58,7 +73,7 @@ public class ImagesGallery { // THUMBNAIL'S HOVER ANIMATION //thumbnailBuildInit2 : 'tools_font-size_1.5em|title_font-size_1.5em', - thumbnailHoverEffect2 : 'image_scale_1.00_1.20_1000|tools_opacity_0_1|tools_translateX_-30px_0px|title_opacity_1_0|title_translateX_0px_-30px', + thumbnailHoverEffect2 : 'imageScaleIn80|tools_opacity_0_1|tools_translateX_-30px_0px|title_opacity_1_0|title_translateX_0px_-30px', touchAnimation : true, touchAutoOpenDelay : 800, @@ -68,7 +83,7 @@ public class ImagesGallery { borderRadius : '2px', background : '#fff', titleShadow : 'none', - titleColor : 'gray', + titleColor : '#696969', labelBackground : '#f3f3f3' }, thumbnailIcon : { @@ -97,15 +112,29 @@ public class ImagesGallery { }-*/; + /** + * Instantiates a new images gallery. + * + * @param immagini the immagini + */ public ImagesGallery(List immagini) { - + this.galleryDivId = "nanogallery"+Random.nextInt()+Random.nextInt(); + this.galleryPanel = new HTMLPanel("
"); this.listImages = immagini; } + /** + * Gets the gallery panel. + * + * @return the gallery panel + */ public HTMLPanel getGalleryPanel() { return galleryPanel; } + /** + * Fill gallery. + */ public void fillGallery() { JSONArray jsonArray = new JSONArray(); @@ -116,12 +145,12 @@ public class ImagesGallery { json.put("src", new JSONString(imageContent.getLink())); json.put("srct", new JSONString(imageContent.getLink())); List listAuthors = image.getResponsabili(); - String txtAuthors = listAuthors.size()>1 ? "Authors ": "Author "; + String txtAuthors = listAuthors.size()>1 ? "Authors: ": "Author: "; for (String author : listAuthors) { txtAuthors+= " "+author +","; } String description = txtAuthors + ". ID Licenza: "+image.getLicenseID(); - txtAuthors = txtAuthors.substring(0,txtAuthors.length()-1); + txtAuthors = txtAuthors.substring(0,txtAuthors.length()-2); json.put("title", new JSONString(image.getDidascalia())); json.put("description", new JSONString(description)); json.put("downloadURL", new JSONString(imageContent.getLink())); @@ -130,6 +159,6 @@ public class ImagesGallery { } } - showGallery(jsonArray.getJavaScriptObject()); + showGallery(jsonArray.getJavaScriptObject(), galleryDivId); } } diff --git 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 index bfeca01..40a115e 100644 --- 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 @@ -1,5 +1,6 @@ package org.gcube.portlets.user.geoportaldataviewer.client.ui.products.concessioni; +import java.util.ArrayList; import java.util.List; import org.gcube.application.geoportalcommon.shared.GeoNaItemRef; @@ -9,7 +10,6 @@ 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; import org.gcube.portlets.user.geoportaldataviewer.shared.products.ConcessioneDV; @@ -319,33 +319,29 @@ public class ConcessioneView extends Composite { } private void addUploadedImages() { + GWT.log("Managing immagini: "+concessioneDV.getImmaginiRappresentative()); List immagini = concessioneDV.getImmaginiRappresentative(); if (immagini != null && immagini.size() > 0) { imagesPanel.setVisible(true); - ImagesGallery gallery = new ImagesGallery(immagini); - imagesPanel.add(gallery.getGalleryPanel()); - gallery.fillGallery(); - - /*boolean addedImage = false; - imagesPanel.add(thumbNails); + List immaginiToShow = new ArrayList(); + //SHOWING ONLY OPEN IMAGES OR IF THE USER IS LOGGED for (UploadedImageDV uploadedImageDV : immagini) { if(uploadedImageDV.getPolicy()==null || uploadedImageDV.getPolicy().equalsIgnoreCase("OPEN")) { - thumbNails.add(new ThumbnailImageView(uploadedImageDV, viewImageButtonVisible, openImageButtonVisible)); - addedImage = true; + immaginiToShow.add(uploadedImageDV); }else { if(myLogin!=null) { - thumbNails.add(new ThumbnailImageView(uploadedImageDV, viewImageButtonVisible, openImageButtonVisible)); - addedImage = true; + immaginiToShow.add(uploadedImageDV); } } - } - if(!addedImage) { - imagesPanel.remove(thumbNails); - }*/ + if(immaginiToShow.size()>0) { + ImagesGallery gallery = new ImagesGallery(immaginiToShow); + imagesPanel.add(gallery.getGalleryPanel()); + gallery.fillGallery(); + } } } diff --git a/src/main/webapp/GeoportalDataViewer.css b/src/main/webapp/GeoportalDataViewer.css index 7f83318..99a7645 100644 --- a/src/main/webapp/GeoportalDataViewer.css +++ b/src/main/webapp/GeoportalDataViewer.css @@ -236,14 +236,15 @@ body { /** NanoGallery2 **/ -.nanogallery_viewertheme_dark_nanogallery .nGY2Viewer { - background: rgba(4, 4, 4, 0.80) !important; +.nGY2Viewer { + background: rgba(4, 4, 4, .8) !important; } -.nanogallery_viewertheme_dark_nanogallery .nGY2Viewer .toolbarBackground { - background: rgba(4, 4, 4, 0.60) !important; +.nGY2Viewer .toolbarBackground { + background: rgba(4, 4, 4, .8) !important; } + .nGY2 .toolbar .ngbt { font-size: 1em !important; padding: 12px 12px !important; From 260aca4036313d8da66f8a335911458b78a72724 Mon Sep 17 00:00:00 2001 From: "francesco.mangiacrapa" Date: Wed, 21 Jul 2021 14:27:59 +0200 Subject: [PATCH 5/7] updated changelog --- CHANGELOG.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 07da32a..ab37615 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,7 +9,8 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm #### Enhancements -[#21847] Integrated with an Image and LighBox gallery for images +[#21847] Integrated with an Image and LighBox gallery for images +Moved to maven-portal-bom 3.6.3 ## [v1.1.0] - 2020-12-21 From 3939cddf7387cf8ba262e67e63d60cf168314114 Mon Sep 17 00:00:00 2001 From: "francesco.mangiacrapa" Date: Wed, 21 Jul 2021 17:08:45 +0200 Subject: [PATCH 6/7] Using the cdnjs.cloudflare.com/ajax/libs/nanogallery2 --- .../client/GeoportalDataViewer.java | 138 +++++++++--------- src/main/webapp/GeoportalDataViewer.html | 2 +- .../GeoPortalDataViewerAppPortlet_view.jsp | 4 + 3 files changed, 74 insertions(+), 70 deletions(-) diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/GeoportalDataViewer.java b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/GeoportalDataViewer.java index cc6f6b8..e844663 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/GeoportalDataViewer.java +++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/GeoportalDataViewer.java @@ -88,109 +88,109 @@ public class GeoportalDataViewer implements EntryPoint { mainPanel = new GeonaDataViewMainPanel(applicationBus, getClientHeight()); RootPanel.get(APP_DIV).add(mainPanel); - - Timer t = new Timer() { - + + Scheduler.get().scheduleDeferred(new ScheduledCommand() { + @Override - public void run() { - Scheduler.get().scheduleDeferred(new ScheduledCommand() { + public void execute() { - @Override - 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") + olMapMng = new OLMapManager(mainPanel.getMapPanel().getElement().getId(), + layerManager.getLayerManagerBus()); + layerManager.setOlMap(olMapMng.getOLOSMMap()); + mainPanel.setMap(olMapMng.getOLOSMMap()); + updateSize(); + ScriptInjector.fromUrl("//cdnjs.cloudflare.com/ajax/libs/nanogallery2/3.0.5/jquery.nanogallery2.min.js") .setWindow(ScriptInjector.TOP_WINDOW).inject(); - } - }); + } + }); - Window.addResizeHandler(new ResizeHandler() { - @Override - public void onResize(ResizeEvent event) { - 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() { + 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); - @Override - public void execute() { - GeoportalDataViewerServiceAsync.Util.getInstance().getGeoNaDataViewProfile(new AsyncCallback() { + // 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() { @Override public void onFailure(Throwable caught) { Window.alert(caught.getMessage()); - + } @Override public void onSuccess(GeoNaDataViewerProfile profile) { geonaDataViewerProfile = profile; - GWT.log("Profile: "+geonaDataViewerProfile); + GWT.log("Profile: " + geonaDataViewerProfile); Iterator it; String theItemType = paramGeonaItemType; - if(theItemType==null) { + if (theItemType == null) { it = geonaDataViewerProfile.getMapLayers().keySet().iterator(); it.hasNext(); - theItemType= it.next(); + theItemType = it.next(); } - + LayerItem layerItem = geonaDataViewerProfile.getMapLayers().get(theItemType); - - if(layerItem==null) { - Window.alert("Not detected any layer with type: "+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); + + 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(); - } - }; - - t.schedule(3000); + }); + bindEvents(); } + + /** * Update window size. diff --git a/src/main/webapp/GeoportalDataViewer.html b/src/main/webapp/GeoportalDataViewer.html index de8e1b3..3452035 100644 --- a/src/main/webapp/GeoportalDataViewer.html +++ b/src/main/webapp/GeoportalDataViewer.html @@ -22,7 +22,7 @@ type="text/javascript"> diff --git a/src/main/webapp/WEB-INF/jsp/GeoPortalDataViewerAppPortlet_view.jsp b/src/main/webapp/WEB-INF/jsp/GeoPortalDataViewerAppPortlet_view.jsp index c2eb463..9242ff9 100644 --- a/src/main/webapp/WEB-INF/jsp/GeoPortalDataViewerAppPortlet_view.jsp +++ b/src/main/webapp/WEB-INF/jsp/GeoPortalDataViewerAppPortlet_view.jsp @@ -29,4 +29,8 @@ + +
\ No newline at end of file From 436eca079743f45fca3bc8f06c7ae0f98fcf323f Mon Sep 17 00:00:00 2001 From: "francesco.mangiacrapa" Date: Fri, 23 Jul 2021 19:02:24 +0200 Subject: [PATCH 7/7] fixing nanogallery2 css import --- .../client/ui/gallery/ImagesGallery.java | 4 ++-- src/main/webapp/GeoportalDataViewer.html | 10 +++++----- .../WEB-INF/jsp/GeoPortalDataViewerAppPortlet_view.jsp | 7 ++++--- 3 files changed, 11 insertions(+), 10 deletions(-) diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java index 950854c..fd14c8a 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java +++ b/src/main/java/org/gcube/portlets/user/geoportaldataviewer/client/ui/gallery/ImagesGallery.java @@ -43,7 +43,7 @@ public class ImagesGallery { .nanogallery2( { thumbnailHeight : '200 XS150 SM150', // RESPONSIVE THUMBNAIL HEIGHT: default=200px, XS resolution=150px, SM resolution=150px - thumbnailWidth : 'auto', // RESPONSIVE THUMBNAIL WIDTH: auto + thumbnailWidth : '218 XS150 SM150', // RESPONSIVE THUMBNAIL WIDTH: auto thumbnailAlignment : 'left', thumbnailBorderHorizontal : 0, thumbnailBorderVertical : 0, @@ -149,8 +149,8 @@ public class ImagesGallery { for (String author : listAuthors) { txtAuthors+= " "+author +","; } - String description = txtAuthors + ". ID Licenza: "+image.getLicenseID(); txtAuthors = txtAuthors.substring(0,txtAuthors.length()-2); + String description = txtAuthors + ". ID Licenza: "+image.getLicenseID(); json.put("title", new JSONString(image.getDidascalia())); json.put("description", new JSONString(description)); json.put("downloadURL", new JSONString(imageContent.getLink())); diff --git a/src/main/webapp/GeoportalDataViewer.html b/src/main/webapp/GeoportalDataViewer.html index 3452035..9eb5b3d 100644 --- a/src/main/webapp/GeoportalDataViewer.html +++ b/src/main/webapp/GeoportalDataViewer.html @@ -9,11 +9,6 @@ - - - - - @@ -24,6 +19,11 @@ + + + + + diff --git a/src/main/webapp/WEB-INF/jsp/GeoPortalDataViewerAppPortlet_view.jsp b/src/main/webapp/WEB-INF/jsp/GeoPortalDataViewerAppPortlet_view.jsp index 9242ff9..8e799df 100644 --- a/src/main/webapp/WEB-INF/jsp/GeoPortalDataViewerAppPortlet_view.jsp +++ b/src/main/webapp/WEB-INF/jsp/GeoPortalDataViewerAppPortlet_view.jsp @@ -22,6 +22,10 @@ src="//cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.4.3/build/ol.js" type="text/javascript"> + + @@ -29,8 +33,5 @@ -
\ No newline at end of file