package org.gcube.portlets.user.geoportaldataviewer.client.ui.cms.gallery; import java.util.Set; import org.gcube.application.geoportalcommon.shared.geoportal.view.FilesetDV; import org.gcube.application.geoportalcommon.shared.geoportal.view.PayloadDV; import org.gcube.application.geoportalcommon.shared.geoportal.view.SectionView; import org.gcube.application.geoportalcommon.shared.geoportal.view.SubDocumentView; 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.JSONParser; import com.google.gwt.json.client.JSONString; import com.google.gwt.json.client.JSONValue; import com.google.gwt.user.client.Random; import com.google.gwt.user.client.ui.HTMLPanel; /** * The Class ImagesSectionGallery. * * @author Francesco Mangiacrapa at ISTI-CNR (francesco.mangiacrapa@isti.cnr.it) * * Jul 21, 2021 */ public class ImagesSectionGallery { private HTMLPanel galleryPanel; private String galleryDivId; private SectionView sectionView; /** * Show gallery. * * @param json_array_images the json array images * @param galleryDivId the gallery div id */ private native void showGallery(JavaScriptObject json_array_images, String galleryDivId) /*-{ console.log("showing: " + json_array_images) var waitForJQuery = setInterval( function() { if (typeof $wnd.$ != 'undefined') { $wnd .$("#" + galleryDivId) .nanogallery2( { thumbnailHeight : '200 XS150 SM150', // RESPONSIVE THUMBNAIL HEIGHT: default=200px, XS resolution=150px, SM resolution=150px thumbnailWidth : '218 XS150 SM150', // RESPONSIVE THUMBNAIL WIDTH: auto thumbnailAlignment : 'left', thumbnailBorderHorizontal : 0, thumbnailBorderVertical : 0, thumbnailGutterWidth : '10 XS10 SM10', thumbnailGutterHeight : '10 XS10 SM10', // THUMBNAIL TOOLS & LABEL thumbnailLabel : { display : true, position : 'onBottom', align : 'left' }, thumbnailToolbarImage : { bottomLeft : 'display' }, // replace the default DISPLAY tool icon icons : { thumbnailDisplay : ' display' }, // DISPLAY ANIMATION galleryDisplayTransition : 'slideUp', galleryDisplayTransitionDuration : 1000, thumbnailDisplayTransition : 'scaleDown', thumbnailDisplayTransitionDuration : 300, thumbnailDisplayInterval : 50, // THUMBNAIL'S HOVER ANIMATION //thumbnailBuildInit2 : 'tools_font-size_1.5em|title_font-size_1.5em', thumbnailHoverEffect2 : 'imageScaleIn80|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 !important', background : '#ffffff !important', titleShadow : 'none !important', titleColor : '#696969 !important', labelBackground : '#f3f3f3 !important' }, thumbnailIcon : { color : '#000', shadow : 'none' }, }, 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); }-*/; /** * Instantiates a new images section gallery. * * @param sectionView the section view */ public ImagesSectionGallery(SectionView sectionView) { this.galleryDivId = "nanogallery" + Random.nextInt() + Random.nextInt(); this.galleryPanel = new HTMLPanel("
"); this.sectionView = sectionView; } /** * Gets the gallery panel. * * @return the gallery panel */ public HTMLPanel getGalleryPanel() { return galleryPanel; } /** * Fill gallery. */ public void fillGallery() { JSONArray jsonArray = new JSONArray(); int index = 0; for (SubDocumentView subdoc : sectionView.getListSubDocuments()) { JSONValue meta = JSONParser.parseStrict(subdoc.getMetadataAsJSON()); for (FilesetDV image : subdoc.getListImages()) { if (image.getListPayload() != null) { for (PayloadDV payloadDV : image.getListPayload()) { JSONObject json = new JSONObject(); json.put("src", new JSONString(payloadDV.getLink())); json.put("srct", new JSONString(payloadDV.getLink())); json.put("downloadURL", new JSONString(payloadDV.getLink())); json.put("title", new JSONString(getFirstValueOfJSON(meta))); json.put("description", new JSONString(meta.toString())); jsonArray.set(index, json); index++; } } } } showGallery(jsonArray.getJavaScriptObject(), galleryDivId); } /** * Gets the first value of JSON. * * @param metadata the metadata * @return the first value of JSON */ public String getFirstValueOfJSON(JSONValue metadata) { String value = ""; if (metadata == null) return value; if (metadata.isArray() != null) { JSONArray array = (JSONArray) metadata; for (int i = 0; i < array.size(); i++) { JSONObject object = (JSONObject) array.get(i); Set set = object.keySet(); value = object.get(set.iterator().next()).toString(); } } else if (metadata.isObject() != null) { JSONObject object = (JSONObject) metadata; Set set = object.keySet(); value = object.get(set.iterator().next()).toString(); } else if (metadata.isString() != null) { value = metadata.toString(); } return value; } }