diff --git a/package.json b/package.json index 3960251c..04376345 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,7 @@ "react-scripts": "5.0.1", "react-table": "^7.7.0", "react-tooltip": "^5.11.2", + "react-youtube": "^10.1.0", "redux": "^4.0.1", "redux-thunk": "^2.3.0", "tocbot": "^4.25.0", diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/ADRNL.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/ADRNL.jsx index b3af2372..1365bec4 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/ADRNL.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/ADRNL.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisAdrenal() { // initialize table of contents @@ -83,63 +84,10 @@ function GraphicalAnalysisAdrenal() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

- +

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/BAT.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/BAT.jsx index a2a24c6a..5cebe2b5 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/BAT.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/BAT.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisBrownAdipose() { // initialize table of contents @@ -84,63 +85,10 @@ function GraphicalAnalysisBrownAdipose() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

- +

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/BLOOD.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/BLOOD.jsx index c557989b..d811913a 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/BLOOD.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/BLOOD.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisBlood() { // initialize table of contents @@ -79,63 +80,10 @@ function GraphicalAnalysisBlood() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

- +

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/COLON.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/COLON.jsx index d306a336..55d13101 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/COLON.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/COLON.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisColon() { // initialize table of contents @@ -79,63 +80,10 @@ function GraphicalAnalysisColon() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/CORTEX.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/CORTEX.jsx index afe25a3d..d2d5f2ac 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/CORTEX.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/CORTEX.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisCortex() { // initialize table of contents @@ -80,63 +81,7 @@ function GraphicalAnalysisCortex() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HEART.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HEART.jsx index 8e9c1c1a..74b2d915 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HEART.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HEART.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisHeart() { // initialize table of contents @@ -79,63 +80,10 @@ function GraphicalAnalysisHeart() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HIPPOC.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HIPPOC.jsx index 7b17dc46..dc9129fa 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HIPPOC.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HIPPOC.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisHippocampus() { // initialize table of contents @@ -84,63 +85,10 @@ function GraphicalAnalysisHippocampus() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HYPOTH.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HYPOTH.jsx index 0a0e86af..cb74d76a 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HYPOTH.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/HYPOTH.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisHypothalamus() { // initialize table of contents @@ -81,63 +82,7 @@ function GraphicalAnalysisHypothalamus() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+
diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/KIDNEY.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/KIDNEY.jsx index 300fc084..3a685360 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/KIDNEY.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/KIDNEY.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisKidney() { // initialize table of contents @@ -77,63 +78,10 @@ function GraphicalAnalysisKidney() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

- +

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/LIVER.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/LIVER.jsx index e63f9793..7bdfbcf4 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/LIVER.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/LIVER.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisLiver() { // initialize table of contents @@ -77,63 +78,10 @@ function GraphicalAnalysisLiver() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/LUNG.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/LUNG.jsx index 3cd1e9db..02ef3519 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/LUNG.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/LUNG.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisLung() { // initialize table of contents @@ -73,63 +74,10 @@ function GraphicalAnalysisLung() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/PLASMA.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/PLASMA.jsx index ee05dd3f..d3a07112 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/PLASMA.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/PLASMA.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisPlasma() { // initialize table of contents @@ -75,63 +76,7 @@ function GraphicalAnalysisPlasma() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SKM_GN.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SKM_GN.jsx index 7a35917f..a1aa3605 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SKM_GN.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SKM_GN.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisGastrocnemius() { // initialize table of contents @@ -85,63 +86,10 @@ function GraphicalAnalysisGastrocnemius() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SKM_VL.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SKM_VL.jsx index 4f33eb3a..f8bd1f9b 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SKM_VL.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SKM_VL.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisVastusLateralis() { // initialize table of contents @@ -79,63 +80,10 @@ function GraphicalAnalysisVastusLateralis() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SMLINT.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SMLINT.jsx index 844d09d0..ed2f7dad 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SMLINT.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SMLINT.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisSmallIntestine() { // initialize table of contents @@ -79,63 +80,10 @@ function GraphicalAnalysisSmallIntestine() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SPLEEN.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SPLEEN.jsx index e01b5ec7..4d4477eb 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SPLEEN.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/SPLEEN.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisSpleen() { // initialize table of contents @@ -75,63 +76,10 @@ function GraphicalAnalysisSpleen() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/WAT_SC.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/WAT_SC.jsx index 634c15af..54b35841 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/WAT_SC.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bLandscapeTissues/WAT_SC.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringLandscapeImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function GraphicalAnalysisWhiteAdipose() { // initialize table of contents @@ -81,63 +82,10 @@ function GraphicalAnalysisWhiteAdipose() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/ADRNL.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/ADRNL.jsx index 3e412303..bac29682 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/ADRNL.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/ADRNL.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisAdrenal() { // initialize table of contents @@ -82,63 +83,10 @@ function MitoGraphicalAnalysisAdrenal() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/BAT.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/BAT.jsx index 955df441..f159c06c 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/BAT.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/BAT.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisBrownAdipose() { // initialize table of contents @@ -82,63 +83,10 @@ function MitoGraphicalAnalysisBrownAdipose() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/BLOOD.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/BLOOD.jsx index 9160e58e..149805ff 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/BLOOD.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/BLOOD.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisBlood() { // initialize table of contents @@ -82,63 +83,10 @@ function MitoGraphicalAnalysisBlood() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/COLON.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/COLON.jsx index 9d495388..46675911 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/COLON.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/COLON.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisColon() { // initialize table of contents @@ -78,63 +79,10 @@ function MitoGraphicalAnalysisColon() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/HEART.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/HEART.jsx index 007e26d6..9de142ed 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/HEART.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/HEART.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisHeart() { // initialize table of contents @@ -79,63 +80,10 @@ function MitoGraphicalAnalysisHeart() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/KIDNEY.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/KIDNEY.jsx index 6a3b0261..446f20b3 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/KIDNEY.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/KIDNEY.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisKidney() { // initialize table of contents @@ -78,63 +79,10 @@ function MitoGraphicalAnalysisKidney() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/LIVER.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/LIVER.jsx index 1db867b0..0039a952 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/LIVER.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/LIVER.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisLiver() { // initialize table of contents @@ -79,63 +80,10 @@ function MitoGraphicalAnalysisLiver() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/LUNG.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/LUNG.jsx index 1c674b67..00382f8b 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/LUNG.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/LUNG.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisLung() { // initialize table of contents @@ -71,63 +72,10 @@ function MitoGraphicalAnalysisLung() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected nodes

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SKM_GN.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SKM_GN.jsx index f7586911..80fb463b 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SKM_GN.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SKM_GN.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisGastrocnemius() { // initialize table of contents @@ -82,63 +83,10 @@ function MitoGraphicalAnalysisGastrocnemius() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SKM_VL.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SKM_VL.jsx index 7bbefc10..69c8345c 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SKM_VL.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SKM_VL.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisVastusLateralis() { // initialize table of contents @@ -82,63 +83,10 @@ function MitoGraphicalAnalysisVastusLateralis() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SMLINT.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SMLINT.jsx index 0aa7efe7..d8f50933 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SMLINT.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SMLINT.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisSmallIntestine() { // initialize table of contents @@ -82,63 +83,10 @@ function MitoGraphicalAnalysisSmallIntestine() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected nodes

@@ -154,7 +102,6 @@ function MitoGraphicalAnalysisSmallIntestine() { tissue="Small Intestine" plotType="Pathway" clusterName="1w_F1_M0" - />

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SPLEEN.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SPLEEN.jsx index 5be3f80f..80a96e6c 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SPLEEN.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/SPLEEN.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisSpleen() { // initialize table of contents @@ -78,63 +79,7 @@ function MitoGraphicalAnalysisSpleen() {

-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/WAT_SC.jsx b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/WAT_SC.jsx index 0ae16ad9..3cdaa601 100644 --- a/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/WAT_SC.jsx +++ b/src/AnalysisPage/GraphicalClustering/Pass1bMitoTissues/WAT_SC.jsx @@ -5,6 +5,7 @@ import { pass1b06GraphicalClusteringMitoImageLocation, } from '../sharedLib'; import DataVizLink from '../components/dataVizLink'; +import PathwayNetworkDescription from '../components/pathwayNetworkDescription'; function MitoGraphicalAnalysisWhiteAdipose() { // initialize table of contents @@ -82,63 +83,10 @@ function MitoGraphicalAnalysisWhiteAdipose() {
-

- Detailed view of selected clusters -

-

- Here we show highlighted trees, top pathway enrichments, network - view of all pathway enrichments, and sample-level - trajectories for each selected cluster (node, edge, or path). -

-

- Interactive networks of pathway enrichments -

-

- These networks summarize all significant pathway enrichments for a - set of differential analytes. Results from all omes are combined. -

-

- Each node is a pathway. Hover over a node to see the pathway name - (and parent pathway in parentheses), nominal enrichment p-value, - datasets in which this pathway was significantly enriched, and the - union of genes at the intersection of the input features and - pathway members. Larger nodes indicate that more datasets (e.g. - METAB;SKM-GN) were significantly enriched for this pathway.{' '} - - Pathways only enriched with metabolites are not shown because - edges are defined using genes, not KEGG IDs. - -

-

- Edges are drawn between nodes if there is a substantial overlap in - the intersection of the input features and pathway members for - both pathways. Hover over an edge to see the similarity score and - list of genes in the intersection. -

-

- Nodes are colored to visually separate groups of related pathway - enrichments. Each group has a label (rectangular node), which - corresponds to the most frequently occurring parent pathway in the - group. These labels are meant to help summarize groups of related - pathway enrichments. -

-

Explore these interactive plots!

-
    -
  • - Hover over nodes (pathways) and edges (intersection between - pathways) to see more information -
    -
    • -
  • - Click nodes to highlight them and connected edges -
    -
    • -
  • - Zoom in and out -
    -
    • -
  • Click and drag nodes
    • -
+

Selected paths

diff --git a/src/AnalysisPage/GraphicalClustering/components/pathwayNetworkDescription.jsx b/src/AnalysisPage/GraphicalClustering/components/pathwayNetworkDescription.jsx new file mode 100644 index 00000000..a6fb32cb --- /dev/null +++ b/src/AnalysisPage/GraphicalClustering/components/pathwayNetworkDescription.jsx @@ -0,0 +1,94 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import ExternalLink from '../../../lib/ui/externalLink'; + +function PathwayNetworkDescription({ tissue, clusterName }) { + const tissueParam = tissue && tissue.length ? `tissues[${tissue}]=1&` : ''; + const clusterParam = clusterName && clusterName.length ? `&cluster=${clusterName}` : ''; + const url = `https://data-viz.motrpac-data.org/?${tissueParam}plot_type=Pathway${clusterParam}`; + + return ( + <> +

Detailed view of selected clusters

+

+ Use the + {' '} + + {' '} + to explore multi-omic trajectories, top pathway enrichments, network + view of + {' '} + all + {' '} + pathway enrichments, and sample-level trajectories for each + selected cluster (node, edge, or path). +

+

+ Interactive networks of pathway enrichments +

+

+ The interactive networks available through the visualization tool + summarize all significant pathway enrichments for a set of + differential analytes. Results from all omes can be visualized. +

+

+ Each node is a pathway. + {' '} + Hover over a node to see the pathway name (and parent pathway in + parentheses), nominal enrichment p-value, datasets in which this + pathway was significantly enriched, and the union of genes at the + intersection of the input features and pathway members. Larger + nodes indicate that more datasets were significantly enriched for + this pathway. Pathways only enriched with metabolites are not + shown because network edges are defined using genes, not KEGG IDs. +

+

+ Edges + {' '} + are drawn between nodes if there is a substantial overlap in + the intersection of the input features and pathway members for + both pathways. Hover over an edge to see the similarity score and + list of genes in the intersection. +

+

+ Colors + {' '} + are applied to nodes to visually separate groups of related + pathway enrichments. Each group has a label, which corresponds + to the most frequently occurring parent pathway in the group. These + labels are meant to help summarize groups of related pathway + enrichments. +

+

+ +

+
    +
  • + Hover over nodes (pathways) and edges (intersection between + pathways) to see more information +
    • +
  • Click nodes to highlight them and connected edges
    • +
  • Zoom in and out
    • +
  • Click and drag nodes to adjust network visualization
    • +
+ + ); +} + +PathwayNetworkDescription.propTypes = { + tissue: PropTypes.string, + clusterName: PropTypes.string, +}; + +PathwayNetworkDescription.defaultProps = { + tissue: null, + clusterName: null, +}; + +export default PathwayNetworkDescription; diff --git a/src/LandingPage/landingPage.jsx b/src/LandingPage/landingPage.jsx index 1c608187..c017403b 100644 --- a/src/LandingPage/landingPage.jsx +++ b/src/LandingPage/landingPage.jsx @@ -1,10 +1,11 @@ -import React, { useCallback, useState, useRef } from 'react'; +import React, { useCallback, useState } from 'react'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import { Redirect, Link } from 'react-router-dom'; import { Helmet } from 'react-helmet'; import VisNetworkReactComponent from 'vis-network-react'; import { useMediaQuery } from 'react-responsive'; +import YouTube from 'react-youtube'; import Footer from '../Footer/footer'; import PromoteBanner from './promoteBanner'; import landingPageStructuredData from '../lib/searchStructuredData/landingPage'; @@ -14,7 +15,6 @@ import LogoMotrpacWhite from '../assets/logo-motrpac-white.png'; import BackgroundVideoImage from '../assets/LandingPageGraphics/background_video_preload.jpg'; import LayerRunner from '../assets/LandingPageGraphics/Data_Layer_Runner.png'; import RatFigurePaass1b from '../assets/LandingPageGraphics/rat-figure-pass1b.svg'; -import LandscapeAbstract from '../assets/LandingPageGraphics/landscape_abstract.gif'; import NatureIssueCover from '../assets/LandingPageGraphics/nature_issue_cover.jpg'; import BackgroundVideo from './components/backgroundVideo'; import Figure1C from './components/figure1c'; @@ -144,7 +144,6 @@ export function LandingPage({ isAuthenticated, profile }) { const [backgroundVideoLoaded, setBackgroundVideoLoaded] = useState(false); const [data, setData] = useState(figure4eData); const [networkNodes, setNetwortNodes] = useState([]); - const iframeRef = useRef(null); const isMobile = useMediaQuery({ query: '(max-width: 768px)' }); const handleAddNode = useCallback(() => { @@ -180,6 +179,22 @@ export function LandingPage({ isAuthenticated, profile }) { }; } + // youtube video player configuration + const onPlayerReady = (event) => { + // access to player in all event handlers via event.target + event.target.pauseVideo(); + }; + + const opts = { + height: '390', + width: '640', + playerVars: { + // https://developers.google.com/youtube/player_parameters + autoplay: 0, + cc_load_policy: 1, + }, + }; + return (
@@ -352,12 +367,13 @@ export function LandingPage({ isAuthenticated, profile }) { className="embedContainer embed-responsive embed-responsive-16by9" id="tutorial-video-iframe-container" > -