Comparison

mod_invites_page/html/invite.html @ 5742:18bae78282a6

mod_invites_page: Move the JS script to its own file
author Emmanuel Gil Peyrot <linkmauve@linkmauve.fr>
date Thu, 16 Nov 2023 16:16:55 +0100
parent 5741:8cd617c0b701
comparison
equal deleted inserted replaced
5741:8cd617c0b701 5742:18bae78282a6
103 103
104 <script src="/share/jquery/jquery.min.js"></script> 104 <script src="/share/jquery/jquery.min.js"></script>
105 <script src="/share/bootstrap4/js/bootstrap.min.js"></script> 105 <script src="/share/bootstrap4/js/bootstrap.min.js"></script>
106 <script src="{static}/qrcode.min.js"></script> 106 <script src="{static}/qrcode.min.js"></script>
107 <script src="{static}/platform.min.js"></script> 107 <script src="{static}/platform.min.js"></script>
108 <script> 108 <script src="{static}/invite.js"></script>
109 (function () {
110 // If QR lib loaded ok, show QR button on desktop devices
111 if(window.QRCode) {
112 new QRCode(document.getElementById("qr-invite-page"), document.location.href);
113 document.getElementById('qr-button-container').classList.remove("d-none");
114 }
115
116 // Detect current platform and show/hide appropriate clients
117 if(window.platform) {
118 var platform_friendly = null;
119 var platform_classname = null;
120
121 switch(platform.os.family) {
122 case "Ubuntu":
123 case "Linux":
124 case "Fedora":
125 case "Red Hat":
126 case "SuSE":
127 platform_friendly = platform.os.family + " (Linux)";
128 platform_classname = "linux";
129 break;
130 case "Windows Phone":
131 platform_friendly = "Windows Phone";
132 platform_classname = "windows-phone";
133 break;
134 default:
135 if(platform.os.family.startsWith("Windows")) {
136 platform_friendly = "Windows";
137 platform_classname = "windows";
138 } else {
139 platform_friendly = platform.os.family;
140 platform_classname = platform_friendly.toLowerCase();
141 }
142 }
143
144 if(platform_friendly && platform_classname) {
145 if(document.querySelectorAll('.client-card .client-platform-badge-'+platform_classname).length == 0) {
146 // No clients recognised for this platform, do nothing
147 return;
148 }
149 // Hide clients not for this platform
150 const client_cards = document.getElementsByClassName('client-card');
151 for (let card of client_cards) {
152 if (card.classList.contains('app-platform-'+platform_classname))
153 card.classList.add('supported-platform');
154 else if (!card.classList.contains('app-platform-web'))
155 card.hidden = true;
156 const badges = card.querySelectorAll('.client-platform-badge');
157 for (let badge of badges) {
158 if (badge.classList.contains('client-platform-badge-'+platform_classname)) {
159 badge.classList.add("badge-success");
160 badge.classList.remove("badge-info");
161 } else {
162 badge.classList.add("badge-secondary");
163 badge.classList.remove("badge-info");
164 }
165 }
166 }
167 const show_all_clients_button_container = document.getElementById('show-all-clients-button-container');
168 show_all_clients_button_container.querySelector('.platform-name').innerHTML = platform_friendly;
169 show_all_clients_button_container.classList.remove("d-none");
170 document.getElementById('show-all-clients-button').addEventListener('click', function (e) {
171 for (let card of client_cards)
172 card.hidden = false;
173 show_all_clients_button_container.hidden = true;
174 e.preventDefaults();
175 });
176 }
177 }
178 })();
179
180 </script>
181 </body> 109 </body>
182 </html> 110 </html>