Built site for gh-pages

.nojekyll

@@ -1 +1 @@
-2b9d6141
+4e77247e

about/about.html

@@ -247,7 +247,7 @@ <h1>Contact the sandbox team</h1>
 
 <div class="quarto-listing quarto-listing-container-default" id="listing-listing">
 <div class="list quarto-listing-default">
-<div class="quarto-post image-right" data-index="0" data-listing-file-modified-sort="1712307668828" data-listing-reading-time-sort="1">
+<div class="quarto-post image-right" data-index="0" data-listing-file-modified-sort="1712318682696" data-listing-reading-time-sort="1">
 <div class="thumbnail">
 <p><a href="../cards/AlbaMartinez.html"> <p class="card-img-top"><img src="../cards/alba.jpg"  class="thumbnail-image card-img"/></p> </a></p>
 </div>
@@ -268,7 +268,7 @@ <h3 class="no-anchor listing-title">
 <a href="../cards/AlbaMartinez.html"> </a>
 </div>
 </div>
-<div class="quarto-post image-right" data-index="1" data-listing-file-modified-sort="1712307668828" data-listing-reading-time-sort="1">
+<div class="quarto-post image-right" data-index="1" data-listing-file-modified-sort="1712318682696" data-listing-reading-time-sort="1">
 <div class="thumbnail">
 <p><a href="../cards/JacobHansen.html"> <p class="card-img-top"><img src="../cards/jaCob.jpg"  class="thumbnail-image card-img"/></p> </a></p>
 </div>
@@ -289,7 +289,7 @@ <h3 class="no-anchor listing-title">
 <a href="../cards/JacobHansen.html"> </a>
 </div>
 </div>
-<div class="quarto-post image-right" data-index="2" data-listing-file-modified-sort="1712307668828" data-listing-reading-time-sort="1">
+<div class="quarto-post image-right" data-index="2" data-listing-file-modified-sort="1712318682696" data-listing-reading-time-sort="1">
 <div class="thumbnail">
 <p><a href="../cards/JakobSkelmose.html"> <p class="card-img-top"><img src="../cards/jaKob.jpg"  class="thumbnail-image card-img"/></p> </a></p>
 </div>
@@ -310,7 +310,7 @@ <h3 class="no-anchor listing-title">
 <a href="../cards/JakobSkelmose.html"> </a>
 </div>
 </div>
-<div class="quarto-post image-right" data-index="3" data-listing-file-modified-sort="1712307668828" data-listing-reading-time-sort="1">
+<div class="quarto-post image-right" data-index="3" data-listing-file-modified-sort="1712318682696" data-listing-reading-time-sort="1">
 <div class="thumbnail">
 <p><a href="../cards/JenniferBartell.html"> <p class="card-img-top"><img src="../cards/jennie.jpg"  class="thumbnail-image card-img"/></p> </a></p>
 </div>
@@ -331,7 +331,7 @@ <h3 class="no-anchor listing-title">
 <a href="../cards/JenniferBartell.html"> </a>
 </div>
 </div>
-<div class="quarto-post image-right" data-index="4" data-listing-file-modified-sort="1712307668828" data-listing-reading-time-sort="1">
+<div class="quarto-post image-right" data-index="4" data-listing-file-modified-sort="1712318682696" data-listing-reading-time-sort="1">
 <div class="thumbnail">
 <p><a href="../cards/SamueleSoraggi.html"> <p class="card-img-top"><img src="../cards/samuele.jpg"  class="thumbnail-image card-img"/></p> </a></p>
 </div>

access/UCloud.html

