SWC-7064, SWC-7092 - Use Elemental2 for JsInterop models

pom.xml

@@ -950,7 +950,19 @@
     <dependency>
       <groupId>com.google.jsinterop</groupId>
       <artifactId>base</artifactId>
-      <version>1.0.0</version>
+      <version>1.0.1</version>
+    </dependency>
+
+    <dependency>
+      <groupId>com.google.elemental2</groupId>
+      <artifactId>elemental2-core</artifactId>
+      <version>1.2.2</version>
+    </dependency>
+
+    <dependency>
+      <groupId>com.google.elemental2</groupId>
+      <artifactId>elemental2-dom</artifactId>
+      <version>1.2.2</version>
     </dependency>
   </dependencies>
 

src/main/java/org/sagebionetworks/web/client/GlobalApplicationState.java

@@ -1,9 +1,9 @@
 package org.sagebionetworks.web.client;
 
-import com.google.gwt.core.client.JavaScriptObject;
 import com.google.gwt.place.shared.Place;
 import com.google.gwt.place.shared.PlaceController;
 import com.google.gwt.user.client.rpc.AsyncCallback;
+import elemental2.dom.FileList;
 import java.util.List;
 import org.sagebionetworks.repo.model.EntityHeader;
 import org.sagebionetworks.web.client.mvp.AppPlaceHistoryMapper;
