Added Javascript code to get connected nodes on edge tap

Added shinyPCViz prototype code

DESCRIPTION

@@ -1,6 +1,6 @@
 Package: rcytoscapejs
 Title: Cytoscape JS HTMLWidgets
-Version: 0.0.6
+Version: 0.0.7
 Authors@R: person("Augustin", "Luna", email="[email protected]", role=c("aut", "cre"))
 Description: HTMLWidgets package for CytoscapeJS.
 License: file LICENSE

inst/examples/shinyPCViz/.gitignore

@@ -0,0 +1 @@
+rsconnect

inst/examples/shinyPCViz/cbioportal_top1.sif

@@ -0,0 +1,62 @@
+Camptothecin	DRUG_TARGET	TOP1
+SRSF11	INTERACTS_WITH	SRSF1
+SRSF11	REACTS_WITH	SRSF1
+SFPQ	INTERACTS_WITH	TOP1
+Irinotecan	DRUG_TARGET	TOP1
+SUMO1	INTERACTS_WITH	TOP1
+TP53	METABOLIC_CATALYSIS	CASP6
+SRSF11	IN_SAME_COMPONENT	SRSF1
+Topotecan	DRUG_TARGET	TOP1
+CASP3	INTERACTS_WITH	TOP1
+CSNK2A1	INTERACTS_WITH	JUN
+Sodium stibogluconate	DRUG_TARGET	TOP1
+TOPORS	INTERACTS_WITH	TOP1
+Lucanthone	DRUG_TARGET	TOP1
+CASP3	STATE_CHANGE	CASP6
+Irinotecan	DRUG_TARGET	TOP1
+Topotecan	DRUG_TARGET	TOP1
+Irinotecan	DRUG_TARGET	TOP1
+SRSF11	INTERACTS_WITH	TOP1
+Aclarubicin	DRUG_TARGET	TOP1
+TDP1	INTERACTS_WITH	TOP1
+CSNK2A1	INTERACTS_WITH	TP53
+TP53	INTERACTS_WITH	NCL
+SUMO1	INTERACTS_WITH	JUN
+SRSF1	INTERACTS_WITH	TOP1
+NCL	INTERACTS_WITH	CSNK2A1
+CSNK2A1	STATE_CHANGE	JUN
+Edotecarin	DRUG_TARGET	TOP1
+TP53	INTERACTS_WITH	TOP1
+JUN	CO_CONTROL	TP53
+Tenifatecan	DRUG_TARGET	TOP1
+UBE2I	INTERACTS_WITH	TP53
+JUN	METABOLIC_CATALYSIS	TP53
+TOPORS	INTERACTS_WITH	SUMO1
+Topotecan	DRUG_TARGET	TOP1
+TOPORS	INTERACTS_WITH	UBE2I
+CASP6	INTERACTS_WITH	CASP3
+UBE2I	INTERACTS_WITH	SUMO1
+UBE2I	INTERACTS_WITH	JUN
+Belotecan	DRUG_TARGET	TOP1
+BTBD1	INTERACTS_WITH	TOP1
+TP53	INTERACTS_WITH	BTBD2
+Lurtotecan	DRUG_TARGET	TOP1
+FSHR	INTERACTS_WITH	TOP1
+NCOA6	INTERACTS_WITH	TOP1
+JUN	INTERACTS_WITH	TOP1
+Rubitecan	DRUG_TARGET	TOP1
+SUMO1	INTERACTS_WITH	TP53
+Exatecan	DRUG_TARGET	TOP1
+SRSF1	REACTS_WITH	SRSF11
+Cositecan	DRUG_TARGET	TOP1
+NCL	INTERACTS_WITH	TOP1
+TP53	CO_CONTROL	JUN
+SRSF1	IN_SAME_COMPONENT	SRSF11
+CASP6	INTERACTS_WITH	TOP1
+BTBD2	INTERACTS_WITH	TOP1
+UBE2I	INTERACTS_WITH	TOP1
+Irinotecan	DRUG_TARGET	TOP1
+Topotecan	DRUG_TARGET	TOP1
+Camptothecin	DRUG_TARGET	TOP1
+TOP1	INTERACTS_WITH	CSNK2A1
+TOPORS	INTERACTS_WITH	TP53

inst/examples/shinyPCViz/server.R

