Skip to content
Snippets Groups Projects
Commit 2cb08386 authored by Gervaise Henry's avatar Gervaise Henry :cowboy:
Browse files

Change donor pr scrnaseq data to strandlab s3

parent 8992cb37
1 merge request!12Develop
Pipeline #5508 failed
Hide whitespace changes
Inline Side-by-side
layouts/custom/hu.donor.deep.html
+ 190
− 190
View file @ 2cb08386
{{ partial "header.html" . }}
<div class="header">
<h1>{{ .Title }}</h1>
<h2>{{ .Description }}</h2>
</div>
<div class="content">
{{ .Content }}
</div>
<style>
.content {
margin: 0;
max-width: none;
}
.select {
float: top;
z-index: 1;
top: 0px;
background: #191818;
overflow-x: hidden;
padding: 8px 10px;
}
.columnS {
float: left;
text-align: center;
width: 50%;
}
.columnF {
float: left;
text-align: center;
width: 33.33%;
}
.row:after {
content: "";
display: table;
clear: both;
}
img {
max-width: 100%;
height: auto;
}
@media (max-width: 1000px) {
.columnS {
text-align: right;
width: 100%;
}
.columnF {
width: 100%;
}
br {
display: none;
}
}
</style>
<div class="content">
<div class="select">
<div class="columnS ui-widget">
<label for="gene" style="font-family:sans-serif; font-size:18px;"><b>Gene:</b></label>
<br>
<input id="gene" size="19">
</div>
<div class="columnS">
<label for="populations" style="font-size:18px;">
<b>Select a group of cell populations:</b>
</label>
<br>
<select name="populations" id="populations">
<option selected="selected" value="Population"> Cell Populations</option>
<option>Lineage</option>
<option value="Zone">Prostatic Zone</option>
<option>Patient</option>
</select>
</div>
<br>
<div style="text-align:center">
<button type="submit" id="analysis" class="btn btn-primary">Run Analysis</button>
</div>
<hr>
<div>
<span style="font-size:16px; font-weight:bold;">Experimental details:</span>
<br>
<span style="font-size:16px;">
Single Cell RNA-Sequencing was conducted on 32,194 cells from peripheral zone and transition zone from
the prostate of three 18-38 year old organ donors using the 10x Genomics platform. The cells were
clustered and identified by correlation of their transcriptomes to known cell types. Gene expression can
be compared by population identity, cell lineage, patient, or dissected prostatic zone. This data is the
result of additional sequencing done on the same samples post publication, and projected in UMAP space.
</span>
</div>
</div>
<div align="center">
<h1 id="label.gene">NO GENE SELECTED</h1>
<h2 id="label.populations"></h2>
<div class="columnF">
<h4 id="label.ClusterVis">
</h3>
<div class="img">
<img id="img.ClusterVis" src="" />
</div>
<br>
</div>
<div class="columnF">
<h4 id="label.Feature">
</h3>
<div class="img">
<img id="img.Feature" src="" />
</div>
<br>
</div>
<div class="columnF">
<h4 id="label.ViolinBox">
</h3>
<div class="img">
<img id="img.ViolinBox" src="" />
</div>
<br>
</div>
</div>
<hr>
<div align="left">
<div><span style="font-size:18px; font-weight:bold;">Publication found at:</span></div>
<div><span style="font-size:16px;"> <a href="https://www.ncbi.nlm.nih.gov/pubmed/?term=30566875"
target="_blank">Cell Reports</a></span></div>
<div><span style="font-size:18px; font-weight:bold;">Raw data found at:</span></div>
<div><span style="font-size:16px;"> <a href="https://www.ncbi.nlm.nih.gov/geo/query/acc.cgi?acc=GSE117403"
target="_blank">GEO:
GSE117403</a></span></div>
<div><span style="font-size:16px;"><a href="https://doi.org/10.25548/W-R8CM" target="_blank">GUDMAP:
W-R8CM</a></span></div>
</div>
</div>
{{ partial "footer.html" . }}
<head>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<style>
.ui-autocomplete {
max-height: 200px;
overflow-y: auto;
overflow-x: hidden;
}
</style>
<script>
$(function () {
$("#populations").selectmenu({ width: 230 });
});
$(function () {
var genes = {{ index .Site.Data.sc_data.hu_donor_pr_deep.genes }};
var selectedGene = $("#gene").autocomplete({
source: genes.genes,
maxResults: 10,
maxShowItems: 10,
minLength: 1,
});
});
$("#analysis").click(function (event) {
event.preventDefault();
var genes = {{ index .Site.Data.sc_data.hu_donor_pr_deep.genes }};
_gene = $("#gene").val().toUpperCase();
if ($.inArray(_gene, genes.genes) < 0) {
alert("Gene " + _gene + " not exist in the data.")
return
}
document.getElementById("label.gene").innerHTML = _gene
document.getElementById("label.populations").innerHTML = "Separated by " + $("#populations").val().toUpperCase()
document.getElementById("label.ClusterVis").innerHTML = "Cluster Visualization"
var img = document.getElementById("img.ClusterVis");
img.src = "https://s3.us-east-2.amazonaws.com/images.gse117403.deep/images/" + $("#populations").val() + "/umap.png"
document.getElementById("label.Feature").innerHTML = "Feature Plot"
var img = document.getElementById("img.Feature");
img.src = "https://s3.us-east-2.amazonaws.com/images.gse117403.deep/images/umap/" + "genes/" + _gene + "_1.png"
document.getElementById("label.ViolinBox").innerHTML = "Violin Box Plot"
var img = document.getElementById("img.ViolinBox");
img.src = "https://s3.us-east-2.amazonaws.com/images.gse117403.deep/images/ViolinBox/" + $("#populations").val() + "/genes/" + _gene + "_1.png"
return (_gene)
});
</script>
{{ partial "header.html" . }}
<div class="header">
<h1>{{ .Title }}</h1>
<h2>{{ .Description }}</h2>
</div>
<div class="content">
{{ .Content }}
</div>
<style>
.content {
margin: 0;
max-width: none;
}
.select {
float: top;
z-index: 1;
top: 0px;
background: #191818;
overflow-x: hidden;
padding: 8px 10px;
}
.columnS {
float: left;
text-align: center;
width: 50%;
}
.columnF {
float: left;
text-align: center;
width: 33.33%;
}
.row:after {
content: "";
display: table;
clear: both;
}
img {
max-width: 100%;
height: auto;
}
@media (max-width: 1000px) {
.columnS {
text-align: right;
width: 100%;
}
.columnF {
width: 100%;
}
br {
display: none;
}
}
</style>
<div class="content">
<div class="select">
<div class="columnS ui-widget">
<label for="gene" style="font-family:sans-serif; font-size:18px;"><b>Gene:</b></label>
<br>
<input id="gene" size="19">
</div>
<div class="columnS">
<label for="populations" style="font-size:18px;">
<b>Select a group of cell populations:</b>
</label>
<br>
<select name="populations" id="populations">
<option selected="selected" value="Population"> Cell Populations</option>
<option>Lineage</option>
<option value="Zone">Prostatic Zone</option>
<option>Patient</option>
</select>
</div>
<br>
<div style="text-align:center">
<button type="submit" id="analysis" class="btn btn-primary">Run Analysis</button>
</div>
<hr>
<div>
<span style="font-size:16px; font-weight:bold;">Experimental details:</span>
<br>
<span style="font-size:16px;">
Single Cell RNA-Sequencing was conducted on 32,194 cells from peripheral zone and transition zone from
the prostate of three 18-38 year old organ donors using the 10x Genomics platform. The cells were
clustered and identified by correlation of their transcriptomes to known cell types. Gene expression can
be compared by population identity, cell lineage, patient, or dissected prostatic zone. This data is the
result of additional sequencing done on the same samples post publication, and projected in UMAP space.
</span>
</div>
</div>
<div align="center">
<h1 id="label.gene">NO GENE SELECTED</h1>
<h2 id="label.populations"></h2>
<div class="columnF">
<h4 id="label.ClusterVis">
</h3>
<div class="img">
<img id="img.ClusterVis" src="" />
</div>
<br>
</div>
<div class="columnF">
<h4 id="label.Feature">
</h3>
<div class="img">
<img id="img.Feature" src="" />
</div>
<br>
</div>
<div class="columnF">
<h4 id="label.ViolinBox">
</h3>
<div class="img">
<img id="img.ViolinBox" src="" />
</div>
<br>
</div>
</div>
<hr>
<div align="left">
<div><span style="font-size:18px; font-weight:bold;">Publication found at:</span></div>
<div><span style="font-size:16px;"> <a href="https://www.ncbi.nlm.nih.gov/pubmed/?term=30566875"
target="_blank">Cell Reports</a></span></div>
<div><span style="font-size:18px; font-weight:bold;">Raw data found at:</span></div>
<div><span style="font-size:16px;"> <a href="https://www.ncbi.nlm.nih.gov/geo/query/acc.cgi?acc=GSE117403"
target="_blank">GEO:
GSE117403</a></span></div>
<div><span style="font-size:16px;"><a href="https://doi.org/10.25548/W-R8CM" target="_blank">GUDMAP:
W-R8CM</a></span></div>
</div>
</div>
{{ partial "footer.html" . }}
<head>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<style>
.ui-autocomplete {
max-height: 200px;
overflow-y: auto;
overflow-x: hidden;
}
</style>
<script>
$(function () {
$("#populations").selectmenu({ width: 230 });
});
$(function () {
var genes = {{ index .Site.Data.sc_data.hu_donor_pr_deep.genes }};
var selectedGene = $("#gene").autocomplete({
source: genes.genes,
maxResults: 10,
maxShowItems: 10,
minLength: 1,
});
});
$("#analysis").click(function (event) {
event.preventDefault();
var genes = {{ index .Site.Data.sc_data.hu_donor_pr_deep.genes }};
_gene = $("#gene").val().toUpperCase();
if ($.inArray(_gene, genes.genes) < 0) {
alert("Gene " + _gene + " not exist in the data.")
return
}
document.getElementById("label.gene").innerHTML = _gene
document.getElementById("label.populations").innerHTML = "Separated by " + $("#populations").val().toUpperCase()
document.getElementById("label.ClusterVis").innerHTML = "Cluster Visualization"
var img = document.getElementById("img.ClusterVis");
img.src = "https://s3.us-east-2.amazonaws.com/data.images.gse117403.deep/images/" + $("#populations").val() + "/umap.png"
document.getElementById("label.Feature").innerHTML = "Feature Plot"
var img = document.getElementById("img.Feature");
img.src = "https://s3.us-east-2.amazonaws.com/data.images.gse117403.deep/images/umap/" + "genes/" + _gene + "_1.png"
document.getElementById("label.ViolinBox").innerHTML = "Violin Box Plot"
var img = document.getElementById("img.ViolinBox");
img.src = "https://s3.us-east-2.amazonaws.com/data.images.gse117403.deep/images/ViolinBox/" + $("#populations").val() + "/genes/" + _gene + "_1.png"
return (_gene)
});
</script>
</head>
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment