From 9a12cbbfb7de8d86a492caeeb672bee5317c9c76 Mon Sep 17 00:00:00 2001
From: ivacom <ivacom@noreply.localhost>
Date: Fri, 10 Jan 2025 13:23:20 +0000
Subject: [PATCH] =?UTF-8?q?=D0=9E=D0=B1=D0=BD=D0=BE=D0=B2=D0=B8=D1=82?=
 =?UTF-8?q?=D1=8C=20test.html?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 test.html | 187 ++++++++++++++++++++----------------------------------
 1 file changed, 70 insertions(+), 117 deletions(-)

diff --git a/test.html b/test.html
index c6ede67..f95d602 100644
--- a/test.html
+++ b/test.html
@@ -20,116 +20,43 @@
             Определение вашей операционной системы...
         </div>
 
-        <div class="accordion" id="appsAccordion">
-            <div class="accordion-item">
-                <h2 class="accordion-header" id="headingAndroid">
-                    <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAndroid" aria-expanded="true" aria-controls="collapseAndroid">
-                        Приложения для Android
-                    </button>
-                </h2>
-                <div id="collapseAndroid" class="accordion-collapse collapse" aria-labelledby="headingAndroid" data-bs-parent="#appsAccordion">
-                    <div class="accordion-body">
-                        <div class="accordion" id="androidSubAccordion">
-                            <div class="accordion-item">
-                                <h2 class="accordion-header" id="headingAndroidApp1">
-                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAndroidApp1" aria-expanded="false" aria-controls="collapseAndroidApp1">
-                                        Приложение 1
-                                    </button>
-                                </h2>
-                                <div id="collapseAndroidApp1" class="accordion-collapse collapse" aria-labelledby="headingAndroidApp1" data-bs-parent="#androidSubAccordion">
-                                    <div class="accordion-body">
-                                        <p>Описание приложения 1 для Android.</p>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="accordion-item">
-                                <h2 class="accordion-header" id="headingAndroidApp2">
-                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAndroidApp2" aria-expanded="false" aria-controls="collapseAndroidApp2">
-                                        Приложение 2
-                                    </button>
-                                </h2>
-                                <div id="collapseAndroidApp2" class="accordion-collapse collapse" aria-labelledby="headingAndroidApp2" data-bs-parent="#androidSubAccordion">
-                                    <div class="accordion-body">
-                                        <p>Описание приложения 2 для Android.</p>
-                                    </div>
-                                </div>
-                            </div>
+        <div id="appsAccordionContainer">
+            <div class="accordion" id="appsAccordion">
+                <div class="accordion-item" data-os="Android">
+                    <h2 class="accordion-header" id="headingAndroid">
+                        <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAndroid" aria-expanded="true" aria-controls="collapseAndroid">
+                            Приложения для Android
+                        </button>
+                    </h2>
+                    <div id="collapseAndroid" class="accordion-collapse collapse" aria-labelledby="headingAndroid" data-bs-parent="#appsAccordion">
+                        <div class="accordion-body">
+                            <p>Описание приложений для Android.</p>
                         </div>
                     </div>
                 </div>
-            </div>
 
-            <div class="accordion-item">
-                <h2 class="accordion-header" id="headingiOS">
-                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseiOS" aria-expanded="false" aria-controls="collapseiOS">
-                        Приложения для iOS
-                    </button>
-                </h2>
-                <div id="collapseiOS" class="accordion-collapse collapse" aria-labelledby="headingiOS" data-bs-parent="#appsAccordion">
-                    <div class="accordion-body">
-                        <div class="accordion" id="iosSubAccordion">
-                            <div class="accordion-item">
-                                <h2 class="accordion-header" id="headingiOSApp1">
-                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseiOSApp1" aria-expanded="false" aria-controls="collapseiOSApp1">
-                                        Приложение 1
-                                    </button>
-                                </h2>
-                                <div id="collapseiOSApp1" class="accordion-collapse collapse" aria-labelledby="headingiOSApp1" data-bs-parent="#iosSubAccordion">
-                                    <div class="accordion-body">
-                                        <p>Описание приложения 1 для iOS.</p>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="accordion-item">
-                                <h2 class="accordion-header" id="headingiOSApp2">
-                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseiOSApp2" aria-expanded="false" aria-controls="collapseiOSApp2">
-                                        Приложение 2
-                                    </button>
-                                </h2>
-                                <div id="collapseiOSApp2" class="accordion-collapse collapse" aria-labelledby="headingiOSApp2" data-bs-parent="#iosSubAccordion">
-                                    <div class="accordion-body">
-                                        <p>Описание приложения 2 для iOS.</p>
-                                    </div>
-                                </div>
-                            </div>
+                <div class="accordion-item" data-os="iOS">
+                    <h2 class="accordion-header" id="headingiOS">
+                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseiOS" aria-expanded="false" aria-controls="collapseiOS">
+                            Приложения для iOS
+                        </button>
+                    </h2>
+                    <div id="collapseiOS" class="accordion-collapse collapse" aria-labelledby="headingiOS" data-bs-parent="#appsAccordion">
+                        <div class="accordion-body">
+                            <p>Описание приложений для iOS.</p>
                         </div>
                     </div>
                 </div>
