downloads: add MacOS latest release buttons (#117)

This commit is contained in:
Tyler Wilding
2022-04-29 23:43:16 -04:00
committed by GitHub
parent 9e61310e2a
commit 3b95254eb3
6 changed files with 64 additions and 24 deletions

View File

@@ -2,7 +2,7 @@
type: page
layout: downloads
title: Downloads
summary: The official source for the latest stable and nightly (dev) builds for PCSX2 on all supported platforms
summary: The official source for the latest stable and nightly builds (aka dev builds) for PCSX2 on all supported platforms
images:
- thumbnail-logo.webp
sitemap:

View File

@@ -262,6 +262,7 @@ a
.dropdown-menu
background-color: var(--secondary-bg-color)
border: var(--tertiary-bg-color) 2px solid
.dropdown-item
color: var(--heading-color)

View File

@@ -1,6 +1,4 @@
@media (max-width: 575.98px)
div > .artifact-button:not(:first-child)
margin-top: 2em
.pagination-container
-webkit-box-pack: center !important
-ms-flex-pack: center !important
@@ -10,6 +8,9 @@
text-transform: unset
font-size: 1em
.empty-artifact-dropdown
cursor: not-allowed
.release-type-title
font-weight: 700
@@ -58,9 +59,11 @@
font-size: 1.5em
color: var(--link-color)
transition: color .15s ease-in-out
&:hover
&:hover:not(.disabled)
color: var(--tertiary-color)
transition: color .15s ease-in-out
&.disabled
filter: opacity(50%)
.release-no-previous-text
text-align: center
@@ -71,8 +74,9 @@
.pr-deletions
color: #f85149
a.disabled
cursor: pointer
.release-artifact-link
&.disabled
cursor: not-allowed
.scroll-fix
scroll-margin-top: 10rem

View File

@@ -8,7 +8,7 @@
<a href="#stable-anchor">Stable Releases</a>
</li>
<li>
<a href="#nightly-anchor">Nightly Releases</a>
<a href="#nightly-anchor">Nightly Releases (aka Dev Builds)</a>
</li>
<li>
<a href="#pr-anchor">Pull Request Builds</a>
@@ -55,9 +55,9 @@
</p>
<div id="latest-release-notes"></div>
</div>
<div class="row mt-5" id="latest-release-artifacts"></div>
<div class="row mt-5 d-flex justify-content-center" id="latest-release-artifacts"></div>
<div class="row skeleton-wrapper">
<div class="col d-flex justify-content-center">
<div class="col-12 col-sm mb-4 d-flex justify-content-center">
<div class="dropdown">
<button class="btn btn-primary artifact-dropdown btn-lg dropdown-toggle" type="button" id="dropdownMenuButton"
data-mdb-toggle="dropdown" aria-expanded="false" disabled>
@@ -67,7 +67,17 @@
</button>
</div>
</div>
<div class="col d-flex justify-content-center">
<div class="col-12 col-sm mb-4 d-flex justify-content-center">
<div class="dropdown">
<button class="btn btn-primary artifact-dropdown btn-lg dropdown-toggle" type="button" id="dropdownMenuButton"
data-mdb-toggle="dropdown" aria-expanded="false" disabled>
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</button>
</div>
</div>
<div class="col-12 col-sm d-flex justify-content-center">
<div class="dropdown">
<button class="btn btn-primary artifact-dropdown btn-lg dropdown-toggle" type="button" id="dropdownMenuButton"
data-mdb-toggle="dropdown" aria-expanded="false" disabled>
@@ -94,7 +104,7 @@
</tr>
</thead>
<tbody id="stable-table-body">
{{- partial "downloads/skeleton-table.html" (dict "numRows" 3 "numCols" 4) -}}
{{- partial "downloads/skeleton-table.html" (dict "numRows" 10 "numCols" 4) -}}
</tbody>
</table>
</div>
@@ -115,9 +125,9 @@
</p>
<div id="latest-nightly-notes"></div>
</div>
<div class="row mt-5" id="latest-nightly-artifacts"></div>
<div class="row mt-5 d-flex justify-content-center" id="latest-nightly-artifacts"></div>
<div class="row skeleton-wrapper">
<div class="col d-flex justify-content-center">
<div class="col-12 col-sm mb-4 d-flex justify-content-center">
<div class="dropdown">
<button class="btn btn-primary artifact-dropdown btn-lg dropdown-toggle" type="button" id="dropdownMenuButton"
data-mdb-toggle="dropdown" aria-expanded="false" disabled>
@@ -127,7 +137,17 @@
</button>
</div>
</div>
<div class="col d-flex justify-content-center">
<div class="col-12 col-sm mb-4 d-flex justify-content-center">
<div class="dropdown">
<button class="btn btn-primary artifact-dropdown btn-lg dropdown-toggle" type="button" id="dropdownMenuButton"
data-mdb-toggle="dropdown" aria-expanded="false" disabled>
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</button>
</div>
</div>
<div class="col-12 col-sm d-flex justify-content-center">
<div class="dropdown">
<button class="btn btn-primary artifact-dropdown btn-lg dropdown-toggle" type="button" id="dropdownMenuButton"
data-mdb-toggle="dropdown" aria-expanded="false" disabled>
@@ -155,7 +175,7 @@
</thead>
<tbody id="nightly-table-body">
<!-- skeleton loading -->
{{- partial "downloads/skeleton-table.html" (dict "numRows" 3 "numCols" 4) -}}
{{- partial "downloads/skeleton-table.html" (dict "numRows" 10 "numCols" 4) -}}
</tbody>
</table>
</div>
@@ -188,7 +208,7 @@
</thead>
<tbody id="pull-request-table-body">
<!-- skeleton loading -->
{{- partial "downloads/skeleton-table.html" (dict "numRows" 3 "numCols" 5) -}}
{{- partial "downloads/skeleton-table.html" (dict "numRows" 10 "numCols" 5) -}}
</tbody>
</table>
</div>

View File

@@ -1,10 +1,10 @@
{{ $cellWidths := slice 25 50 75 }}
{{ range (seq .numRows)}}
{{ $cellWidths := slice 25 50 75 100 }}
{{ range $rowIndex := (seq $.numRows)}}
<tr>
{{ range (seq $.numCols)}}
<td>
<div class="skeleton-text">
<div class="skeleton-line" style="width: {{ index (shuffle $cellWidths) 0 }}%"></div>
<div class="skeleton-line" style="width: {{ index (shuffle $cellWidths) (mod $rowIndex (len $cellWidths)) }}%"></div>
</div>
</td>
{{ end }}

View File

@@ -1,12 +1,12 @@
let latestArtifactDropdown = doT.template(`
<div class="col-12 col-sm d-flex justify-content-center artifact-button">
<div class="col-12 col-md-4 mb-4 mb-md-0 d-flex justify-content-center artifact-button">
<div class="dropdown">
{{? it.assets.length }}
<button class="btn btn-primary artifact-dropdown btn-lg dropdown-toggle" type="button" id="dropdownMenuButton" data-mdb-toggle="dropdown" aria-expanded="false">
<i class="{{= it.icon }}"></i>&nbsp{{= it.name }}&nbsp-&nbsp{{= it.version }}
</button>
{{?? true}}
<span class="d-inline-block" tabindex="0" data-mdb-toggle="tooltip" title="No release found for this version - See below">
<span class="d-inline-block empty-artifact-dropdown" tabindex="0" data-mdb-toggle="tooltip" title="No release found for this version - See below">
<button class="btn btn-primary artifact-dropdown btn-lg dropdown-toggle" type="button" id="dropdownMenuButton" data-mdb-toggle="dropdown" aria-expanded="false" style="pointer-events: none;" disabled>
<i class="{{= it.icon }}"></i>&nbsp{{= it.name }}&nbsp-&nbsp{{= it.version }}
</button>
@@ -53,8 +53,8 @@ let releaseRow = doT.template(`
</ul>
{{?? true}}
<span class="d-inline-block" tabindex="0" data-mdb-toggle="tooltip" title="No release found for this version">
<a role="button" data-mdb-toggle="dropdown" data-mdb-ripple-duration="none" class="disabled">
<i class="{{= platform.icon }} release-artifact-icon"></i>
<a role="button" class="release-artifact-link disabled" data-mdb-toggle="dropdown" data-mdb-ripple-duration="none">
<i class="{{= platform.icon }} release-artifact-icon disabled"></i>
</a>
</span>
{{?}}
@@ -182,6 +182,16 @@ $('document').ready(async function () {
} catch (e) {
$('#outage-alert').show();
}
// Scroll to anchor tag if relevant
if(window.location.hash) {
var elem = document.getElementById(window.location.hash.replace("#", ""));
if (elem != null) {
elem.scrollIntoView({
behavior: 'smooth'
});
}
}
});
function renderLatestRelease(latestRelease, selector) {
@@ -198,9 +208,14 @@ function renderLatestRelease(latestRelease, selector) {
name: "Linux",
icon: "fab fa-linux",
version: latestRelease.version
}) +
latestArtifactDropdown({
assets: latestRelease.assets.MacOS.filter(asset => !asset.additionalTags.includes("symbols")),
name: "MacOS",
icon: "fab fa-apple",
version: latestRelease.version
})
);
// TODO - macOS
$(function () {
$('[data-mdb-toggle="tooltip"]').tooltip()
});