Mercurial > prosody-modules

comparison mod_invites_page/html/invite.html @ 5718:8cd617c0b701

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
mod_invites_page: Replace jQuery with vanilla.js in the HTML
author Emmanuel Gil Peyrot <linkmauve@linkmauve.fr>
date Thu, 16 Nov 2023 16:15:26 +0100
parents 09b8144051ea
children 18bae78282a6
comparison
equal deleted inserted replaced
5717:e06af1403a60 5718:8cd617c0b701
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>
109 $(function () { 109 (function () {
110 // If QR lib loaded ok, show QR button on desktop devices 110 // If QR lib loaded ok, show QR button on desktop devices
111 if(window.QRCode) { 111 if(window.QRCode) {
112 $('#qr-modal').one('show.bs.modal', function (e) { 112 new QRCode(document.getElementById("qr-invite-page"), document.location.href);
113 new QRCode(document.getElementById("qr-invite-page"), document.location.href); 113 document.getElementById('qr-button-container').classList.remove("d-none");
114 });
115 $('#qr-button-container').addClass("d-md-block");
116 } 114 }
117 115
118 // Detect current platform and show/hide appropriate clients 116 // Detect current platform and show/hide appropriate clients
119 if(window.platform) { 117 if(window.platform) {
120 var platform_friendly = null; 118 var platform_friendly = null;
121 var platform_classname = null; 119 var platform_classname = null;
122 120
123 switch(platform.os.family) { 121 switch(platform.os.family) {
124 case "Ubuntu": 122 case "Ubuntu":
125 case "Linux": 123 case "Linux":
126 case "Fedora": 124 case "Fedora":
127 case "Red Hat": 125 case "Red Hat":
142 platform_classname = platform_friendly.toLowerCase(); 140 platform_classname = platform_friendly.toLowerCase();
143 } 141 }
144 } 142 }
145 143
146 if(platform_friendly && platform_classname) { 144 if(platform_friendly && platform_classname) {
147 if($('.client-card .client-platform-badge-'+platform_classname).length == 0) { 145 if(document.querySelectorAll('.client-card .client-platform-badge-'+platform_classname).length == 0) {
148 // No clients recognised for this platform, do nothing 146 // No clients recognised for this platform, do nothing
149 return; 147 return;
150 } 148 }
151 // Hide clients not for this platform 149 // Hide clients not for this platform
152 $('.client-card.app-platform-'+platform_classname).addClass("supported-platform"); 150 const client_cards = document.getElementsByClassName('client-card');
153 $('.client-card').not(".supported-platform, .app-platform-web").hide(); 151 for (let card of client_cards) {
154 $('.client-card .client-platform-badge') 152 if (card.classList.contains('app-platform-'+platform_classname))
155 .not(".client-platform-badge-"+platform_classname) 153 card.classList.add('supported-platform');
156 .addClass("badge-secondary") 154 else if (!card.classList.contains('app-platform-web'))
157 .removeClass("badge-info"); 155 card.hidden = true;
158 $('.client-card .client-platform-badge-'+platform_classname) 156 const badges = card.querySelectorAll('.client-platform-badge');
159 .addClass("badge-success") 157 for (let badge of badges) {
160 .removeClass("badge-info"); 158 if (badge.classList.contains('client-platform-badge-'+platform_classname)) {
161 $('#show-all-clients-button-container .platform-name').text(platform_friendly); 159 badge.classList.add("badge-success");
162 $('#show-all-clients-button-container').removeClass("d-none"); 160 badge.classList.remove("badge-info");
163 $('#show-all-clients-button').click(function () { 161 } else {
164 $('.client-card').show(); 162 badge.classList.add("badge-secondary");
165 $('#show-all-clients-button-container').hide(); 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();
166 }); 175 });
167 } 176 }
168 } 177 }
169 }); 178 })();
170 179
171 </script> 180 </script>
172 </body> 181 </body>
173 </html> 182 </html>