add figurl support

.gitignore

@@ -1,3 +1,5 @@
+dist
+package-lock.json
 *.mat
 *.json
 !public/DATA/*HPa_01_04_*.json

app/js/figurl-interface/deserializeReturnValue.js

@@ -0,0 +1,140 @@
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const deserializeReturnValue = (x) => {
+  if (!x) return x;
+  else if (typeof x === 'object') {
+    if (Array.isArray(x)) {
+      return x.map((a) => deserializeReturnValue(a));
+    } else if (x._type === 'ndarray') {
+      const shape = x.shape;
+      const dtype = x.dtype;
+      const data_b64 = x.data_b64;
+      const dataBuffer = _base64ToArrayBuffer(data_b64);
+      switch (dtype) {
+        case 'float32':
+          return applyShape(new Float32Array(dataBuffer), shape);
+        case 'int32':
+          return applyShape(new Int32Array(dataBuffer), shape);
+        case 'int16':
+          return applyShape(new Int16Array(dataBuffer), shape);
+        case 'int8':
+          return applyShape(new Int8Array(dataBuffer), shape);
+        case 'uint32':
+          return applyShape(new Uint32Array(dataBuffer), shape);
+        case 'uint16':
+          return applyShape(new Uint16Array(dataBuffer), shape);
+        case 'uint8':
+          return applyShape(new Uint8Array(dataBuffer), shape);
+        default:
+          throw Error(`Datatype not yet implemented for ndarray: ${dtype}`);
+      }
+    } else {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      const ret = {};
+      for (const k in x) {
+        ret[k] = deserializeReturnValue(x[k]);
+      }
+      return ret;
+    }
+  } else return x;
+};
+
+const applyShape = (
+  x,
+  shape
+) => {
+  if (shape.length === 1) {
+    if (shape[0] !== x.length) throw Error('Unexpected length of array');
+    return Array.from(x);
+  } else if (shape.length === 2) {
+    const n1 = shape[0];
+    const n2 = shape[1];
+    if (n1 * n2 !== x.length) throw Error('Unexpected length of array');
+    const ret = [];
+    for (let i1 = 0; i1 < n1; i1++) {
+      ret.push(Array.from(x.slice(i1 * n2, (i1 + 1) * n2)));
+    }
+    return ret;
+  } else if (shape.length === 3) {
+    const n1 = shape[0];
+    const n2 = shape[1];
+    const n3 = shape[2];
+    if (n1 * n2 * n3 !== x.length) throw Error('Unexpected length of array');
+    const ret = [];
+    for (let i1 = 0; i1 < n1; i1++) {
+      const A = [];
+      for (let i2 = 0; i2 < n2; i2++) {
+        A.push(Array.from(x.slice(i1 * n2 * n3 + i2 * n3, i1 * n2 * n3 + (i2 + 1) * n3)));
+      }
+      ret.push(A);
+    }
+    return ret;
+  } else if (shape.length === 4) {
+    const n1 = shape[0];
+    const n2 = shape[1];
+    const n3 = shape[2];
+    const n4 = shape[3];
+    if (n1 * n2 * n3 * n4 !== x.length) throw Error('Unexpected length of array');
+    const ret = [];
+    for (let i1 = 0; i1 < n1; i1++) {
+      const A = [];
+      for (let i2 = 0; i2 < n2; i2++) {
+        const B = [];
+        for (let i3 = 0; i3 < n3; i3++) {
+          B.push(
+            Array.from(
+              x.slice(i1 * n2 * n3 * n4 + i2 * n3 * n4 + i3 * n4, i1 * n2 * n3 * n4 + i2 * n3 * n4 + (i3 + 1) * n4)
+            )
+          );
+        }
+        A.push(B);
+      }
+      ret.push(A);
+    }
+    return ret;
+  } else if (shape.length === 5) {
+    const n1 = shape[0];
+    const n2 = shape[1];
+    const n3 = shape[2];
+    const n4 = shape[3];
+    const n5 = shape[4];
+    if (n1 * n2 * n3 * n4 * n5 !== x.length) throw Error('Unexpected length of array');
+    const request = [];
+    for (let i1 = 0; i1 < n1; i1++) {
+      const A = [];
+      for (let i2 = 0; i2 < n2; i2++) {
+        const B = [];
+        for (let i3 = 0; i3 < n3; i3++) {
+          const C = [];
+          for (let i4 = 0; i4 < n4; i4++) {
+            C.push(
+              Array.from(
+                x.slice(
+                  i1 * n2 * n3 * n4 * n5 + i2 * n3 * n4 * n5 + i3 * n4 * n5 + i4 * n5,
+                  i1 * n2 * n3 * n4 * n5 + i2 * n3 * n4 * n5 + i3 * n4 * n5 + (i4 + 1) * n5
+                )
+              )
+            );
+          }
+          B.push(C);
+        }
+        A.push(B);
+      }
+      ret.push(A);
+    }
+    return ret;
+  } else {
+    throw Error('Not yet implemented');
+  }
+};
+
+const _base64ToArrayBuffer = (base64) => {
+  const binary_string = window.atob(base64);
+  const len = binary_string.length;
+  const bytes = new Uint8Array(len);
+  for (let i = 0; i < len; i++) {
+    bytes[i] = binary_string.charCodeAt(i);
+  }
+  return bytes.buffer;
+};
+
+export default deserializeReturnValue;

app/js/figurl-interface/getFigureData.js

@@ -0,0 +1,18 @@
+import sendRequestToParent from './sendRequestToParent';
+import deserializeReturnValue from './deserializeReturnValue';
+
+const getFigureData = () => {
+  return new Promise((resolve, reject) => {
+    const request = {
+      type: 'getFigureData',
+      figurlProtocolVersion: 'p1'
+    };
+    sendRequestToParent(request).then(response => {
+      resolve(deserializeReturnValue(response.figureData));
+    }).catch((err) => {
+      reject(err);
+    })
+  })
+};
+
+export default getFigureData;

app/js/figurl-interface/getFileData.js

@@ -0,0 +1,146 @@
+import sendRequestToParent from './sendRequestToParent';
+import deserializeReturnValue from './deserializeReturnValue';
+
+const getFileData = (
+  uri,
+  responseType,
+  onProgress,
+  o = {}
+) => {
+  let responseType2
+  if (responseType === 'json-deserialized') {
+    responseType2 = 'json'
+  }
+  else {
+    responseType2 = responseType
+  }
+  const request = {
+    type: 'getFileData',
+    uri,
+    responseType: responseType2,
+    figurlProtocolVersion: 'p1'
+  };
+  if (o.startByte !== undefined) {
+    request.startByte = o.startByte;
+    request.endByte = o.endByte;
+  }
+  progressListeners[uri] = ({ loaded, total }) => {
+    onProgress({ loaded, total });
+  };
+  return new Promise((resolve, reject) => {
+    sendRequestToParent(request).then(response => {
+      if (!isGetFileDataResponse(response)) throw Error('Invalid response to getFigureData');
+      if (response.errorMessage) {
+        throw Error(`Error getting file data for ${uri}: ${response.errorMessage}`);
+      }
+      if (responseType === 'json-deserialized') {
+        resolve(deserializeReturnValue(response.fileData));
+      }
+      else {
+        resolve(response.fileData);
+      }
+    })
+    .catch((err) => {
+      reject(err);
+    })
+  })
+};
+
+export const getFileDataUrl = (uri) => {
+  const request = {
+    type: 'getFileDataUrl',
+    uri,
+    figurlProtocolVersion: 'p1'
+  };
+  return new Promise((resolve, reject) => {
+    sendRequestToParent(request).then(response => {
+      if (!isGetFileDataUrlResponse(response)) throw Error('Invalid response to getFigureUrlData');
+      if (!response.fileDataUrl || response.errorMessage) {
+        throw Error(`Error getting file data for ${uri}: ${response.errorMessage}`);
+      }
+      resolve(response.fileDataUrl);
+    })
+    .catch((err) => {
+      reject(err);
+    })
+  })
+}
+
+// export const storeFileData = async (fileData, o = {}) => {
+//   const request = {
+//     type: 'storeFile',
+//     fileData,
+//     figurlProtocolVersion: 'p1'
+//   };
+//   const response = await sendRequestToParent(request);
+//   if (!isStoreFileResponse(response)) throw Error('Invalid response to storeFile');
+//   if (response.error) {
+//     throw Error(`Error storing file data: ${response.error}`);
+//   }
+//   if (response.uri === undefined) {
+//     throw Error('Unexpected response.uri is undefined');
+//   }
+//   return response.uri;
+// };
+
+// export const storeGithubFileData = async (o) => {
+//   const request = {
+//     type: 'storeGithubFile',
+//     fileData: o.fileData,
+//     uri: o.uri,
+//     figurlProtocolVersion: 'p1'
+//   };
+//   const response = await sendRequestToParent(request);
+//   if (!isStoreGithubFileResponse(response)) throw Error('Invalid response to storeFile');
+//   if (response.error) {
+//     throw Error(`Error storing file data: ${response.error}`);
+//   }
+// };
+
+const progressListeners = {};
+
+export const handleFileDownloadProgress = ({
+  uri,
+  loaded,
+  total,
+}) => {
+  const x = progressListeners[uri];
+  if (x) {
+    x({ loaded, total });
+  }
+};
+
+// export const useFileData = (uri, responseType, o = {}) => {
+//   // eslint-disable-next-line @typescript-eslint/no-explicit-any
+//   const [fileData, setFileData] = useState<any | undefined>(undefined);
+//   const [errorMessage, setErrorMessage] = useState<string | undefined>(undefined);
+//   const { progress, reportProgress } = useMemo(() => {
+//     let _callback = ({ loaded, total }) => {};
+//     const reportProgress = (a) => {
+//       _callback(a);
+//     };
+//     const progress = {
+//       onProgress: (callback) => {
+//         _callback = callback;
+//       },
+//     };
+//     return { progress, reportProgress };
+//   }, []);
+//   useEffect(() => {
+//     setErrorMessage(undefined);
+//     setFileData(undefined);
+//     getFileData(uri, responseType, reportProgress, {
+//       startByte: o.startByte,
+//       endByte: o.endByte
+//     })
+//       .then((data) => {
+//         setFileData(data);
+//       })
+//       .catch((err) => {
+//         setErrorMessage(err.message);
+//       });
+//   }, [uri, reportProgress, o.startByte, o.endByte, responseType]);
+//   return { fileData, progress, errorMessage };
+// };
+
+export default getFileData;

app/js/figurl-interface/sendMessageToParent.js

@@ -0,0 +1,25 @@
+// const urlSearchParams = new URLSearchParams(window.location.search)
+// const queryParams = Object.fromEntries(urlSearchParams.entries())
+
+function parseQuery(queryString) {
+  const ind = queryString.indexOf('?');
+  if (ind < 0) return {};
+  const query = {};
+  const pairs = queryString.slice(ind + 1).split('&');
+  for (let i = 0; i < pairs.length; i++) {
+    const pair = pairs[i].split('=');
+    query[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1] || '');
+  }
+  return query;
+}
+
+// Important to do it this way because it is difficult to handle special characters (especially #) by using URLSearchParams or window.location.search
+const queryParams = parseQuery(window.location.href);
+
+const sendMessageToParent = (x, { parentOrigin }) => {
+  const parentOrOpenerWindow = queryParams.useOpener === '1' ? window.opener : window.parent;
+  // if no parent, this will post to itself
+  parentOrOpenerWindow.postMessage(x, parentOrigin);
+};
+
+export default sendMessageToParent;