radnom button

_layouts/track.html

@@ -9,6 +9,53 @@ layout: default
 {% assign onetracker = album.tracks | size %}
 {% endif %}
 {% endfor %}
+<script type="text/javascript">
+
+  function generateRandomPosts()
+  {
+      $.getJSON("/posts.json", function(data) {
+          console.log("[posts.json loaded for random posts]");
+
+          var postsCount = data.length;
+          var posts = data;
+
+          var randomIndexUsed = [];
+          var counter = 0;
+          var numberOfPosts = 1;
+
+          var divRandomPosts = $("#random_posts");
+
+          while (counter < numberOfPosts)
+          {
+              var randomIndex = Math.floor(Math.random() * postsCount);
+
+              if (randomIndexUsed.indexOf(randomIndex) == "-1")
+              {
+                  var postHREF = posts[randomIndex].href;
+                  var postTitle = posts[randomIndex].title;
+
+                  if (counter == (numberOfPosts - 1))
+                  {
+                      divRandomPosts.append('<a class="button" href="' + postHREF + '">🔥</a>');
+                  }
+                  else
+                  {
+                      divRandomPosts.append('<a class="button" href="' + postHREF + '">🔥</a>');
+                  }
+
+                  randomIndexUsed.push(randomIndex);
+
+                  counter++;
+              }
+          }
+      });
+  }
+
+  $(document).ready(function() {
+      generateRandomPosts();
+  });
+
+</script>
 
 <div id="trackArt">
 <section>
@@ -122,9 +169,11 @@ layout: default
       {% if page.next.url %}
       <a id="btnNext" href="{{ relBase }}{{ page.next.url }}"><span class="fas fa-fast-forward"></span></a>
       {% endif %}
+      
     </div>
+    
     <p id="npTitle" style="font-weight: bold;">{{ page.common.title }} </p>
-
+    <div id="random_posts" style="margin-right: 40px;"></div>
 
 
   </div>