fix(#160): Use array to better sort editions.

Author: arkhi

_src/_data/eleventyComputed.js

@@ -1,8 +1,8 @@
 export default {
   // Provide a structure by year to match expected output logic.
-  years: function(data) {
+  editions: function(data) {
     const participants = data.participants;
-    const years = {};
+    const editions = [];
     const yearMin = 2006; // The first CSS Naked Day.
 
     let yearMax = yearMin;
@@ -11,30 +11,40 @@ export default {
       // Basic structure: year > participant > websites.
       participants[participant].websites.forEach(website => {
         website.years.forEach(year => {
+          let currentEdition = editions.find(edition => edition.year === year);
+
           yearMax = Math.max(yearMin, year);
 
-          if (!years[year]) {
-            years[year] = {
+          // Initialise year if it does not exist.
+          if (!currentEdition) {
+            editions.push({
+              year: Number(year),
               'participants': {},
-            };
+            });
+
+            currentEdition = editions.find(edition => edition.year === year);
           }
 
-          if (!years[year]['participants'][participant]) {
-            years[year]['participants'][participant] = [];
+          // Populate participants for this year.
+          if (!currentEdition['participants'][participant]) {
+            currentEdition['participants'][participant] = [];
           }
 
-          years[year]['participants'][participant].push(website.url);
+          // Populate participant with its websites for this year.
+          currentEdition['participants'][participant].push(website.url);
         });
       });
     };
 
-    // Add missing years with no participant.
+    // Add missing editions with no participant.
     for (let year = yearMin; year < yearMax; year++) {
-      if (!years[year]) {
-        years[year] = {};
+      if (!editions.some((edition) => edition.year === year)) {
+        editions.push({ year });
       }
     }
 
-    return years;
+    editions.sort((a, b) => a.year > b.year ? 1 : -1);
+
+    return editions;
   }
 }

_src/index.njk

@@ -40,17 +40,15 @@
           <h3><a id="editions" href="#editions">CSS Naked Day editions</a></h3>
 
           <ul>
-
-            {% for index, year in years %}
+            {% for edition in editions | reverse %}
               <li>
-                {% if year.participants | length %}
-                  <a href="{{ index | slugify }}.html">{{ index }}</a>
+                {% if edition.participants | length %}
+                  <a href="{{ edition.year | slugify }}.html">{{ edition.year }}</a>
                 {% else %}
-                  {{ index }}
+                  {{ edition.year }}
                 {% endif %}
               </li>
             {% endfor %}
-
           </ul>
 
           <h3><a id="participate" href="#participate">How to participate</a></h3>

_src/year.njk

@@ -36,33 +36,37 @@
           <p>
             <a href="/">Home</a>
 
-            {% for index, year in years %}
-              {% if year.participants | length %}
-                · <a href="{{ index | slugify }}.html">{{ index }}</a>
+            {% for edition in editions %}
+              {% if edition.participants | length %}
+                · <a href="{{ edition.year | slugify }}.html">{{ edition.year }}</a>
               {% else %}
-                · {{ index }}
+                · {{ edition.year }}
               {% endif %}
             {% endfor %}
           </p>
 
           <h3>Kudos to these websites who got naked in {{ year }}!</h3>
 
           <ol>
-            {# We use both years and participants as Global Data. #}
-            {% for index, websites in years[year].participants %}
-              {% set participant = participants[index] %}
+            {# We use both editions and participants as Global Data. #}
+            {% for edition in editions %}
+              {% if edition.year === year %}
+                {% for filename, websites in edition.participants %}
+                  {% set participant = participants[filename] %}
 
-              <li>
-                {%- if websites | length === 1 -%}
-                  {% linkNoSpam 'getParticipantDisplayName', websites[0], participant, year %}
-                {%- else -%}
-                  {{ participant | getParticipantDisplayName }}:
+                  <li>
+                    {%- if websites | length === 1 -%}
+                      {% linkNoSpam 'getParticipantDisplayName', websites[0], participant, year %}
+                    {%- else -%}
+                      {{ participant | getParticipantDisplayName }}:
 
-                  {% for website in websites -%}
-                    {% linkNoSpam 'getSiteTitle', website, participant, year, loop.index0 %}
-                  {%- endfor %}
-                {% endif %}
-              </li>
+                      {% for website in websites -%}
+                        {% linkNoSpam 'getSiteTitle', website, participant, year, loop.index0 %}
+                      {%- endfor %}
+                    {% endif %}
+                  </li>
+                {% endfor %}
+              {% endif %}
             {% endfor %}
           </ol>