darnytsa_hero

MediaWiki:Common.js: відмінності між версіями

← Попереднє редагування
Немає опису редагування
мНемає опису редагування
 
(Не показано 26 проміжних версій цього користувача)
Рядок 1: Рядок 1:
// =========================
// ОСНОВНИЙ КОД ДЛЯ ТЕМ, ДОСТУПНОСТІ ТА ЛУПИ
// =========================
$(function () {
$(function () {
     // Теми
     // Теми
Рядок 10: Рядок 13:
         theme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
         theme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
     }
     }
     if (themes[theme]) mw.loader.load(themes[theme], 'text/css');
   
    // Завантажуємо тему
     if (themes[theme]) {
        mw.loader.load(themes[theme], 'text/css');
    }
 
    // Розмір шрифту
    var fontSize = parseInt(localStorage.getItem('fontSize')) || parseInt($('body').css('font-size')) || 16;
 
    function applyFontSize() {
        var content = document.querySelector('.mw-parser-output');
        if (content) {
            content.style.fontSize = fontSize + 'px';
        }
    }
 
    // Масив для збереження позицій кнопок
    var buttonCount = 0;
 
    // Функція створення кнопки праворуч з автоматичним вертикальним розташуванням
    function createButtonRight(text, onClick, title) {
        var btn = document.createElement('button');
        btn.innerText = text;
        btn.title = title;
        btn.style.position = 'fixed';
        btn.style.right = '10px';
        btn.style.bottom = (10 + buttonCount * 60) + 'px'; // вертикальний відступ між кнопками
        btn.style.padding = '10px 16px';
        btn.style.border = 'none';
        btn.style.borderRadius = '25px';
        btn.style.background = '#1a73e8';
        btn.style.color = '#fff';
        btn.style.fontWeight = 'bold';
        btn.style.fontSize = '14px';
        btn.style.cursor = 'pointer';
        btn.style.zIndex = 9999;
        btn.style.textAlign = 'center';
        btn.style.boxShadow = '0 2px 6px rgba(0,0,0,0.3)';
        btn.style.whiteSpace = 'nowrap';
 
        btn.onclick = onClick;
        document.body.appendChild(btn);


    function createButton(text, bottom, onClick, title) {
         buttonCount++; // збільшуємо лічильник кнопок для наступного bottom
         var $btn = $('<button>').text(text).attr('title', title).css({
         return btn;
            position: 'fixed',
            bottom: bottom + 'px',
            right: '10px',
            padding: '10px 16px',
            border: 'none',
            borderRadius: '25px',
            background: '#1a73e8',
            color: '#ffffff',
            fontWeight: 'bold',
            fontSize: '14px',
            cursor: 'pointer',
            zIndex: 9999,
            textAlign: 'center',
            boxShadow: '0 2px 6px rgba(0,0,0,0.3)',
            whiteSpace: 'nowrap'
        }).click(onClick);
        $('body').append($btn);
         return $btn;
     }
     }


     // Кнопка Темна/Світла тема
     // Кнопка Темна/Світла тема
     var $themeBtn = createButton(
     createButtonRight(
         theme === 'dark' ? 'Світла тема ☀️' : 'Темна тема 🌙',
         theme === 'dark' ? 'Світла тема ☀️' : 'Темна тема 🌙',
        10,
         function () {
         function () {
             var newTheme = theme === 'dark' ? 'light' : 'dark';
             var newTheme = theme === 'dark' ? 'light' : 'dark';
Рядок 45: Рядок 70:
         'Змінити тему'
         'Змінити тему'
     );
     );
    // Змінна для зберігання розміру шрифту
    var fontSize = parseInt($('body').css('font-size'), 10) || 16;
   
    // Функція для застосування розміру шрифту
    function applyFontSize() {
        $('body').css('font-size', fontSize + 'px');
    }


     // Кнопка доступності
     // Кнопка доступності
     var $accessBtn = createButton(
     createButtonRight(
         'Доступність',
         localStorage.getItem('accessibilityMode') === 'on' ? 'Доступність' : 'Доступність',
        70,
         function () {
         function () {
             if (!$('body').hasClass('accessibility-mode')) {
             if (!$('body').hasClass('accessibility-mode')) {
                 $('body').addClass('accessibility-mode');
                 $('body').addClass('accessibility-mode');
                 localStorage.setItem('accessibilityMode', 'on');
                 localStorage.setItem('accessibilityMode', 'on');
                $accessBtn.css('background', '#ff6600');
                $accessBtn.text('Доступність ON');
             } else {
             } else {
                 $('body').removeClass('accessibility-mode');
                 $('body').removeClass('accessibility-mode');
                 localStorage.setItem('accessibilityMode', 'off');
                 localStorage.setItem('accessibilityMode', 'off');
                $accessBtn.css('background', '#1a73e8');
                $accessBtn.text('Доступність OFF');
             }
             }
         },
         },
Рядок 74: Рядок 86:
     );
     );


     // Відновлення стану доступності
     // Кнопки лупи
     if (localStorage.getItem('accessibilityMode') === 'on') {
     createButtonRight('🔍 +', function () {
        $('body').addClass('accessibility-mode');
        $accessBtn.css('background', '#ff6600');
        $accessBtn.text('Доступність ON');
    }
 
    // Лупа
    createButton('🔍 +', 130, function () {
         fontSize += 2;
         fontSize += 2;
         if (fontSize > 30) fontSize = 30;
         if (fontSize > 30) fontSize = 30;
Рядок 89: Рядок 94:
     }, 'Збільшити шрифт');
     }, 'Збільшити шрифт');


     createButton('🔍 -', 170, function () {
     createButtonRight('🔍 -', function () {
         fontSize -= 2;
         fontSize -= 2;
         if (fontSize < 12) fontSize = 12;
         if (fontSize < 12) fontSize = 12;
Рядок 96: Рядок 101:
     }, 'Зменшити шрифт');
     }, 'Зменшити шрифт');


     // Відновлення розміру шрифту
    // Застосовуємо шрифт при завантаженні
     if (localStorage.getItem('fontSize')) {
    applyFontSize();
         fontSize = parseInt(localStorage.getItem('fontSize'), 10);
 
     // Відновлення стану доступності при завантаженні
     if (localStorage.getItem('accessibilityMode') === 'on') {
         $('body').addClass('accessibility-mode');
     }
     }
    applyFontSize();
});
});




