site: Move download button to the page center, add Android builds

site/assets/js/downloads.js

@@ -15,6 +15,7 @@ function releaseCallback(v, count, e) {
         var release = releases[i];
 
         var windowsFound = false;
+        var androidFound = false;
         release.assets.forEach(function (asset) {
             /* We only want to provide the msvc builds on the downloads page for Windows. */
             if (asset.name.includes('-mingw-')) return;
@@ -22,9 +23,13 @@ function releaseCallback(v, count, e) {
             if (asset.name.includes('windows')) {
                 windowsFound = true;
             }
+            
+            if (asset.name.includes('.apk')) {
+                androidFound = true;
+            }
         });
 
-        if (!windowsFound) {
+        if (!windowsFound && !androidFound) {
             continue;
         }
 
@@ -36,6 +41,8 @@ function releaseCallback(v, count, e) {
         var release_title = '';
         if (v == 'mainline') {
             release_title = 'Mainline Build';
+        } else if (v == 'android') {
+            release_title = 'Android Build';
         }
 
         if (release_commit) {
@@ -51,6 +58,7 @@ function releaseCallback(v, count, e) {
             if (asset.name.includes('.tar.xz')) return;
             if (asset.name.includes('-debugsymbols.zip')) return;
             if (asset.name.includes('.zsync')) return;
+            if (asset.name.includes('.aab')) return;
 
             /* We only want to provide the msvc builds on the downloads page for Windows. */
             if (asset.name.includes('-mingw-')) return;
@@ -63,6 +71,7 @@ function releaseCallback(v, count, e) {
             else if (asset.name.includes('exe')) env_icon = 'windows';
             else if (asset.name.includes('osx')) env_icon = 'apple';
             else if (asset.name.includes('AppImage')) env_icon = 'linux';
+            else if (asset.name.includes('.apk')) env_icon = 'android';
 
             var download_url = `https://github.com/yuzu-emu/yuzu-${v}/releases/download/${release.tag_name}/${asset.name}`;
 

site/assets/scss/yuzu/yuzu.scss

@@ -145,9 +145,14 @@ pre > code {
   text-align: center;
 }
 
+#download-buttons {
+  display: flex;
+  justify-content: center;
+}
+
 #download-buttons > a {
-  margin-top: 0.75rem;
+  margin-top: 2rem;
-  margin-bottom: 0.75rem;
+  margin-bottom: 0;
 }
 
 @media screen and (min-width: 780px) {
@@ -158,8 +163,8 @@ pre > code {
   }
 
   #download-buttons > a {
-    margin-top: 0;
+    padding-left: 2rem;
-    margin-bottom: 0;
+    padding-right: 2rem;
   }
 }
 

site/layouts/page/downloads.html

@@ -5,17 +5,6 @@
     <div class="container">
         <div class="mb-3" id="download-header">
             <h1 class="title is-flex-grow-1 mb-0">{{ .Title }}</h1>
-            <div id="download-buttons">
-                <a href="https://github.com/yuzu-emu/liftinstall/releases/download/1.9/yuzu_install.exe" class="button dl-button is-medium is-success" id="dl-button-windows">
-                    <span class="icon mr-1"><i class="fab fa-windows"></i></span> Download for Windows x64
-                </a>
-                <a href="https://github.com/yuzu-emu/liftinstall/releases/download/1.9/liftinstall-31b3e7e.tar.xz" class="button dl-button is-medium is-success" id="dl-button-linux">
-                    <span class="icon mr-1"><i class="fab fa-linux"></i></span> Download for Linux x64
-                </a>
-                <a href="https://play.google.com/store/apps/details?id=org.yuzu.yuzu_emu" class="button dl-button is-medium is-success" id="dl-button-android">
-                    <span class="icon mr-1"><i class="fab fa-android"></i></span> Download for Android
-                </a>
-            </div>
         </div>
 
         <div id="unsupported-platform-view">
@@ -59,6 +48,20 @@
         <div class="content" id="platform-instructions">
             {{ .Content }}
         </div>
+        
+        <div class="content">
+            <div id="download-buttons">
+                <a href="https://github.com/yuzu-emu/liftinstall/releases/download/1.9/yuzu_install.exe" class="button dl-button is-medium is-success" id="dl-button-windows">
+                    <span class="icon mr-1"><i class="fab fa-windows"></i></span> Download for Windows x64
+                </a>
+                <a href="https://github.com/yuzu-emu/liftinstall/releases/download/1.9/liftinstall-31b3e7e.tar.xz" class="button dl-button is-medium is-success" id="dl-button-linux">
+                    <span class="icon mr-1"><i class="fab fa-linux"></i></span> Download for Linux x64
+                </a>
+                <a href="https://play.google.com/store/apps/details?id=org.yuzu.yuzu_emu" class="button dl-button is-medium is-success" id="dl-button-android">
+                    <span class="icon mr-1"><i class="fab fa-android"></i></span> Download for Android
+                </a>
+            </div>
+        </div>
     </div>
 </section>
 
@@ -78,7 +81,7 @@
             </article>
         </div>
         
-        <div class="show-with-js" id="package-view">
+        <div class="show-with-js" id="package-view-mainline">
             <!-- Mainline -->
             <div class="content">
                 <h2>Builds
@@ -99,6 +102,28 @@
                 </div>
             </div>
         </div>
+        
+        <div class="show-with-js" id="package-view-android">
+            <!-- Android -->
+            <div class="content">
+                <h2>Builds
+                    <span class="tag is-info">
+                        Last release was &nbsp;
+                        <span id='last-updated-android'></span>
+                    </span>
+                </h2>
+
+                <div id="downloads-android">
+                </div>
+
+                <div id="unavailable-android" class="is-hidden">There was a problem checking GitHub. Click the link below to view them directly.</div>
+                <br />
+
+                <div class="has-text-centered">
+                    <a href="https://github.com/yuzu-emu/yuzu-android/releases">Click here to view previous versions...</a>
+                </div>
+            </div>
+        </div>
 	</div>
 </section>
 
@@ -139,6 +164,33 @@
         
         const fragment = targetId.split('-')[1];
         window.location.hash = `#${fragment}`;
+        
+        switch (targetId) {
+            case "tab-windows":
+                document.getElementById("package-view-mainline").style.display = "block";
+                document.getElementById("dl-button-windows").style.display = "";
+                document.getElementById("package-view-android").style.display = "none";
+                document.getElementById("dl-button-linux").style.display = "none";
+                document.getElementById("dl-button-android").style.display = "none";
+                break;
+            case "tab-linux":
+                document.getElementById("package-view-mainline").style.display = "block";
+                document.getElementById("dl-button-linux").style.display = "";
+                document.getElementById("package-view-android").style.display = "none";
+                document.getElementById("dl-button-windows").style.display = "none";
+                document.getElementById("dl-button-android").style.display = "none";
+                break;
+            case "tab-android":
+                document.getElementById("package-view-android").style.display = "block";
+                document.getElementById("dl-button-android").style.display = "";
+                document.getElementById("package-view-mainline").style.display = "none";
+                document.getElementById("dl-button-windows").style.display = "none";
+                document.getElementById("dl-button-linux").style.display = "none";
+                break;
+            default:
+                document.getElementById("unsupported-platform-view").style.display = "block";
+                break
+        }
     }
 
     const getOSGuess = () => {
@@ -175,6 +227,7 @@
     }
 
     getRelease('mainline');
+    getRelease('android');
 
     // Show JS relevant elements
     document.querySelectorAll(".hide-with-js")
@@ -189,23 +242,18 @@
     // Attempt autodetection of their operating system
     switch (getFragment() || getOSGuess()) {
         case "Windows":
-            document.getElementById("dl-button-linux").style.display = "none";
-            document.getElementById("dl-button-android").style.display = "none";
             setTabActive('tab-windows');
             break;
         case "Linux":
-            document.getElementById("dl-button-windows").style.display = "none";
-            document.getElementById("dl-button-android").style.display = "none";
             setTabActive('tab-linux');
             break;
         case "Android":
-            document.getElementById("dl-button-windows").style.display = "none";
-            document.getElementById("dl-button-linux").style.display = "none";
             setTabActive('tab-android');
             break;
         default:
-            document.getElementById("unsupported-platform-view").style.display = "block";
             setTabActive('tab-windows');
+            document.getElementById("dl-button-windows").style.display = "none";
+            document.getElementById("unsupported-platform-view").style.display = "block";   
             break
     }