-            </div>
 
-            <div class="accordion-item">
-                <h2 class="accordion-header" id="headingWindows">
-                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWindows" aria-expanded="false" aria-controls="collapseWindows">
-                        Приложения для Windows
-                    </button>
-                </h2>
-                <div id="collapseWindows" class="accordion-collapse collapse" aria-labelledby="headingWindows" data-bs-parent="#appsAccordion">
-                    <div class="accordion-body">
-                        <div class="accordion" id="windowsSubAccordion">
-                            <div class="accordion-item">
-                                <h2 class="accordion-header" id="headingWindowsApp1">
-                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWindowsApp1" aria-expanded="false" aria-controls="collapseWindowsApp1">
-                                        Приложение 1
-                                    </button>
-                                </h2>
-                                <div id="collapseWindowsApp1" class="accordion-collapse collapse" aria-labelledby="headingWindowsApp1" data-bs-parent="#windowsSubAccordion">
-                                    <div class="accordion-body">
-                                        <p>Описание приложения 1 для Windows.</p>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="accordion-item">
-                                <h2 class="accordion-header" id="headingWindowsApp2">
-                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWindowsApp2" aria-expanded="false" aria-controls="collapseWindowsApp2">
-                                        Приложение 2
-                                    </button>
-                                </h2>
-                                <div id="collapseWindowsApp2" class="accordion-collapse collapse" aria-labelledby="headingWindowsApp2" data-bs-parent="#windowsSubAccordion">
-                                    <div class="accordion-body">
-                                        <p>Описание приложения 2 для Windows.</p>
-                                    </div>
-                                </div>
-                            </div>
+                <div class="accordion-item" data-os="Windows">
+                    <h2 class="accordion-header" id="headingWindows">
+                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWindows" aria-expanded="false" aria-controls="collapseWindows">
+                            Приложения для Windows
+                        </button>
+                    </h2>
+                    <div id="collapseWindows" class="accordion-collapse collapse" aria-labelledby="headingWindows" data-bs-parent="#appsAccordion">
+                        <div class="accordion-body">
+                            <p>Описание приложений для Windows.</p>
                         </div>
                     </div>
                 </div>
@@ -138,26 +65,52 @@
     </div>
 
     <script>
-        document.addEventListener('DOMContentLoaded', function () {
-            const osDetection = document.getElementById('os-detection');
+        // Определение текущей ОС пользователя
+        function detectOS() {
             const userAgent = navigator.userAgent;
+            if (/android/i.test(userAgent)) return "Android";
+            if (/iPhone|iPad|iPod/i.test(userAgent)) return "iOS";
+            if (/Windows NT/i.test(userAgent)) return "Windows";
+            return null;
+        }
 
-            let os = 'Не удалось определить ОС';
-            if (/Android/i.test(userAgent)) {
-                os = 'Android';
-                document.getElementById('collapseAndroid').classList.add('show');
-            } else if (/iPhone|iPad|iPod/i.test(userAgent)) {
-                os = 'iOS';
-                document.getElementById('collapseiOS').classList.add('show');
-            } else if (/Windows NT/i.test(userAgent)) {
-                os = 'Windows';
-                document.getElementById('collapseWindows').classList.add('show');
+        // Сортировка аккордеона
+        function sortAccordion(currentOS) {
+            const accordionContainer = document.getElementById("appsAccordionContainer");
+            const accordionItems = Array.from(document.querySelectorAll(".accordion-item"));
+
+            // Сортируем элементы, чтобы текущая ОС была первой
+            accordionItems.sort((a, b) => {
+                const osA = a.getAttribute("data-os");
+                const osB = b.getAttribute("data-os");
+                if (osA === currentOS) return -1;
+                if (osB === currentOS) return 1;
+                return 0;
+            });
+
+            // Перестраиваем аккордеон
+            accordionContainer.innerHTML = "";
+            const newAccordion = document.createElement("div");
+            newAccordion.className = "accordion";
+            newAccordion.id = "appsAccordion";
+
+            accordionItems.forEach(item => newAccordion.appendChild(item));
+            accordionContainer.appendChild(newAccordion);
+        }
+
+        // Инициализация
+        document.addEventListener("DOMContentLoaded", () => {
+            const currentOS = detectOS();
+            const osDetection = document.getElementById("os-detection");
+
+            if (currentOS) {
+                osDetection.textContent = `Ваша операционная система: ${currentOS}`;
+                sortAccordion(currentOS);
+            } else {
+                osDetection.textContent = "Не удалось определить вашу операционную систему.";
             }
-
-            osDetection.textContent = `Ваша операционная система: ${os}`;
         });
     </script>
-
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
 </body>
 </html>