From 48d19b6f105408be798b035e0e19ac8119e7c02e Mon Sep 17 00:00:00 2001 From: "francesco.mangiacrapa" Date: Mon, 20 Sep 2021 18:08:43 +0200 Subject: [PATCH] #21990 Integrated with JSONEditor, Improved general CSS --- .../client/GeoPortalDataEntryApp.java | 15 ++- .../client/ui/GeonaMainTabPanel.ui.xml | 12 +- .../client/ui/GeonaRecordsPaginatedView.java | 2 +- .../client/ui/edit/EditModeRecord.java | 111 ++++++++++++++++++ .../client/ui/edit/EditModeRecord.ui.xml | 31 +++++ .../client/ui/edit/jseditor/MyJSONEditor.java | 48 ++++++++ .../ui/report/ReportTemplateToHTML.java | 10 +- .../client/ui/utils/ExternalLib.java | 23 ++++ .../server/MongoServiceUtil.java | 7 +- src/main/webapp/GeoPortalDataEntryApp.html | 9 ++ .../jsp/GeoPortalDataEntryAppPortlet_view.jsp | 19 ++- 11 files changed, 258 insertions(+), 29 deletions(-) create mode 100644 src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/EditModeRecord.java create mode 100644 src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/EditModeRecord.ui.xml create mode 100644 src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/jseditor/MyJSONEditor.java create mode 100644 src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/utils/ExternalLib.java diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/GeoPortalDataEntryApp.java b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/GeoPortalDataEntryApp.java index 8cb43db..8770435 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/GeoPortalDataEntryApp.java +++ b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/GeoPortalDataEntryApp.java @@ -25,6 +25,7 @@ import org.gcube.portlets.user.geoportaldataentry.client.events.SaveGeonaDataFor import org.gcube.portlets.user.geoportaldataentry.client.ui.GeonaMainTabPanel; import org.gcube.portlets.user.geoportaldataentry.client.ui.GeonaRecordsPaginatedView; import org.gcube.portlets.user.geoportaldataentry.client.ui.card.GeoNaFormCardModel; +import org.gcube.portlets.user.geoportaldataentry.client.ui.edit.EditModeRecord; import org.gcube.portlets.user.geoportaldataentry.client.ui.form.GeonaDataEntryMainForm; import org.gcube.portlets.user.geoportaldataentry.client.ui.report.BuildValidationReport; import org.gcube.portlets.user.geoportaldataentry.client.ui.report.ReportTemplateToHTML; @@ -43,7 +44,6 @@ import org.gcube.portlets.widgets.mpformbuilder.client.form.generic.CreateMetada import org.gcube.portlets.widgets.mpformbuilder.shared.metadata.MetaDataProfileBean; import com.github.gwtbootstrap.client.ui.Alert; -import com.github.gwtbootstrap.client.ui.Heading; import com.github.gwtbootstrap.client.ui.Modal; import com.github.gwtbootstrap.client.ui.constants.AlertType; import com.google.gwt.core.client.EntryPoint; @@ -74,10 +74,7 @@ public class GeoPortalDataEntryApp implements EntryPoint { private static final String DIV_PORTLET_ID = "geoportal-data-entry"; - /** - * Create a remote service proxy to talk to the server-side Greeting service. - */ - public static final GeoportalDataEntryServiceAsync greetingService = GWT.create(GeoportalDataEntryService.class); + public static final GeoportalDataEntryServiceAsync geoportalDataEntryService = GWT.create(GeoportalDataEntryService.class); private final HandlerManager appManagerBus = new HandlerManager(null); @@ -153,6 +150,7 @@ public class GeoPortalDataEntryApp implements EntryPoint { int topBorder = workspace.getAbsoluteTop(); int footer = 85; // footer is bottombar + sponsor int headerSize = 90; + //int headerSize = 30; int rootHeight = Window.getClientHeight() - topBorder - headerSize - footer;// - ((footer == // null)?0:(footer.getOffsetHeight()-15)); @@ -523,11 +521,12 @@ public class GeoPortalDataEntryApp implements EntryPoint { case EDIT_RECORD: final Modal modal3 = new Modal(true, true); modal3.setTitle("Edit
"+concessione.getNome()+"
"); - modal3.setWidth(800); + modal3.setWidth(950); + modal3.setHeight("700px"); modal3.setCloseVisible(true); - modal3.add(new Heading(1, "Under construction...")); + EditModeRecord emr = new EditModeRecord(concessione,RECORD_TYPE.CONCESSIONE); + modal3.add(emr); modal3.show(); - break; case DELETE_RECORD: diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/GeonaMainTabPanel.ui.xml b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/GeonaMainTabPanel.ui.xml index 34fec38..48e3a6c 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/GeonaMainTabPanel.ui.xml +++ b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/GeonaMainTabPanel.ui.xml @@ -35,16 +35,20 @@ .max-height-300 { max-height: auto; } + + .margin-botttom-5 { + margin-bottom: 5px !important; + } GeoNa - + - - + + New Project - + List of Projects diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/GeonaRecordsPaginatedView.java b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/GeonaRecordsPaginatedView.java index a9ec117..ca84a21 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/GeonaRecordsPaginatedView.java +++ b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/GeonaRecordsPaginatedView.java @@ -203,7 +203,7 @@ public class GeonaRecordsPaginatedView { GWT.log("calling loadItemsForStatus with parameters [startIndex: " + newStartIndex + ", limit: " + limit + ", serverIndex:" + serverIndex + ", sortFilter: " + sortFilter + "]"); - GeoPortalDataEntryApp.greetingService.getListConcessioni(newStartIndex, limit, sortFilter, invalidCache, + GeoPortalDataEntryApp.geoportalDataEntryService.getListConcessioni(newStartIndex, limit, sortFilter, invalidCache, new AsyncCallback() { @Override diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/EditModeRecord.java b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/EditModeRecord.java new file mode 100644 index 0000000..cd4fe3e --- /dev/null +++ b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/EditModeRecord.java @@ -0,0 +1,111 @@ +package org.gcube.portlets.user.geoportaldataentry.client.ui.edit; + +import org.gcube.application.geoportalcommon.shared.products.BaseConcessioneDV; +import org.gcube.portlets.user.geoportaldataentry.client.ConstantsGeoPortalDataEntryApp.RECORD_TYPE; +import org.gcube.portlets.user.geoportaldataentry.client.GeoPortalDataEntryApp; +import org.gcube.portlets.user.geoportaldataentry.client.ui.edit.jseditor.MyJSONEditor; + +import com.google.gwt.core.client.GWT; +import com.google.gwt.uibinder.client.UiBinder; +import com.google.gwt.uibinder.client.UiField; +import com.google.gwt.user.client.Random; +import com.google.gwt.user.client.Timer; +import com.google.gwt.user.client.rpc.AsyncCallback; +import com.google.gwt.user.client.ui.Composite; +import com.google.gwt.user.client.ui.FlowPanel; +import com.google.gwt.user.client.ui.Widget; + +/** + * The Class EditModeRecord. + * + * @author Francesco Mangiacrapa at ISTI-CNR francesco.mangiacrapa@isti.cnr.it + * + * Sep 17, 2021 + */ +public class EditModeRecord extends Composite { + + private static EditModeRecordUiBinder uiBinder = GWT.create(EditModeRecordUiBinder.class); + + @UiField + FlowPanel rawUpdatePanel; + + @UiField + FlowPanel filesUpdatePanel; + + private BaseConcessioneDV selectedConcessione; + + /** + * The Interface EditModeRecordUiBinder. + * + * @author Francesco Mangiacrapa at ISTI-CNR francesco.mangiacrapa@isti.cnr.it + * + * Sep 17, 2021 + */ + interface EditModeRecordUiBinder extends UiBinder { + } + + /** + * Instantiates a new edits the mode record. + * + * @param selectedConcessione the selected concessione + * @param type the type + */ + public EditModeRecord(BaseConcessioneDV selectedConcessione, RECORD_TYPE type) { + initWidget(uiBinder.createAndBindUi(this)); + this.selectedConcessione = selectedConcessione; + + final FlowPanel fp = new FlowPanel(); + fp.getElement().setId("jsoneditor"+Random.nextInt()); + fp.setHeight("400px"); + rawUpdatePanel.add(fp); + + GeoPortalDataEntryApp.geoportalDataEntryService.getJSONRecord(selectedConcessione.getItemId(), type, new AsyncCallback() { + + @Override + public void onSuccess(String jsonData) { + GWT.log("Instance JSON Editor with: "+jsonData); + //jsonEditor = ExternalLib.instanceJSONEditor(fp.getElement().getId(), jsonData); + //String updated = ExternalLib.getUpdatedJSON(jsonEditor); + + //JSONEditor constuctor = new JSONEditor(fp.getElement(),"{}"); + final MyJSONEditor jsEditor = MyJSONEditor.init(fp.getElement().getId()); + jsEditor.setName(selectedConcessione.getNome()); +// JSONValue jsValue = JSONParser.parse(jsonData); +// JSONObject extraJSONObject = jsValue.isObject(); + jsEditor.set(jsonData); + + new Timer() { + + @Override + public void run() { + jsEditor.setMode("tree"); + + } + }.schedule(200); + + + //GWT.log("Updated: "+updated.toString()); + //org.gcube.portlets.user.geoportaldataentry.client.ui.utils.JSONEditor editor = JE.jsoneditor(fp.getElement(), jsonData); + //rawUpdatePanel.add(new Widget(editor)); + + + } + + @Override + public void onFailure(Throwable caught) { + // TODO Auto-generated method stub + + } + }); + + bindEvents(); + } + + /** + * Bind events. + */ + private void bindEvents() { + // TODO Auto-generated method stub + + } +} diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/EditModeRecord.ui.xml b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/EditModeRecord.ui.xml new file mode 100644 index 0000000..8ccecb8 --- /dev/null +++ b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/EditModeRecord.ui.xml @@ -0,0 +1,31 @@ + + + + .important { + font-weight: bold; + } + + + + + + + Raw Project Editor + + + + + Update the file/s + By choosing a section (e.g. "RELAZIONE di + SCAVO") and + uploading new file/s the old one/s will be replaced + + + + + + \ No newline at end of file diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/jseditor/MyJSONEditor.java b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/jseditor/MyJSONEditor.java new file mode 100644 index 0000000..30d2db0 --- /dev/null +++ b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/edit/jseditor/MyJSONEditor.java @@ -0,0 +1,48 @@ +package org.gcube.portlets.user.geoportaldataentry.client.ui.edit.jseditor; + +import com.google.gwt.core.client.JavaScriptObject; + +public class MyJSONEditor extends JavaScriptObject { + + // 6131f0d902ad3d2580412d14 + + protected MyJSONEditor() { + } + + public static native MyJSONEditor init(String divID) /*-{ + var container = $doc.getElementById(divID); + var options = { + modes : ['code','tree'], + search: true, + onError : function(error) { + console.log("MyJSONEditor error: " + error) + } + }; + console.log("container is: " + container); + return new $wnd.JSONEditor(container, options); + }-*/; + + public final native void set(String json) /*-{ + var toJSONObject = JSON.parse(json); + // set json + console.log("displayng JSON: " + toJSONObject); + this.set(toJSONObject); + this.refresh(); + }-*/; + + public final native void get() /*-{ + this.get(); + }-*/; + + public final native void onError() /*-{ + this.onError(error); + }-*/; + + public final native void setMode(String mode) /*-{ + this.setMode(mode); + }-*/; + + public final native void setName(String rootName) /*-{ + this.setName(rootName); + }-*/; +} \ No newline at end of file diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/report/ReportTemplateToHTML.java b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/report/ReportTemplateToHTML.java index 61b8afa..5bf287e 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/report/ReportTemplateToHTML.java +++ b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/report/ReportTemplateToHTML.java @@ -1,5 +1,7 @@ package org.gcube.portlets.user.geoportaldataentry.client.ui.report; +import org.gcube.portlets.user.geoportaldataentry.client.ui.utils.ExternalLib; + import com.github.gwtbootstrap.client.ui.Paragraph; import com.google.gwt.core.client.GWT; import com.google.gwt.json.client.JSONArray; @@ -80,16 +82,10 @@ public class ReportTemplateToHTML extends Composite { e.printStackTrace(); GWT.log("error: " + e.getMessage()); } - reportJSON.add(new HTML("
" + toPrettyPrintJSON(reportAsJSON) + "
")); + reportJSON.add(new HTML("
" + ExternalLib.toPrettyPrintJSON(reportAsJSON) + "
")); } } - public static native String toPrettyPrintJSON(String jsonData)/*-{ - console.log(jsonData); - var objJSON = JSON.parse(jsonData); - return $wnd.prettyPrintJson.toHtml(objJSON); - }-*/; - /** * Json to HTML. * diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/utils/ExternalLib.java b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/utils/ExternalLib.java new file mode 100644 index 0000000..3b89653 --- /dev/null +++ b/src/main/java/org/gcube/portlets/user/geoportaldataentry/client/ui/utils/ExternalLib.java @@ -0,0 +1,23 @@ +package org.gcube.portlets.user.geoportaldataentry.client.ui.utils; + +/** + * The Class ExternalLib. + * + * @author Francesco Mangiacrapa at ISTI-CNR francesco.mangiacrapa@isti.cnr.it + * + * Sep 17, 2021 + */ +public class ExternalLib { + + /** + * To pretty print JSON. calls the externa js lib 'pretty-print-json' + * + * @param jsonData the json data + * @return the string + */ + public static native String toPrettyPrintJSON(String jsonData)/*-{ + //console.log(jsonData); + var objJSON = JSON.parse(jsonData); + return $wnd.prettyPrintJson.toHtml(objJSON); + }-*/; +} diff --git a/src/main/java/org/gcube/portlets/user/geoportaldataentry/server/MongoServiceUtil.java b/src/main/java/org/gcube/portlets/user/geoportaldataentry/server/MongoServiceUtil.java index e10ac71..5cb11c9 100644 --- a/src/main/java/org/gcube/portlets/user/geoportaldataentry/server/MongoServiceUtil.java +++ b/src/main/java/org/gcube/portlets/user/geoportaldataentry/server/MongoServiceUtil.java @@ -5,7 +5,6 @@ import static org.gcube.application.geoportal.client.GeoportalAbstractPlugin.mon import java.io.FileInputStream; import java.io.FileNotFoundException; import java.io.InputStream; -import java.io.Serializable; import java.util.ArrayList; import java.util.Comparator; import java.util.List; @@ -98,10 +97,10 @@ public class MongoServiceUtil { LOG.debug("toJSON called"); try { - if (theObj instanceof Serializable) { +// if (theObj instanceof Serializable) { return org.gcube.application.geoportal.client.utils.Serialization.write(theObj); - } - throw new Exception("The input object is not serializable"); +// } +// throw new Exception("The input object is not serializable"); } catch (Exception e) { LOG.warn("Error on deserializing: ", e); diff --git a/src/main/webapp/GeoPortalDataEntryApp.html b/src/main/webapp/GeoPortalDataEntryApp.html index 0558c96..26b1cc3 100644 --- a/src/main/webapp/GeoPortalDataEntryApp.html +++ b/src/main/webapp/GeoPortalDataEntryApp.html @@ -22,6 +22,15 @@ src="//cdn.jsdelivr.net/npm/pretty-print-json@1.1/dist/pretty-print-json.min.js" type="text/javascript"> + + + + + diff --git a/src/main/webapp/WEB-INF/jsp/GeoPortalDataEntryAppPortlet_view.jsp b/src/main/webapp/WEB-INF/jsp/GeoPortalDataEntryAppPortlet_view.jsp index d9e7da1..04ca825 100644 --- a/src/main/webapp/WEB-INF/jsp/GeoPortalDataEntryAppPortlet_view.jsp +++ b/src/main/webapp/WEB-INF/jsp/GeoPortalDataEntryAppPortlet_view.jsp @@ -13,10 +13,6 @@ - - @@ -24,15 +20,28 @@ src="//cdn.jsdelivr.net/npm/pretty-print-json@1.1/dist/pretty-print-json.min.js" type="text/javascript"> + + + + + + + - +