Skip to content

Commit aece5c9

Browse files
moriondo2022moriondo2022
authored
Merge pull request #1015 from broadinstitute/sysbio-more-fixes
Sysbio more fixes
2 parents c9d57bd + 9750bc7 commit aece5c9

File tree

5 files changed

+57
-45
lines changed

5 files changed

+57
-45
lines changed

‎src/portals/SysBio/components/BulkTable.vue‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -365,10 +365,7 @@ export default Vue.component("bulk-table", {
365365
async findGene(gene){
366366
console.log("Finding" + gene);
367367
// Populate the subtable before toggling it open
368-
let dataItem = this.bulkData.find(g => g.gene === gene);
369-
if (!dataItem){
370-
return;
371-
}
368+
this.$emit("geneFound", false);
372369
//await this.getSubtable(dataItem);
373370
let location = this.allGenes.indexOf(gene);
374371
console.log(JSON.stringify(this.allGenes[0]));
@@ -377,6 +374,7 @@ export default Vue.component("bulk-table", {
377374
}
378375
let page = Math.floor(location / this.perPage) + 1;
379376
this.currentPage = page;
377+
this.$emit("geneFound", true);
380378
}
381379
},
382380
watch: {

‎src/portals/SysBio/components/BulkVolcanoPlot.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -394,7 +394,7 @@ export default Vue.component("bulk-volcano-plot", {
394394
.append('circle')
395395
.attr('cx', this.x(d.value.x))
396396
.attr('cy', this.y(d.value.y))
397-
.attr('r', 2)
397+
.attr('r', 5)
398398
.style('fill', fillColor)
399399
.attr("id", (d.key))
400400
.attr("class", this.dataToClass(d.value));

‎src/portals/SysBio/views/BulkBrowser/Template.vue‎

Lines changed: 48 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -75,42 +75,35 @@
7575
</div>
7676
</div>
7777
</div>
78-
<div class="tabs-group">
78+
</div>
79+
</div>
80+
<div v-if="$parent.dataReady">
81+
<div class="flex-gap" id="visualizers">
82+
<!--left tab group-->
83+
<div class="tabs-group volcano">
7984
<div class="tabs-wrapper">
8085
<div class="tab">
81-
Search for a gene
86+
Differentially Expressed Genes
8287
</div>
8388
</div>
84-
<div class="tabs-section-wrapper">
85-
<div class="tab-section">
89+
<div class="tabs-section-wrapper row" id="diff-exp-menu">
90+
<div class="col-md-3"></div>
91+
<div class="col-md-3 menu-item">
92+
<div class="label">Search for a gene</div>
8693
<gene-selectpicker @onGeneChange="gene => $parent.highlight(gene)">
8794
</gene-selectpicker>
8895
</div>
89-
</div>
90-
</div>
91-
<div class="tabs-group">
92-
<div class="tabs-wrapper">
93-
<div class="tab">
94-
Set -log10(FDR adj. p) threshold
95-
</div>
96-
</div>
97-
<div class="tabs-section-wrapper">
98-
<div class="tab-section">
99-
<input type="number" step="0.1" class="form-control"
96+
<div class="col-md-3 menu-item">
97+
<div class="label">Set -log1-(FDR adj. P) threshold</div>
98+
<input type="number" step="0.1" class="form-control"
10099
:value=$parent.volcanoYCondition
101100
@change="event => $parent.setVolcano(event.target.value)"/>
102101
</div>
102+
<div class="col-md-3"></div>
103103
</div>
104-
</div>
105-
</div>
106-
</div>
107-
<div v-if="$parent.dataReady">
108-
<div class="flex-gap" id="visualizers">
109-
<!--left tab group-->
110-
<div class="tabs-group volcano">
111-
<div class="tabs-wrapper">
112-
<div class="tab">
113-
Differentially Expressed Genes
104+
<div class="tabs-section-wrapper">
105+
<div class="gene-not-found" v-if="!$parent.foundGene">
106+
Gene not found.
114107
</div>
115108
</div>
116109
<div class="tabs-section-wrapper">
@@ -137,20 +130,20 @@
137130
</div>
138131
</div>
139132
</div>
140-
</div>
141-
<div id="table-wrapper" class="flex-gap flex-column">
142-
<div class="flex-gap flex-column">
143-
<bulk-table
144-
:bulkData="$parent.bulkData19K"
145-
146-
:dataset="$store.state.selectedDataset"
147-
:config="$parent.tableConfig"
148-
:scatterConfig="$parent.scatterplotConfig"
149-
:highlightedGene="$store.state.selectedGene"
150-
:regulationConditions="$parent.regulationConditions">
151-
</bulk-table>
152-
</div>
153-
</div>
133+
</div>
134+
<div id="table-wrapper" class="flex-gap flex-column">
135+
<div class="flex-gap flex-column">
136+
<bulk-table
137+
:bulkData="$parent.bulkData19K"
138+
@geneFound="v => $parent.geneFound(v)"
139+
:dataset="$store.state.selectedDataset"
140+
:config="$parent.tableConfig"
141+
:scatterConfig="$parent.scatterplotConfig"
142+
:highlightedGene="$store.state.selectedGene"
143+
:regulationConditions="$parent.regulationConditions">
144+
</bulk-table>
145+
</div>
146+
</div>
154147
<div class="flex-gap" id="enrichr-legend" v-if="$parent.enrichrReady && $parent.dataReady">
155148
<div class="tabs-group">
156149
<div class="tabs-wrapper">
@@ -452,6 +445,7 @@ button.hide-table {
452445
}
453446
.volcano {
454447
width: 100%;
448+
background-color: white;
455449
}
456450
.top-menu-item {
457451
max-width: 25%;
@@ -473,4 +467,19 @@ button.hide-table {
473467
#gene-box {
474468
padding: 10px !important;
475469
}
470+
#diff-exp-menu {
471+
padding: 20px;
472+
margin: 20px;
473+
background-color: #efefef;
474+
border-radius: 5px;
475+
}
476+
#diff-exp-menu > .menu-item {
477+
font-size: larger;
478+
}
479+
.gene-not-found {
480+
margin: 20px;
481+
padding: 20px;
482+
border: 1px solid goldenrod;
483+
background-color: gold;
484+
}
476485
</style>

‎src/portals/SysBio/views/BulkBrowser/main.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@ new Vue({
4747
data() {
4848
return {
4949
loading: true,
50+
foundGene: false,
5051
dataReady: false,
5152
enrichrReady: false,
5253
tableHidden: false,
@@ -352,6 +353,10 @@ new Vue({
352353
getClass(library){
353354
let libraryName = library["Gene-set Library"];
354355
return this.enrichrLibrary === libraryName ? "selected-library" : "";
356+
},
357+
geneFound(found){
358+
console.log("Gene found?", found);
359+
this.foundGene = found;
355360
}
356361
},
357362
watch: {

‎src/portals/SysBio/views/BulkBrowser/store.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ export default new Vuex.Store({
7171
for (const [k, v] of Object.entries(comparisons)){
7272
let comptype = Array.from(v.label.matchAll(compTypeFinder))
7373
.map(a => a[1])
74-
.join(" vs. ");
74+
.join(" vs ");
7575
v.type = comptype;
7676
let ampAndCellType = v.label.split(":");
7777
v.amp = ampAndCellType[0];

0 commit comments

Comments
 (0)