@@ -194,6 +194,19 @@ <h1>Accessing the Sandbox on UCloud</h1>
 <p>User accounts on UCloud are enabled by university login credentials using WAYF (Where Are You From). Access the WAYF login portal <a href="https://cloud.sdu.dk/">here</a>, and then find your affiliated Danish university using the search bar. After login, we suggest setting up Two Factor Authentication by clicking on the icon in the top-right corner of the screen. Once you are an approved user of UCloud, you can access the Sandbox environment via different ‘Sandbox’ apps linked to topical modules that you deploy using your own storage and computing resources - just go to Apps once you have signed into UCloud and search ‘Sandbox’ to find what we have deployed. Each app page has its own Documentation link that will direct you to Sandbox-based usage guidelines which may be customized to the app’s particular tools and scope. Apps will have different ‘courses’ that you can initially choose which make a personal copy of training materials in your workspace for you to edit.</p>
 <p>Each Danish university has its usage relationship with UCloud as governed by their local front office of <a href="https://www.deic.dk/en">DeiC</a> - check with your university IT support / DeiC representatives about requesting computational resources. For example, the University of Copenhagen has previously allotted an initial chunk of free UCloud compute hours to staff (from PhD students to professors as well as non-academic staff). If you have further questions about getting compute resources, please <a href="https://hds-sandbox.github.io/contact">contact</a> Sandbox staff.</p>
 <p>Extensive documentation on the general use of UCloud (how to use apps and run jobs, etc.) is available in the UCloud <a href="https://docs.cloud.sdu.dk/">user guide</a>.</p>
+<div class="callout callout-style-default callout-tip callout-titled">
+<div class="callout-header d-flex align-content-center">
+<div class="callout-icon-container">
+<i class="callout-icon"></i>
+</div>
+<div class="callout-title-container flex-fill">
+Tip
+</div>
+</div>
+<div class="callout-body-container callout-body">
+<p>Click on the images to view them in full size.</p>
+</div>
+</div>
 <section id="example-how-to-open-a-sandbox-app" class="level2">
 <h2 class="anchored" data-anchor-id="example-how-to-open-a-sandbox-app">Example: how to open a Sandbox app</h2>
 <section id="step-1" class="level3">
@@ -206,7 +219,7 @@ <h3 class="anchored" data-anchor-id="step-2"><strong>Step 2</strong></h3>
 <p>For this example, we select Sandbox_workshop.</p>
 <div class="quarto-figure quarto-figure-center">
 <figure class="figure">
-<p><img src="../assets/images/workspace.png" class="img-fluid figure-img" alt="Screenshot of your dashboard"></p>
+<p><img src="../images/workspace.png" class="black-box lightbox img-fluid figure-img" alt="Screenshot of your dashboard"></p>
 <figcaption class="figure-caption">Dashboard: your workspace</figcaption>
 </figure>
 </div>
@@ -239,7 +252,7 @@ <h3 class="anchored" data-anchor-id="step-3"><strong>Step 3</strong></h3>
 <p>Then click on Apps in the left panel to investigate what tools and environments you can use (green circle). The easiest way to find Sandbox resources is to search via the toolbar (red circle). In this example, we’ll select the Genomics Sandbox (which will bring you to the submission screen).</p>
 <div class="quarto-figure quarto-figure-center">
 <figure class="figure">
-<p><img src="../assets/images/apps.png" class="img-fluid figure-img" alt="Screenshot of apps dashboard"></p>
+<p><img src="../images/apps.png" class="black-box lightbox img-fluid figure-img" alt="Screenshot of apps dashboard"></p>
 <figcaption class="figure-caption">Dashboard: all apps</figcaption>
 </figure>
 </div>
@@ -262,7 +275,7 @@ <h3 class="anchored" data-anchor-id="step-4"><strong>Step 4</strong></h3>
 <p>Click on the app button to get into the settings window. First, we recommend reading the documentation of the app (highlighted in green). Then, you can configure the app as shown below, or be provided with a configuration file made available in a workshop’s project folders (<em>import parameters</em>) which will take care of everything for you.</p>
 <div class="quarto-figure quarto-figure-center">
 <figure class="figure">
-<p><img src="../assets/images/configure_NGS.png" class="img-fluid figure-img" alt="Screenshot of how to configure your job"></p>
+<p><img src="../images/configure_NGS.png" class="black-box lightbox img-fluid figure-img" alt="Screenshot of how to configure your job"></p>
 <figcaption class="figure-caption">Dashboard jobs: configuration step</figcaption>
 </figure>
 </div>
