ddddd
// ==UserScript==
// @name gariks
// @namespace http://tampermonkey.net/
// @version 1.1
// @description ddddd
// @author g
// @match https://gartic.io/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=gartic.io
// @grant none
// ==/UserScript==
(function() {
'use strict';
// --- 1. DEĞİŞKENLER ---
let overlayGorsel = null; // Eklediğimiz resim elementi
let menuAcik = false; // Menü durumu
// --- 2. HTML ARAYÜZÜ ---
// A) Sabit Duran Açma/Kapama Butonu (Sol Üst)
const toggleButtonHTML = `
<button id="ressam-toggle-btn" style="
position: fixed;
top: 10px;
left: 10px;
width: 50px;
height: 50px;
background: #222;
color: #00ff00;
border: 2px solid #00ff00;
border-radius: 50%;
font-size: 24px;
cursor: pointer;
z-index: 10000;
box-shadow: 0 0 10px #00ff00;
display: flex;
align-items: center;
justify-content: center;
">
🎨
</button>
`;
// B) Ayar Menüsü (Başlangıçta Gizli)
const menuHTML = `
<div id="ressam-menu" style="
position: fixed;
top: 70px; /* Butonun hemen altında */
left: 10px;
background: rgba(0, 0, 0, 0.9);
color: #00ff00;
padding: 15px;
border: 2px solid #00ff00;
border-radius: 10px;
z-index: 9999;
font-family: sans-serif;
box-shadow: 0 0 15px #00ff00;
display: none; /* Gizli başla */
width: 220px;
">
<h4 style="margin:0 0 10px 0; text-align:center; color:white;">AYARLAR</h4>
<label style="font-size:12px;">Resim URL:</label>
<input type="text" id="img-url" placeholder="https://..." style="
width: 95%;
background: #333;
color: white;
border: 1px solid #666;
padding: 5px;
margin-bottom: 10px;
border-radius: 4px;
">
<label style="font-size:12px;">Saydamlık:</label>
<input type="range" id="opacity-slider" min="0" max="1" step="0.1" value="0.5" style="width:100%;">
<button id="btn-yukle" style="
width: 100%;
background: #00ff00;
color: black;
font-weight: bold;
border: none;
padding: 8px;
cursor: pointer;
margin-top: 10px;
border-radius: 4px;
">YANSIT / GÜNCELLE</button>
<button id="btn-gizle" style="
width: 100%;
background: #ff3333;
color: white;
font-weight: bold;
border: none;
padding: 5px;
cursor: pointer;
margin-top: 5px;
border-radius: 4px;
font-size: 11px;
">RESMİ KALDIR</button>
</div>
`;
// --- 3. ARAYÜZÜ SAYFAYA EKLEME ---
const container = document.createElement('div');
container.innerHTML = toggleButtonHTML + menuHTML;
document.body.appendChild(container);
// --- 4. FONKSİYONLAR ---
// Resmi Canvas üzerine yerleştirme
function resmiYansit() {
const url = document.getElementById('img-url').value;
const opacity = document.getElementById('opacity-slider').value;
const oyunCanvas = document.querySelector('canvas');
if (!oyunCanvas) {
alert('Oyun alanı (Canvas) bulunamadı!');
return;
}
if (!url) {
alert('Lütfen bir resim linki yapıştırın!');
return;
}
// Resim elementi yoksa oluştur
if (!overlayGorsel) {
overlayGorsel = document.createElement('img');
overlayGorsel.style.position = 'absolute';
overlayGorsel.style.pointerEvents = 'none'; // Tıklamalar arkaya geçsin
overlayGorsel.style.zIndex = '100';
document.body.appendChild(overlayGorsel);
}
// Resim özelliklerini ayarla
overlayGorsel.src = url;
overlayGorsel.style.opacity = opacity;
overlayGorsel.style.display = 'block'; // Görünür yap
// Canvas üzerine tam oturt
const rect = oyunCanvas.getBoundingClientRect();
// Sayfa kaydırmasını (scroll) da hesaba katalım
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
const scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
overlayGorsel.style.top = (rect.top + scrollTop) + 'px';
overlayGorsel.style.left = (rect.left + scrollLeft) + 'px';
overlayGorsel.style.width = rect.width + 'px';
overlayGorsel.style.height = rect.height + 'px';
}
// Resmi tamamen kaldırma fonksiyonu
function resmiKaldir() {
if (overlayGorsel) {
overlayGorsel.style.display = 'none';
overlayGorsel.src = ''; // Linki boşalt
}
}
// --- 5. OLAY DİNLEYİCİLERİ (EVENTS) ---
// Sol üstteki yuvarlak butona tıklayınca menüyü aç/kapa
document.getElementById('ressam-toggle-btn').addEventListener('click', () => {
const menu = document.getElementById('ressam-menu');
menuAcik = !menuAcik;
menu.style.display = menuAcik ? 'block' : 'none';
});
// "Yansıt" butonu
document.getElementById('btn-yukle').addEventListener('click', resmiYansit);
// "Resmi Kaldır" butonu
document.getElementById('btn-gizle').addEventListener('click', resmiKaldir);
// Slider değişince opaklığı anlık ayarla
document.getElementById('opacity-slider').addEventListener('input', (e) => {
if(overlayGorsel) {
overlayGorsel.style.opacity = e.target.value;
}
});
// Ekran boyutu değişirse (telefon yan çevrilirse vs.) resmi tekrar hizala
window.addEventListener('resize', () => {
if(overlayGorsel && overlayGorsel.style.display !== 'none') {
resmiYansit();
}
});
})();