@@ -0,0 +1,89 @@
+library(rcytoscapejs)
+library(paxtoolsr)
+library(DT)
+
+shinyServer(function(input, output, session) {
+  # NOTE: Reactive variables used as functions networkReactive()
+  networkReactive <- reactive({
+    shiny::validate(
+      need(!is.null(input$sifFile), "SIF Missing")
+    )
+
+    inFile <- input$sifFile
+
+    network <- read.table(inFile$datapath, sep="\t", stringsAsFactors=FALSE)
+    colnames(network) <- c("source", "interaction", "target")
+
+    sif <- network
+    colnames(sif) <- c("PARTICIPANT_A", "INTERACTION_TYPE", "PARTICIPANT_B")
+
+    #maxInteractions <-  input$maxInteractions
+    maxInteractions <- 50
+
+    if(nrow(network) <= maxInteractions) {
+      maxInteractions <- nrow(network)
+    } else {
+      maxInteractions <- maxInteractions
+    }
+
+    network <- network[1:maxInteractions, ]
+
+    edgeList <- network[, c("source","target")]
+
+    nodes <- unique(c(edgeList$source, edgeList$target))
+
+    id <- nodes
+    name <- nodes
+    addLinks <- TRUE
+
+    if(addLinks) {
+      href <- paste0("https://www.google.com/search?q=", nodes)
+      tooltip <- paste0("Node: ", nodes)
+      nodeData <- data.frame(id, name, href, tooltip, stringsAsFactors=FALSE)
+    } else {
+      nodeData <- data.frame(id, name, stringsAsFactors=FALSE)
+    }
+
+    nodeData$color <- rep("#888888", nrow(nodeData))
+    nodeData$color[which(grepl("[a-z]", nodes))] <- "#FF0000"
+
+    nodeData$shape <- rep("ellipse", nrow(nodeData))
+    nodeData$shape[which(grepl("[a-z]", nodes))] <- "octagon"
+
+    edgeData <- edgeList
+
+    tmp <- list(nodeData=nodeData, edgeData=edgeData, sif=sif)
+
+    return(tmp)
+  })
+
+  output$clickedNode = renderPrint({
+    input$clickedNode
+  })
+
+  output$clickedEdge = renderPrint({
+    network <- networkReactive()
+
+    t1 <- input$clickedEdge
+    t2 <- data.frame(a=t1[1], b=t1[2], stringsAsFactors=FALSE)
+
+    shiny::validate(
+      need(!is.null(input$clickedEdge), "NULL")
+    )
+
+    #str(t1)
+    #str(t2)
+
+    sif <- filterSif(network$sif, edgelist=t2)
+    #str(sif$INTERACTION_TYPE)
+
+    unique(sif$INTERACTION_TYPE)
+  })
+
+  output$plot <- renderRcytoscapejs({
+    network <- networkReactive()
+
+    cyNetwork <- createCytoscapeJsNetwork(network$nodeData, network$edgeData)
+    rcytoscapejs(nodeEntries=cyNetwork$nodes, edgeEntries=cyNetwork$edges, highlightConnectedNodes=FALSE)
+  })
+})

inst/examples/shinyPCViz/ui.R

@@ -0,0 +1,24 @@
+library(rcytoscapejs)
+library(shiny)
+
+shinyUI(navbarPage("Shiny PCViz",
+  tabPanel("Network",
+    sidebarLayout(
+      sidebarPanel(
+        fileInput('sifFile', 'Choose SIF File', accept=c('.sif')),
+        hr(),
+        h4("Hover Node"),
+        textOutput("clickedNode"),
+        hr(),
+        h4("Clicked Interaction Type"),
+        textOutput("clickedEdge"),
+        width=3
+      ),
+      mainPanel(
+        rcytoscapejsOutput("plot", height="600px")
+      )
+    )
+  ),
+  tags$head(tags$script(src="cyjs.js"))
+))
+

inst/examples/shinyPCViz/www/cyjs.js

@@ -0,0 +1,25 @@
+// Wait for cy to be defined and then add event listener
+$(document).ready(function() {
+  Shiny.addCustomMessageHandler("saveImage",
+    function(message) {
+      //console.log("saveImage");
+
+      var result = cy.png(); 
+      //Shiny.onInputChange("imgContent", result);
+      console.log("imgContent: " + result);
+
+      // From: http://stackoverflow.com/questions/25087009/trigger-a-file-download-on-click-of-button-javascript-with-contents-from-dom
+      dl = document.createElement('a');
+      document.body.appendChild(dl);
+      dl.download = "download.png";
+      dl.href = result;
+      dl.click();
+    }
+  );
+});
+
+Shiny.addCustomMessageHandler("testMessage",
+  function(message) {
+    alert(JSON.stringify(message));
+  }
+);

inst/htmlwidgets/rcytoscapejs.js

@@ -172,6 +172,44 @@ HTMLWidgets.widget({
                   });
                 }
 
+                cy.on('tap', 'edge', function (event) {
+                  var edgeHighlighted = this.hasClass("highlighted");
+                  console.log(edgeHighlighted);
+                  var nodes = this.connectedNodes();
+
+                  console.log("nodes");
+                  console.log(nodes);
+                  console.log("ID 1:" + nodes[0]._private.data.id);
+                  console.log("ID 2:" + nodes[1]._private.data.id);
+
+                  var keys = [nodes[0]._private.data.id, nodes[1]._private.data.id];
+
+                  Shiny.onInputChange("clickedEdge", keys);
+                  console.log("break");
+
+                  /*
+                  var globalnodes = instance.cy.nodes();
+                  var selected = [];
+                  for (var i = 0; i < globalnodes.length; i++) {
+                      if (globalnodes[i].hasClass("highlighted")) {
+                          selected.push(globalnodes[i]._private.ids);
+                      }
+                  }
+
+                  //console.log(globalnodes);
+                  console.log(selected);
+
+                  var keys = [];
+                  for (var i = 0; i < selected.length; i++) {
+                      var kk = selected[i];
+                      for (var k in kk) keys.push(k);
+                  }
+                  */
+
+                  console.log("keys" + keys);
+                  Shiny.onInputChange("edgeConnectedNodes", keys);
+                });
+
                 cy.on('mouseover', 'node', function (event) {
                     var node = this;
                     Shiny.onInputChange("clickedNode", this._private.data.id);