@@ -120,7 +120,7 @@ public void setAppPlaceHistoryMapper(
 
   void initializeToastContainer();
 
-  void setDropZoneHandler(CallbackP<JavaScriptObject> fileListCallback);
+  void setDropZoneHandler(CallbackP<FileList> fileListCallback);
 
   void clearDropZoneHandler();
 

src/main/java/org/sagebionetworks/web/client/GlobalApplicationStateImpl.java

@@ -6,7 +6,6 @@
 import static org.sagebionetworks.web.shared.WebConstants.REPO_SERVICE_URL_KEY;
 
 import com.google.gwt.core.client.GWT;
-import com.google.gwt.core.client.JavaScriptObject;
 import com.google.gwt.dom.client.Element;
 import com.google.gwt.event.shared.EventBus;
 import com.google.gwt.event.shared.UmbrellaException;
@@ -19,6 +18,7 @@
 import com.google.gwt.user.client.ui.RootPanel;
 import com.google.gwt.user.datepicker.client.CalendarUtil;
 import com.google.inject.Inject;
+import elemental2.dom.FileList;
 import java.util.ArrayList;
 import java.util.Date;
 import java.util.List;
@@ -60,7 +60,7 @@ public class GlobalApplicationStateImpl implements GlobalApplicationState {
   private DateTimeUtils dateTimeUtils;
   private SynapseJavascriptClient jsClient;
   private SessionStorage sessionStorage;
-  private CallbackP<JavaScriptObject> fileListCallback;
+  private CallbackP<FileList> fileListCallback;
   private SynapseProperties synapseProperties;
   private PortalGinInjector ginInjector;
   private final OneSageUtils oneSageUtils;
@@ -459,7 +459,7 @@ public boolean isDragAndDropListenerSet() {
     return fileListCallback != null;
   }
 
-  public void onDrop(JavaScriptObject fileList) {
+  public void onDrop(FileList fileList) {
     if (isDragAndDropListenerSet()) {
       fileListCallback.invoke(fileList);
     }
@@ -520,7 +520,7 @@ function allowDrag(e) {
 			function handleDrop(e) {
 				e.preventDefault();
 				hideDropZone();
-				globalAppState.@org.sagebionetworks.web.client.GlobalApplicationStateImpl::onDrop(Lcom/google/gwt/core/client/JavaScriptObject;)(e.dataTransfer.files);
+				globalAppState.@org.sagebionetworks.web.client.GlobalApplicationStateImpl::onDrop(Lelemental2/dom/FileList;)(e.dataTransfer.files);
 			}
 
 			dropZone.addEventListener('dragenter', allowDrag);
@@ -540,7 +540,7 @@ function handleDrop(e) {
 	}-*/;
 
   @Override
-  public void setDropZoneHandler(CallbackP<JavaScriptObject> fileListCallback) {
+  public void setDropZoneHandler(CallbackP<FileList> fileListCallback) {
     this.fileListCallback = fileListCallback;
   }
 

src/main/java/org/sagebionetworks/web/client/SynapseJSNIUtils.java

@@ -3,6 +3,7 @@
 import com.google.gwt.core.client.JavaScriptObject;
 import com.google.gwt.dom.client.Element;
 import com.google.gwt.xhr.client.XMLHttpRequest;
+import elemental2.dom.Blob;
 import org.sagebionetworks.repo.model.file.FileHandleAssociateType;
 import org.sagebionetworks.web.client.callback.MD5Callback;
 import org.sagebionetworks.web.client.widget.provenance.nchart.LayoutResult;
@@ -43,10 +44,6 @@ public LayoutResult nChartlayout(
 
   public void setPageDescription(String newDescription);
 
-  public JavaScriptObject getFileList(String fileFieldId);
-
-  public JavaScriptObject getFileBlob(int index, JavaScriptObject fileList);
-
   public void uploadFileChunk(
     String contentType,
     JavaScriptObject blob,
@@ -57,15 +54,13 @@ public void uploadFileChunk(
     ProgressCallback callback
   );
 
-  public String getContentType(JavaScriptObject fileList, int index);
-
   public boolean isFileAPISupported();
 
   public boolean isElementExists(String elementId);
 
   public String getFileUrl(String fileFieldId);
 
-  public void getFileMd5(JavaScriptObject blob, MD5Callback callback);
+  public void getFileMd5(Blob blob, MD5Callback callback);
 
   public void getFilePartMd5(
     JavaScriptObject blob,
@@ -74,12 +69,6 @@ public void getFilePartMd5(
     MD5Callback md5Callback
   );
 
-  public double getFileSize(JavaScriptObject blob);
-
-  String[] getMultipleUploadFileNames(JavaScriptObject fileList);
-
-  String getWebkitRelativePath(JavaScriptObject fileList, int index);
-
   public void consoleLog(String message);
 
   public void consoleError(String message);
@@ -117,8 +106,6 @@ public void getFilePartMd5(
 
   boolean elementSupportsAttribute(Element el, String attribute);
 
-  Element getElementById(String elementId);
-
   String getCdnEndpoint();
 
   String getAccessTokenCookieUrl();

src/main/java/org/sagebionetworks/web/client/SynapseJSNIUtilsImpl.java

@@ -10,6 +10,7 @@
 import com.google.gwt.user.client.Random;
 import com.google.gwt.user.client.Window.Location;
 import com.google.gwt.xhr.client.XMLHttpRequest;
+import elemental2.dom.Blob;
 import org.sagebionetworks.repo.model.file.FileHandleAssociateType;
 import org.sagebionetworks.web.client.callback.MD5Callback;
 import org.sagebionetworks.web.client.jsinterop.SRC;
@@ -219,9 +220,7 @@ public void setPageTitle(String newTitle) {
   @Override
   public void setPageDescription(String newDescription) {
     if (Document.get() != null) {
-      NodeList<com.google.gwt.dom.client.Element> tags = Document
-        .get()
-        .getElementsByTagName("meta");
+      NodeList<Element> tags = Document.get().getElementsByTagName("meta");
       for (int i = 0; i < tags.getLength(); i++) {
         MetaElement metaTag = ((MetaElement) tags.getItem(i));
         if (metaTag.getName().equals("description")) {
@@ -246,33 +245,6 @@ public void uploadFileChunk(
     _directUploadBlob(contentType, blob, startByte, endByte, url, xhr);
   }
 
-  @Override
-  public JavaScriptObject getFileList(String fileFieldId) {
-    return _getFileList(fileFieldId);
-  }
-
-  private static final native JavaScriptObject _getFileList(
-    String fileFieldId
-  ) /*-{
-		var fileToUploadElement = $doc.getElementById(fileFieldId);
-		if (fileToUploadElement && 'files' in fileToUploadElement) {
-			return fileToUploadElement.files;
-		}
-		return null;
-	}-*/;
-
-  @Override
-  public JavaScriptObject getFileBlob(int index, JavaScriptObject fileList) {
-    return _getFileBlob(index, fileList);
-  }
-
-  private static final native JavaScriptObject _getFileBlob(
-    int index,
-    JavaScriptObject fileList
-  ) /*-{
-		return fileList[index];
-	}-*/;
-
   private static final native void _directUploadBlob(
     String contentType,
     JavaScriptObject fileToUpload,
@@ -324,64 +296,10 @@ private static final native double _getTotal(JavaScriptObject evt) /*-{
 		return 0;
 	}-*/;
 
-  @Override
-  public String getContentType(JavaScriptObject fileList, int index) {
-    return _getContentType(fileList, index);
-  }
-
-  private static final native String _getContentType(
-    JavaScriptObject fileList,
-    int index
-  ) /*-{
-		return fileList[index].type;
-	}-*/;
-
-  @Override
-  public String getWebkitRelativePath(JavaScriptObject fileList, int index) {
-    return _getWebkitRelativePath(fileList, index);
-  }
-
-  private static final native String _getWebkitRelativePath(
-    JavaScriptObject fileList,
-    int index
-  ) /*-{
-		return fileList[index].webkitRelativePath;
-	}-*/;
-
-  @Override
-  public double getFileSize(JavaScriptObject blob) {
-    return _getFileSize(blob);
-  }
-
-  private static final native double _getFileSize(JavaScriptObject blob) /*-{
-		return blob.size;
-	}-*/;
-
-  @Override
-  public String[] getMultipleUploadFileNames(JavaScriptObject fileList) {
-    String unSplitNames = _getFilesSelected(fileList);
-    if (unSplitNames.equals("")) return null;
-    return unSplitNames.split(";");
-  }
-
-  private static native String _getFilesSelected(JavaScriptObject fileList) /*-{
-		var out = "";
-		for (i = 0; i < fileList.length; i++) {
-			var file = fileList[i];
-			out += file.name + ';';
-		}
-		return out;
-	}-*/;
-
   public boolean isElementExists(String elementId) {
     return Document.get().getElementById(elementId) != null;
   }
 
-  @Override
-  public Element getElementById(String elementId) {
-    return Document.get().getElementById(elementId);
-  }
-
   /**
    * Return the last modified time of the File (in milliseconds since the UNIX epoch).  -1 if undefined.
    */
@@ -404,12 +322,12 @@ private static final native double _getLastModified(
    * calculate the md5.
    */
   @Override
-  public void getFileMd5(JavaScriptObject blob, MD5Callback md5Callback) {
-    _getFileMd5(blob, md5Callback);
+  public void getFileMd5(Blob file, MD5Callback md5Callback) {
+    _getFileMd5(file, md5Callback);
   }
 
   private static final native void _getFileMd5(
-    JavaScriptObject file,
+    Blob file,
     MD5Callback md5Callback
   ) /*-{
 		if ($wnd.Worker) {

src/main/java/org/sagebionetworks/web/client/SynapseJsInteropUtils.java

@@ -0,0 +1,16 @@
+package org.sagebionetworks.web.client;
+
+import com.google.gwt.dom.client.Element;
+import elemental2.dom.Blob;
+import elemental2.dom.FileList;
+import org.sagebionetworks.web.client.callback.MD5Callback;
+
+public interface SynapseJsInteropUtils {
+  FileList getFileList(String fileFieldId);
+
+  String[] getMultipleUploadFileNames(FileList fileList);
+
+  String getWebkitRelativePath(FileList fileList, double index);
+
+  Element getElementById(String elementId);
+}

src/main/java/org/sagebionetworks/web/client/SynapseJsInteropUtilsImpl.java

@@ -0,0 +1,54 @@
+package org.sagebionetworks.web.client;
+
+import com.google.gwt.dom.client.Document;
+import com.google.gwt.dom.client.Element;
+import elemental2.dom.Blob;
+import elemental2.dom.DomGlobal;
+import elemental2.dom.File;
+import elemental2.dom.FileList;
+import elemental2.dom.HTMLInputElement;
+import jsinterop.base.Js;
+import org.sagebionetworks.web.client.callback.MD5Callback;
+
+public class SynapseJsInteropUtilsImpl implements SynapseJsInteropUtils {
+
+  @Override
+  public FileList getFileList(String fileFieldId) {
+    elemental2.dom.Element fileToUploadElement =
+      DomGlobal.document.getElementById(fileFieldId);
+    if (
+      fileToUploadElement instanceof HTMLInputElement &&
+      ((HTMLInputElement) fileToUploadElement).files != null
+    ) return ((HTMLInputElement) fileToUploadElement).files;
+
+    return null;
+  }
+
+  private static String getFilesSelected(FileList fileList) {
+    StringBuilder out = new StringBuilder();
+    for (double i = 0; i < fileList.length; i++) {
+      File file = fileList.item(i);
+      out.append(file.name).append(';');
+    }
+    return out.toString();
+  }
+
+  @Override
+  public String[] getMultipleUploadFileNames(FileList fileList) {
+    String unSplitNames = getFilesSelected(fileList);
+    if (unSplitNames.isEmpty()) return null;
+    return unSplitNames.split(";");
+  }
+
+  @Override
+  public String getWebkitRelativePath(FileList fileList, double index) {
+    return (String) Js
+      .asPropertyMap(fileList.item(index))
+      .get("webkitRelativePath");
+  }
+
+  @Override
+  public Element getElementById(String elementId) {
+    return Document.get().getElementById(elementId);
+  }
+}

src/main/java/org/sagebionetworks/web/client/jsinterop/JSONEntityUtils.java

@@ -1,5 +1,6 @@
 package org.sagebionetworks.web.client.jsinterop;
 
+import elemental2.core.Global;
 import org.sagebionetworks.gwt.client.schema.adapter.JSONObjectGwt;
 import org.sagebionetworks.schema.adapter.JSONEntity;
 import org.sagebionetworks.schema.adapter.JSONObjectAdapter;
@@ -20,6 +21,6 @@ public static Object toJsInteropCompatibleObject(JSONEntity entity) {
     }
     // This is a quick-and-dirty implementation--serialize the object to a string and use JSON.parse to deserialize it
     // It would be more efficient to update the JSONObjectGwt instance to directly create and return a native object.
-    return JSON.parse(adapter.toJSONString());
+    return Global.JSON.parse(adapter.toJSONString());
   }
 }