doc: Fixed some html errors, the pages now pass the W3C validation. Additionally, empty lines are now removed from html output.

Author: dagophil

_config.yml

@@ -4,6 +4,9 @@ destination: doc
 
 baseurl: ""
 
+compress_html:
+  blanklines: true
+
 collections:
   implementation:
     output: true

doc_src/_implementation/game_design.html

@@ -17,14 +17,15 @@ <h2>Die Spielschleife</h2>
 <p>Damit lässt sich die Endlosschleife unseres Spiels wie folgt zusammenfassen:</p>
 <ul>
     <li>Initialisierung.</li>
-    <li>Solange das Fenster geöffnet ist:</li>
-    <ul>
-        <li>Lese die Kinect-Daten ein.</li>
-        <li>Berechne die Koordinaten des Cursors mithilfe einer Umrechnung der Handkoordinaten der Kinect in Bildschirmkoordinaten (siehe <a href="kinect.html">Kinect Schnittstelle</a>).</li>
-        <li>Überprüfe, ob ein Klick ausgelöst wurde.</li>
-        <li>Rufe die Update-Funktion des Hauptwidgets auf. Übergebe dabei die Koordinaten des Cursors und ob ein Klick ausgelöst wurde. (Mit diesem Aufruf wird die komplette Spiellogik aktualisiert.)</li>
-        <li>Zeichne das Hauptwidget und somit auch alle untergeordneten Widgets.</li>
-    </ul>
+    <li>Solange das Fenster geöffnet ist:
+        <ul>
+            <li>Lese die Kinect-Daten ein.</li>
+            <li>Berechne die Koordinaten des Cursors mithilfe einer Umrechnung der Handkoordinaten der Kinect in Bildschirmkoordinaten (siehe <a href="kinect.html">Kinect Schnittstelle</a>).</li>
+            <li>Überprüfe, ob ein Klick ausgelöst wurde.</li>
+            <li>Rufe die Update-Funktion des Hauptwidgets auf. Übergebe dabei die Koordinaten des Cursors und ob ein Klick ausgelöst wurde. (Mit diesem Aufruf wird die komplette Spiellogik aktualisiert.)</li>
+            <li>Zeichne das Hauptwidget und somit auch alle untergeordneten Widgets.</li>
+        </ul>
+    </li>
 </ul>
 
 <h2> Der Event Manager</h2>

doc_src/_implementation/gui.html

@@ -22,7 +22,7 @@ <h3>Motivation</h3>
 <div class="row" style="margin-bottom:16px;">
     <div class="col-sm-6" style="margin-bottom:16px;">
         <a href="{{base}}/img/menu1.png" class="lightbox-link" data-lightbox="menu1">
-            <img class="img-responsive img-thumbnail" width="800" height="628" src="{{base}}/img/menu1.png" />
+            <img class="img-responsive img-thumbnail" width="800" height="628" src="{{base}}/img/menu1.png" alt="menu1.png" />
         </a>
     </div>
     <div class="col-sm-6">
@@ -118,7 +118,7 @@ <h3>GridWidget</h3>
 <div class="clearfix" style="margin-bottom:16px;">
 <div class="lfloat-sm-6">
 <a href="{{base}}/img/screenshot_3.jpg" class="lightbox-link" data-lightbox="screenshot_3">
-    <img class="img-responsive img-thumbnail" width="1366" height="768" src="{{base}}/img/screenshot_3.jpg" />
+    <img class="img-responsive img-thumbnail" width="1366" height="768" src="{{base}}/img/screenshot_3.jpg" alt="screenshot_3.jpg" />
 </a>
 </div>
 <p>Bei dem Hau den Maulwurf Spiel gibt es einige grafische Elemente, die wie in einer Tabelle oder in einem Gitter angeordnet sind. So befinden sich zum Beispiel die Maulwurfshügel in einem Gitter der Größe 3x3. Um eine leichte Positionierung solch angeordneter Elemente zu vereinfachen, haben wir die GridWidget Klasse erstellt.</p>