//OVERLAY  
// =========================
// ВАШ СТАРИЙ OVERLAY КОД (без змін)
// =========================
(function() {
(function() {
     'use strict';
     'use strict';
Рядок 831: Рядок 840:
})();
})();


// =========================
// КНОПКА ВИПАДКОВА СТОРІНКА (вище)
// =========================
function createRandomButton() {
    if (document.getElementById('float-random-btn')) return;
    if (!document.body.classList.contains('skin-minerva')) return;
   
    const btn = document.createElement('button');
    btn.id = 'float-random-btn';
    btn.innerHTML = '🎲 Випадкова cторінка';
    btn.title = 'Випадкова сторінка';
    btn.style.cssText = `
        position: fixed;
        bottom: 240px; 
        left: 15px;
        z-index: 9998;
        background: linear-gradient(135deg, #ff6b6b 0%, #ee5a24 100%);
        color: white;
        border: none;
        padding: 12px 18px;
        border-radius: 25px;
        font-size: 16px;
        font-weight: bold;
        cursor: pointer;
        box-shadow: 0 4px 15px rgba(0,0,0,0.3);
        display: flex;
        align-items: center;
        gap: 8px;
        transition: all 0.3s ease;
        white-space: nowrap;
    `;
   
    btn.addEventListener('click', function(e) {
        e.preventDefault();
        e.stopPropagation();
        btn.innerHTML = '⏳ Завантаження...';
        btn.style.opacity = '0.7';
        btn.disabled = true;
        setTimeout(() => {
            window.location.href = '/w/index.php/Спеціальна:Випадкова_сторінка';
        }, 100);
    });
   
    btn.addEventListener('mouseenter', function() {
        if (!this.disabled) {
            this.style.transform = 'scale(1.05)';
            this.style.boxShadow = '0 6px 20px rgba(0,0,0,0.4)';
        }
    });
   
    btn.addEventListener('mouseleave', function() {
        this.style.transform = 'scale(1)';
        this.style.boxShadow = '0 4px 15px rgba(0,0,0,0.3)';
    });
   
    document.body.appendChild(btn);
}


// =========================
// КНОПКА "ЯК ЦЕ ПРАЦЮЄ?" (виправлена версія)
// =========================
function createHowItWorksButton() {
    if (document.getElementById('how-it-works-btn')) return;
   
    const btn = document.createElement('button');
    btn.id = 'how-it-works-btn';
    btn.innerHTML = '?';
    btn.title = 'Як це працює?';
    btn.style.cssText = `
        position: fixed;
        bottom: 140px;
        left: 15px;
        z-index: 9998;
        background: linear-gradient(135deg, #4CAF50 0%, #45a049 100%);
        color: white;
        border: none;
        width: 60px;
        height: 60px;
        border-radius: 50%;
        font-size: 24px;
        font-weight: bold;
        cursor: pointer;
        box-shadow: 0 4px 15px rgba(0,0,0,0.3);
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s ease;
        line-height: 1;
    `;
   
    btn.addEventListener('click', function(e) {
        e.preventDefault();
        e.stopPropagation();
        window.location.href = '/w/index.php/FAQ';
    });
   
    btn.addEventListener('mouseenter', function() {
        this.style.transform = 'scale(1.05)';
        this.style.boxShadow = '0 6px 20px rgba(0,0,0,0.4)';
    });
   
    btn.addEventListener('mouseleave', function() {
        this.style.transform = 'scale(1)';
        this.style.boxShadow = '0 4px 15px rgba(0,0,0,0.3)';
    });
   
    document.body.appendChild(btn);
}


