Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add cxttap and mouseout events #152

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
+633 −15
Open

Add cxttap and mouseout events #152

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2223d26
Fix missing package.json
eai-oen Aug 20, 2021
af237a9
Add cxttap, mouseout events
eai-oen Aug 20, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions R/cytoCytoscape.R
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
# AUTO GENERATED FILE - DO NOT EDIT

cytoCytoscape <- function(id=NULL, autoRefreshLayout=NULL, autolock=NULL, autoungrabify=NULL, autounselectify=NULL, boxSelectionEnabled=NULL, className=NULL, elements=NULL, generateImage=NULL, imageData=NULL, layout=NULL, maxZoom=NULL, minZoom=NULL, mouseoverEdgeData=NULL, mouseoverNodeData=NULL, pan=NULL, panningEnabled=NULL, responsive=NULL, selectedEdgeData=NULL, selectedNodeData=NULL, style=NULL, stylesheet=NULL, tapEdge=NULL, tapEdgeData=NULL, tapNode=NULL, tapNodeData=NULL, userPanningEnabled=NULL, userZoomingEnabled=NULL, zoom=NULL, zoomingEnabled=NULL) {
cytoCytoscape <- function(id=NULL, autoRefreshLayout=NULL, autolock=NULL, autoungrabify=NULL, autounselectify=NULL, boxSelectionEnabled=NULL, className=NULL, cxtTapEdge=NULL, cxtTapEdgeData=NULL, cxtTapNode=NULL, cxtTapNodeData=NULL, elements=NULL, generateImage=NULL, imageData=NULL, layout=NULL, maxZoom=NULL, minZoom=NULL, mouseoutEdgeData=NULL, mouseoutNodeData=NULL, mouseoverEdgeData=NULL, mouseoverNodeData=NULL, pan=NULL, panningEnabled=NULL, responsive=NULL, selectedEdgeData=NULL, selectedNodeData=NULL, style=NULL, stylesheet=NULL, tapEdge=NULL, tapEdgeData=NULL, tapNode=NULL, tapNodeData=NULL, userPanningEnabled=NULL, userZoomingEnabled=NULL, zoom=NULL, zoomingEnabled=NULL) {

props <- list(id=id, autoRefreshLayout=autoRefreshLayout, autolock=autolock, autoungrabify=autoungrabify, autounselectify=autounselectify, boxSelectionEnabled=boxSelectionEnabled, className=className, elements=elements, generateImage=generateImage, imageData=imageData, layout=layout, maxZoom=maxZoom, minZoom=minZoom, mouseoverEdgeData=mouseoverEdgeData, mouseoverNodeData=mouseoverNodeData, pan=pan, panningEnabled=panningEnabled, responsive=responsive, selectedEdgeData=selectedEdgeData, selectedNodeData=selectedNodeData, style=style, stylesheet=stylesheet, tapEdge=tapEdge, tapEdgeData=tapEdgeData, tapNode=tapNode, tapNodeData=tapNodeData, userPanningEnabled=userPanningEnabled, userZoomingEnabled=userZoomingEnabled, zoom=zoom, zoomingEnabled=zoomingEnabled)
props <- list(id=id, autoRefreshLayout=autoRefreshLayout, autolock=autolock, autoungrabify=autoungrabify, autounselectify=autounselectify, boxSelectionEnabled=boxSelectionEnabled, className=className, cxtTapEdge=cxtTapEdge, cxtTapEdgeData=cxtTapEdgeData, cxtTapNode=cxtTapNode, cxtTapNodeData=cxtTapNodeData, elements=elements, generateImage=generateImage, imageData=imageData, layout=layout, maxZoom=maxZoom, minZoom=minZoom, mouseoutEdgeData=mouseoutEdgeData, mouseoutNodeData=mouseoutNodeData, mouseoverEdgeData=mouseoverEdgeData, mouseoverNodeData=mouseoverNodeData, pan=pan, panningEnabled=panningEnabled, responsive=responsive, selectedEdgeData=selectedEdgeData, selectedNodeData=selectedNodeData, style=style, stylesheet=stylesheet, tapEdge=tapEdge, tapEdgeData=tapEdgeData, tapNode=tapNode, tapNodeData=tapNodeData, userPanningEnabled=userPanningEnabled, userZoomingEnabled=userZoomingEnabled, zoom=zoom, zoomingEnabled=zoomingEnabled)
if (length(props) > 0) {
props <- props[!vapply(props, is.null, logical(1))]
}
component <- list(
props = props,
type = 'Cytoscape',
namespace = 'dash_cytoscape',
propNames = c('id', 'autoRefreshLayout', 'autolock', 'autoungrabify', 'autounselectify', 'boxSelectionEnabled', 'className', 'elements', 'generateImage', 'imageData', 'layout', 'maxZoom', 'minZoom', 'mouseoverEdgeData', 'mouseoverNodeData', 'pan', 'panningEnabled', 'responsive', 'selectedEdgeData', 'selectedNodeData', 'style', 'stylesheet', 'tapEdge', 'tapEdgeData', 'tapNode', 'tapNodeData', 'userPanningEnabled', 'userZoomingEnabled', 'zoom', 'zoomingEnabled'),
propNames = c('id', 'autoRefreshLayout', 'autolock', 'autoungrabify', 'autounselectify', 'boxSelectionEnabled', 'className', 'cxtTapEdge', 'cxtTapEdgeData', 'cxtTapNode', 'cxtTapNodeData', 'elements', 'generateImage', 'imageData', 'layout', 'maxZoom', 'minZoom', 'mouseoutEdgeData', 'mouseoutNodeData', 'mouseoverEdgeData', 'mouseoverNodeData', 'pan', 'panningEnabled', 'responsive', 'selectedEdgeData', 'selectedNodeData', 'style', 'stylesheet', 'tapEdge', 'tapEdgeData', 'tapNode', 'tapNodeData', 'userPanningEnabled', 'userZoomingEnabled', 'zoom', 'zoomingEnabled'),
package = 'dashCytoscape'
)

148 changes: 145 additions & 3 deletions dash_cytoscape/Cytoscape.py
View file
Original file line number Diff line number Diff line change
@@ -38,6 +38,140 @@ class Cytoscape(Component):
Sets the class name of the element (the value of an element's html
class attribute).
- cxtTapEdge (dict; optional):
The complete edge dictionary returned when you two-finger tap or
right-click it. Read-only.
`cxtTapEdge` is a dict with keys:
- classes (string; optional):
General item (for all elements).
- data (dict; optional):
General item (for all elements).
- grabbable (boolean; optional):
General item (for all elements).
- group (string; optional):
General item (for all elements).
- isLoop (boolean; optional):
Edge-specific item.
- isSimple (boolean; optional):
Edge-specific item.
- locked (boolean; optional):
General item (for all elements).
- midpoint (dict; optional):
Edge-specific item.
- selectable (boolean; optional):
General item (for all elements).
- selected (boolean; optional):
General item (for all elements).
- sourceData (dict; optional):
Edge-specific item.
- sourceEndpoint (dict; optional):
Edge-specific item.
- style (dict; optional):
General item (for all elements).
- targetData (dict; optional):
Edge-specific item.
- targetEndpoint (dict; optional):
Edge-specific item.
- timeStamp (number; optional):
Edge-specific item.
- cxtTapEdgeData (dict; optional):
The data dictionary of an edge returned when you two-finger tap or
right-click it. Read-only.
- cxtTapNode (dict; optional):
The complete node dictionary returned when you two-finger tap or
right-click it. Read-only.
`cxtTapNode` is a dict with keys:
- ancestorsData (dict | list; optional):
Item for compound nodes.
- childrenData (dict | list; optional):
Item for compound nodes.
- classes (string; optional):
General item (for all elements).
- data (dict; optional):
General item (for all elements).
- descendantsData (dict | list; optional):
Item for compound nodes.
- edgesData (list; optional):
node specific item.
- grabbable (boolean; optional):
General item (for all elements).
- group (string; optional):
General item (for all elements).
- isChild (boolean; optional):
Item for compound nodes.
- isChildless (boolean; optional):
Item for compound nodes.
- isOrphan (boolean; optional):
Item for compound nodes.
- isParent (boolean; optional):
Item for compound nodes.
- locked (boolean; optional):
General item (for all elements).
- parentData (dict | list; optional):
Item for compound nodes.
- position (dict; optional):
General item (for all elements).
- relativePosition (dict; optional):
Item for compound nodes.
- renderedPosition (dict; optional):
node specific item.
- selectable (boolean; optional):
General item (for all elements).
- selected (boolean; optional):
General item (for all elements).
- siblingsData (dict | list; optional):
Item for compound nodes.
- style (dict; optional):
General item (for all elements).
- timeStamp (number; optional):
node specific item.
- cxtTapNodeData (dict; optional):
The data dictionary of a node returned when you two-finger tap or
right-click it. Read-only.
- elements (list of dicts; optional):
A list of dictionaries representing the elements of the networks.
Each dictionary describes an element, and specifies its purpose.
@@ -216,6 +350,14 @@ class attribute).
A minimum bound on the zoom level of the graph. The viewport can
not be scaled smaller than this zoom level.
- mouseoutEdgeData (dict; optional):
The data dictionary of an edge returned when you hover out of it.
Read-only.
- mouseoutNodeData (dict; optional):
The data dictionary of a node returned when you hover out of it.
Read-only.
- mouseoverEdgeData (dict; optional):
The data dictionary of an edge returned when you hover over it.
Read-only.
@@ -428,12 +570,12 @@ class attribute).
Whether zooming the graph is enabled (i.e., the zoom level of the
graph is mutable overall)."""
@_explicitize_args
def __init__(self, id=Component.UNDEFINED, className=Component.UNDEFINED, style=Component.UNDEFINED, elements=Component.UNDEFINED, stylesheet=Component.UNDEFINED, layout=Component.UNDEFINED, pan=Component.UNDEFINED, zoom=Component.UNDEFINED, panningEnabled=Component.UNDEFINED, userPanningEnabled=Component.UNDEFINED, minZoom=Component.UNDEFINED, maxZoom=Component.UNDEFINED, zoomingEnabled=Component.UNDEFINED, userZoomingEnabled=Component.UNDEFINED, boxSelectionEnabled=Component.UNDEFINED, autoungrabify=Component.UNDEFINED, autolock=Component.UNDEFINED, autounselectify=Component.UNDEFINED, autoRefreshLayout=Component.UNDEFINED, tapNode=Component.UNDEFINED, tapNodeData=Component.UNDEFINED, tapEdge=Component.UNDEFINED, tapEdgeData=Component.UNDEFINED, mouseoverNodeData=Component.UNDEFINED, mouseoverEdgeData=Component.UNDEFINED, selectedNodeData=Component.UNDEFINED, selectedEdgeData=Component.UNDEFINED, generateImage=Component.UNDEFINED, imageData=Component.UNDEFINED, responsive=Component.UNDEFINED, **kwargs):
self._prop_names = ['id', 'autoRefreshLayout', 'autolock', 'autoungrabify', 'autounselectify', 'boxSelectionEnabled', 'className', 'elements', 'generateImage', 'imageData', 'layout', 'maxZoom', 'minZoom', 'mouseoverEdgeData', 'mouseoverNodeData', 'pan', 'panningEnabled', 'responsive', 'selectedEdgeData', 'selectedNodeData', 'style', 'stylesheet', 'tapEdge', 'tapEdgeData', 'tapNode', 'tapNodeData', 'userPanningEnabled', 'userZoomingEnabled', 'zoom', 'zoomingEnabled']
def __init__(self, id=Component.UNDEFINED, className=Component.UNDEFINED, style=Component.UNDEFINED, elements=Component.UNDEFINED, stylesheet=Component.UNDEFINED, layout=Component.UNDEFINED, pan=Component.UNDEFINED, zoom=Component.UNDEFINED, panningEnabled=Component.UNDEFINED, userPanningEnabled=Component.UNDEFINED, minZoom=Component.UNDEFINED, maxZoom=Component.UNDEFINED, zoomingEnabled=Component.UNDEFINED, userZoomingEnabled=Component.UNDEFINED, boxSelectionEnabled=Component.UNDEFINED, autoungrabify=Component.UNDEFINED, autolock=Component.UNDEFINED, autounselectify=Component.UNDEFINED, autoRefreshLayout=Component.UNDEFINED, tapNode=Component.UNDEFINED, tapNodeData=Component.UNDEFINED, tapEdge=Component.UNDEFINED, tapEdgeData=Component.UNDEFINED, cxtTapNode=Component.UNDEFINED, cxtTapNodeData=Component.UNDEFINED, cxtTapEdge=Component.UNDEFINED, cxtTapEdgeData=Component.UNDEFINED, mouseoverNodeData=Component.UNDEFINED, mouseoverEdgeData=Component.UNDEFINED, mouseoutNodeData=Component.UNDEFINED, mouseoutEdgeData=Component.UNDEFINED, selectedNodeData=Component.UNDEFINED, selectedEdgeData=Component.UNDEFINED, generateImage=Component.UNDEFINED, imageData=Component.UNDEFINED, responsive=Component.UNDEFINED, **kwargs):
self._prop_names = ['id', 'autoRefreshLayout', 'autolock', 'autoungrabify', 'autounselectify', 'boxSelectionEnabled', 'className', 'cxtTapEdge', 'cxtTapEdgeData', 'cxtTapNode', 'cxtTapNodeData', 'elements', 'generateImage', 'imageData', 'layout', 'maxZoom', 'minZoom', 'mouseoutEdgeData', 'mouseoutNodeData', 'mouseoverEdgeData', 'mouseoverNodeData', 'pan', 'panningEnabled', 'responsive', 'selectedEdgeData', 'selectedNodeData', 'style', 'stylesheet', 'tapEdge', 'tapEdgeData', 'tapNode', 'tapNodeData', 'userPanningEnabled', 'userZoomingEnabled', 'zoom', 'zoomingEnabled']
self._type = 'Cytoscape'
self._namespace = 'dash_cytoscape'
self._valid_wildcard_attributes = []
self.available_properties = ['id', 'autoRefreshLayout', 'autolock', 'autoungrabify', 'autounselectify', 'boxSelectionEnabled', 'className', 'elements', 'generateImage', 'imageData', 'layout', 'maxZoom', 'minZoom', 'mouseoverEdgeData', 'mouseoverNodeData', 'pan', 'panningEnabled', 'responsive', 'selectedEdgeData', 'selectedNodeData', 'style', 'stylesheet', 'tapEdge', 'tapEdgeData', 'tapNode', 'tapNodeData', 'userPanningEnabled', 'userZoomingEnabled', 'zoom', 'zoomingEnabled']
self.available_properties = ['id', 'autoRefreshLayout', 'autolock', 'autoungrabify', 'autounselectify', 'boxSelectionEnabled', 'className', 'cxtTapEdge', 'cxtTapEdgeData', 'cxtTapNode', 'cxtTapNodeData', 'elements', 'generateImage', 'imageData', 'layout', 'maxZoom', 'minZoom', 'mouseoutEdgeData', 'mouseoutNodeData', 'mouseoverEdgeData', 'mouseoverNodeData', 'pan', 'panningEnabled', 'responsive', 'selectedEdgeData', 'selectedNodeData', 'style', 'stylesheet', 'tapEdge', 'tapEdgeData', 'tapNode', 'tapNodeData', 'userPanningEnabled', 'userZoomingEnabled', 'zoom', 'zoomingEnabled']
self.available_wildcard_properties = []
_explicit_args = kwargs.pop('_explicit_args')
_locals = locals()
276 changes: 276 additions & 0 deletions dash_cytoscape/metadata.json
View file
Original file line number Diff line number Diff line change
@@ -762,6 +762,268 @@
"required": false,
"description": "The data dictionary of an edge returned when you tap or click it. Read-only."
},
"cxtTapNode": {
"type": {
"name": "exact",
"value": {
"edgesData": {
"name": "array",
"description": "node specific item",
"required": false
},
"renderedPosition": {
"name": "object",
"description": "node specific item",
"required": false
},
"timeStamp": {
"name": "number",
"description": "node specific item",
"required": false
},
"classes": {
"name": "string",
"description": "General item (for all elements)",
"required": false
},
"data": {
"name": "object",
"description": "General item (for all elements)",
"required": false
},
"grabbable": {
"name": "bool",
"description": "General item (for all elements)",
"required": false
},
"group": {
"name": "string",
"description": "General item (for all elements)",
"required": false
},
"locked": {
"name": "bool",
"description": "General item (for all elements)",
"required": false
},
"position": {
"name": "object",
"description": "General item (for all elements)",
"required": false
},
"selectable": {
"name": "bool",
"description": "General item (for all elements)",
"required": false
},
"selected": {
"name": "bool",
"description": "General item (for all elements)",
"required": false
},
"style": {
"name": "object",
"description": "General item (for all elements)",
"required": false
},
"ancestorsData": {
"name": "union",
"value": [
{
"name": "object"
},
{
"name": "array"
}
],
"description": "Item for compound nodes",
"required": false
},
"childrenData": {
"name": "union",
"value": [
{
"name": "object"
},
{
"name": "array"
}
],
"description": "Item for compound nodes",
"required": false
},
"descendantsData": {
"name": "union",
"value": [
{
"name": "object"
},
{
"name": "array"
}
],
"description": "Item for compound nodes",
"required": false
},
"parentData": {
"name": "union",
"value": [
{
"name": "object"
},
{
"name": "array"
}
],
"description": "Item for compound nodes",
"required": false
},
"siblingsData": {
"name": "union",
"value": [
{
"name": "object"
},
{
"name": "array"
}
],
"description": "Item for compound nodes",
"required": false
},
"isParent": {
"name": "bool",
"description": "Item for compound nodes",
"required": false
},
"isChildless": {
"name": "bool",
"description": "Item for compound nodes",
"required": false
},
"isChild": {
"name": "bool",
"description": "Item for compound nodes",
"required": false
},
"isOrphan": {
"name": "bool",
"description": "Item for compound nodes",
"required": false
},
"relativePosition": {
"name": "object",
"description": "Item for compound nodes",
"required": false
}
}
},
"required": false,
"description": "The complete node dictionary returned when you two-finger tap or right-click it. Read-only."
},
"cxtTapNodeData": {
"type": {
"name": "object"
},
"required": false,
"description": "The data dictionary of a node returned when you two-finger tap or right-click it. Read-only."
},
"cxtTapEdge": {
"type": {
"name": "exact",
"value": {
"isLoop": {
"name": "bool",
"description": "Edge-specific item",
"required": false
},
"isSimple": {
"name": "bool",
"description": "Edge-specific item",
"required": false
},
"midpoint": {
"name": "object",
"description": "Edge-specific item",
"required": false
},
"sourceData": {
"name": "object",
"description": "Edge-specific item",
"required": false
},
"sourceEndpoint": {
"name": "object",
"description": "Edge-specific item",
"required": false
},
"targetData": {
"name": "object",
"description": "Edge-specific item",
"required": false
},
"targetEndpoint": {
"name": "object",
"description": "Edge-specific item",
"required": false
},
"timeStamp": {
"name": "number",
"description": "Edge-specific item",
"required": false
},
"classes": {
"name": "string",
"description": "General item (for all elements)",
"required": false
},
"data": {
"name": "object",
"description": "General item (for all elements)",
"required": false
},
"grabbable": {
"name": "bool",
"description": "General item (for all elements)",
"required": false
},
"group": {
"name": "string",
"description": "General item (for all elements)",
"required": false
},
"locked": {
"name": "bool",
"description": "General item (for all elements)",
"required": false
},
"selectable": {
"name": "bool",
"description": "General item (for all elements)",
"required": false
},
"selected": {
"name": "bool",
"description": "General item (for all elements)",
"required": false
},
"style": {
"name": "object",
"description": "General item (for all elements)",
"required": false
}
}
},
"required": false,
"description": "The complete edge dictionary returned when you two-finger tap or right-click it. Read-only."
},
"cxtTapEdgeData": {
"type": {
"name": "object"
},
"required": false,
"description": "The data dictionary of an edge returned when you two-finger tap or right-click it. Read-only."
},
"mouseoverNodeData": {
"type": {
"name": "object"
@@ -776,6 +1038,20 @@
"required": false,
"description": "The data dictionary of an edge returned when you hover over it. Read-only."
},
"mouseoutNodeData": {
"type": {
"name": "object"
},
"required": false,
"description": "The data dictionary of a node returned when you hover out of it. Read-only."
},
"mouseoutEdgeData": {
"type": {
"name": "object"
},
"required": false,
"description": "The data dictionary of an edge returned when you hover out of it. Read-only."
},
"selectedNodeData": {
"type": {
"name": "array"
2 changes: 1 addition & 1 deletion dash_cytoscape/package-info.json → dash_cytoscape/package.json
View file
Original file line number Diff line number Diff line change
@@ -21,7 +21,7 @@
"build:js-dev-extra": "webpack --config webpack.dev.extra.config.js",
"build:js-extra": "webpack --config webpack.prod.extra.config.js",
"build:js-all": "npm run build:js && npm run build:js-dev && npm run build:js-dev-extra && npm run build:js-extra",
"build:backends": "dash-generate-components ./src/lib/components dash_cytoscape -p package-info.json --r-prefix 'cyto' --jl-prefix 'cyto'",
"build:backends": "dash-generate-components ./src/lib/components dash_cytoscape --r-prefix 'cyto' --jl-prefix 'cyto'",
"build:all": "npm run build:js-all && npm run build:backends",
"build:all-activated": "(. venv/bin/activate || venv\\scripts\\activate && npm run build:all)"
},
64 changes: 59 additions & 5 deletions man/cytoCytoscape.Rd
View file
Original file line number Diff line number Diff line change
@@ -12,11 +12,13 @@ A Component Library for Dash aimed at facilitating network visualization in Pyth
\usage{
cytoCytoscape(id=NULL, autoRefreshLayout=NULL, autolock=NULL,
autoungrabify=NULL, autounselectify=NULL,
boxSelectionEnabled=NULL, className=NULL, elements=NULL,
generateImage=NULL, imageData=NULL, layout=NULL,
maxZoom=NULL, minZoom=NULL, mouseoverEdgeData=NULL,
mouseoverNodeData=NULL, pan=NULL, panningEnabled=NULL,
responsive=NULL, selectedEdgeData=NULL,
boxSelectionEnabled=NULL, className=NULL, cxtTapEdge=NULL,
cxtTapEdgeData=NULL, cxtTapNode=NULL, cxtTapNodeData=NULL,
elements=NULL, generateImage=NULL, imageData=NULL,
layout=NULL, maxZoom=NULL, minZoom=NULL,
mouseoutEdgeData=NULL, mouseoutNodeData=NULL,
mouseoverEdgeData=NULL, mouseoverNodeData=NULL, pan=NULL,
panningEnabled=NULL, responsive=NULL, selectedEdgeData=NULL,
selectedNodeData=NULL, style=NULL, stylesheet=NULL,
tapEdge=NULL, tapEdgeData=NULL, tapNode=NULL,
tapNodeData=NULL, userPanningEnabled=NULL,
@@ -43,6 +45,54 @@ to select) is enabled. If enabled, the user must taphold to pan the graph.}
\item{className}{Character. Sets the class name of the element (the value of an element's html
class attribute).}
\item{cxtTapEdge}{Lists containing elements 'isloop', 'issimple', 'midpoint', 'sourcedata', 'sourceendpoint', 'targetdata', 'targetendpoint', 'timestamp', 'classes', 'data', 'grabbable', 'group', 'locked', 'selectable', 'selected', 'style'.
those elements have the following types:
- isloop (logical; optional): edge-specific item
- issimple (logical; optional): edge-specific item
- midpoint (named list; optional): edge-specific item
- sourcedata (named list; optional): edge-specific item
- sourceendpoint (named list; optional): edge-specific item
- targetdata (named list; optional): edge-specific item
- targetendpoint (named list; optional): edge-specific item
- timestamp (numeric; optional): edge-specific item
- classes (character; optional): general item (for all elements)
- data (named list; optional): general item (for all elements)
- grabbable (logical; optional): general item (for all elements)
- group (character; optional): general item (for all elements)
- locked (logical; optional): general item (for all elements)
- selectable (logical; optional): general item (for all elements)
- selected (logical; optional): general item (for all elements)
- style (named list; optional): general item (for all elements). The complete edge dictionary returned when you two-finger tap or right-click it. Read-only.}
\item{cxtTapEdgeData}{Named list. The data dictionary of an edge returned when you two-finger tap or right-click it. Read-only.}
\item{cxtTapNode}{Lists containing elements 'edgesdata', 'renderedposition', 'timestamp', 'classes', 'data', 'grabbable', 'group', 'locked', 'position', 'selectable', 'selected', 'style', 'ancestorsdata', 'childrendata', 'descendantsdata', 'parentdata', 'siblingsdata', 'isparent', 'ischildless', 'ischild', 'isorphan', 'relativeposition'.
those elements have the following types:
- edgesdata (unnamed list; optional): node specific item
- renderedposition (named list; optional): node specific item
- timestamp (numeric; optional): node specific item
- classes (character; optional): general item (for all elements)
- data (named list; optional): general item (for all elements)
- grabbable (logical; optional): general item (for all elements)
- group (character; optional): general item (for all elements)
- locked (logical; optional): general item (for all elements)
- position (named list; optional): general item (for all elements)
- selectable (logical; optional): general item (for all elements)
- selected (logical; optional): general item (for all elements)
- style (named list; optional): general item (for all elements)
- ancestorsdata (named list | unnamed list; optional): item for compound nodes
- childrendata (named list | unnamed list; optional): item for compound nodes
- descendantsdata (named list | unnamed list; optional): item for compound nodes
- parentdata (named list | unnamed list; optional): item for compound nodes
- siblingsdata (named list | unnamed list; optional): item for compound nodes
- isparent (logical; optional): item for compound nodes
- ischildless (logical; optional): item for compound nodes
- ischild (logical; optional): item for compound nodes
- isorphan (logical; optional): item for compound nodes
- relativeposition (named list; optional): item for compound nodes. The complete node dictionary returned when you two-finger tap or right-click it. Read-only.}
\item{cxtTapNodeData}{Named list. The data dictionary of a node returned when you two-finger tap or right-click it. Read-only.}
\item{elements}{List of lists containing elements 'group', 'data', 'position', 'selected', 'selectable', 'locked', 'grabbable', 'classes'.
those elements have the following types:
- group (character; optional): either 'nodes' or 'edges'. if not given, it's automatically inferred.
@@ -140,6 +190,10 @@ scaled larger than this zoom level.}
\item{minZoom}{Numeric. A minimum bound on the zoom level of the graph. The viewport can not be
scaled smaller than this zoom level.}
\item{mouseoutEdgeData}{Named list. The data dictionary of an edge returned when you hover out of it. Read-only.}
\item{mouseoutNodeData}{Named list. The data dictionary of a node returned when you hover out of it. Read-only.}
\item{mouseoverEdgeData}{Named list. The data dictionary of an edge returned when you hover over it. Read-only.}
\item{mouseoverNodeData}{Named list. The data dictionary of a node returned when you hover over it. Read-only.}
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -21,7 +21,7 @@
"build:js-dev-extra": "webpack --config webpack.dev.extra.config.js",
"build:js-extra": "webpack --config webpack.prod.extra.config.js",
"build:js-all": "npm run build:js && npm run build:js-dev && npm run build:js-dev-extra && npm run build:js-extra",
"build:backends": "dash-generate-components ./src/lib/components dash_cytoscape -p package-info.json --r-prefix 'cyto' --jl-prefix 'cyto'",
"build:backends": "dash-generate-components ./src/lib/components dash_cytoscape --r-prefix 'cyto' --jl-prefix 'cyto'",
"build:all": "npm run build:js-all && npm run build:backends",
"build:all-activated": "(. venv/bin/activate || venv\\scripts\\activate && npm run build:all)"
},
4 changes: 2 additions & 2 deletions src/DashCytoscape.jl
View file
Original file line number Diff line number Diff line change
@@ -5,7 +5,7 @@ using Dash
const resources_path = realpath(joinpath( @__DIR__, "..", "deps"))
const version = "0.3.0"

include("cyto_cytoscape.jl")
include("jl/cyto_cytoscape.jl")

function __init__()
DashBase.register_package(
@@ -16,7 +16,7 @@ function __init__()
[
DashBase.Resource(
relative_package_path = "dash_cytoscape.min.js",
external_url = "https://unpkg.com/dash-cytoscape@0.2.0/dash_cytoscape/dash_cytoscape.min.js",
external_url = "https://unpkg.com/dash-cytoscape@0.3.0/dash_cytoscape/dash_cytoscape.min.js",
dynamic = nothing,
async = nothing,
type = :js
146 changes: 146 additions & 0 deletions src/lib/components/Cytoscape.react.js
View file
Original file line number Diff line number Diff line change
@@ -229,6 +229,28 @@ class Cytoscape extends Component {
}
});

cy.on('cxttap', 'node', event => {
const nodeObject = this.generateNode(event);

if (typeof this.props.setProps === 'function') {
this.props.setProps({
cxtTapNode: nodeObject,
cxtTapNodeData: nodeObject.data
});
}
});

cy.on('cxttap', 'edge', event => {
const edgeObject = this.generateEdge(event);

if (typeof this.props.setProps === 'function') {
this.props.setProps({
cxtTapEdge: edgeObject,
cxtTapEdgeData: edgeObject.data
});
}
});

cy.on('mouseover', 'node', event => {
if (typeof this.props.setProps === 'function') {
this.props.setProps({
@@ -245,6 +267,22 @@ class Cytoscape extends Component {
}
});

cy.on('mouseout', 'node', event => {
if (typeof this.props.setProps === 'function') {
this.props.setProps({
mouseoutNodeData: event.target.data()
});
}
});

cy.on('mouseout', 'edge', event => {
if (typeof this.props.setProps === 'function') {
this.props.setProps({
mouseoutEdgeData: event.target.data()
});
}
});

cy.on('select', 'node', event => {
const ele = event.target;

@@ -840,6 +878,104 @@ Cytoscape.propTypes = {
*/
tapEdgeData: PropTypes.object,

/**
* The complete node dictionary returned when you two-finger tap or right-click it. Read-only.
*/
cxtTapNode: PropTypes.exact({
/** node specific item */
edgesData: PropTypes.array,
/** node specific item */
renderedPosition: PropTypes.object,
/** node specific item */
timeStamp: PropTypes.number,
/** General item (for all elements) */
classes: PropTypes.string,
/** General item (for all elements) */
data: PropTypes.object,
/** General item (for all elements) */
grabbable: PropTypes.bool,
/** General item (for all elements) */
group: PropTypes.string,
/** General item (for all elements) */
locked: PropTypes.bool,
/** General item (for all elements) */
position: PropTypes.object,
/** General item (for all elements) */
selectable: PropTypes.bool,
/** General item (for all elements) */
selected: PropTypes.bool,
/** General item (for all elements) */
style: PropTypes.object,
/** Item for compound nodes */
ancestorsData: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
/** Item for compound nodes */
childrenData: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
/** Item for compound nodes */
descendantsData: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
/** Item for compound nodes */
parentData: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
/** Item for compound nodes */
siblingsData: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
/** Item for compound nodes */
isParent: PropTypes.bool,
/** Item for compound nodes */
isChildless: PropTypes.bool,
/** Item for compound nodes */
isChild: PropTypes.bool,
/** Item for compound nodes */
isOrphan: PropTypes.bool,
/** Item for compound nodes */
relativePosition: PropTypes.object
}),

/**
* The data dictionary of a node returned when you two-finger tap or right-click it. Read-only.
*/
cxtTapNodeData: PropTypes.object,

/**
* The complete edge dictionary returned when you two-finger tap or right-click it. Read-only.
*/
cxtTapEdge: PropTypes.exact({
/** Edge-specific item */
isLoop: PropTypes.bool,
/** Edge-specific item */
isSimple: PropTypes.bool,
/** Edge-specific item */
midpoint: PropTypes.object,
/** Edge-specific item */
sourceData: PropTypes.object,
/** Edge-specific item */
sourceEndpoint: PropTypes.object,
/** Edge-specific item */
targetData: PropTypes.object,
/** Edge-specific item */
targetEndpoint: PropTypes.object,
/** Edge-specific item */
timeStamp: PropTypes.number,
/** General item (for all elements) */
classes: PropTypes.string,
/** General item (for all elements) */
data: PropTypes.object,
/** General item (for all elements) */
grabbable: PropTypes.bool,
/** General item (for all elements) */
group: PropTypes.string,
/** General item (for all elements) */
locked: PropTypes.bool,
/** General item (for all elements) */
selectable: PropTypes.bool,
/** General item (for all elements) */
selected: PropTypes.bool,
/** General item (for all elements) */
style: PropTypes.object
}),

/**
* The data dictionary of an edge returned when you two-finger tap or right-click it. Read-only.
*/
cxtTapEdgeData: PropTypes.object,

/**
* The data dictionary of a node returned when you hover over it. Read-only.
*/
@@ -850,6 +986,16 @@ Cytoscape.propTypes = {
*/
mouseoverEdgeData: PropTypes.object,

/**
* The data dictionary of a node returned when you hover out of it. Read-only.
*/
mouseoutNodeData: PropTypes.object,

/**
* The data dictionary of an edge returned when you hover out of it. Read-only.
*/
mouseoutEdgeData: PropTypes.object,

/**
* The list of data dictionaries of all selected nodes (e.g. using
* Shift+Click to select multiple nodes, or Shift+Drag to use box selection). Read-only.