Skip to content
GitLab
Commit 35c1b4ec authored by Christian Tischer's avatar Christian Tischer
Browse files

Improve module layout

parent e9dc6201
Pipeline #10080 failed with stage
in 11 seconds
Hide whitespace changes
Inline Side-by-side
Gemfile.lock 0 → 100644
View file @ 35c1b4ec
GEM
remote: https://rubygems.org/
specs:
addressable (2.6.0)
public_suffix (>= 2.0.2, < 4.0)
colorator (1.1.0)
commonmarker (0.17.13)
ruby-enum (~> 0.5)
concurrent-ruby (1.1.5)
ffi (1.11.1)
forwardable-extended (2.6.0)
i18n (1.6.0)
concurrent-ruby (~> 1.0)
jekyll (3.4.0)
addressable (~> 2.4)
colorator (~> 1.0)
jekyll-sass-converter (~> 1.0)
jekyll-watch (~> 1.1)
kramdown (~> 1.3)
liquid (~> 3.0)
mercenary (~> 0.3.3)
pathutil (~> 0.9)
rouge (~> 1.7)
safe_yaml (~> 1.0)
jekyll-commonmark (1.2.0)
commonmarker (~> 0.14)
jekyll (>= 3.0, < 4.0)
jekyll-commonmark-ghpages (0.1.0)
commonmarker (~> 0.17.6)
jekyll-commonmark (~> 1)
jekyll-sass-converter (1.5.2)
sass (~> 3.4)
jekyll-watch (1.5.1)
listen (~> 3.0)
kramdown (1.17.0)
liquid (3.0.6)
listen (3.1.5)
rb-fsevent (~> 0.9, >= 0.9.4)
rb-inotify (~> 0.9, >= 0.9.7)
ruby_dep (~> 1.2)
mercenary (0.3.6)
pathutil (0.16.2)
forwardable-extended (~> 2.6)
public_suffix (3.1.0)
rb-fsevent (0.10.3)
rb-inotify (0.10.0)
ffi (~> 1.0)
rouge (1.11.1)
ruby-enum (0.7.2)
i18n
ruby_dep (1.5.0)
safe_yaml (1.0.5)
sass (3.7.4)
sass-listen (~> 4.0.0)
sass-listen (4.0.0)
rb-fsevent (~> 0.9, >= 0.9.4)
rb-inotify (~> 0.9, >= 0.9.7)
PLATFORMS
ruby
DEPENDENCIES
jekyll (= 3.4.0)
jekyll-commonmark-ghpages
tzinfo-data
RUBY VERSION
ruby 2.6.2p47
BUNDLED WITH
2.0.1
_layouts/module.html
View file @ 35c1b4ec
......@@ -91,8 +91,11 @@ window.onload = set_view_defaults;
</header>
{% if page.prerequisites %}
<div class="prerequisites">
<br>
<br>
<h2>Prerequisites</h2>
Before starting this lesson, you should be familiar with:
Before starting this lesson, you should be familiar with:<br>
<br>
<ul>
{% for prereq in page.prerequisites %}
<li>{{ prereq | markdownify }}</li>
......@@ -101,8 +104,11 @@ window.onload = set_view_defaults;
</div>
{% endif %}
<div class="learning-objectives">
<br>
<br>
<h2>Learning Objectives</h2>
After completing this lesson, learners should be able to:
After completing this lesson, learners should be able to:<br>
<br>
<ul>
{% for objective in page.objectives %}
<li>{{ objective | markdownify }}</li>
......@@ -110,15 +116,21 @@ window.onload = set_view_defaults;
</ul>
</div>
<br>
<br>
<h2>Motivation</h2>
{{ page.motivation | markdownify }}
<br>
<br>
<h2>Concept map</h2>
<div class="mermaid">
{{ page.concept_map }}
</div>
<br>
<br>
<h2>Example</h2>
<figure>
......@@ -132,6 +144,8 @@ window.onload = set_view_defaults;
{{ content }}
</div>
<br>
<br>
<h2>Activity</h2>
{% if page.activity_preface %}
......@@ -139,7 +153,7 @@ window.onload = set_view_defaults;
{% endif %}
{% if page.activities %}
Choose a platform to display instructions for: <select id="id_activity_platform" name="activityplatformlist" onchange="change_activity_content_by_platform('id_activity_platform');return false;">
Show activity for: <select id="id_activity_platform" name="activityplatformlist" onchange="change_activity_content_by_platform('id_activity_platform');return false;">
{% assign first = true %}
{% endif %}
{% for platform in page.activities %}
......@@ -158,7 +172,6 @@ Choose a platform to display instructions for: <select id="id_activity_platform"
{% for platform in page.activities %}
<div id="{{ platform[0] | slugify }}-activity-div">
&nbsp; <br>
&nbsp; <br>
<h3>{{ platform[0] }}</h3>
{% assign includefile = platform[1] %}
{% capture activity %}{% include {{ includefile }} %}{% endcapture %}
......@@ -167,6 +180,9 @@ Choose a platform to display instructions for: <select id="id_activity_platform"
{% endfor %}
{% if page.exercises_preface or page.exercises %}
<br>
<br>
<h2>Formative assessment</h2>
{% endif %}
......@@ -175,7 +191,7 @@ Choose a platform to display instructions for: <select id="id_activity_platform"
{% endif %}
{% if page.exercises %}
Choose a platform to display instructions for: <select id="id_exercises_platform" name="exercisesplatformlist" onchange="change_exercises_content_by_platform('id_exercises_platform');return false;">
Perform additional excercises for: <select id="id_exercises_platform" name="exercisesplatformlist" onchange="change_exercises_content_by_platform('id_exercises_platform');return false;">
{% assign first = true %}
{% endif %}
{% for platform in page.exercises %}
......@@ -192,6 +208,7 @@ Choose a platform to display instructions for: <select id="id_exercises_platform
{% endif %}
{% for platform in page.exercises %}
<div id="{{ platform[0] | slugify }}-exercises-div">
&nbsp; <br>
<h3>{{ platform[0] }}</h3>
{% assign includefile = platform[1] %}
{% capture exercise %}{% include {{ includefile }} %}{% endcapture %}
......@@ -199,6 +216,8 @@ Choose a platform to display instructions for: <select id="id_exercises_platform
</div>
{% endfor %}
<br>
<br>
<h2>Follow-up material</h2>
<ul>
......@@ -207,6 +226,8 @@ Choose a platform to display instructions for: <select id="id_exercises_platform
{% endfor %}
</ul>
<br>
<br>
<h2>Learn more</h2>
<ul>
......
_site/CONTRIBUTING.html 0 → 100644
View file @ 35c1b4ec
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Image Analysis Training</title>
<meta name="description" content="A collection of material for teaching image analysis. Includes concept maps, exercises, example data
">
<link rel="stylesheet" href="/image-analysis-training-resources/css/main.css">
<link rel="canonical" href="http://localhost:4000/image-analysis-training-resources/CONTRIBUTING.html">
<link rel="alternate" type="application/rss+xml" title="Image Analysis Training" href="http://localhost:4000/image-analysis-training-resources/feed.xml">
<script src="https://unpkg.com/mermaid@8.0.0/dist/mermaid.min.js"></script>
<script>mermaid.initialize({startOnLoad:true});</script>
</head>
<body>
<header class="site-header">
<div class="wrapper">
<a class="site-title" href="/image-analysis-training-resources/">Image Analysis Training</a>
<nav class="site-nav">
<a href="#" class="menu-icon">
<svg viewBox="0 0 18 15">
<path fill="#424242" d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.031C17.335,0,18,0.665,18,1.484L18,1.484z"/>
<path fill="#424242" d="M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0c0-0.82,0.665-1.484,1.484-1.484 h15.031C17.335,6.031,18,6.696,18,7.516L18,7.516z"/>
<path fill="#424242" d="M18,13.516C18,14.335,17.335,15,16.516,15H1.484C0.665,15,0,14.335,0,13.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.031C17.335,12.031,18,12.696,18,13.516L18,13.516z"/>
</svg>
</a>
<div class="trigger">
<a class="page-link" href="/image-analysis-training-resources/modules/basic_image_analysis_workflow.html">Basic image analysis workflow</a>
<a class="page-link" href="/image-analysis-training-resources/modules/binarization.html">Image binarization</a>
<a class="page-link" href="/image-analysis-training-resources/modules/calibration.html">Image calibration</a>
<a class="page-link" href="/image-analysis-training-resources/modules/connected_components.html">Connected components</a>
<a class="page-link" href="/image-analysis-training-resources/modules/display.html">Image display</a>
<a class="page-link" href="/image-analysis-training-resources/example-images/">Example Images</a>
<a class="page-link" href="/image-analysis-training-resources/modules/filter_convolution.html">Image math</a>
<a class="page-link" href="/image-analysis-training-resources/modules/filter_difference_of_gaussian.html">Difference of Gaussian</a>
<a class="page-link" href="/image-analysis-training-resources/">Image Analysis Training Material</a>
<a class="page-link" href="/image-analysis-training-resources/modules/measure_intensities.html">Intensity measurements</a>
<a class="page-link" href="/image-analysis-training-resources/modules/measure_shapes.html">Object shape measurements</a>
<a class="page-link" href="/image-analysis-training-resources/modules/object_splitting.html">Object splitting</a>
<a class="page-link" href="/image-analysis-training-resources/modules/pixel_data_types.html">Pixel data types</a>
<a class="page-link" href="/image-analysis-training-resources/modules/pixel_math.html">Image math</a>
<a class="page-link" href="/image-analysis-training-resources/modules/pixels.html">Pixels</a>
</div>
</nav>
</div>
</header>
<div class="page-content">
<div class="wrapper">
<h1 id="guidelines-for-contributing">Guidelines for Contributing</h1>
<p>Contributions to this project are very welcome.
Changes should be submitted by merge request from a new branch to <code>master</code>.
Merge requests should be reviewed by at least one Maintainer before merging.</p>
<p>See <code>README.md</code> for information on the structure of the repository.</p>
<h2 id="step-by-step-guide">Step by step guide</h2>
<p>To contribute to this project, please follow those steps:</p>
<ol>
<li>Clone this repository: <code>git clone https://git.embl.de/grp-bio-it/image-analysis-training-resources.git</code></li>
<li>On your computer, make a new branch. For example, if you would like to contribute python code to the binarization.md module you may: <code>git checkout -b pythonBinarization</code></li>
<li>Now add your changes on your computer (staying in this branch) - see &quot;Adding a new module&quot; section, below.</li>
<li>When you are done, please <code>git add .; git commit -m &quot;some message&quot;</code></li>
<li>Now you can upload your branch to the online repository by typing: <code>git push --set-upstream origin pythonBinarization</code>.</li>
<li>Go to the online repository on gitlab: https://git.embl.de/grp-bio-it/image-analysis-training-resources</li>
<li>On gitlab, there will now be button at the top of the page. Click this button to stage a &quot;merge request&quot; of your contribution (in your branch) to the master branch. There will also a possibility to assign a project maintainer to review your contribution and to merge it. Please select someone appropriate here.</li>
<li>Thank you for your contribution!</li>
</ol>
<h2 id="adding-a-new-module">Adding a new module</h2>
<p>Each module page is built from a template (<code>_layouts/module.html</code>),
ensuring a consistent structure and style for the whole collection.
To create a new module, you will need to add a few files
in a few different places in this repository.</p>
<h3 id="module-file">Module file</h3>
<p>Most important is the module file itself.
This module file should be saved with a short, descriptive name (no spaces!)
ending with the <code>.md</code> (Markdown) extension.
Typically, the only content of this Markdown file should be a header
written in YAML. See the specification below.
All fields not marked as optional are required for the page to build.
You can check that your YAML is valid with <a href="http://www.yamllint.com/">this tool</a>.</p>
<pre><code class="language-yaml">---
title: Title of the Module
layout: module # don't change this
prerequisites:
- &quot;a list of things that learners should know&quot;
- &quot;in order to understand this module&quot;
objectives:
- &quot;a list of learning objectives&quot;
- &quot;see note 1 below for more info&quot;
motivation: &gt;
A description of *why* you would want to learn this.
Can be written in
(GitHub-flavoured) [Markdown](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)
and split
across
multiple
lines.
concept_map: &gt; # see note 2
graph TD
A[Christmas] --&gt;|Get money| B(Go shopping)
B --&gt; C{Let me think}
C --&gt;|One| D[Laptop]
C --&gt;|Two| E[iPhone]
C --&gt;|Three| F[fa:fa-car Car];
figure: /figures/mymodule.png # store the example image for your module in the `figures` folder and provide the absolute path from the root of the site here.
figure_legend: Some description of the figure. (optional)
activity_preface: &gt;
Some general description of the activity for
that learners will do while studying the module.
It will be followed by platform-specific instructions/example code.
(optional)
activities: # platform-specific activity instruction/example code files (see note 3) (optional)
&quot;ImageJ GUI&quot;: &quot;mymodule/activities/mymodule_imagejgui.md&quot;
&quot;ImageJ Macro&quot;: &quot;mymodule/activities/mymodule_imagejmacro.md&quot;
&quot;Jython&quot;: &quot;mymodule/activities/mymodule_jython.md&quot;
exercises_preface: &gt;
You could put general, language-agnostic questions here...
(optional)
exercises: # platform-specific exercises (in Markdown files) (see note 3) (optional)
&quot;ImageJ GUI&quot;: &quot;mymodule/exercises/mymodule_imagejgui.md&quot;
&quot;ImageJ Macro&quot;: &quot;mymodule/exercises/mymodule_imagejmacro.md&quot;
&quot;Jython&quot;: &quot;mymodule/exercises/mymodule_jython.md&quot;
&quot;MATLAB&quot;: &quot;mymodule/exercises/mymodule_matlab.md&quot;
learn_next: # see note 4
- &quot;[name_of_one](calibration)&quot;
- &quot;[or_more_modules](object_splitting)&quot;
- &quot;[to link to next](display)&quot;
external_links:
- &quot;[link to](https://external.page.com)&quot;
---
</code></pre>
<p>Notes:</p>
<ol>
<li>Learning objectives should be worded as endings to a sentence beginning &quot;After completing this lesson, learners should be able to...&quot;. We recommend starting each learning objective with a verb from <a href="https://cft.vanderbilt.edu/guides-sub-pages/blooms-taxonomy/">Bloom's Taxonomy</a></li>
<li>Concept maps are drawn with <a href="https://mermaidjs.github.io/flowchart.html">Mermaid.js</a>. The indentation of the chart description is important, so be careful!</li>
<li>The <code>activities</code> and <code>exercises</code> fields should be populated with key-value pairs, where the key is the name of the platform (e.g. &quot;ImageJ GUI&quot;, &quot;Python&quot;, etc) and the value is the path (relative to <code>_includes/</code>) to the file containing the activity instructions/exercises for that platform.</li>
<li>The points in &quot;Learn Next&quot; are Markdown links, which should be formed as <code>[Module Title](modulefilename)</code>, where the extension has been removed from the filename.</li>
</ol>
<h3 id="associated-files">Associated files</h3>
<p>Below is a list of all the other files that you should provide
to accompany a new module,
as well as the appropriate location for each
(relative to the top level of the repository).
Examples are given for a <code>/modules/mymodule.md</code></p>
<ul>
<li>The <code>figure</code> image
<ul>
<li>an file containing an example image to illustrate the concept being taught in the module</li>
<li>location: <code>/figures/mymodule.md</code></li>
</ul>
</li>
<li>The <code>activities</code> files
<ul>
<li>Markdown files containing instructions and/or example code for an activity that learners should follow to learn how to apply the concept on a particular platform (ImageJ Macro, MATLAB, etc)</li>
<li>location: <code>_includes/mymodule/activities/mymodule_platformnospaces.md</code></li>
</ul>
</li>
<li>The <code>exercises</code> files
<ul>
<li>Markdown files containing exercises to test the learner's understanding of applying the concept on a particular platform</li>
<li>location: <code>_includes/mymodule/exercises/mymodule_platformnospaces.md</code></li>
</ul>
</li>
</ul>
<h2 id="adding-exercisesactivity-instructions-for-a-new-platform">Adding exercises/activity instructions for a new platform</h2>
<p>Contributions of instructions and exercises for more platforms are very welcome - please see the &quot;Associated files&quot; subsection above for details of where these contributed files should be added.</p>
<h2 id="questions-about-the-module-layout">Questions about the module layout</h2>
<p>If you have questions about the module layout, please contact <a href="mailto:toby.hodges@embl.de">Toby Hodges</a>.</p>
</div>
</div>
<footer class="site-footer">
<div class="wrapper">
<h2 class="footer-heading">Image Analysis Training</h2>
<div class="footer-col-wrapper">
<div class="footer-col footer-col-1">
<ul class="contact-list">
<li>Image Analysis Training</li>
<li><a href="mailto:image-analysis-support@embl.de">image-analysis-support@embl.de</a></li>
<li><a href="https://git.embl.de/grp-bio-it/image-analysis-training-resources/">Source code</a></li>
<li><a href="/image-analysis-training-resources/CONTRIBUTING">Contributions to this material are very welcome.</a></li>
</ul>
</div>
<div class="footer-col footer-col-2">
</div>
<div class="footer-col footer-col-3">
<p>A collection of material for teaching image analysis. Includes concept maps, exercises, example data
</p>
<p>Use of this site falls under <a href="https://www.embl.de/aboutus/privacy_policy/index.html">EMBL's Privacy Policy</a>.</p>
</div>
</div>
</div>
</footer>
</body>
</html>
_site/Gemfile 0 → 100644
View file @ 35c1b4ec
source "https://rubygems.org"
ruby RUBY_VERSION
# This will help ensure the proper Jekyll version is running.
gem "jekyll", "3.4.0"
# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
# install GH-flavoured MD plugin
group :jekyll_plugins do
gem 'jekyll-commonmark-ghpages'
end
_site/Gemfile.lock 0 → 100644
View file @ 35c1b4ec
GEM
remote: https://rubygems.org/
specs:
addressable (2.6.0)
public_suffix (>= 2.0.2, < 4.0)
colorator (1.1.0)
commonmarker (0.17.13)
ruby-enum (~> 0.5)
concurrent-ruby (1.1.5)
ffi (1.11.1)
forwardable-extended (2.6.0)
i18n (1.6.0)
concurrent-ruby (~> 1.0)
jekyll (3.4.0)
addressable (~> 2.4)
colorator (~> 1.0)
jekyll-sass-converter (~> 1.0)
jekyll-watch (~> 1.1)
kramdown (~> 1.3)
liquid (~> 3.0)
mercenary (~> 0.3.3)
pathutil (~> 0.9)
rouge (~> 1.7)
safe_yaml (~> 1.0)
jekyll-commonmark (1.2.0)
commonmarker (~> 0.14)
jekyll (>= 3.0, < 4.0)
jekyll-commonmark-ghpages (0.1.0)
commonmarker (~> 0.17.6)
jekyll-commonmark (~> 1)
jekyll-sass-converter (1.5.2)
sass (~> 3.4)
jekyll-watch (1.5.1)
listen (~> 3.0)
kramdown (1.17.0)
liquid (3.0.6)
listen (3.1.5)
rb-fsevent (~> 0.9, >= 0.9.4)
rb-inotify (~> 0.9, >= 0.9.7)
ruby_dep (~> 1.2)
mercenary (0.3.6)
pathutil (0.16.2)
forwardable-extended (~> 2.6)
public_suffix (3.1.0)
rb-fsevent (0.10.3)
rb-inotify (0.10.0)
ffi (~> 1.0)
rouge (1.11.1)
ruby-enum (0.7.2)
i18n
ruby_dep (1.5.0)
safe_yaml (1.0.5)
sass (3.7.4)
sass-listen (~> 4.0.0)
sass-listen (4.0.0)
rb-fsevent (~> 0.9, >= 0.9.4)
rb-inotify (~> 0.9, >= 0.9.7)
PLATFORMS
ruby
DEPENDENCIES
jekyll (= 3.4.0)
jekyll-commonmark-ghpages
tzinfo-data
RUBY VERSION
ruby 2.6.2p47
BUNDLED WITH
2.0.1
_site/LICENSE.md 0 → 100644
View file @ 35c1b4ec
This material is made available under the [Creative Commons Attribution license][cc-by-human].
The following is a human-readable summary of (and not a substitute for)
the [full legal text of the CC BY 4.0 license][cc-by-legal].
You are free:
* to **Share**---copy and redistribute the material in any medium or format
* to **Adapt**---remix, transform, and build upon the material
for any purpose, even commercially.
The licensor cannot revoke these freedoms as long as you follow the
license terms.
Under the following terms:
* **Attribution**---You must give appropriate credit (mentioning that
your work is derived from work that is Copyright ©
European Molecualr Biology Laboratory and, where practical, link to
the [source project repository][our-gitlab-repo]) and [the license][cc-by-human],
and indicate if changes were made. You may do
so in any reasonable manner, but not in any way that suggests the
licensor endorses you or your use.
**No additional restrictions**---You may not apply legal terms or
technological measures that legally restrict others from doing
anything the license permits. With the understanding that:
Notices:
* You do not have to comply with the license for elements of the
material in the public domain or where your use is permitted by an
applicable exception or limitation.
* No warranties are given. The license may not give you all of the
permissions necessary for your intended use. For example, other
rights such as publicity, privacy, or moral rights may limit how you
use the material.
[cc-by-human]: https://creativecommons.org/licenses/by/4.0/
[cc-by-legal]: https://creativecommons.org/licenses/by/4.0/legalcode
[our-gitlab-repo]: https://git.embl.de/grp-bio-it/image-analysis-training-resources/
\ No newline at end of file
_site/css/main.css 0 → 100644
View file @ 35c1b4ec
/**
* Reset some basic elements
*/
body, h1, h2, h3, h4, h5, h6,
p, blockquote, pre, hr,
dl, dd, ol, ul, figure {
margin: 0;
padding: 0; }
/**
* Basic styling
*/
body {
font: 400 16px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #111;
background-color: #fdfdfd;
-webkit-text-size-adjust: 100%;
-webkit-font-feature-settings: "kern" 1;
-moz-font-feature-settings: "kern" 1;
-o-font-feature-settings: "kern" 1;
font-feature-settings: "kern" 1;
font-kerning: normal; }
/**
* Set `margin-bottom` to maintain vertical rhythm
*/
h1, h2, h3, h4, h5, h6,
p, blockquote, pre,
ul, ol, dl, figure,
.highlight {
margin-bottom: 15px; }
/**
* Images
*/
img {
max-width: 100%;
vertical-align: middle; }
/**
* Figures
*/
figure > img {
display: block; }