@@ -139,7 +139,7 @@ <h3>GridWidget</h3>
 };
 auto grid_ptr = make_shared&lt;GridWidget&gt;(3, 3);
 auto & grid = *grid_ptr; // easy access to operator()
-for (int i = 0; i < 9; ++i)
+for (int i = 0; i &lt; 9; ++i)
 {
     auto im = make_shared&lt;ImageWidget&gt;(filenames[i]);
     grid(i%3, i/3) = im;
@@ -148,9 +148,9 @@ <h3>GridWidget</h3>
 
 <br />
 
-<h3>AnimatedWidget</h2>
+<h3>AnimatedWidget</h3>
     <div class="clearfix">
-    <a href="{{base}}/img/gmole_spritesheet.png" class="lightbox-link" alt="golden_mole_spritesheet.png" data-lightbox="gmole_spritesheet"> 
+    <a href="{{base}}/img/gmole_spritesheet.png" class="lightbox-link" data-lightbox="gmole_spritesheet"> 
     <img class="img-responsive img-thumbnail lfloat-sm-6"  width="1001" height="751" src="{{base}}/img/gmole_spritesheet.png" alt="golden_mole_spritesheet"/></a>
 
     <p>In dem Hau den Maulwurf Spiel werden viele Animationen verwendet.
@@ -187,7 +187,7 @@ <h3>Motivation</h3>
 
 <div class="col-md-8 col-md-offset-2" style="margin-top:16px;margin-bottom:16px;">
     <a href="{{base}}/img/class_diagram_action.png" class="lightbox-link" data-lightbox="class_diagram_action">
-        <img class="img-responsive img-thumbnail" width="924" height="353" src="{{base}}/img/class_diagram_action.png" />
+        <img class="img-responsive img-thumbnail" width="924" height="353" src="{{base}}/img/class_diagram_action.png" alt="class_diagram_action.png" />
     </a>
 </div>
 

doc_src/_implementation/kinect.html

@@ -14,7 +14,7 @@ <h1>Kinect</h1>
 
 <h2>Umwandlung der Hand-Koordinaten</h2>
     <div class="clearfix">
-    <a href="{{base}}/img/ebene_skeleton.png" class="lightbox-link" alt="ebene_skeleton.png" data-lightbox="ebene_skeleton"> 
+    <a href="{{base}}/img/ebene_skeleton.png" class="lightbox-link" data-lightbox="ebene_skeleton"> 
         <img class="img-responsive img-thumbnail lfloat-sm-6"  width="898" height="674" src="{{base}}/img/ebene_skeleton.png" alt="ebene_skeleton.png"/>
     </a>
     <p>
@@ -37,9 +37,9 @@ <h2>Umwandlung der Hand-Koordinaten</h2>
     Daraus ergibt sich die folgende Basiswechselmatrix:
     $$
         M_{B \rightarrow E} = \left( \begin{array}{ccc}
-        S_{20} - S_{10}&0&S_{22}-S_{12} \\
-        0&X&0 \\
-        S_{22} - S_{12}&0&S_{10}-S_{20} \\
+        S_{20} - S_{10} & 0 & S_{22}-S_{12} \\
+        0 & X & 0 \\
+        S_{22} - S_{12} & 0 & S_{10}-S_{20} \\
         \end{array}
         \right)
     $$
@@ -60,33 +60,33 @@ <h2>Zittern des Cursors verhindern</h2>
 	<h2>Klick-Geste</h2>
     <p>Um einen Maulwurf in dem Hau den Maulwurf Spiel zu treffen, muss der Benutzer eine Klick Bewegung ausführen. Eine solche Klick-Geste wird bereits von OpenNi zur Verfügung gestellt, jedoch reagiert diese erst, wenn man den Arm fast ganz ausstreckt.<br/>
     Dies ist äußerst ungeeignet für das Hau den Maulwurf Spiel, da hier sehr oft und schnell geklickt werden muss. Daher haben wir eine eigene Klick-Geste entwickelt, welche früher reagiert und nur eine kleine Bewegung benötigt um einen Klick auszulösen.</p>
-    <h3> Die Klick-Geste Implementierung</h2>
+    <h3> Die Klick-Geste Implementierung</h3>
 <pre class="line-numbers">
 <code class="language-cpp">
 // Add the new point and its timestamp to the queue.
 positions_.emplace_back(elapsed_time_, point.Y);
 
 // Remove all points that are too old.
-while (!positions_.empty() && positions_.front().first+max_delay_ < elapsed_time_)
+while (!positions_.empty() && positions_.front().first+max_delay_ &lt; elapsed_time_)
     positions_.pop_front();
 
 // Check if enough movement happened.
 float sum = 0.0;
 float prev = positions_.front().second;
 for (auto const & p : positions_) {
-    if (p.second > prev) {
+    if (p.second &gt; prev) {
         sum += abs(p.second - prev);
         prev = p.second;
     }
 }
 
 // To prevent rapid clicking, only fire handle_click_() if no click happened just before.
 if (clicked_) {
-    if (sum < threshold_) {
+    if (sum &lt; threshold_) {
         clicked_ = false;
     }
 } else {
-    if (sum >= threshold_) {
+    if (sum &gt;= threshold_) {
         clicked_ = true;
         handle_click_();
     }

doc_src/_layouts/compress.html

@@ -0,0 +1,10 @@
+---
+# Jekyll layout that compresses HTML
+# v3.0.2
+# http://jch.penibelst.de/
+# © 2014–2015 Anatol Broder
+# MIT License
+---
+
+{% capture _LINE_FEED %}
+{% endcapture %}{% if site.compress_html.ignore.envs contains jekyll.environment %}{{ content }}{% else %}{% capture _content %}{{ content }}{% endcapture %}{% assign _profile = site.compress_html.profile %}{% if site.compress_html.endings == "all" %}{% assign _endings = "html head body li dt dd p rt rp optgroup option colgroup caption thead tbody tfoot tr td th" | split: " " %}{% else %}{% assign _endings = site.compress_html.endings %}{% endif %}{% for _element in _endings %}{% capture _end %}</{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _end %}{% endfor %}{% if _profile and _endings %}{% assign _profile_endings = _content | size | plus: 1 %}{% endif %}{% for _element in site.compress_html.startings %}{% capture _start %}<{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _start %}{% endfor %}{% if _profile and site.compress_html.startings %}{% assign _profile_startings = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.comments == "all" %}{% assign _comments = "<!-- -->" | split: " " %}{% else %}{% assign _comments = site.compress_html.comments %}{% endif %}{% if _comments.size == 2 %}{% capture _comment_befores %}.{{ _content }}{% endcapture %}{% assign _comment_befores = _comment_befores | split: _comments.first %}{% for _comment_before in _comment_befores %}{% if forloop.first %}{% continue %}{% endif %}{% capture _comment_outside %}{% if _carry %}{{ _comments.first }}{% endif %}{{ _comment_before }}{% endcapture %}{% capture _comment %}{% unless _carry %}{{ _comments.first }}{% endunless %}{{ _comment_outside | split: _comments.last | first }}{% if _comment_outside contains _comments.last %}{{ _comments.last }}{% assign _carry = false %}{% else %}{% assign _carry = true %}{% endif %}{% endcapture %}{% assign _content = _content | remove_first: _comment %}{% endfor %}{% if _profile %}{% assign _profile_comments = _content | size | plus: 1 %}{% endif %}{% endif %}{% assign _pre_befores = _content | split: "<pre" %}{% assign _content = "" %}{% for _pre_before in _pre_befores %}{% assign _pres = _pre_before | split: "</pre>" %}{% assign _pres_after = "" %}{% if _pres.size != 0 %}{% if site.compress_html.blanklines %}{% assign _lines = _pres.last | split: _LINE_FEED %}{% capture _pres_after %}{% for _line in _lines %}{% assign _trimmed = _line | split: " " | join: " " %}{% if _trimmed != empty or forloop.last %}{% unless forloop.first %}{{ _LINE_FEED }}{% endunless %}{{ _line }}{% endif %}{% endfor %}{% endcapture %}{% else %}{% assign _pres_after = _pres.last | split: " " | join: " " %}{% endif %}{% endif %}{% capture _content %}{{ _content }}{% if _pre_before contains "</pre>" %}<pre{{ _pres.first }}</pre>{% endif %}{% unless _pre_before contains "</pre>" and _pres.size == 1 %}{{ _pres_after }}{% endunless %}{% endcapture %}{% endfor %}{% if _profile %}{% assign _profile_collapse = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.clippings == "all" %}{% assign _clippings = "html head title base link meta style body article section nav aside h1 h2 h3 h4 h5 h6 hgroup header footer address p hr blockquote ol ul li dl dt dd figure figcaption main div table caption colgroup col tbody thead tfoot tr td th" | split: " " %}{% else %}{% assign _clippings = site.compress_html.clippings %}{% endif %}{% for _element in _clippings %}{% assign _edges = " <e;<e; </e>;</e>;</e> ;</e>" | replace: "e", _element | split: ";" %}{% assign _content = _content | replace: _edges[0], _edges[1] | replace: _edges[2], _edges[3] | replace: _edges[4], _edges[5] %}{% endfor %}{% if _profile and _clippings %}{% assign _profile_clippings = _content | size | plus: 1 %}{% endif %}{{ _content }}{% if _profile %} <table id="compress_html_profile_{{ site.time | date: "%Y%m%d" }}" class="compress_html_profile"> <thead> <tr> <td>Step <td>Bytes <tbody> <tr> <td>raw <td>{{ content | size }}{% if _profile_endings %} <tr> <td>endings <td>{{ _profile_endings }}{% endif %}{% if _profile_startings %} <tr> <td>startings <td>{{ _profile_startings }}{% endif %}{% if _profile_comments %} <tr> <td>comments <td>{{ _profile_comments }}{% endif %}{% if _profile_collapse %} <tr> <td>collapse <td>{{ _profile_collapse }}{% endif %}{% if _profile_clippings %} <tr> <td>clippings <td>{{ _profile_clippings }}{% endif %} </table>{% endif %}{% endif %}

doc_src/_layouts/default.html

@@ -1,3 +1,6 @@
+---
+layout: compress
+---
 <!DOCTYPE html>
 <html lang="en">
     {% include head.html %}

doc_src/index.html

@@ -10,7 +10,7 @@ <h1>Ziele</h1>
     <p>In dem Fortgeschrittenenpraktikum befassen wir uns mit der Programmierung für die <a href="https://de.wikipedia.org/wiki/Kinect" target="_blank">Kinect</a>. Dabei werden zwei Programme entworfen, ein interaktives Menü und ein Hau den Maulwurf Spiel.</p>
 </div>
 <h2>Das Kinect Menü</h2>
-<p>Ziel unseres Projektes ist der Entwurf eines interaktiven Menüs, mit welchem sich Kinect Programme starten und wechseln lassen, ohne die Tastatur zu benutzen.<br/ >
+<p>Ziel unseres Projektes ist der Entwurf eines interaktiven Menüs, mit welchem sich Kinect Programme starten und wechseln lassen, ohne die Tastatur zu benutzen.<br />
 Die einzelnen Menüpunkte werden aus einer XML-Datei eingelesen.</p>
 <p> Weiter Informationen unter:
     <a href="{{base}}/menu.html">Kinect Menü</a>