bin/boilerplate/_extras/figures.md

   1 ---
   2 title: Figures
   3 ---
   4 <script>
   5   window.onload = function() {
   6     var lesson_episodes = [
   7     {% for episode in site.episodes %}
   8     "{{ episode.url }}"{% unless forloop.last %},{% endunless %}
   9     {% endfor %}
  10     ];
  11
  12     var xmlHttp = [];  /* Required since we are going to query every episode. */
  13     for (i=0; i < lesson_episodes.length; i++) {
  14
  15       xmlHttp[i] = new XMLHttpRequest();
  16       xmlHttp[i].episode = lesson_episodes[i];  /* To enable use this later. */
  17       xmlHttp[i].onreadystatechange = function() {
  18
  19         if (this.readyState == 4 && this.status == 200) {
  20           var parser = new DOMParser();
  21           var htmlDoc = parser.parseFromString(this.responseText,"text/html");
  22           var htmlDocArticle = htmlDoc.getElementsByTagName("article")[0];
  23
  24           var article_here = document.getElementById(this.episode);
  25           var images = htmlDocArticle.getElementsByTagName("img");
  26
  27           if (images.length > 0) {
  28             var h1text = htmlDocArticle.getElementsByTagName("h1")[0].innerHTML;
  29
  30             var htitle = document.createElement('h2');
  31             htitle.innerHTML = h1text;
  32             article_here.appendChild(htitle);
  33
  34             var image_num = 0;
  35             for (let image of images) {
  36               image_num++;
  37
  38               var title = document.createElement('p');
  39               title.innerHTML = "<strong>Figure " + image_num + ".</strong> " + image.alt;
  40               article_here.appendChild(title);
  41
  42               var img = document.createElement('img');
  43               img.src = image.src;
  44               article_here.appendChild(img);
  45
  46               if (image_num < images.length) {
  47                 var hr = document.createElement('hr');
  48                 article_here.appendChild(hr);
  49               }
  50             }
  51           }
  52         }
  53       }
  54       episode_url = "{{ base }}" + lesson_episodes[i];
  55       xmlHttp[i].open("GET", episode_url);
  56       xmlHttp[i].send(null);
  57     }
  58   }
  59 </script>
  60 {% comment %}
  61 Create anchor for each one of the episodes.
  62 {% endcomment %}
  63 {% for episode in site.episodes %}
  64 <article id="{{ episode.url }}" class="figures"></article>
  65 {% endfor %}
  66
  67 {% include links.md %}