@@ -296,7 +309,7 @@ <h3 class="anchored" data-anchor-id="step-5"><strong>Step 5</strong></h3>
 <p>Wait to go through the queue. When the session starts, the timer begins to count down. In a couple of minutes, you should be able to open the interface through the button (green circle) in a new window (refresh the window if needed).</p>
 <div class="quarto-figure quarto-figure-center">
 <figure class="figure">
-<p><img src="../assets/images/running_NGS.png" class="img-fluid figure-img" alt="Screenshot of dashboard running app"></p>
+<p><img src="../images/running_NGS.png" class="black-box lightbox img-fluid figure-img" alt="Screenshot of dashboard running app"></p>
 <figcaption class="figure-caption">Dashboard jobs: running the app</figcaption>
 </figure>
 </div>
@@ -307,14 +320,14 @@ <h3 class="anchored" data-anchor-id="step-6"><strong>Step 6</strong></h3>
 <p>If you are testing the genomic app, your interface should look like in the image below. Different apps might use other development environments. In this case, you will be working from <a href="https://jupyter.org/">JupyterLab</a>. You can open Jupyter Notebooks (yellow square), R studio (blue square) or a terminal (black square) among others. In this case, #1 and #2 have all the software and packages that you will need pre-installed (this is not the case with Python 3 to the left).</p>
 <div class="quarto-figure quarto-figure-center">
 <figure class="figure">
-<p><img src="../assets/images/interface_jupyterlab.png" class="img-fluid figure-img" alt="Screenshot of JupyterLab interface"></p>
+<p><img src="../images/interface_jupyterlab.png" class="black-box lightbox img-fluid figure-img" alt="Screenshot of JupyterLab interface"></p>
 <figcaption class="figure-caption">JupyterLab interface: running the app</figcaption>
 </figure>
 </div>
 <p>You can navigate through the different folders and start running the Python notebooks (pink arrow).</p>
 <div class="quarto-figure quarto-figure-center">
 <figure class="figure">
-<p><img src="../assets/images/openning_notebook.png" class="img-fluid figure-img" alt="Screenshot of Jupyter Notebook"></p>
+<p><img src="../images/openning_notebook.png" class="black-box lightbox img-fluid figure-img" alt="Screenshot of Jupyter Notebook"></p>
 <figcaption class="figure-caption">JupyterLab interface: openning notebook</figcaption>
 </figure>
 </div>

listings.json

@@ -1,14 +1,4 @@
 [
-  {
-    "listing": "/about/about.html",
-    "items": [
-      "/cards/AlbaMartinez.html",
-      "/cards/JacobHansen.html",
-      "/cards/JakobSkelmose.html",
-      "/cards/JenniferBartell.html",
-      "/cards/SamueleSoraggi.html"
-    ]
-  },
   {
     "listing": "/news.html",
     "items": [
@@ -35,5 +25,15 @@
       "/news/2022-04-22-basicpm-wrapup.html",
       "/news/2022-06-01-genomics-au.html"
     ]
+  },
+  {
+    "listing": "/about/about.html",
+    "items": [
+      "/cards/AlbaMartinez.html",
+      "/cards/JacobHansen.html",
+      "/cards/JakobSkelmose.html",
+      "/cards/JenniferBartell.html",
+      "/cards/SamueleSoraggi.html"
+    ]
   }
 ]

modules/index.html

@@ -204,28 +204,34 @@ <h1 class="title">Training modules</h1>
 <li>Independently accessible <strong>Sandbox apps on <a href="https://genome.au.dk">GenomeDK</a></strong>, the bioinformatics high-throughput HPC at University of Aarhus</li>
 <li>Virtual machines deployed on the <strong><a href="https://www.computerome.dk/solutions/course-platform">Course Platform</a> at Computerome</strong>, the academic HPC at the Technical University of Denmark (Sandbox rollout still under development!) <strong>tutorials and guides</strong> and <strong>popular tools for analysis and visualization</strong>. <a href="mailto:nhds_sandbox@sund.ku.dk">Email us</a> with any questions, comments or suggestions for new workshops!</li>
 </ul>