// =========================
// ВИПРАВЛЕНА ІНІЦІАЛІЗАЦІЯ (замінити тільки цю частину)
// =========================


// Приховування відмови та активація випадкової сторінки
// Видаляємо всі старі ініціалізатори і замінюємо на цей простий код:
document.addEventListener('DOMContentLoaded', function() {
    if (window.innerWidth <= 768 || document.body.classList.contains('skin-minerva')) {
       
        // 1. Приховати всі елементи з текстом "Відмова"
        const allElements = document.querySelectorAll('*');
        allElements.forEach(element => {
            if (element.textContent && element.textContent.includes('Відмова')) {
                element.style.display = 'none';
                if (element.closest('li')) {
                    element.closest('li').style.display = 'none';
                }
            }
        });
       
        // 2. Приховати за посиланням
        const links = document.querySelectorAll('a[href]');
        links.forEach(link => {
            if (link.href.includes('%D0%92%D1%96%D0%B4%D0%BC%D0%BE%D0%B2%D0%B0') ||
                link.textContent.includes('Відмова')) {
                link.style.display = 'none';
                if (link.closest('li')) link.closest('li').style.display = 'none';
            }
        });
       
        // 3. Активувати кнопку Випадкова сторінка
        const randomLinks = document.querySelectorAll('a[href*="%D0%92%D0%B8%D0%BF%D0%B0%D0%B4%D0%BA%D0%BE%D0%B2%D0%B0"]');
        randomLinks.forEach(link => {
            link.style.display = 'block';
            link.style.color = '#ffffff';
        });
    }
});
 


let buttonsInitialized = false;


// Простий спосіб додати елементи в меню
function initializeLeftButtons() {
function addToMenu() {
     if (buttonsInitialized) return;
     // Чекаємо поки меню повністю завантажиться
    buttonsInitialized = true;
    setTimeout(function() {
   
        const menu = document.querySelector('#mw-mf-page-left');
    // Кнопка "Як це працює?" для всіх тем
        if (!menu) return;
    createHowItWorksButton();
       
   
        // Шукаємо список навігації
    // Кнопка "Випадкова сторінка" тільки для Minerva
        let navList = menu.querySelector('#p-navigation');
    if (document.body.classList.contains('skin-minerva')) {
       
         createRandomButton();
        // Якщо списку немає - створюємо його
     }
        if (!navList) {
            navList = document.createElement('ul');
            navList.id = 'p-navigation';
            navList.className = 'toggle-list__list';
            menu.prepend(navList);
        }
       
        // Перевіряємо чи вже є наші елементи
        const currentHtml = navList.innerHTML.toLowerCase();
         if (!currentHtml.includes('головна') && !currentHtml.includes('випадкова')) {
            // Додаємо обидва елементи
            navList.innerHTML = `
                <li class="toggle-list-item">
                    <a class="toggle-list-item__anchor" href="/w/index.php/Головна_сторінка">
                        <span class="minerva-icon minerva-icon--home"></span>
                        <span class="toggle-list-item__label">Головна сторінка</span>
                    </a>
                </li>
                <li class="toggle-list-item">
                    <a class="toggle-list-item__anchor" href="/w/index.php/Спеціальна:Випадкова_сторінка">
                        <span class="minerva-icon minerva-icon--die"></span>
                        <span class="toggle-list-item__label">Випадкова стаття</span>
                    </a>
                </li>
            ` + navList.innerHTML;
        }
     }, 100);
}
}


// Запускаємо при кліку на меню
// Тільки один спосіб ініціалізації
document.addEventListener('click', function(e) {
if (document.readyState === 'loading') {
     if (e.target.closest('#mw-mf-main-menu-button') || e.target.closest('#main-menu-input')) {
     document.addEventListener('DOMContentLoaded', initializeLeftButtons);
        addToMenu();
} else {
    }
    setTimeout(initializeLeftButtons, 100);
});
}


// Також запускаємо при завантаженні
// Тільки один резервний таймер
document.addEventListener('DOMContentLoaded', addToMenu);
setTimeout(initializeLeftButtons, 1000);
Отримано з https://darnytsa.hero.kyivcity.gov.ua/w/index.php/MediaWiki:Common.js