mirror of
https://github.com/jonasbark/swiftcontrol.git
synced 2026-02-18 00:17:40 +01:00
709 lines
27 KiB
HTML
709 lines
27 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="SwiftControl - Control your favorite trainer app using Zwift Click, Zwift Ride, Zwift Play, and other devices">
|
|
<title>SwiftControl - Control Your Virtual Cycling Experience</title>
|
|
<link rel="icon" type="image/x-icon" href="favicon.ico">
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
line-height: 1.6;
|
|
color: #333;
|
|
background: #0E74B7;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
.container {
|
|
max-width: 1200px;
|
|
margin: 0 auto;
|
|
padding: 20px;
|
|
}
|
|
|
|
header {
|
|
text-align: center;
|
|
padding: 40px 20px;
|
|
background: rgba(255, 255, 255, 0.95);
|
|
border-radius: 15px;
|
|
margin-bottom: 30px;
|
|
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.logo-container {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 20px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.logo {
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
|
|
h1 {
|
|
color: #000;
|
|
font-size: 2.5em;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.tagline {
|
|
font-size: 1.2em;
|
|
color: #666;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.main-content {
|
|
display: grid;
|
|
gap: 30px;
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.card {
|
|
background: rgba(255, 255, 255, 0.95);
|
|
border-radius: 15px;
|
|
padding: 30px;
|
|
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.card h2 {
|
|
color: #000;
|
|
margin-bottom: 20px;
|
|
font-size: 1.8em;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
}
|
|
|
|
.store-links {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 15px;
|
|
justify-content: center;
|
|
margin: 20px 0;
|
|
}
|
|
|
|
.store-badge {
|
|
display: inline-block;
|
|
transition: transform 0.2s;
|
|
}
|
|
|
|
.store-badge:hover {
|
|
transform: translateY(-5px);
|
|
}
|
|
|
|
.store-badge img {
|
|
height: 60px;
|
|
width: auto;
|
|
}
|
|
|
|
.compatibility-tool {
|
|
margin-top: 30px;
|
|
}
|
|
|
|
.dropdown-group {
|
|
margin-bottom: 25px;
|
|
}
|
|
|
|
label {
|
|
display: block;
|
|
font-weight: 600;
|
|
margin-bottom: 10px;
|
|
color: #333;
|
|
font-size: 1.1em;
|
|
}
|
|
|
|
select {
|
|
width: 100%;
|
|
padding: 12px 15px;
|
|
font-size: 16px;
|
|
border: 2px solid #ddd;
|
|
border-radius: 8px;
|
|
background-color: white;
|
|
cursor: pointer;
|
|
transition: border-color 0.2s;
|
|
}
|
|
|
|
select:hover {
|
|
border-color: #0E74B7;
|
|
}
|
|
|
|
select:focus {
|
|
outline: none;
|
|
border-color: #0E74B7;
|
|
box-shadow: 0 0 0 3px rgba(14, 116, 183, 0.1);
|
|
}
|
|
|
|
select option:disabled {
|
|
color: #999;
|
|
}
|
|
|
|
.compatibility-result {
|
|
margin-top: 30px;
|
|
padding: 20px;
|
|
border-radius: 10px;
|
|
display: none;
|
|
}
|
|
|
|
.compatibility-result.show {
|
|
display: block;
|
|
}
|
|
|
|
.result-compatible {
|
|
background-color: #d4edda;
|
|
border: 2px solid #28a745;
|
|
}
|
|
|
|
.result-limited {
|
|
background-color: #fff3cd;
|
|
border: 2px solid #ffc107;
|
|
}
|
|
|
|
.result-incompatible {
|
|
background-color: #f8d7da;
|
|
border: 2px solid #dc3545;
|
|
}
|
|
|
|
.result-header {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
margin-bottom: 15px;
|
|
font-size: 1.2em;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.result-icon {
|
|
font-size: 1.5em;
|
|
}
|
|
|
|
.result-description {
|
|
line-height: 1.8;
|
|
}
|
|
|
|
.warning-box {
|
|
background-color: #fff3cd;
|
|
border-left: 4px solid #ffc107;
|
|
padding: 15px;
|
|
margin-top: 15px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.info-box {
|
|
background-color: #d1ecf1;
|
|
border-left: 4px solid #17a2b8;
|
|
padding: 15px;
|
|
margin-top: 15px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.beta-badge {
|
|
display: inline-block;
|
|
background-color: #ffc107;
|
|
color: #000;
|
|
padding: 2px 8px;
|
|
border-radius: 4px;
|
|
font-size: 0.8em;
|
|
font-weight: 600;
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.features-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
|
gap: 20px;
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.feature-item {
|
|
padding: 15px;
|
|
background-color: #f8f9fa;
|
|
border-radius: 8px;
|
|
border-left: 4px solid #0E74B7;
|
|
}
|
|
|
|
.feature-item h3 {
|
|
color: #0E74B7;
|
|
margin-bottom: 10px;
|
|
font-size: 1.1em;
|
|
}
|
|
|
|
.supported-list {
|
|
list-style: none;
|
|
padding: 0;
|
|
}
|
|
|
|
.supported-list li {
|
|
padding: 8px 0;
|
|
padding-left: 25px;
|
|
position: relative;
|
|
}
|
|
|
|
.supported-list li:before {
|
|
content: "✓";
|
|
position: absolute;
|
|
left: 0;
|
|
color: #28a745;
|
|
font-weight: bold;
|
|
}
|
|
|
|
footer {
|
|
text-align: center;
|
|
padding: 30px 20px;
|
|
margin-top: 40px;
|
|
color: white;
|
|
}
|
|
|
|
footer a {
|
|
color: white;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
h1 {
|
|
font-size: 1.8em;
|
|
}
|
|
|
|
.logo {
|
|
width: 70px;
|
|
height: 70px;
|
|
}
|
|
|
|
.card {
|
|
padding: 20px;
|
|
}
|
|
|
|
.features-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<header>
|
|
<div class="logo-container">
|
|
<img src="logo.png" alt="SwiftControl Logo" class="logo">
|
|
<div>
|
|
<h1>SwiftControl</h1>
|
|
<p class="tagline">Control your favorite trainer app with Zwift devices and more</p>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="main-content">
|
|
<!-- Download Section -->
|
|
<div class="card">
|
|
<h2>📱 Download SwiftControl</h2>
|
|
<p style="margin-bottom: 20px;">Get started by downloading SwiftControl for your platform. Use the compatibility checker below to find the right setup for you!</p>
|
|
<div class="store-links">
|
|
<a href="https://play.google.com/store/apps/details?id=de.jonasbark.swiftcontrol" class="store-badge" target="_blank" rel="noopener">
|
|
<img src="https://github.com/user-attachments/assets/a059d5a1-2efb-4f65-8117-ef6a99823b21" alt="Get it on Google Play">
|
|
</a>
|
|
<a href="https://apps.apple.com/us/app/swiftcontrol/id6753721284?platform=iphone" class="store-badge" target="_blank" rel="noopener">
|
|
<img src="https://github.com/user-attachments/assets/c23f977a-48f6-4951-811e-ae530dbfa014" alt="Download on the App Store">
|
|
</a>
|
|
<a href="https://apps.apple.com/us/app/swiftcontrol/id6753721284?platform=mac" class="store-badge" target="_blank" rel="noopener">
|
|
<img src="https://github.com/user-attachments/assets/b3552436-409c-43b0-ba7d-b6a72ae30ff1" alt="Download on the Mac App Store">
|
|
</a>
|
|
<a href="https://apps.microsoft.com/detail/9NP42GS03Z26" class="store-badge" target="_blank" rel="noopener">
|
|
<img src="https://github.com/user-attachments/assets/7a8a3cd6-ec26-4678-a850-732eedd27c48" alt="Get it from Microsoft">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Compatibility Checker -->
|
|
<div class="card">
|
|
<h2>🔍 Compatibility Checker</h2>
|
|
<p style="margin-bottom: 20px;">Find out which platform you need to download SwiftControl on based on where you want to run your trainer app.</p>
|
|
|
|
<div class="compatibility-tool">
|
|
<div class="dropdown-group">
|
|
<label for="trainer-platform">1. Where Do You Want to Run Your Trainer App?</label>
|
|
<select id="trainer-platform">
|
|
<option value="">-- Choose a platform --</option>
|
|
<option value="android">Android</option>
|
|
<option value="ipad">iPad</option>
|
|
<option value="windows">Windows</option>
|
|
<option value="macos">macOS</option>
|
|
<option value="iphone">iPhone</option>
|
|
<option value="appletv">Apple TV</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="dropdown-group">
|
|
<label for="trainer-app">2. Select Your Trainer App (Optional)</label>
|
|
<select id="trainer-app">
|
|
<option value="">-- Choose a trainer app --</option>
|
|
<option value="mywhoosh">MyWhoosh</option>
|
|
<option value="zwift">Zwift</option>
|
|
<option value="trainingpeaks">TrainingPeaks Virtual / IndieVelo</option>
|
|
<option value="biketerra">Biketerra</option>
|
|
<option value="rouvy">Rouvy</option>
|
|
<option value="custom">Custom / Other App</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div id="compatibility-result" class="compatibility-result">
|
|
<!-- Results will be displayed here -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Features Section -->
|
|
<div class="card">
|
|
<h2>✨ What Can SwiftControl Do?</h2>
|
|
<div class="features-grid">
|
|
<div class="feature-item">
|
|
<h3>Virtual Gear Shifting</h3>
|
|
<p>Control your virtual gears seamlessly</p>
|
|
</div>
|
|
<div class="feature-item">
|
|
<h3>Steering & Turning</h3>
|
|
<p>Navigate your virtual routes with precision</p>
|
|
</div>
|
|
<div class="feature-item">
|
|
<h3>Workout Intensity</h3>
|
|
<p>Adjust workout intensity on the fly</p>
|
|
</div>
|
|
<div class="feature-item">
|
|
<h3>Music Control</h3>
|
|
<p>Control music playback while you ride</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Supported Devices & Apps -->
|
|
<div class="card">
|
|
<h2>🎮 Supported Devices & Apps</h2>
|
|
<div class="features-grid">
|
|
<div class="feature-item">
|
|
<h3>Devices</h3>
|
|
<ul class="supported-list">
|
|
<li>Zwift Click & Click v2</li>
|
|
<li>Zwift Ride</li>
|
|
<li>Zwift Play</li>
|
|
<li>Shimano Di2</li>
|
|
<li>Wahoo Kickr Bike Shift</li>
|
|
<li>Elite Sterzo Smart</li>
|
|
<li>Gamepads</li>
|
|
</ul>
|
|
</div>
|
|
<div class="feature-item">
|
|
<h3>Trainer Apps</h3>
|
|
<ul class="supported-list">
|
|
<li>MyWhoosh</li>
|
|
<li>Zwift</li>
|
|
<li>TrainingPeaks Virtual</li>
|
|
<li>IndieVelo</li>
|
|
<li>Biketerra</li>
|
|
<li>Rouvy</li>
|
|
<li>Custom apps via mapping</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Instructions Section -->
|
|
<div class="card">
|
|
<h2>📖 Instructions & Help</h2>
|
|
<p style="margin-bottom: 20px;">Need help getting started? Check out these resources:</p>
|
|
<div class="features-grid">
|
|
<div class="feature-item">
|
|
<h3>📄 General Instructions</h3>
|
|
<p>Complete guide to using SwiftControl with all supported platforms and trainer apps.</p>
|
|
<a href="https://github.com/jonasbark/swiftcontrol/blob/main/README.md" target="_blank" style="color: #0E74B7; text-decoration: none; font-weight: 600;">View README →</a>
|
|
</div>
|
|
<div class="feature-item">
|
|
<h3>🍎 iOS Instructions</h3>
|
|
<p>Special instructions for using MyWhoosh Direct Connect on iOS devices.</p>
|
|
<a href="https://github.com/jonasbark/swiftcontrol/blob/main/INSTRUCTIONS_IOS.md" target="_blank" style="color: #0E74B7; text-decoration: none; font-weight: 600;">View iOS Guide →</a>
|
|
</div>
|
|
<div class="feature-item">
|
|
<h3>🔧 Troubleshooting</h3>
|
|
<p>Having issues? Check our troubleshooting guide for common problems and solutions.</p>
|
|
<a href="https://github.com/jonasbark/swiftcontrol/blob/main/TROUBLESHOOTING.md" target="_blank" style="color: #0E74B7; text-decoration: none; font-weight: 600;">View Troubleshooting →</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<footer>
|
|
<p>Made with ❤️ for cyclists | <a href="https://github.com/jonasbark/swiftcontrol" target="_blank">View on GitHub</a></p>
|
|
<p style="margin-top: 10px;"><a href="https://paypal.me/boni" target="_blank">Support Development via PayPal</a></p>
|
|
</footer>
|
|
</div>
|
|
|
|
<script>
|
|
// Platform information from README compatibility matrix
|
|
const platformInfo = {
|
|
android: {
|
|
name: 'Android',
|
|
supported: true,
|
|
storeLink: 'https://play.google.com/store/apps/details?id=de.jonasbark.swiftcontrol',
|
|
storeName: 'Google Play Store',
|
|
swiftControlPlatforms: ['android'],
|
|
info: 'You can run SwiftControl on the same Android device where your trainer app runs.',
|
|
restrictions: {}
|
|
},
|
|
ipad: {
|
|
name: 'iPad',
|
|
supported: true,
|
|
storeLink: 'https://apps.apple.com/us/app/swiftcontrol/id6753721284?platform=iphone',
|
|
storeName: 'App Store',
|
|
swiftControlPlatforms: ['ios', 'android'],
|
|
info: 'You will need to use SwiftControl as a "remote" to control the trainer app on your iPad. Typically, you would use an iPhone or an Android phone for that.',
|
|
restrictions: {}
|
|
},
|
|
windows: {
|
|
name: 'Windows',
|
|
supported: true,
|
|
storeLink: 'https://apps.microsoft.com/detail/9NP42GS03Z26',
|
|
storeName: 'Microsoft Store',
|
|
swiftControlPlatforms: ['windows'],
|
|
info: 'You can run SwiftControl on the same Windows PC where your trainer app runs.',
|
|
restrictions: {
|
|
general: 'Windows may flag the app as virus. It likely does so because the app controls the mouse and keyboard. Bluetooth connection unstable? You may need to use an external Bluetooth adapter.'
|
|
}
|
|
},
|
|
macos: {
|
|
name: 'macOS',
|
|
supported: true,
|
|
storeLink: 'https://apps.apple.com/us/app/swiftcontrol/id6753721284?platform=mac',
|
|
storeName: 'Mac App Store',
|
|
swiftControlPlatforms: ['macos'],
|
|
info: 'You can run SwiftControl on the same Mac where your trainer app runs.',
|
|
restrictions: {}
|
|
},
|
|
iphone: {
|
|
name: 'iPhone',
|
|
supported: 'limited',
|
|
storeLink: 'https://apps.apple.com/us/app/swiftcontrol/id6753721284?platform=iphone',
|
|
storeName: 'App Store',
|
|
swiftControlPlatforms: ['ios', 'android'],
|
|
info: 'Note that you can\'t run SwiftControl and your trainer app on the same iPhone due to iOS limitations, but you could use the Link method on another device to control MyWhoosh (and only MyWhoosh) on an iPhone.',
|
|
restrictions: {
|
|
mywhoosh: 'Only MyWhoosh is supported using the Link method. You will need another device to run SwiftControl.'
|
|
}
|
|
},
|
|
appletv: {
|
|
name: 'Apple TV',
|
|
supported: 'limited',
|
|
swiftControlPlatforms: ['ios', 'android'],
|
|
info: 'Only MyWhoosh using the Link method is supported - but you cannot also use MyWhoosh Link at the same time.',
|
|
restrictions: {
|
|
mywhoosh: 'Only MyWhoosh is supported using the Link method. You will need another device to run SwiftControl.'
|
|
}
|
|
}
|
|
};
|
|
|
|
// Trainer app specific information
|
|
const trainerApps = {
|
|
mywhoosh: {
|
|
name: 'MyWhoosh',
|
|
supportedPlatforms: ['android', 'ipad', 'windows', 'macos', 'iphone', 'appletv']
|
|
},
|
|
zwift: {
|
|
name: 'Zwift',
|
|
supportedPlatforms: ['android', 'ipad', 'windows', 'macos'],
|
|
restrictions: {
|
|
android: 'Running SwiftControl on Android is required to act as a "Controllable" in Zwift.',
|
|
windows: 'Running SwiftControl on Windows is required to act as a "Controllable" in Zwift.',
|
|
ipad: 'iOS and macOS are not able to act as a "Controllable" in Zwift, only on-screen controls available.',
|
|
macos: 'iOS and macOS are not able to act as a "Controllable" in Zwift, only on-screen controls available.'
|
|
}
|
|
},
|
|
trainingpeaks: {
|
|
name: 'TrainingPeaks Virtual / IndieVelo',
|
|
supportedPlatforms: ['android', 'ipad', 'windows', 'macos']
|
|
},
|
|
biketerra: {
|
|
name: 'Biketerra',
|
|
supportedPlatforms: ['android', 'ipad', 'windows', 'macos']
|
|
},
|
|
rouvy: {
|
|
name: 'Rouvy',
|
|
supportedPlatforms: ['android', 'ipad', 'windows', 'macos']
|
|
},
|
|
custom: {
|
|
name: 'Custom / Other App',
|
|
supportedPlatforms: ['android', 'ipad', 'windows', 'macos']
|
|
}
|
|
};
|
|
|
|
const trainerPlatformSelect = document.getElementById('trainer-platform');
|
|
const trainerAppSelect = document.getElementById('trainer-app');
|
|
const resultDiv = document.getElementById('compatibility-result');
|
|
|
|
trainerPlatformSelect.addEventListener('change', function() {
|
|
updateCompatibility();
|
|
});
|
|
|
|
trainerAppSelect.addEventListener('change', function() {
|
|
updateCompatibility();
|
|
});
|
|
|
|
function updateCompatibility() {
|
|
const selectedPlatform = trainerPlatformSelect.value;
|
|
const selectedApp = trainerAppSelect.value;
|
|
|
|
if (!selectedPlatform) {
|
|
resultDiv.classList.remove('show');
|
|
return;
|
|
}
|
|
|
|
const platform = platformInfo[selectedPlatform];
|
|
const app = selectedApp ? trainerApps[selectedApp] : null;
|
|
|
|
// Check if platform is supported
|
|
if (!platform.supported || platform.supported === 'limited') {
|
|
showLimitedSupport(platform, app, selectedPlatform);
|
|
return;
|
|
}
|
|
|
|
// Check app-specific compatibility
|
|
if (app && !app.supportedPlatforms.includes(selectedPlatform)) {
|
|
showIncompatible(platform, app, selectedPlatform);
|
|
return;
|
|
}
|
|
|
|
// Show compatible result
|
|
showCompatible(platform, app, selectedPlatform);
|
|
}
|
|
|
|
function showCompatible(platform, app, platformKey) {
|
|
resultDiv.className = 'compatibility-result show result-compatible';
|
|
|
|
const appName = app ? app.name : 'your trainer app';
|
|
const appRestrictions = app && app.restrictions && app.restrictions[platformKey];
|
|
const hasRestrictions = appRestrictions || (platform.restrictions && platform.restrictions.general);
|
|
|
|
let html = `
|
|
<div class="result-header">
|
|
<span class="result-icon">${hasRestrictions ? '⚠️' : '✅'}</span>
|
|
<span>${hasRestrictions ? 'Compatible with Limitations' : 'Fully Compatible'}</span>
|
|
</div>
|
|
<div class="result-description">
|
|
<p><strong>${appName}</strong> on <strong>${platform.name}</strong></p>
|
|
<p style="margin-top: 10px;">${platform.info}</p>
|
|
`;
|
|
|
|
// Show app restrictions if any
|
|
if (appRestrictions) {
|
|
html += `
|
|
<div class="warning-box">
|
|
<strong>⚠️ Important:</strong> ${appRestrictions}
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
// Show platform restrictions if any
|
|
if (platform.restrictions && platform.restrictions.general) {
|
|
html += `
|
|
<div class="warning-box">
|
|
<strong>⚠️ Note:</strong> ${platform.restrictions.general}
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
// Show download recommendation
|
|
if (platform.swiftControlPlatforms.length === 1 && platform.swiftControlPlatforms[0] === platform.name.toLowerCase()) {
|
|
// Same device
|
|
html += `
|
|
<div class="info-box">
|
|
<strong>📥 Download SwiftControl:</strong><br>
|
|
Install SwiftControl on your <strong>${platform.name}</strong> device using the <strong>${platform.storeName}</strong> (use download links at the top of this page).
|
|
</div>
|
|
`;
|
|
} else {
|
|
// Remote control scenario
|
|
const platformsList = platform.swiftControlPlatforms.map(p => {
|
|
if (p === 'android') return 'Android';
|
|
if (p === 'ios') return 'iPhone/iPad';
|
|
if (p === 'macos') return 'macOS';
|
|
if (p === 'windows') return 'Windows';
|
|
return p;
|
|
}).join(' or ');
|
|
|
|
html += `
|
|
<div class="info-box">
|
|
<strong>📥 Download SwiftControl:</strong><br>
|
|
Install SwiftControl on a <strong>${platformsList}</strong> device (use download links at the top of this page).<br>
|
|
<br>
|
|
<strong>Setup:</strong><br>
|
|
1. Run SwiftControl on your ${platformsList} device<br>
|
|
2. Connect your controller devices (Zwift Click, etc.) to SwiftControl<br>
|
|
3. SwiftControl will remotely control ${appName} running on your ${platform.name}
|
|
`;
|
|
|
|
if (app && app.name === 'MyWhoosh') {
|
|
html += `<br><br><small>💡 Tip: You can use MyWhoosh Direct Connect for a seamless experience. <a href="https://github.com/jonasbark/swiftcontrol/blob/main/INSTRUCTIONS_IOS.md" target="_blank" style="color: #0E74B7;">See instructions</a></small>`;
|
|
}
|
|
|
|
html += `
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
html += `</div>`;
|
|
resultDiv.innerHTML = html;
|
|
|
|
if (hasRestrictions) {
|
|
resultDiv.classList.remove('result-compatible');
|
|
resultDiv.classList.add('result-limited');
|
|
}
|
|
}
|
|
|
|
function showLimitedSupport(platform, app, platformKey) {
|
|
resultDiv.className = 'compatibility-result show result-limited';
|
|
|
|
const appName = app ? app.name : 'trainer apps';
|
|
|
|
let html = `
|
|
<div class="result-header">
|
|
<span class="result-icon">⚠️</span>
|
|
<span>Limited Support</span>
|
|
</div>
|
|
<div class="result-description">
|
|
<p><strong>${appName}</strong> on <strong>${platform.name}</strong></p>
|
|
<p style="margin-top: 10px;">${platform.info}</p>
|
|
`;
|
|
|
|
if (app && platform.restrictions && platform.restrictions[app]) {
|
|
html += `
|
|
<div class="warning-box">
|
|
<strong>⚠️ Important:</strong> ${platform.restrictions[app]}
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
html += `</div>`;
|
|
resultDiv.innerHTML = html;
|
|
}
|
|
|
|
function showIncompatible(platform, app, platformKey) {
|
|
resultDiv.className = 'compatibility-result show result-incompatible';
|
|
|
|
resultDiv.innerHTML = `
|
|
<div class="result-header">
|
|
<span class="result-icon">❌</span>
|
|
<span>Not Supported</span>
|
|
</div>
|
|
<div class="result-description">
|
|
<p><strong>${app.name}</strong> is not supported on <strong>${platform.name}</strong>.</p>
|
|
<p style="margin-top: 10px;">Please select a different platform or trainer app.</p>
|
|
</div>
|
|
`;
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|