Swipe left/right on images or use overlay buttons on videos to navigate between posts. Double-click images to open them in a new tab (fullscreen).
// ==UserScript==
// @name Rule34 Mobile Swipe & Video Navigation
// @name:tr Rule34 Mobil Kaydırma ve Video Navigasyonu
// @namespace https://greasyfork.org/en/users/1500762-kerimdemirkaynak
// @version 1.7
// @description Swipe left/right on images or use overlay buttons on videos to navigate between posts. Double-click images to open them in a new tab (fullscreen).
// @description:tr Resimlerde sola/sağa kaydırarak veya videolardaki butonları kullanarak gönderiler arasında gezinin. Tam ekran görmek için resimlere çift tıklayın.
// @author Kerim Demirkaynak
// @license MIT
// @icon https://www.google.com/s2/favicons?sz=256&domain_url=https%3A%2F%2Frule34.xxx%2F
// @match https://rule34.xxx/index.php?page=post&s=view*
// @grant none
// @run-at document-idle
// ==/UserScript==
(function() {
'use strict';
// 1. Alttaki gezinme çubuğunu kaldır
const bottomBar = document.getElementById('navlinksContainer');
if (bottomBar) bottomBar.style.display = 'none';
const mainImage = document.getElementById('image');
const videoPlayer = document.querySelector('video, #gelcomVideoPlayer');
const container = document.querySelector('.image-container');
// Eğer video varsa -> overlay butonlar ekle
if (videoPlayer) {
console.log("Rule34 Betiği: Video bulundu, overlay butonlar ekleniyor...");
// Genel buton oluşturucu
const createOverlayButton = (symbol, side, clickHandler) => {
const btn = document.createElement('div');
btn.textContent = symbol;
btn.style.position = 'fixed';
btn.style.top = '50%';
btn.style[side] = '20px';
btn.style.transform = 'translateY(-50%)';
btn.style.fontSize = '3rem';
btn.style.color = 'white';
btn.style.background = 'rgba(0,0,0,0.5)';
btn.style.padding = '10px 16px';
btn.style.borderRadius = '50%';
btn.style.cursor = 'pointer';
btn.style.userSelect = 'none';
btn.style.zIndex = '999999'; // hep üstte
btn.style.transition = 'background 0.2s';
btn.addEventListener('mouseenter', () => btn.style.background = 'rgba(0,0,0,0.7)');
btn.addEventListener('mouseleave', () => btn.style.background = 'rgba(0,0,0,0.5)');
btn.addEventListener('click', clickHandler);
document.body.appendChild(btn);
return btn;
};
const nextLink = document.querySelector('a#next_search_link');
const prevLink = document.querySelector('a#prev_search_link');
if (prevLink) {
createOverlayButton("←", "left", () => prevLink.click());
}
if (nextLink) {
createOverlayButton("→", "right", () => nextLink.click());
}
return; // Video olduğunda resim mantığını çalıştırma
}
// Eğer resim varsa -> kaydırma aktif
if (mainImage && container) {
container.style.cursor = 'grab';
// Çift tıkla yeni sekmede aç
mainImage.addEventListener('dblclick', function(e) {
e.preventDefault();
const originalImageUrl = mainImage.src;
if (originalImageUrl) {
window.open(originalImageUrl, '_blank');
}
});
// Kaydırma
let startX = 0;
let startY = 0;
let isDragging = false;
const swipeThreshold = 50;
const handleGestureEnd = (endX, endY) => {
const deltaX = endX - startX;
const deltaY = endY - startY;
if (Math.abs(deltaX) > swipeThreshold && Math.abs(deltaX) > Math.abs(deltaY) * 1.5) {
if (deltaX < 0) {
const nextLink = document.querySelector('a#next_search_link');
if (nextLink) nextLink.click();
} else {
const prevLink = document.querySelector('a#prev_search_link');
if (prevLink) prevLink.click();
}
}
};
// Dokunmatik
container.addEventListener('touchstart', (e) => {
startX = e.changedTouches[0].screenX;
startY = e.changedTouches[0].screenY;
}, { passive: true });
container.addEventListener('touchend', (e) => {
const endX = e.changedTouches[0].screenX;
const endY = e.changedTouches[0].screenY;
handleGestureEnd(endX, endY);
});
// Fare
container.addEventListener('mousedown', (e) => {
e.preventDefault();
isDragging = true;
startX = e.screenX;
startY = e.screenY;
container.style.cursor = 'grabbing';
});
container.addEventListener('mouseup', (e) => {
if (isDragging) {
isDragging = false;
const endX = e.screenX;
const endY = e.screenY;
container.style.cursor = 'grab';
handleGestureEnd(endX, endY);
}
});
container.addEventListener('mouseleave', () => {
if (isDragging) {
isDragging = false;
container.style.cursor = 'grab';
}
});
}
})();