https://www.videogo.io/js/platform-toggle-white.js

1(function () {
2    // 注入样式
3    const style = document.createElement('style');
4    style.textContent = `
5        .btn-groups { display: none; }
6        .btn-groups.show { display: flex; }
7
8        .platform-switch-hint {
9            margin-top: 15px;
10            margin-left: 10px;
11            font-size: 15px;
12            color: #666;
13            display: inline-flex;
14            align-items: center;
15            gap: 8px;
16            cursor: pointer;
17            color: white;
18        }
19        .platform-icon {
20            width: 24px !important;
21            height: 24px !important;
22            object-fit: contain;
23            flex-shrink: 0;
24            cursor: pointer;
25            transition: opacity 0.2s ease;
26        }
27        .platform-icon.active {
28            cursor: default;
29        }
30    `;
31    document.head.appendChild(style);
32
33    function detectOS() {
34        const ua = navigator.userAgent.toLowerCase();
35        const platform = navigator.platform.toLowerCase();
36        if (platform.includes('mac')) return 'mac';
37        if (platform.includes('win')) return 'win';
38        if (/iphone|ipad|ipod/.test(ua)) return 'mac'; // iOS 显示 Mac 按钮
39        if (/android/.test(ua)) return 'android';
40        return 'win'; // 其他系统默认显示 Windows 按钮
41    }
42
43    function getSwitchTarget(currentOS) {
44        return currentOS === 'mac' ? 'win' : 'mac';
45    }
46
47    function getSwitchHintHTML(targetOS) {
48        const label = targetOS === 'mac' ? 'Switch to Mac' : 'Switch to Windows';
49        const icon = `/image/icon/${targetOS}-white.png`;
50        return `<img src="${icon}" alt="${targetOS}"> ${label}`;
51    }
52
53    function getMultiPlatformHTML(currentOS) {
54        const platforms = [
55            { key: 'win', label: 'Windows' },
56            { key: 'mac', label: 'Mac' },
57            { key: 'android', label: 'Android' }
58        ];
59        return `Available for ${platforms.map(p => {
60            const isActive = p.key === currentOS;
61            const icon = `/image/icon/${p.key}${isActive ? '-hover' : ''}.png`;
62            return `<img src="${icon}" title="${p.label}" class="platform-icon ${isActive ? 'active' : ''}" data-target="${p.key}" alt="${p.label}">`;
63        }).join('')}`;
64    }
65
66    function switchPlatform(sys) {
67        let matched = false;
68
69        // 隐藏所有按钮组
70        document.querySelectorAll('.btn-groups').forEach(group => {
71            group.classList.remove('show');
72        });
73
74        // 显示匹配平台的按钮组
75        const groups = document.querySelectorAll(`.btn-groups.sys-${sys}`);
76        if (groups.length > 0) {
77            matched = true;
78            groups.forEach(group => group.classList.add('show'));
79        }
80
81        // fallback：如果没有匹配的，显示 Windows 按钮组
82        if (!matched) {
83            document.querySelectorAll('.btn-groups.sys-win').forEach(group => {
84                group.classList.add('show');
85            });
86        }
87
88        // 切换提示文字
89        document.querySelectorAll('.platform-switch-hint').forEach(hintEl => {
90            const mode = hintEl.getAttribute('data-mode') || 'single';
91            if (mode === 'multi') {
92                hintEl.innerHTML = getMultiPlatformHTML(sys);
93                hintEl.querySelectorAll('.platform-icon').forEach(icon => {
94                    const target = icon.getAttribute('data-target');
95                    icon.onclick = target !== sys ? () => switchPlatform(target) : null;
96                });
97            } else {
98                const targetOS = getSwitchTarget(sys);
99                hintEl.innerHTML = getSwitchHintHTML(targetOS);
100                hintEl.onclick = () => switchPlatform(targetOS);
101            }
102        });
103    }
104
105    document.addEventListener('DOMContentLoaded', () => {
106        const currentOS = detectOS();
107        switchPlatform(currentOS);
108    });
109})();