-<section id="genomics" class="level2">
-<h2 class="anchored" data-anchor-id="genomics">Genomics</h2>
+<p>&nbsp;</p>
+<section id="genomics" class="level2 embedded">
+<h2 class="embedded anchored" data-anchor-id="genomics">Genomics</h2>
+<div style="margin-bottom: -20px">
 <div class="quarto-figure quarto-figure-right">
 <figure class="figure">
-<p><img src="../images/genomics2.png" class="img-fluid figure-img" style="width:20.0%"></p>
+<p><img src="../images/genomics2.png" class="img-fluid figure-img" style="width:18.0%"></p>
 </figure>
 </div>
+</div>
 <p>Genomics is the study of genomes, the complete set of an organism’s DNA. Genomics research now encompasses functional and structural studies, epigenomics, and metagenomics, and genomic medicine is under active implementation and extension in the health sector.</p>
 <p><strong>Use the <a href="https://cloud.sdu.dk/app/jobs/create?app=genomics&amp;version=2023.03.01">Genomics Sandbox App</a> on UCloud to explore the resources below:</strong></p>
 <ul>
 <li><a href="https://hds-sandbox.github.io/NGS_summer_course_Aarhus/">Introduction to Next Generation Sequencing data</a> (last update: June 2023)</li>
 <li><a href="https://hds-sandbox.github.io/PopulationGenomicsCourse/">Introduction to Population Genomics</a> (implementation of a course by Prof.&nbsp;Kasper Munch of Aarhus University) (last update: March 2023)</li>
 <li><a href="https://hds-sandbox.github.io/GWAS_course/">Introduction to GWAS</a> (last update: March 2023)</li>
 </ul>
+<p>&nbsp;</p>
 </section>
-<section id="transcriptomics" class="level2">
-<h2 class="anchored" data-anchor-id="transcriptomics">Transcriptomics</h2>
+<section id="transcriptomics" class="level2 embedded">
+<h2 class="embedded anchored" data-anchor-id="transcriptomics">Transcriptomics</h2>
+<div style="margin-bottom: -20px">
 <div class="quarto-figure quarto-figure-right">
 <figure class="figure">
-<p><img src="../images/transcriptomics.png" class="img-fluid figure-img" style="width:20.0%"></p>
+<p><img src="../images/transcriptomics.png" class="img-fluid figure-img" style="width:18.0%"></p>
 </figure>
 </div>
+</div>
 <p>Transcriptomics is the study of transcriptomes, which investigates RNA transcripts within a cell or tissue to determine what genes are being expressed and in what proportion. These RNA transcripts include mRNAs, tRNA, rRNA, and other non-coding RNA present in a cell.</p>
 <p><strong>Use the <a href="https://cloud.sdu.dk/app/jobs/create?app=transcriptomics&amp;version=2023.03">Transcriptomics Sandbox App</a> on UCloud to explore these resources:</strong></p>
 <ul>
@@ -234,14 +240,17 @@ <h2 class="anchored" data-anchor-id="transcriptomics">Transcriptomics</h2>
 <li>Cirrocumulus (a popular tool for visualizing different types of RNA-seq data and downstream analysis)</li>
 <li>RNAseq in RStudio (RStudio session with pre-installed RNAseq analysis packages for exploring with your own uploaded data)</li>
 </ul>
+<p>&nbsp;</p>
 </section>
-<section id="proteomics" class="level2">
-<h2 class="anchored" data-anchor-id="proteomics">Proteomics</h2>
+<section id="proteomics" class="level2 embedded">
+<h2 class="embedded anchored" data-anchor-id="proteomics">Proteomics</h2>
+<div style="margin-bottom: -20px">
 <div class="quarto-figure quarto-figure-right">
 <figure class="figure">
