mirror of
https://github.com/LizardByte/Sunshine.git
synced 2026-08-07 10:20:46 +00:00
Deploy site from c58fd6d8c6
This commit is contained in:
LizardByte-bot
+109
-497
@@ -470,503 +470,8 @@
|
||||
<section class="py-5" id="Clients">
|
||||
<div class="container px-auto">
|
||||
<h2 class="text-center fw-bolder my-5">Clients</h2>
|
||||
<div class="row gx-5">
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/android.svg" alt="Android"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/moonlight-stream/moonlight-android" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
Android
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-info rounded-pill">Official</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="pb-3">
|
||||
|
||||
<a href="https://play.google.com/store/apps/details?id=com.limelight" target="_blank">
|
||||
<img alt="Get it on Google Play"
|
||||
src="https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png"
|
||||
height="60"
|
||||
/>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="pb-3">
|
||||
|
||||
<a href="https://www.amazon.com/gp/product/B00JK4MFN2" target="_blank">
|
||||
<img alt="Available at Amazon Appstore"
|
||||
src="https://images-na.ssl-images-amazon.com/images/G/01/mobile-apps/devportal2/res/images/amazon-appstore-badge-english-black.png"
|
||||
height="60"
|
||||
style="padding: 10px;"/>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://f-droid.org/packages/com.limelight" target="_blank">
|
||||
<img alt="Get it on F-Droid"
|
||||
src="https://fdroid.gitlab.io/artwork/badge/get-it-on.png"
|
||||
height="60"
|
||||
/>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/ios.svg" alt="iOS"/>
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/appletv.svg" alt="Apple TV"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/moonlight-stream/moonlight-ios" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
iOS
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-info rounded-pill">Official</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="pb-3">
|
||||
|
||||
<a href="https://apps.apple.com/us/app/moonlight-game-streaming/id1000551566" target="_blank">
|
||||
<img alt="Download on the App Store"
|
||||
src="https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg"
|
||||
height="40"
|
||||
/>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://apps.apple.com/us/app/moonlight-game-streaming/id1000551566" target="_blank">
|
||||
<img alt="Download on Apple TV"
|
||||
src="https://developer.apple.com/app-store/marketing/guidelines/images/badge-download-on-apple-tv.svg"
|
||||
height="40"
|
||||
/>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/linux.svg" alt="Linux"/>
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/macos.svg" alt="macOS"/>
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/icons/windows.svg" alt="Windows"/>
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/steam.svg" alt="Steam"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/moonlight-stream/moonlight-qt" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
QT
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-info rounded-pill">Official</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://github.com/moonlight-stream/moonlight-qt/releases" target="_blank" class="btn btn-info">
|
||||
<i class="fab fa-github"></i>
|
||||
Download on GitHub
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/raspberrypi.svg" alt="Raspberry Pi"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/moonlight-stream/moonlight-embedded" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
Embedded
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-info rounded-pill">Official</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://github.com/irtimmer/moonlight-embedded/wiki/Packages" target="_blank" class="btn btn-info">
|
||||
<i class="fas fa-download"></i>
|
||||
Download
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/icons/xbox.svg" alt="Xbox"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/TheElixZammuto/moonlight-xbox" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
Xbox One/Series
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-warning rounded-pill">Community</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://apps.microsoft.com/store/detail/moonlight-uwp/9MW1BS08ZBTH" target="_blank">
|
||||
<img alt="Get it from Microsoft"
|
||||
src="https://get.microsoft.com/images/en-us%20dark.svg"
|
||||
height="40"
|
||||
/>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/playstationvita.svg" alt="PlayStation Vita"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/xyzz/vita-moonlight" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
PS Vita
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-warning rounded-pill">Community</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://github.com/xyzz/vita-moonlight/releases" target="_blank" class="btn btn-info">
|
||||
<i class="fab fa-github"></i>
|
||||
Download on GitHub
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/icons/nintendo-switch.svg" alt="Nintendo Switch"/>
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/android.svg" alt="Android"/>
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/appletv.svg" alt="Apple TV"/>
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/ios.svg" alt="iOS"/>
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/macos.svg" alt="macOS"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/XITRIX/Moonlight-Switch" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
Moonlight Switch
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-warning rounded-pill">Community</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://github.com/XITRIX/Moonlight-Switch/releases" target="_blank" class="btn btn-info">
|
||||
<i class="fab fa-github"></i>
|
||||
Download on GitHub
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@13/icons/wiiu.svg" alt="Wii U"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/GaryOderNichts/moonlight-wiiu" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
Nintendo Wii U
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-warning rounded-pill">Community</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://github.com/GaryOderNichts/moonlight-wiiu#quick-start" target="_blank" class="btn btn-info">
|
||||
<i class="fas fa-download"></i>
|
||||
Download
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@13/icons/nintendo3ds.svg" alt="3DS"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/zoeyjodon/moonlight-N3DS" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
New Nintendo 3DS
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-warning rounded-pill">Community</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://github.com/zoeyjodon/moonlight-N3DS" target="_blank" class="btn btn-info">
|
||||
<i class="fas fa-download"></i>
|
||||
Download
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/lg.svg" alt="LG webOS TV"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/mariotaku/moonlight-tv" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
LG webOS TV
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-warning rounded-pill">Community</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://github.com/mariotaku/moonlight-tv#download" target="_blank" class="btn btn-info">
|
||||
<i class="fas fa-download"></i>
|
||||
Download
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
|
||||
<img class="invert" src="https://cdn.jsdelivr.net/npm/simple-icons@16/icons/samsung.svg" alt="Samsung Tizen TV"/>
|
||||
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="https://github.com/brightcraft/moonlight-tizen" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
Samsung Tizen TV
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
|
||||
<span class="badge text-bg-warning rounded-pill">Community</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer p-3 px-4">
|
||||
|
||||
<div class="">
|
||||
|
||||
<a href="https://github.com/brightcraft/moonlight-tizen/releases" target="_blank" class="btn btn-info">
|
||||
<i class="fab fa-github"></i>
|
||||
Download on GitHub
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row gx-5" id="clients-container">
|
||||
<!-- Dynamically populated from sunshine.json -->
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1102,6 +607,113 @@
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Fetch clients from app directory
|
||||
fetch('https://app.lizardbyte.dev/app-directory/sunshine.json')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
const clientsContainer = document.getElementById('clients-container');
|
||||
if (!clientsContainer) return;
|
||||
|
||||
const apps = data.apps || [];
|
||||
|
||||
apps.forEach(app => {
|
||||
let iconsHtml = '';
|
||||
|
||||
// Dynamic generation from JSON icons array
|
||||
if (app.icons && Array.isArray(app.icons)) {
|
||||
app.icons.forEach(icon => {
|
||||
iconsHtml += `<img ${icon.invert ? 'class="invert"' : ''} src="${icon.src}" alt="${icon.alt}"/>`;
|
||||
});
|
||||
}
|
||||
|
||||
const typeBadge = app.official
|
||||
? '<span class="badge text-bg-info rounded-pill">Official</span>'
|
||||
: '<span class="badge text-bg-warning rounded-pill">Community</span>';
|
||||
|
||||
let downloadsHtml = '';
|
||||
|
||||
// Dynamic generation from JSON downloads array
|
||||
if (app.downloads && Array.isArray(app.downloads)) {
|
||||
app.downloads.forEach((download, index) => {
|
||||
const isLast = index === app.downloads.length - 1;
|
||||
const pbClass = isLast ? '' : ' pb-3';
|
||||
|
||||
if (download.img) {
|
||||
let styleAttr = '';
|
||||
let heightAttr = '40';
|
||||
let imgHost = '';
|
||||
try { imgHost = new URL(download.img).hostname; } catch (e) {}
|
||||
|
||||
if (imgHost === 'play.google.com' || imgHost.endsWith('.ssl-images-amazon.com') || imgHost === 'fdroid.gitlab.io') {
|
||||
heightAttr = '60';
|
||||
}
|
||||
if (imgHost.endsWith('.ssl-images-amazon.com')) {
|
||||
styleAttr = 'style="padding: 10px;"';
|
||||
}
|
||||
|
||||
downloadsHtml += `
|
||||
<div class="${pbClass.trim()}">
|
||||
<a href="${download.url}" target="_blank">
|
||||
<img alt="${download.label}"
|
||||
src="${download.img}"
|
||||
height="${heightAttr}"
|
||||
${styleAttr}/>
|
||||
</a>
|
||||
</div>
|
||||
`;
|
||||
} else {
|
||||
let btnClass = 'btn btn-info';
|
||||
let iconHtml = '<i class="fas fa-download"></i> ';
|
||||
let urlHost = '';
|
||||
try { urlHost = new URL(download.url).hostname; } catch (e) {}
|
||||
|
||||
if (urlHost === 'github.com') {
|
||||
iconHtml = '<i class="fab fa-github"></i> ';
|
||||
}
|
||||
downloadsHtml += `
|
||||
<div class="${pbClass.trim()}">
|
||||
<a href="${download.url}" target="_blank" class="${btnClass}">
|
||||
${iconHtml}${download.label}
|
||||
</a>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const projectLink = (app.links && app.links.github) || (app.links && app.links.website) || '#';
|
||||
|
||||
const clientHtml = `
|
||||
<div class="col-md-6 col-lg-4 mb-5">
|
||||
<div class="card-custom h-100 shadow border-0 rounded-0 d-flex flex-column">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="icon">
|
||||
${iconsHtml}
|
||||
</div>
|
||||
<div class="ms-3">
|
||||
<h5 class="fw-bolder mb-0">
|
||||
<a href="${projectLink}" target="_blank" class="text-decoration-none project-card-link crowdin-ignore">
|
||||
${app.name}
|
||||
</a>
|
||||
</h5>
|
||||
</div>
|
||||
<div class="ms-auto">
|
||||
${typeBadge}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
${downloadsHtml ? `
|
||||
<div class="card-footer p-3 px-4">
|
||||
${downloadsHtml}
|
||||
</div>` : ''}
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
clientsContainer.innerHTML += clientHtml;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user