grnsight 6.0.4 → 7.1.1

package/web-client/public/js/grnsight.js

@@ -1,13 +1,34 @@
+/* eslint-disable func-style */
 import { displayStatistics } from "./graph-statistics"; // eslint-disable-line no-unused-vars
 import { upload } from "./upload";
 import { generateNetwork } from "./generateNetwork";
 
 import { grnState } from "./grnstate";
+import { queryDefaultDataset } from "./api/grnsight-api.js";
 import { updateApp } from "./update-app";
 import { setupHandlers } from "./setup-handlers";
 
-setupHandlers(grnState);
-updateApp(grnState);
+async function updateDefaultDataset () {
+    try {
+        const response = await queryDefaultDataset({type:"DefaultDataset"});
+        grnState.database = response;
+        return response.defaultDataset.join();
+    } catch (error) {
+        console.log(error.stack);
+        console.log(error.name);
+        console.log(error.message);
+    }
+}
 
-upload();
-generateNetwork();
+async function initializeGrnsight () {
+    const defaultDataset = await updateDefaultDataset();
+    grnState.defaultDataset = defaultDataset;
+
+    setupHandlers(grnState);
+    updateApp(grnState);
+
+    upload();
+    generateNetwork();
+}
+
+initializeGrnsight();

package/web-client/public/js/grnstate.js

@@ -10,7 +10,8 @@ import {
   DEFAULT_MAX_LOG_FOLD_CHANGE,
   DEFAULT_ZOOM_VALUE,
   FORCE_GRAPH,
-  VIEWPORT_INIT
+  VIEWPORT_INIT,
+  NETWORK_GRN_MODE
 } from "./constants";
 let currentWorkbook = null;
 
