OpenTogetherTube penceresi
// ==UserScript==
// @name Gartic.io OpenTogetherTube Embedder
// @namespace http://tampermonkey.net/
// @version 2.1
// @description OpenTogetherTube penceresi
// @author You
// @match https://gartic.io/*
// @match http://gartic.io/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
let iframe;
let container;
// Sayfa yüklendiğinde başlat
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', initializeScript);
} else {
initializeScript();
}
function initializeScript() {
// Hemen pencereyi oluştur
createFloatingWindow();
}
function createFloatingWindow() {
// Ana container
container = document.createElement('div');
container.id = 'ott-container';
container.style.cssText = `
position: fixed;
bottom: 20px;
right: 20px;
width: 480px;
height: 350px;
background: #1e1e1e;
border: 2px solid #ff6b35;
border-radius: 15px;
z-index: 9999;
box-shadow: 0 10px 30px rgba(0,0,0,0.5);
resize: both;
overflow: hidden;
min-width: 350px;
min-height: 250px;
max-width: 1000px;
max-height: 800px;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
`;
// Header
const header = document.createElement('div');
header.style.cssText = `
background: linear-gradient(135deg, #ff6b35, #f39c12);
color: white;
padding: 12px 15px;
font-size: 13px;
cursor: move;
display: flex;
justify-content: space-between;
align-items: center;
user-select: none;
font-weight: 600;
`;
header.innerHTML = `
<span>🎵 OpenTogetherTube</span>
<div>
<button id="minimize-btn" style="background: #666; border: none; color: white; padding: 5px 10px; border-radius: 6px; cursor: pointer;">−</button>
</div>
`;
// Content area
const content = document.createElement('div');
content.id = 'ott-content';
content.style.cssText = `
width: 100%;
height: calc(100% - 55px);
position: relative;
background: #2c2c2c;
overflow: hidden;
`;
// Activation overlay
const overlay = document.createElement('div');
overlay.id = 'activation-overlay';
overlay.style.cssText = `
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, rgba(255,107,53,0.9), rgba(231,76,60,0.9));
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
z-index: 10;
color: white;
text-align: center;
cursor: pointer;
transition: all 0.3s ease;
`;
overlay.innerHTML = `
<div style="font-size: 60px; margin-bottom: 20px; animation: bounce 2s infinite;">🎵</div>
<div style="font-size: 18px; font-weight: bold; margin-bottom: 10px;">OpenTogetherTube'u Başlat</div>
<div style="font-size: 14px; opacity: 0.9; margin-bottom: 20px;">Video izlemek için tıklayın</div>
<div style="padding: 12px 24px; background: rgba(255,255,255,0.2); border-radius: 25px; font-size: 14px; font-weight: 600;">BAŞLAT</div>
`;
// İframe oluştur
iframe = document.createElement('iframe');
iframe.style.cssText = `
width: 100%;
height: 100%;
border: none;
border-radius: 0 0 15px 15px;
background: #000;
`;
iframe.setAttribute('allow', 'autoplay; fullscreen; microphone; camera; midi; encrypted-media; payment; clipboard-read; clipboard-write; web-share; picture-in-picture');
iframe.setAttribute('allowfullscreen', 'true');
// Elementleri birleştir
content.appendChild(overlay);
content.appendChild(iframe);
container.appendChild(header);
container.appendChild(content);
document.body.appendChild(container);
setupEventListeners();
showNotification('OpenTogetherTube hazır! Başlatmak için pencereye tıklayın.', 'info');
}
function setupEventListeners() {
// Ana aktivasyon
document.getElementById('activation-overlay').addEventListener('click', function() {
activatePlayer();
});
setupWindowControls();
}
function activatePlayer() {
const overlay = document.getElementById('activation-overlay');
overlay.style.opacity = '0';
setTimeout(() => {
overlay.style.display = 'none';
}, 300);
// 3131 odasına bağlan
const fullUrl = 'https://opentogethertube.com/room/3131';
iframe.src = fullUrl;
showNotification('OpenTogetherTube yükleniyor...', 'info');
}
function setupWindowControls() {
// Sürükleme
const header = container.querySelector('div');
let isDragging = false;
let dragOffset = { x: 0, y: 0 };
header.addEventListener('mousedown', function(e) {
if (e.target.tagName === 'BUTTON') return;
isDragging = true;
dragOffset.x = e.clientX - container.offsetLeft;
dragOffset.y = e.clientY - container.offsetTop;
document.body.style.userSelect = 'none';
e.preventDefault();
});
document.addEventListener('mousemove', function(e) {
if (!isDragging) return;
const newLeft = Math.max(0, Math.min(window.innerWidth - container.offsetWidth, e.clientX - dragOffset.x));
const newTop = Math.max(0, Math.min(window.innerHeight - container.offsetHeight, e.clientY - dragOffset.y));
container.style.left = newLeft + 'px';
container.style.top = newTop + 'px';
});
document.addEventListener('mouseup', function() {
isDragging = false;
document.body.style.userSelect = '';
});
// Minimize/Maximize
let isMinimized = false;
document.getElementById('minimize-btn').addEventListener('click', function() {
const content = document.getElementById('ott-content');
if (isMinimized) {
content.style.display = 'block';
container.style.height = '350px';
this.textContent = '−';
isMinimized = false;
} else {
content.style.display = 'none';
container.style.height = '55px';
this.textContent = '+';
isMinimized = true;
}
});
}
function showNotification(message, type = 'info') {
const notification = document.createElement('div');
notification.style.cssText = `
position: fixed;
top: 20px;
right: 20px;
padding: 15px 20px;
border-radius: 10px;
color: white;
font-family: 'Segoe UI', sans-serif;
font-size: 13px;
font-weight: 500;
z-index: 10001;
max-width: 300px;
box-shadow: 0 8px 25px rgba(0,0,0,0.3);
opacity: 0;
transform: translateY(-20px);
transition: all 0.3s ease;
`;
const colors = {
success: '#27ae60',
warning: '#f39c12',
error: '#e74c3c',
info: '#3498db'
};
notification.style.background = colors[type] || colors.info;
notification.textContent = message;
document.body.appendChild(notification);
requestAnimationFrame(() => {
notification.style.opacity = '1';
notification.style.transform = 'translateY(0)';
});
setTimeout(() => {
notification.style.opacity = '0';
notification.style.transform = 'translateY(-20px)';
setTimeout(() => notification.remove(), 300);
}, 4000);
}
// CSS
const style = document.createElement('style');
style.textContent = `
@keyframes bounce {
0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
40% { transform: translateY(-20px); }
60% { transform: translateY(-10px); }
}
#ott-container button {
transition: all 0.2s ease;
}
#ott-container button:hover {
opacity: 0.85;
transform: scale(1.05);
}
#activation-overlay:hover {
transform: scale(1.02);
}
#ott-container {
backdrop-filter: blur(10px);
}
`;
document.head.appendChild(style);
console.log('Gartic.io OpenTogetherTube Script yüklendi!');
})();