paintbrush and intialize

This commit is contained in:
Colin Megill
2018-01-05 17:16:14 -08:00
parent b1cf549fd8
commit 5140020c08
7 changed files with 31 additions and 21 deletions
+1 -1
View File
@@ -61,7 +61,7 @@ const attemptCategoricalMetadataDeselection = (metadataField, value) => {
const initialize = () => { const initialize = () => {
return (dispatch, getState) => { return (dispatch, getState) => {
dispatch({type: "initialize started"}) dispatch({type: "initialize started"})
fetch(`${globals.API.prefix}${globals.API.version}cells`, { fetch(`${globals.API.prefix}${globals.API.version}initialize`, {
method: "get", method: "get",
headers: new Headers({ headers: new Headers({
'Content-Type': 'application/json' 'Content-Type': 'application/json'
+16 -1
View File
@@ -43,7 +43,7 @@ class App extends React.Component {
first request includes query straight off the url bar for now first request includes query straight off the url bar for now
*/ */
this.props.dispatch(actions.requestCells(window.location.search)) this.props.dispatch(actions.requestCells(window.location.search))
this.props.dispatch(actions.___hardcoded___requestGeneExpressionCountsPOST(window.location.search)) // this.props.dispatch(actions.___hardcoded___requestGeneExpressionCountsPOST(window.location.search))
} }
render() { render() {
@@ -69,6 +69,21 @@ class App extends React.Component {
<Categorical/> <Categorical/>
<div> <div>
<Graph/> <Graph/>
<button
style={{
fontSize: 14,
fontWeight: 400,
color: "#41633C",
padding: "10px 20px",
backgroundColor: "#B9D1B5",
border: "none",
borderRadius: 3,
cursor: "pointer",
}}
>
Reproject
</button>
<Continuous/> <Continuous/>
</div> </div>
<Expression/> <Expression/>
+4 -3
View File
@@ -46,13 +46,13 @@ class Category extends React.Component {
<span <span
onClick={this.handleColorChange.bind(this)} onClick={this.handleColorChange.bind(this)}
style={{ style={{
fontSize: 24, fontSize: 16,
marginLeft: 10, marginLeft: 10,
position: "relative", position: "relative",
top: 4, top: 2,
cursor: "pointer", cursor: "pointer",
}}> }}>
🎨 🖌️
</span> </span>
</p> </p>
<span <span
@@ -112,6 +112,7 @@ class Categories extends React.Component {
marginRight: 40, marginRight: 40,
flexShrink: 0 flexShrink: 0
}}> }}>
{ {
_.map(this.props.ranges, (value, key) => { _.map(this.props.ranges, (value, key) => {
const isColorField = key.includes("color") || key.includes("Color"); const isColorField = key.includes("color") || key.includes("Color");
-3
View File
@@ -22,13 +22,11 @@ import {
const metadata = state.cells.cells && state.cells.cells.data.metadata ? state.cells.cells.data.metadata : null; const metadata = state.cells.cells && state.cells.cells.data.metadata ? state.cells.cells.data.metadata : null;
const initializeRanges = state.initialize.data && state.initialize.data.data.ranges ? state.initialize.data.data.ranges : null; const initializeRanges = state.initialize.data && state.initialize.data.data.ranges ? state.initialize.data.data.ranges : null;
const initializeMetadata = state.initialize.data && state.initialize.data.data.metadata ? state.initialize.data.data.metadata : null;
return { return {
ranges, ranges,
metadata, metadata,
initializeRanges, initializeRanges,
initializeMetadata,
colorAccessor: state.controls.colorAccessor, colorAccessor: state.controls.colorAccessor,
colorScale: state.controls.colorScale, colorScale: state.controls.colorScale,
graphBrushSelection: state.controls.graphBrushSelection, graphBrushSelection: state.controls.graphBrushSelection,
@@ -74,7 +72,6 @@ class Continuous extends React.Component {
this.state.svg, this.state.svg,
this.state.ctx, this.state.ctx,
dimensions, dimensions,
nextProps.initializeMetadata, /* PERF this means brushes are always filtering on everything */
xscale, xscale,
height, height,
width, width,
+1 -2
View File
@@ -9,7 +9,6 @@ const drawAxes = (
svg, svg,
ctx, ctx,
dimensions, dimensions,
metadata,
xscale, xscale,
height, height,
width, width,
@@ -56,7 +55,7 @@ const drawAxes = (
.on("click", (d) => { handleColorAction(d.key) }) .on("click", (d) => { handleColorAction(d.key) })
.attr("class", styles.title) .attr("class", styles.title)
.attr("text-anchor", "start") .attr("text-anchor", "start")
.text(function(d) { return "description" in d ? d.description + " 🎨" : d.key + " 🎨"; }); .text(function(d) { return "description" in d ? d.description + " 🖌️" : d.key + " 🖌️"; });
// Add and store a brush for each axis. // Add and store a brush for each axis.
axes.append("g") axes.append("g")
+8 -10
View File
@@ -66,12 +66,12 @@ class DiffExp extends React.Component {
<span <span
onClick={this.handleGeneColorScaleClick(gene).bind(this)} onClick={this.handleGeneColorScaleClick(gene).bind(this)}
style={{ style={{
fontSize: 24, fontSize: 16,
cursor: "pointer", cursor: "pointer",
position: "relative", position: "relative",
top: 5, top: 2,
marginRight: 10 marginRight: 6
}}>🎨</span> }}>🖌️</span>
<span>{gene}</span> <span>{gene}</span>
</div> </div>
<p style={{ <p style={{
@@ -109,12 +109,12 @@ class DiffExp extends React.Component {
<span <span
onClick={this.handleGeneColorScaleClick(gene).bind(this)} onClick={this.handleGeneColorScaleClick(gene).bind(this)}
style={{ style={{
fontSize: 24, fontSize: 16,
cursor: "pointer", cursor: "pointer",
position: "relative", position: "relative",
top: 5, top: 2,
marginRight: 10 marginRight: 6
}}>🎨</span> }}>🖌️</span>
<span>{gene}</span> <span>{gene}</span>
</div> </div>
<p style={{ <p style={{
@@ -150,7 +150,6 @@ class DiffExp extends React.Component {
@connect((state) => { @connect((state) => {
return { return {
expression: state.expression.data,
currentCellSelection: state.controls.currentCellSelection, currentCellSelection: state.controls.currentCellSelection,
differential: state.differential differential: state.differential
} }
@@ -208,7 +207,6 @@ class Expression extends React.Component {
} }
render () { render () {
if ( if (
!this.props.expression ||
!this.props.differential !this.props.differential
) { ) {
return null return null
+1 -1
View File
@@ -12,7 +12,7 @@ const Controls = (state = {
continuousSelection: null, continuousSelection: null,
axesHaveBeenDrawn: false, axesHaveBeenDrawn: false,
__storedStateForCelllist1__: null, /* will need procedural control of brush ie., brush.extent https://bl.ocks.org/micahstubbs/3cda05ca68cba260cb81 */ __storedStateForCelllist1__: null, /* will need procedural control of brush ie., brush.extent https://bl.ocks.org/micahstubbs/3cda05ca68cba260cb81 */
__storedStateForCelllist1__: null, __storedStateForCelllist2__: null,
}, action) => { }, action) => {
switch (action.type) { switch (action.type) {
/********************************** /**********************************