@@ -41,6 +42,7 @@ const annotateLinks = workbook => {
 };
 
 export const grnState = {
+    mode: NETWORK_GRN_MODE,    // GRNsight will display GRN view unless specified
     name: null,
     simulation: undefined,
     newWorkbook: false,

package/web-client/public/js/iframe-coordination.js

@@ -11,7 +11,7 @@
  *                loaded into the web browser when this script executes.
  */
 iFrameResize({
-  checkOrigin: ["https://dondi.github.io", "https://grnsight.cs.lmu.edu"],
+  checkOrigin: ["https://dondi.github.io", "https://grnsight.lmucs.org"],
   widthCalculationMethod: "taggedElement",
   heightCalculationMethod: "taggedElement",
   sizeWidth: true,
@@ -40,7 +40,7 @@ const sendDimensions = (destination, origin) => {
 };
 
 window.addEventListener("message", event => {
-  if (event.origin.indexOf("https://grnsight.cs.lmu.edu") !== 0) {
+  if (event.origin.indexOf("https://grnsight.lmucs.org") !== 0) {
     // Ignore any message that did not originate from the GRNsight web client server.
     return;
   }
@@ -51,5 +51,5 @@ window.addEventListener("message", event => {
 });
 
 window.addEventListener("resize", () => sendDimensions(
-  document.querySelector("iframe.embedded-demo").contentWindow, "https://grnsight.cs.lmu.edu"
+  document.querySelector("iframe.embedded-demo").contentWindow, "https://grnsight.lmucs.org"
 ));

package/web-client/public/js/setup-handlers.js

@@ -225,29 +225,40 @@ export const setupHandlers = grnState => {
     });
 
 // Node Coloring
-    $(NODE_COLORING_TOGGLE_CLASS).click(() => {
-        grnState.nodeColoring.nodeColoringEnabled = !grnState.nodeColoring.nodeColoringEnabled;
-        updateApp(grnState);
-    });
-
-    $(TOP_DATASET_SELECTION_SIDEBAR).change(() => {
-        var selection = $(TOP_DATASET_SELECTION_SIDEBAR).find(":selected").attr("value");
+    const updateTopDatasetSelection = (selection) => {
         grnState.nodeColoring.topDataset = selection;
         if (grnState.nodeColoring.bottomDataSameAsTop) {
             grnState.nodeColoring.bottomDataset = selection;
         }
         updateApp(grnState);
-    });
+    };
 
-    $(TOP_DATASET_SELECTION_MENU).click(() => {
-        var selection = $(this).attr("value");
-        grnState.nodeColoring.topDataset = selection;
-        if (grnState.nodeColoring.bottomDataSameAsTop) {
+    const updateBottomDatasetSelection = (selection) => {
+        grnState.nodeColoring.bottomDataset = selection;
+        if (selection === "Same as Top Dataset") {
+            grnState.nodeColoring.bottomDataset = grnState.nodeColoring.topDataset;
+            grnState.nodeColoring.bottomDataSameAsTop = true;
+        } else {
+            grnState.nodeColoring.bottomDataSameAsTop = false;
             grnState.nodeColoring.bottomDataset = selection;
         }
         updateApp(grnState);
+    };
+
+    $(NODE_COLORING_TOGGLE_CLASS).click(() => {
+        grnState.nodeColoring.nodeColoringEnabled = !grnState.nodeColoring.nodeColoringEnabled;
+        updateApp(grnState);
     });
 
+    $(TOP_DATASET_SELECTION_SIDEBAR).change(() => {
+        const selection = $(TOP_DATASET_SELECTION_SIDEBAR).find(":selected").attr("value");
+        updateTopDatasetSelection(selection);
+    });
+
+    $(TOP_DATASET_SELECTION_MENU).click((event) => {
+        const selection = event.target.dataset.expression;
+        updateTopDatasetSelection(selection);
+    });
     $(AVG_REPLICATE_VALS_TOP_SIDEBAR).change(() => {
         grnState.nodeColoring.averageTopDataset = !grnState.nodeColoring.averageTopDataset;
         updateApp(grnState);
@@ -259,28 +270,13 @@ export const setupHandlers = grnState => {
     });
 
     $(BOTTOM_DATASET_SELECTION_SIDEBAR).change(() => {
-        var selection = $(BOTTOM_DATASET_SELECTION_SIDEBAR).find(":selected").attr("value");
-        grnState.nodeColoring.bottomDataset = selection;
-        if (grnState.nodeColoring.bottomDataset === "Same as Top Dataset") {
-            grnState.nodeColoring.bottomDataset = grnState.nodeColoring.topDataset;
-            grnState.nodeColoring.bottomDataSameAsTop = true;
-        } else {
-            grnState.nodeColoring.bottomDataSameAsTop = false;
-        }
-        updateApp(grnState);
+        const selection = $(BOTTOM_DATASET_SELECTION_SIDEBAR).find(":selected").attr("value");
+        updateBottomDatasetSelection(selection);
     });
 
-    $(BOTTOM_DATASET_SELECTION_MENU).click(() => {
-        var selection = $(this).attr("value");
-        grnState.nodeColoring.bottomDataset = selection;
-        if (selection === "Same as Top Dataset") {
-            grnState.nodeColoring.bottomDataset = grnState.nodeColoring.topDataset;
-            grnState.nodeColoring.bottomDataSameAsTop = true;
-        } else {
-            grnState.nodeColoring.bottomDataSameAsTop = false;
-            grnState.nodeColoring.bottomDataset = selection;
-        }
-        updateApp(grnState);
+    $(BOTTOM_DATASET_SELECTION_MENU).click((event) => {
+        const selection = event.target.dataset.expression;
+        updateBottomDatasetSelection(selection);
     });
 
     $(AVG_REPLICATE_VALS_BOTTOM_SIDEBAR).change(() => {

package/web-client/public/js/setup-load-and-import-handlers.js

@@ -1,212 +1,238 @@
 import { updateApp } from "./update-app";
 
 import {
-  DEMO_INFORMATION,
-  UNWEIGHTED_DEMO_PATH,
-  WEIGHTED_DEMO_PATH,
-  SCHADE_INPUT_PATH,
-  SCHADE_OUTPUT_PATH,
-  WEIGHTED_DEMO_NAME,
-  UNWEIGHTED_DEMO_NAME,
-  SCHADE_INPUT_NAME,
-  SCHADE_OUTPUT_NAME,
+    DEMO_INFORMATION,
+    UNWEIGHTED_DEMO_PATH,
+    WEIGHTED_DEMO_PATH,
+    SCHADE_INPUT_PATH,
+    SCHADE_OUTPUT_PATH,
+    WEIGHTED_DEMO_NAME,
+    UNWEIGHTED_DEMO_NAME,
+    SCHADE_INPUT_NAME,
+    SCHADE_OUTPUT_NAME,
+    PPI_DEMO_PATH,
+    PPI_DEMO_NAME,
+    FORCE_GRAPH,
+    NETWORK_PPI_MODE,
+    NETWORK_GRN_MODE
 } from "./constants";
 import { getWorkbookFromForm, getWorkbookFromUrl } from "./api/grnsight-api";
 
+
 const demoFiles = [
-  UNWEIGHTED_DEMO_PATH,
-  WEIGHTED_DEMO_PATH,
-  SCHADE_INPUT_PATH,
-  SCHADE_OUTPUT_PATH,
+    UNWEIGHTED_DEMO_PATH,
+    WEIGHTED_DEMO_PATH,
+    SCHADE_INPUT_PATH,
+    SCHADE_OUTPUT_PATH,
+    PPI_DEMO_PATH
 ];
 
 const submittedFilename = ($upload) => {
-  let path = $upload.val();
-  let fakePathCheck = path.search("\\\\") + 1;
+    let path = $upload.val();
+    let fakePathCheck = path.search("\\\\") + 1;
 
-  while (fakePathCheck) {
-    path = path.substring(fakePathCheck);
-    fakePathCheck = path.search("\\\\") + 1;
-  }
+    while (fakePathCheck) {
+        path = path.substring(fakePathCheck);
+        fakePathCheck = path.search("\\\\") + 1;
+    }
 
-  return path;
+    return path;
 };
 
 const createFileForm = ($upload) => {
-  const formData = new FormData();
-  formData.append("file", $upload[0].files[0]);
-  return formData;
+    const formData = new FormData();
+    formData.append("file", $upload[0].files[0]);
+    return formData;
 };
 
 const uploadEpilogue = (event) => {
-  if (window.ga) {
-    window.ga("send", "pageview", {
-      page: "/GRNsight/upload",
-      sessionControl: "start",
-    });
-  }
+    if (window.ga) {
+        window.ga("send", "pageview", {
+            page: "/GRNsight/upload",
+            sessionControl: "start",
+        });
+    }
 
-  $("a.upload > input[type=file]").val("");
-  event.preventDefault();
+    $("a.upload > input[type=file]").val("");
+    event.preventDefault();
 };
 const disableUpload = (state) => {
-  $(".upload").attr("disabled", state);
-  $(".upload-sif").attr("disabled", state);
-  $(".upload-graphml").attr("disabled", state);
+    $(".upload").attr("disabled", state);
+    $(".upload-sif").attr("disabled", state);
+    $(".upload-graphml").attr("disabled", state);
 };
 
 const uploadHandler = (uploader) => {
-  return function(event) {
-    // Must be `function` due to use of `this`.
-    const $upload = $(this);
-    const filename = submittedFilename($upload); // TODO: remove before master release (beta@4.0.6)
-    if ($upload[0].files[0].size < 2000000) {
-      // disable upload button to prevent multiple uploads
-      disableUpload(true);
-      const formData = createFileForm($upload);
-      uploader(filename, formData);
-      uploadEpilogue(event);
-    } else {
-      let errorString =
-        "The file uploaded is too large. Please try again with a file smaller than 1 MB.";
-      $("#error").html(errorString);
-      $("#errorModal").modal("show");
-    }
-  };
+    return function (event) {
+        // Must be `function` due to use of `this`.
+        const $upload = $(this);
+        const filename = submittedFilename($upload); // TODO: remove before master release (beta@4.0.6)
+        if ($upload[0].files[0].size < 2000000) {
+            // disable upload button to prevent multiple uploads
+            disableUpload(true);
+            const formData = createFileForm($upload);
+            uploader(filename, formData);
+            uploadEpilogue(event);
+        } else {
+            let errorString =
+                "The file uploaded is too large. Please try again with a file smaller than 1 MB.";
+            $("#error").html(errorString);
+            $("#errorModal").modal("show");
+        }
+    };
 };
 
 const workbookErrorDisplayer = (xhr) => {
-  // re-enable upload button
-  disableUpload(false);
-  // Deleted status, error for argument because it was never used
-  const err = JSON.parse(xhr.responseText);
-  let errorString = "Your graph failed to load.<br><br>";
-
-  if (!err.errors) {
-    // will be falsy if an error was thrown before the workbook was generated
-    errorString += err;
-  } else {
-    errorString = err.errors.reduce(
-      (currentErrorString, currentError) =>
-        `${currentErrorString}${currentError.possibleCause} ${currentError.suggestedFix}<br><br>`,
-
-      errorString
-    );
-  }
+    // re-enable upload button
+    disableUpload(false);
+    // Deleted status, error for argument because it was never used
+    const err = JSON.parse(xhr.responseText);
+    let errorString = "Your graph failed to load.<br><br>";
+
+    if (!err.errors) {
+        // will be falsy if an error was thrown before the workbook was generated
+        errorString += err;
+    } else {
+        errorString = err.errors.reduce(
+            (currentErrorString, currentError) =>
+                `${currentErrorString}${currentError.possibleCause} ${currentError.suggestedFix}<br><br>`,
 
-  $("#error").html(errorString);
-  $("#errorModal").modal("show");
+            errorString
+        );
+    }
+
+    $("#error").html(errorString);
+    $("#errorModal").modal("show");
 };
 
-let reloader = () => {};
+let reloader = () => { };
 
 const returnUploadRoute = (filename) => {
-  if (demoFiles.indexOf(filename) !== -1) {
-    return filename;
-  } else if (filename.includes(".xlsx")) {
-    return "upload";
-  } else if (filename.includes(".sif")) {
-    return "upload-sif";
-  } else if (filename.includes(".graphml")) {
-    return "upload-graphml";
-  }
+    if (demoFiles.indexOf(filename) !== -1) {
+        return filename;
+    } else if (filename.includes(".xlsx")) {
+        return "upload";
+    } else if (filename.includes(".sif")) {
+        return "upload-sif";
+    } else if (filename.includes(".graphml")) {
+        return "upload-graphml";
+    }
 };
 
 export const setupLoadAndImportHandlers = (grnState) => {
-  const loadGrn = (name, formData) => {
-    const uploadRoute = returnUploadRoute(name);
-    // The presence of formData is taken to indicate a POST.
-    getWorkbookFromForm(formData, uploadRoute)
-      .done((workbook, textStatus, jqXhr) => {
-        grnState.name = name || jqXhr.getResponseHeader("X-GRNsight-Filename");
-        if (demoFiles.indexOf(name) > -1) {
-          switch (name) {
-            case WEIGHTED_DEMO_PATH:
-              grnState.name = WEIGHTED_DEMO_NAME;
-              break;
-            case UNWEIGHTED_DEMO_PATH:
-              grnState.name = UNWEIGHTED_DEMO_NAME;
-              break;
-            case SCHADE_INPUT_PATH:
-              grnState.name = SCHADE_INPUT_NAME;
-              break;
-            case SCHADE_OUTPUT_PATH:
-              grnState.name = SCHADE_OUTPUT_NAME;
-          }
-        }
-        grnState.workbook = workbook;
-        grnState.workbook.expressionNames = Object.keys(workbook.expression);
-        if (uploadRoute !== "upload") {
-          grnState.annotateLinks();
-        }
-        reloader = () => loadGrn(name, formData);
-        // re-enable upload button
-        disableUpload(false);
-        updateApp(grnState);
-        // displayStatistics(workbook);
-      })
-      .error(workbookErrorDisplayer);
-  };
-  /*
-   * Thanks to http://stackoverflow.com/questions/6974684/how-to-send-formdata-objects-with-ajax-requests-in-jquery
-   * for helping to resolve this.
-   */
-
-  // $(".upload").change(uploadHandler(loadGrn));
-  $("body").on("change", ".upload", uploadHandler(loadGrn));
-  const loadDemo = (url, value) => {
-    $("#demoSourceDropdown option[value='" + value.substring(1) + "']").prop(
-      "selected",
-      true
+    const loadGrn = (name, formData) => {
+        const uploadRoute = returnUploadRoute(name);
+        // The presence of formData is taken to indicate a POST.
+        getWorkbookFromForm(formData, uploadRoute)
+            .done((workbook, textStatus, jqXhr) => {
+                grnState.name = name || jqXhr.getResponseHeader("X-GRNsight-Filename");
+                if (demoFiles.indexOf(name) > -1) {
+                    switch (name) {
+                    case WEIGHTED_DEMO_PATH:
+                        grnState.name = WEIGHTED_DEMO_NAME;
+                        break;
+                    case UNWEIGHTED_DEMO_PATH:
+                        grnState.name = UNWEIGHTED_DEMO_NAME;
+                        break;
+                    case SCHADE_INPUT_PATH:
+                        grnState.name = SCHADE_INPUT_NAME;
+                        break;
+                    case SCHADE_OUTPUT_PATH:
+                        grnState.name = SCHADE_OUTPUT_NAME;
+                        break;
+                    case PPI_DEMO_PATH:
+                        grnState.name = PPI_DEMO_NAME;
+                        break;
+                    }
+                }
+                grnState.workbook = workbook;
+
+                if (grnState.name.includes(".sif")) {
+                    grnState.mode = workbook.workbookType;
+                } else if (grnState.name.includes(".graphml")) {
+                    grnState.mode = NETWORK_GRN_MODE;
+                } else {
+                    grnState.mode = workbook.meta.data.workbookType;
+                }
+                grnState.workbook.expressionNames = Object.keys(workbook.expression);
+                if (uploadRoute !== "upload") {
+                    grnState.annotateLinks();
+                }
+                reloader = () => loadGrn(name, formData);
+                // re-enable upload button
+                disableUpload(false);
+                updateApp(grnState);
+                // displayStatistics(workbook);
+            })
+            .error(workbookErrorDisplayer);
+    };
+    /*
+     * Thanks to http://stackoverflow.com/questions/6974684/how-to-send-formdata-objects-with-ajax-requests-in-jquery
+     * for helping to resolve this.
+     */
+
+    // $(".upload").change(uploadHandler(loadGrn));
+    $("body").on("change", ".upload", uploadHandler(loadGrn));
+    const loadDemo = (url, value) => {
+        $("#demoSourceDropdown option[value='" + value.substring(1) + "']").prop(
+            "selected",
+            true
+        );
+        loadGrn(url);
+        reloader = () => loadGrn(url);
+        grnState.graphLayout = FORCE_GRAPH;
+        $("a.upload > input[type=file]").val("");
+    };
+
+    const initializeDemoFile = (demoClass, demoPath, demoName) => {
+        $(".dropdown-menu li a").on("click", (event) => {
+            const selected = event.target.dataset.expression;
+            if (`.${selected}` === demoClass) {
+                loadDemo(demoPath, demoClass, demoName);
+            }
+        });
+        $("#demoSourceDropdown").on("change", () => {
+            const selected = `.${$("#demoSourceDropdown").val()}`;
+            if (selected === demoClass) {
+                loadDemo(demoPath, demoClass, demoName);
+            }
+        });
+    };
+
+    DEMO_INFORMATION.forEach((demoInfo) =>
+        initializeDemoFile.apply(null, demoInfo)
     );
-    loadGrn(url);
-    reloader = () => loadGrn(url);
 
-    $("a.upload > input[type=file]").val("");
-  };
-
-  const initializeDemoFile = (demoClass, demoPath, demoName) => {
-    // Deleted parameter `event`
-    $(demoClass).on("click", () => {
-      loadDemo(demoPath, demoClass, demoName);
-    });
-    $("#demoSourceDropdown").on("change", () => {
-      const selected = `.${$("#demoSourceDropdown").val()}`;
-      if (selected === demoClass) {
-        loadDemo(demoPath, demoClass, demoName);
-      }
+    $("body").on("click", ".reload", function () {
+        // Deleted `event` parameter but need `function` because of `this`.
+        if (
+            !$(this)
+                .parent()
+                .hasClass("disabled")
+        ) {
+            if ($.isFunction(reloader)) {
+                reloader();
+            }
+        }
     });
-  };
-
-  DEMO_INFORMATION.forEach((demoInfo) =>
-    initializeDemoFile.apply(null, demoInfo)
-  );
-
-  $("body").on("click", ".reload", function() {
-    // Deleted `event` parameter but need `function` because of `this`.
-    if (
-      !$(this)
-        .parent()
-        .hasClass("disabled")
-    ) {
-      if ($.isFunction(reloader)) {
-        reloader();
-      }
-    }
-  });
 };
 
 export const responseCustomWorkbookData = (grnState, queryURL, name) => {
-  const uploadRoute = queryURL;
-  getWorkbookFromUrl(uploadRoute).done((workbook) => {
-    grnState.name = name;
-    grnState.workbook = workbook;
-    // Reset the node coloring dataset selection
-    grnState.nodeColoring.topDataset = undefined;
-    grnState.nodeColoring.bottomDataset = undefined;
-    grnState.annotateLinks();
-    disableUpload(false);
-    updateApp(grnState);
-    reloader = () => responseCustomWorkbookData(grnState, queryURL, name);
-  });
+    const uploadRoute = queryURL;
+    getWorkbookFromUrl(uploadRoute).done((workbook) => {
+        if (workbook.meta.data.workbookType === NETWORK_PPI_MODE) {
+            grnState.mode = workbook.meta.data.workbookType;
+        } else {
+            grnState.mode = NETWORK_GRN_MODE;
+        }
+        grnState.name = name;
+        grnState.workbook = workbook;
+        // Reset the node coloring dataset selection
+        grnState.nodeColoring.topDataset = grnState.defaultDataset;
+        grnState.nodeColoring.bottomDataset = grnState.defaultDataset;
+        grnState.annotateLinks();
+        disableUpload(false);
+        updateApp(grnState);
+        reloader = () => responseCustomWorkbookData(grnState, queryURL, name);
+    });
 };