diff --git a/css/loom.css b/css/loom.css index c18f1d0..9c014e7 100644 --- a/css/loom.css +++ b/css/loom.css @@ -47,7 +47,10 @@ code { a { cursor: pointer; } - +.sparkline-label { + vertical-align: super; + margin-left: 5px; +} .scrollable-menu { height: auto; max-height: 200px; diff --git a/js/heatmap-sidepanel.js b/js/heatmap-sidepanel.js index 2555fa1..af9d744 100644 --- a/js/heatmap-sidepanel.js +++ b/js/heatmap-sidepanel.js @@ -22,13 +22,13 @@ export class HeatmapSidepanel extends Component { rowAttr: name })}>{name}; }); - var showOptionsForRows = ["Text", "Bars", "Quantitative", "Categorical"].map((name)=> { + var showOptionsForRows = ["Text", "Bars", "Heatmap", "Categorical"].map((name)=> { return
  • dispatch({ type: 'SET_HEATMAP_PROPS', rowMode: name })}>{name}
  • ; }); - var showOptionsForCols = ["Text", "Bars", "Quantitative", "Categorical"].map((name)=> { + var showOptionsForCols = ["Text", "Bars", "Heatmap", "Categorical"].map((name)=> { return
  • dispatch({ type: 'SET_HEATMAP_PROPS', colMode: name diff --git a/js/landscape-sidepanel.js b/js/landscape-sidepanel.js index 6c714db..7336c50 100644 --- a/js/landscape-sidepanel.js +++ b/js/landscape-sidepanel.js @@ -87,7 +87,7 @@ export class LandscapeSidepanel extends Component {
    diff --git a/js/loom.js b/js/loom.js index f868621..819b3fc 100644 --- a/js/loom.js +++ b/js/loom.js @@ -19,7 +19,8 @@ class App extends Component { render() { // Injected by connect() call: const dispatch = this.props.dispatch; - + const ds = this.props.dataState; + var view =
    ; switch(this.props.viewState.view) { @@ -53,15 +54,15 @@ class App extends Component { onColorModeChange={(mode)=>dispatch({type: 'SET_LANDSCAPE_COLOR_MODE', mode: mode})} onColorGeneChange={(gene)=>{ dispatch({type: 'SET_LANDSCAPE_COLOR_GENE', gene: gene}); - dispatch(fetchGene(this.props.fileInfo.rowAttrs, gene)); + dispatch(fetchGene(this.props.fileInfo.rowAttrs, gene, ds.genes)); }} onXGeneChange={(gene)=>{ dispatch({type: 'SET_LANDSCAPE_X_GENE', gene: gene}); - dispatch(fetchGene(this.props.fileInfo.rowAttrs, gene)); + dispatch(fetchGene(this.props.fileInfo.rowAttrs, gene, ds.genes)); }} onYGeneChange={(gene)=>{ dispatch({type: 'SET_LANDSCAPE_Y_GENE', gene: gene}); - dispatch(fetchGene(this.props.fileInfo.rowAttrs, gene)); + dispatch(fetchGene(this.props.fileInfo.rowAttrs, gene, ds.genes)); }} /> break; diff --git a/js/reducers.js b/js/reducers.js index 16a0731..7197d08 100644 --- a/js/reducers.js +++ b/js/reducers.js @@ -18,10 +18,10 @@ function viewState(state=initialViewState, action) { const initialSparklineState = { type: "SET_SPARKLINE_PROPS", // This will be set to the last action type - colAttr: "Tissue", - colMode: "Categorical", + colAttr: "CellID", + colMode: "Text", orderByAttr: "(unordered)", // meaning, original order - geneMode: "Quantitative", + geneMode: "Heatmap", genes: "" } @@ -40,8 +40,8 @@ const initialLandscapeState = { xGene: "", yCoordinate: "_tSNE2", yGene: "", - colorAttr: "Tissue", - colorMode: "Categorical", + colorAttr: "CellID", + colorMode: "Heatmap", colorGene: "" } diff --git a/js/scatterplot.js b/js/scatterplot.js index 8dd9820..9ac3240 100644 --- a/js/scatterplot.js +++ b/js/scatterplot.js @@ -46,7 +46,7 @@ export class Scatterplot extends React.Component { var ymin = Math.min(...y); var ymax = Math.max(...y); var color = this.props.color; - var palette = (this.props.colorMode == "Quantitative" ? colors.solar9 : colors.category20); + var palette = (this.props.colorMode == "Heatmap" ? colors.solar9 : colors.category20); // Calculate the color scale if(color.length == 0) { diff --git a/js/sparkline-sidepanel.js b/js/sparkline-sidepanel.js index a5d20b1..43a0662 100644 --- a/js/sparkline-sidepanel.js +++ b/js/sparkline-sidepanel.js @@ -36,7 +36,7 @@ export class SparklineSidepanel extends Component {
  • ); }); - var optionsForCols = ["Text", "Bars", "Quantitative", "Categorical"].map((name)=> { + var optionsForCols = ["Text", "Bars", "Heatmap", "Categorical"].map((name)=> { return (
  • dispatch({ @@ -48,7 +48,7 @@ export class SparklineSidepanel extends Component {
  • ); }); - var optionsForGenes = ["Bars", "Quantitative"].map((name)=> { + var optionsForGenes = ["Bars", "Heatmap"].map((name)=> { return (
  • dispatch({ diff --git a/js/sparkline-view.js b/js/sparkline-view.js index 1466563..36e41f0 100644 --- a/js/sparkline-view.js +++ b/js/sparkline-view.js @@ -46,7 +46,7 @@ export class SparklineView extends Component { screenRange={[0,600]} mode={ss.geneMode} /> - {gene} + {gene} ); } else { @@ -85,7 +85,7 @@ export class SparklineView extends Component { screenRange={[0,600]} mode={ss.colMode} /> - {ss.colAttr} + {ss.colAttr}
    {geneSparklines}
    diff --git a/js/sparkline.js b/js/sparkline.js index 138f429..49f25dc 100644 --- a/js/sparkline.js +++ b/js/sparkline.js @@ -184,7 +184,7 @@ export class Sparkline extends React.Component { if(this.props.mode == 'Bars') { painter = new BarPainter(this.props.data, width/10); } - if(this.props.mode == 'Quantitative') { + if(this.props.mode == 'Heatmap') { painter = new QuantitativePainter(); } painter.paint(context, width, height, Math.max(Math.floor(pixelsPer), 1), yoffset, data);