Randomized display order of user pictures

Author: keitharm

public/js/photos.js

@@ -10,14 +10,20 @@
         document.getElementById('photos_' + g).appendChild(thephoto);
       };
 
+      var menNums = randomNums(95);
+      var womenNums = randomNums(95);
+      var legoNums = randomNums(9); // Legos are people too
+
       for (var i = 0; i <= 99; i++) {
-        createImage(i, 'men');
+        createImage(menNums[i], 'men');
       }
+
       for (var i = 0; i <= 95; i++) {
-        createImage(i, 'women');
+        createImage(womenNums[i], 'women');
       }
+
       for (var i = 0; i <= 9; i++) {
-        createImage(i, 'lego');
+        createImage(legoNums[i], 'lego');
       }
 
       Array.prototype.slice.call(document.getElementsByTagName('img')).forEach(function(el) {
@@ -67,4 +73,26 @@
       }
     })();
   }
+
+  // It's <insert year here>, gotta be PC
+  function randomNums(amt) {
+    function shuffle(array) {
+      var m = array.length, t, i;
+
+      // While there remain elements to shuffle…
+      while (m) {
+
+        // Pick a remaining element
+        i = Math.floor(Math.random() * m--);
+
+        // And swap it with the current element.
+        t = array[m];
+        array[m] = array[i];
+        array[i] = t;
+      }
+
+      return array;
+    }
+    return shuffle(new Array(amt).fill(0).map(function(v, i) { return i; }));
+  }
 })();

views/pages/photos.ejs

@@ -14,20 +14,30 @@
 
   <div class="frame">
 
+  <% if (Math.floor(Math.random() * 2) === 1) { %>
+    <section id="women">
+      <h2>Ladies</h2>
+      <div id="photos_women"></div>
+    </section>
+    <section id="men">
+      <h2>Gentlemen</h2>
+      <div id="photos_men"></div>
+    </section>
+  <% } else { %>
     <section id="men">
       <h2>Gentlemen</h2>
       <div id="photos_men"></div>
     </section>
-
     <section id="women">
       <h2>Ladies</h2>
       <div id="photos_women"></div>
     </section>
-
+  <% } %>
     <section id="lego">
       <h2>Lego</h2>
       <div id="photos_lego"></div>
     </section>
+
     <% include ../snippets/ads %>
   </div>
   <% include ../snippets/footer %>