-<p><img src="../images/proteomics.png" class="img-fluid figure-img" style="width:20.0%"></p>
+<p><img src="../images/proteomics.png" class="img-fluid figure-img" style="width:18.0%"></p>
 </figure>
 </div>
+</div>
 <p>Proteomics is the study of proteins that are produced by an organism. Proteomics allows us to analyze protein composition and structure, which have great importance in determining their function.</p>
 <p><strong>Use the <a href="https://cloud.sdu.dk/app/jobs/create?app=proteomics&amp;version=Mar2023">Proteomics Sandbox App</a> on UCloud to explore pre-installed tools for proteomics analysis and other resources:</strong></p>
 <ul>
@@ -252,28 +261,34 @@ <h2 class="anchored" data-anchor-id="proteomics">Proteomics</h2>
 <ul>
 <li><a href="https://hds-sandbox.github.io/proteomics-sandbox/colabfold.html">ColabFold Intro</a> (last update: October 2022)</li>
 </ul>
+<p>&nbsp;</p>
 </section>
-<section id="electronic-health-records" class="level2">
-<h2 class="anchored" data-anchor-id="electronic-health-records">Electronic Health Records</h2>
+<section id="electronic-health-records" class="level2 embedded">
+<h2 class="embedded anchored" data-anchor-id="electronic-health-records">Electronic Health Records</h2>
+<div style="margin-bottom: -20px">
 <div class="quarto-figure quarto-figure-right">
 <figure class="figure">
-<p><img src="../images/EHRs.png" class="img-fluid figure-img" style="width:20.0%"></p>
+<p><img src="../images/EHRs.png" class="img-fluid figure-img" style="width:18.0%"></p>
 </figure>
 </div>
+</div>
 <p>Electronic health records (EHRs) are digital records kept in the public health sector that record the medical histories of individuals, and access is normally highly restricted to preserve patient privacy. This data is sometimes also shared (partly or in full) in secondary patient registries that support research on a specific disease or condition (such as breast cancer or cystic fibrosis). These datasets are extraordinarily valuable in the development of predictive models used in precision medicine.</p>
 <p>The chronic lymphocytic leukemia synthetic dataset listed below is generated solely from public data. It is of low utility, so we don’t recommend its use beyond the course it was designed for (with much explanation for the students on its construction and caveats). Please see <a href="../datasets/synthdata.html">Synthetic Data</a> for more information.</p>
 <ul>
 <li>Chronic Lymphocytic Leukemia synthetic dataset created for use in “Fra realworld data til personlig medicin”, a course from the University of Copenhagen’s <a href="https://personligmedicin.ku.dk/">MS in Personlig Medicin</a> (last update: January 2023)</li>
 <li>Intro to EHR analysis (workshop under development)</li>
 </ul>
+<p>&nbsp;</p>
 </section>
-<section id="data-carpentry-and-management" class="level2">
-<h2 class="anchored" data-anchor-id="data-carpentry-and-management">Data Carpentry and management</h2>
+<section id="data-carpentry-and-management" class="level2 embedded">
+<h2 class="embedded anchored" data-anchor-id="data-carpentry-and-management">Data Carpentry and management</h2>
+<div style="margin-bottom: -20px">
 <div class="quarto-figure quarto-figure-right">
 <figure class="figure">
-<p><img src="../images/HPC.png" class="img-fluid figure-img" style="width:20.0%"></p>
+<p><img src="../images/HPC.png" class="img-fluid figure-img" style="width:18.0%"></p>
 </figure>
 </div>
+</div>
 <p>Computing skills are an important foundation for health data science (and using the above training modules), but formal training is often lacking as biomedical researchers navigate increasingly difficult computational tasks in their projects. These skills range from programming to the use of high-performance computers (HPC) to proper research data management.</p>
 <ul>
 <li><a href="https://hds-sandbox.github.io/access/index.html">HPC Startup Guide</a> (instructions for accessing and navigating compute resources at Computerome and UCloud)</li>