Add B0 section

05-B0/README.md

@@ -0,0 +1,2 @@
+# mooc_b0_mapping
+Notebooks to create Figures for the B0 mapping chapter of the MOOC

05-B0/binder/requirements.txt

@@ -0,0 +1,7 @@
+jupyter-book==0.13.0
+lxml_html_clean
+nibabel
+pandas
+plotly
+scipy
+tabulate

05-B0/binder/runtime.txt

@@ -0,0 +1 @@
+python-3.8

05-B0/content/_config.yml

@@ -0,0 +1,37 @@
+# Book settings
+# Learn more at https://jupyterbook.org/customize/config.html
+
+title: B0 mapping
+logo: logo.png
+
+# Force re-execution of notebooks on each build.
+# See https://jupyterbook.org/content/execute.html
+execute:
+  execute_notebooks: force
+
+launch_buttons:
+  notebook_interface: "jupyterlab"
+
+# Information about where the book exists on the web
+repository:
+  url: https://github.com/qMRLab/qMRI-MOOC_B0-module  # Online location of your book
+  path_to_book: content  # Optional path to your book, relative to the repository root
+  branch: main  # Which branch of the repository should be used when creating links (optional)
+
+only_build_toc_files: true
+
+execute:
+  timeout: 600
+
+sphinx:
+  local_extensions          :   # A list of local extensions to load by sphinx specified by "name: path" items
+  recursive_update          : false # A boolean indicating whether to overwrite the Sphinx config (true) or recursively update
+  config                    :   # key-value pairs to directly over-ride the Sphinx configuration
+    bibtex_reference_style: author_year
+    bibtex_default_style: plain
+    bibtex_tooltips: true
+    html_static_path: ['_static']
+    html_css_files: ['custom.css']
+
+bibtex_bibfiles:
+  - ../paper.bib

05-B0/content/_static/custom.css

@@ -0,0 +1,52 @@
+p {
+    text-align: justify;
+  }
+  a {
+    color: #870000!important;
+  }
+  a:hover {
+    color: brick!important;
+  }
+  a:visited {
+    color: #6f42c1!important;
+  }
+  body, h1, h2, h3, h4, h5 {
+      font-family: 'STIX Two Text';
+  }
+  h1 {
+      color: #342727!important;
+  }
+  .caption {
+      text-align:justify;
+      line-height:1.25;
+      font-size:80%
+  }
+
+  #site-navigation {
+      display: none;
+  }
+
+  #main-content{
+      margin: 0 auto;
+  }
+
+
+  .fa, .far, .fas {
+      color: red;
+  }
+
+  .header-article::after{
+    content: url('https://neurolibre.org/assets/joss2-b7ea8dd1f24ce2b0825db17e3495576253ba4c64df3384a66354713d76c40a75.svg');
+    width: 150px; 
+    height: 80px;
+    position: relative;
+    right: 10px;
+  }
+
+  .header-article::before{
+    content: url('https://raw.githubusercontent.com/neurolibre/brand/b5e10e051a0059824ca2f4204e1288927e551d49/svg/neurolibre_logo.svg');
+    width: 33px; 
+    height: 33px;
+    position: absolute;
+    left: 10px;
+  }

05-B0/content/_toc.yml

@@ -0,0 +1,5 @@
+# Table of contents
+# Learn more at https://jupyterbook.org/customize/toc.html
+
+format: jb-article
+root: paper

05-B0/content/assets/before_after.css

@@ -0,0 +1,50 @@
+.beforeAfter {
+    border-radius: 5px;
+    /* border: 2px solid silver; */
+    position: relative;
+    margin: 0;
+    padding: 0;
+}
+
+.after {
+    height:100%;
+    width:100%;
+    z-index: 1;
+    position: absolute;
+ }
+
+.before {
+    height: 100%;
+    width: 50%;
+    overflow: hidden;
+    border-right: 4px solid silver;
+    z-index: 40;
+    position: absolute;
+}
+
+.middle {
+    top: 45%;
+    left: 48%;
+    z-index: 50;
+    draggable: true;
+    position: absolute;
+}
+
+.middle:before {
+    content: '\f1de';
+    font-family: "Font Awesome 6 Free";
+    font-size: 30pt;
+    font-weight: 900;
+    background-color: silver;
+    border: 1pt solid black;
+    cursor: grab;
+    border-radius: 5pt;
+}
+
+.middle:hover:before {
+    filter: brightness(1.15)
+}
+
+.middle:active:before {
+    cursor: grabbing;
+}

05-B0/content/assets/before_after.js

@@ -0,0 +1,57 @@
+function beforeAfter() {
+    $(".middle").on("mousedown", function () {
+        $(document).on("mouseup",function() {
+            $(document).unbind("mousemove")
+             $(document).unbind("mouseup")
+             oldX = undefined
+             oldY = undefined
+             })
+        $(document).on("mousemove", function () {
+            adjustSize()
+        })
+    })
+
+    $(".before .modebar").css({'left':'0px', 'position':'absolute'})
+}
+
+window.fetch = new Proxy(window.fetch, {
+    apply(fetch, that, args) {
+        // Forward function call to the original fetch
+        const result = fetch.apply(that, args);
+
+        // Do whatever you want with the resulting Promise
+        result.then((response) => {
+            if (args[0] == '/_dash-update-component') {
+                setTimeout(function() {beforeAfter()}, 500)
+            }})
+        return result
+        }
+    }
+    )
+
+var oldX;
+var oldY;
+function adjustSize() {
+    if (event.screenX != 0) {
+        var clientX = event.clientX
+        var scrollLeft = $(document).scrollLeft()
+
+        if (oldX && !((parseFloat($('.before').css("width"))+((clientX-scrollLeft)-oldX)) > $('.beforeAfter').width())) {
+            var width = parseFloat($('.before').css("width"))+((clientX-scrollLeft)-oldX)
+            $('.before').css("width", width)
+            $('.middle').css("left", ($('.before').width()/$('.beforeAfter').width()*100)-2 + '%')
+
+        }
+
+        if (parseFloat($('.middle').css('left'))> $('.beforeAfter').width()) {
+            $('.middle').css("left", '99.5%')
+            $('.before').css("width", $('.beforeAfter').width())
+        }
+    }
+    oldX = clientX-scrollLeft
+    event.target.style.cursor = 'grab';
+}
+
+$(document).ready(function() {
+    setTimeout(function() {beforeAfter()}, 1000)
+})