Greasy Fork镜像

/////////////////////// Function of adding a button ////////////////////////////



// Вставляем кнопку с классом
function addButtonToThumbnail(thumbnail) {
if (thumbnail.querySelector('.mini-player-btn')) return;

const btn = document.createElement('button');
btn.textContent = '▶';
btn.title = 'Запустить мини-плеер';
btn.className = 'mini-player-btn';

// Стиль для кнопки через CSS
// Можно добавить через JS или вставить в стили сайта

// Для примера — добавим стиль через JS
if (!document.getElementById('custom-mini-player-style')) {
const style = document.createElement('style');
style.id = 'custom-mini-player-style';
style.innerHTML = ` /* Скрываем кнопку по умолчанию */
.mini-player-btn {
display: none;
position: absolute;
top: 4px;
left: 6px;
z-index: 10;
padding: 2px 6px;
font-size: 14px;
cursor: pointer;
border: none;
background: rgba(78, 161, 243, 0.6);
color: #fff;
border-radius: 3px;
}
/* Показываем кнопку при наведении на миниатюру */
ytd-thumbnail:hover .mini-player-btn,
/* или для других вариантов, если используются другие контейнеры */
ytd-grid-video-renderer:hover .mini-player-btn,
ytd-video-renderer:hover .mini-player-btn,
ytd-rich-grid-media:hover .mini-player-btn {
display: block;
}
`;
document.head.appendChild(style);
}

// Обеспечиваем, что у миниатюры position: relative
if (window.getComputedStyle(thumbnail).position === 'static') {
thumbnail.style.position = 'relative';
}

// Обработчик клика
btn.onclick = (e) => {
e.stopPropagation();
e.preventDefault();
const link = thumbnail.querySelector('a') || thumbnail.closest('a');
if (link && link.href) {
const videoId = extractVideoId(link.href);
if (videoId) {
createMiniPlayer(videoId);
}
}
};

// Обработка правого клика (оставляем без изменений)
btn.addEventListener('contextmenu', (e) => {
e.stopPropagation();
e.preventDefault();
});

thumbnail.appendChild(btn);
}

// Обработка миниатюр
function processThumbnails() {
document.querySelectorAll('a[href*="/watch"], a[href*="/shorts/"]').forEach(a => {
const thumbnail = a.closest('ytd-thumbnail, ytd-grid-video-renderer, ytd-video-renderer, ytd-rich-grid-media');
if (thumbnail) {
addButtonToThumbnail(thumbnail);
}
});
}

// Изначально и при изменениях
processThumbnails();

const observer = new MutationObserver(() => {
processThumbnails();
});
observer.observe(document.body, { childList: true, subtree: true });




})();