Customize the PixelPlanet interface with extended personalization options and revert to default.
目前为
// ==UserScript==
// @name Pixelplanet+
// @namespace http://tampermonkey.net/
// @version 4.1
// @author Pixel, join dsc.gg/turkmenlippf
// @description Customize the PixelPlanet interface with extended personalization options and revert to default.
// @match https://pixelplanet.fun/*
// @grant GM_addStyle
// @grant GM_addStyle
// @grant GM_xmlhttpRequest
// @grant GM_setClipboard
// @icon https://files.catbox.moe/qb2prb.png
// ==/UserScript==
(function() {
'use strict';
GM_addStyle(`
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css');
@import url('https://fonts.googleapis.com/css2?family=Pixelify+Sans&display=swap');
`);
// Varsayılan stiller
const defaultCSS = `
body {
margin: 0;
font-family: 'Montserrat', sans-serif;
font-size: 16px;
background: #c4c4c4;
}
.menu > div { background-color: transparent !important; }
`;
// Kullanıcı ayarları
const settings = {
buttonColor: '#4CAF50',
buttonHoverColor: '#ff91a6',
fontColor: '#000000',
fontSize: '16',
fontFamily: 'Arial',
menuColor: '#ffffff',
backgroundOpacity: '1',
backgroundImage: '',
cursorURL: ''
};
// Sayfa yüklendiğinde ayarları uygula
applyStoredStyles();
// Buton ekle
addCustomizationButton();
// Ayarları yükle ve uygula
function applyStoredStyles() {
const storedSettings = loadSettings();
applyCustomStyles(storedSettings);
}
// Ayarları localStorage'dan yükle
function loadSettings() {
Object.keys(settings).forEach(key => {
settings[key] = getStoredValue(key, settings[key]);
});
return settings;
}
// LocalStorage'dan bir değeri al
function getStoredValue(key, defaultValue) {
return localStorage.getItem(key) || defaultValue;
}
// LocalStorage'a bir değeri kaydet
function setStoredValue(key, value) {
localStorage.setItem(key, value);
}
// Stilleri uygula
function applyCustomStyles({ buttonColor, buttonHoverColor, fontColor, fontSize, fontFamily, menuColor, backgroundOpacity, backgroundImage, cursorURL }) {
GM_addStyle(`
body {
background-color: rgba(255, 255, 255, ${backgroundOpacity});
background-image: url(${backgroundImage});
font-size: ${fontSize}px;
font-family: ${fontFamily};
color: ${fontColor};
}
.actionbuttons, .actionbuttons button,
.coorbox, .onlinebox, .cooldownbox, #palettebox {
background-color: ${buttonColor} !important;
color: white !important;
}
.actionbuttons:hover, .actionbuttons button:hover,
.coorbox:hover, .onlinebox:hover, .cooldownbox:hover, #palettebox:hover {
background-color: ${buttonHoverColor} !important;
}
.customMenu, .modal.USERAREA.show, .modal.HELP.show, .modal.SETTINGS.show {
background-color: ${menuColor} !important;
color: ${fontColor};
border-radius: 10px;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
.window.CHAT.show {
background-image: url(${backgroundImage}) !important;
background-size: cover;
background-position: center;
}
* {
cursor: url('${cursorURL}') 16 16, auto !important;
}
`);
}
// Buton ekle
function addCustomizationButton() {
const customizationButton = document.createElement('div');
customizationButton.id = 'customizationButton';
customizationButton.className = 'actionbuttons';
customizationButton.setAttribute('role', 'button');
customizationButton.innerHTML = `
<i class="fa fa-plus-square" aria-hidden="true" style="vertical-align: middle; font-size: 19px; color: #FFFFFF;"></i>
`;
customizationButton.style.position = 'fixed';
customizationButton.style.left = '16px';
customizationButton.style.top = '37%';
customizationButton.style.zIndex = '9999';
customizationButton.style.transform = 'translateY(-50%)';
document.body.appendChild(customizationButton);
customizationButton.addEventListener('click', showCustomizationPanel);
}
// Ayar panelini göster
function showCustomizationPanel() {
const panelHTML = `
<div class="modal SETTINGS show customMenu" style="
z-index: 9999;
width: 50%;
max-width: 500px;
max-height: 80vh;
overflow-y: auto;
padding: 20px;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #ffffff;
border: 1px solid #ccc;
border-radius: 12px;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
transition: all 0.3s ease;
font-family: 'Pixelify Sans', sans-serif;
">
<h2 style="text-align: center; font-size: 1.4em; margin-bottom: 1em;">Settings</h2>
<div class="modal-topbtn close" role="button" title="Close" tabindex="-1" style="
position: absolute;
top: 10px;
right: 10px;
font-size: 1.2em;
cursor: pointer;
">✕</div>
<div class="content" style="display: flex; flex-direction: column; gap: 15px;">
<div class="setitem">
<label>Button Color:</label>
<input type="color" id="buttonColorPicker" value="${settings.buttonColor}" />
</div>
<div class="setitem">
<label>Button Hover Color:</label>
<input type="color" id="buttonHoverColorPicker" value="${settings.buttonHoverColor}" />
</div>
<div class="setitem">
<label>Font Color:</label>
<input type="color" id="fontColorPicker" value="${settings.fontColor}" />
</div>
<div class="setitem">
<label>Font Size:</label>
<input type="number" id="fontSizePicker" min="10" max="30" value="${settings.fontSize}" style="width: 80px;" /> px
</div>
<div class="setitem">
<label>Font Family:</label>
<select id="fontFamilyPicker" style="padding: 5px; border-radius: 5px;">
<option value="Arial" ${settings.fontFamily === 'Arial' ? 'selected' : ''}>Arial</option>
<option value="Verdana" ${settings.fontFamily === 'Verdana' ? 'selected' : ''}>Verdana</option>
<option value="Helvetica" ${settings.fontFamily === 'Helvetica' ? 'selected' : ''}>Helvetica</option>
<option value="Tahoma" ${settings.fontFamily === 'Tahoma' ? 'selected' : ''}>Tahoma</option>
<option value="Pixelify Sans" ${settings.fontFamily === 'Pixelify Sans' ? 'selected' : ''}>Pixelify Sans</option>
</select>
</div>
<div class="setitem">
<label>Menu Color:</label>
<input type="color" id="menuColorPicker" value="${settings.menuColor}" />
</div>
<div class="setitem">
<label>Background Opacity:</label>
<input type="range" id="backgroundOpacity" min="0.1" max="1" step="0.1" value="${settings.backgroundOpacity}" />
</div>
<div class="setitem">
<label>Chat Background Image URL:</label>
<input type="text" id="backgroundImage" value="${settings.backgroundImage}" style="width: 100%;" placeholder="Enter URL here" />
</div>
<div class="setitem">
<label>Custom Cursor URL:</label>
<input type="text" id="cursorURL" value="${settings.cursorURL}" style="width: 100%;" placeholder="Enter cursor URL here" />
</div>
<button id="saveButton" style="background-color: #4CAF50; color: white; padding: 10px 20px; border: none; cursor: pointer; border-radius: 5px;">Save</button>
<button id="resetButton" style="background-color: #f44336; color: white; padding: 10px 20px; border: none; cursor: pointer; border-radius: 5px;">Reset to Default</button>
<button id="exportButton" style="background-color: #2196F3; color: white; padding: 10px 20px; border: none; cursor: pointer; border-radius: 5px;">Export Settings</button>
<button id="importButton" style="background-color: #FF9800; color: white; padding: 10px 20px; border: none; cursor: pointer; border-radius: 5px;">Import Settings</button>
</div>
</div>
`;
const modalContainer = document.createElement('div');
modalContainer.innerHTML = panelHTML;
document.body.appendChild(modalContainer);
// Kapatma butonuna tıklandığında paneli kapat
document.querySelector('.modal-topbtn.close').addEventListener('click', () => {
modalContainer.remove();
});
// Ayarları kaydet
document.getElementById('saveButton').addEventListener('click', () => {
settings.buttonColor = document.getElementById('buttonColorPicker').value;
settings.buttonHoverColor = document.getElementById('buttonHoverColorPicker').value;
settings.fontColor = document.getElementById('fontColorPicker').value;
settings.fontSize = document.getElementById('fontSizePicker').value;
settings.fontFamily = document.getElementById('fontFamilyPicker').value;
settings.menuColor = document.getElementById('menuColorPicker').value;
settings.backgroundOpacity = document.getElementById('backgroundOpacity').value;
settings.backgroundImage = document.getElementById('backgroundImage').value;
settings.cursorURL = document.getElementById('cursorURL').value;
saveSettings();
applyStoredStyles();
modalContainer.remove();
});
// Varsayılan ayarlara sıfırlama
document.getElementById('resetButton').addEventListener('click', () => {
resetToDefaultStyles();
modalContainer.remove();
});
// Ayarları dışa aktar
document.getElementById('exportButton').addEventListener('click', () => {
const jsonSettings = JSON.stringify(settings);
const blob = new Blob([jsonSettings], { type: 'application/json' });
const link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.download = 'settings.json';
link.click();
});
// Ayarları içe aktar
document.getElementById('importButton').addEventListener('click', () => {
const input = document.createElement('input');
input.type = 'file';
input.accept = '.json';
input.click();
input.addEventListener('change', (event) => {
const file = event.target.files[0];
if (file && file.name.endsWith('.json')) {
const reader = new FileReader();
reader.onload = function () {
try {
const importedSettings = JSON.parse(reader.result);
Object.keys(importedSettings).forEach(key => {
settings[key] = importedSettings[key];
});
saveSettings();
applyStoredStyles();
} catch (e) {
alert('Failed to import settings.');
}
};
reader.readAsText(file);
} else {
alert('Invalid file format.');
}
});
});
}
// Ayarları kaydet
function saveSettings() {
Object.keys(settings).forEach(key => {
setStoredValue(key, settings[key]);
});
}
// Varsayılan ayarlara dön
function resetToDefaultStyles() {
settings.buttonColor = rgba(226, 226, 226, 0.80);
settings.buttonHoverColor = '#ff91a6';
settings.fontColor = '#000000';
settings.fontSize = '16';
settings.fontFamily = 'Arial';
settings.menuColor = '#ffffff';
settings.backgroundOpacity = '1';
settings.backgroundImage = '';
settings.cursorURL = '';
saveSettings();
applyStoredStyles();
}
})();
(function() {
'use strict';
// Buton oluşturma
let uploadBtn = document.createElement("button");
uploadBtn.innerHTML = '<img src="https://files.catbox.moe/potman.png" style="width: 16px; height: 16px;">'; // Ataş ikonu
uploadBtn.style.padding = "5px";
uploadBtn.style.fontSize = "12px";
uploadBtn.style.color = "white";
uploadBtn.style.border = "1px solid black"; // 1px kalınlığında siyah border eklendi
uploadBtn.style.borderRadius = "3px"; // İsteğe bağlı: Köşeleri yuvarlak yapmak için
uploadBtn.style.cursor = "pointer";
uploadBtn.style.display = "flex";
uploadBtn.style.alignItems = "center";
uploadBtn.style.justifyContent = "center";
uploadBtn.style.marginLeft = "5px"; // Sohbet giriş kutusundan biraz uzaklaştırmak için
uploadBtn.style.backgroundColor = "transparent"; // Arka planı şeffaf yap
// Dosya seçme input'u
let fileInput = document.createElement("input");
fileInput.type = "file";
fileInput.style.display = "none";
document.body.appendChild(fileInput);
// Butona tıklanınca dosya seç
uploadBtn.addEventListener("click", function() {
fileInput.click();
});
fileInput.addEventListener("change", function() {
if (fileInput.files.length === 0) return;
let file = fileInput.files[0];
let formData = new FormData();
formData.append("reqtype", "fileupload");
formData.append("userhash", "");
formData.append("fileToUpload", file);
GM_xmlhttpRequest({
method: "POST",
url: "https://catbox.moe/user/api.php",
data: formData,
onload: function(response) {
if (response.status === 200) {
let link = response.responseText.trim();
GM_setClipboard(link);
// Sohbet kutusuna linki ekle
let chatInput = document.querySelector("input.chtipt");
if (chatInput) {
chatInput.value = link;
}
} else {
console.error("Yükleme başarısız oldu!");
}
}
});
});
// Sohbet kutusunu bul ve butonu içine ekle
let chatInputContainer = document.querySelector("form.chatinput");
if (chatInputContainer) {
chatInputContainer.appendChild(uploadBtn);
} else {
console.error("Sohbet giriş kutusu bulunamadı!");
}
})();
let notificationRadius=300;const NOTIFICATION_TIME=2000;let pixelList=[];let canvas;let notifCircles=[];const args=window.location.href.split(',');let globalScale=1;let viewX=parseInt(args[args.length-3]);let viewY=parseInt(args[args.length-2]);const PING_OP=0xB0;const REG_MCHUNKS_OP=0xA3;const PIXEL_UPDATE_OP=0xC1;const REG_CANVAS_OP=0xA0;if(document.readyState==="loading"){document.addEventListener("DOMContentLoaded",init);}else{init();}function init(){setTimeout(radarMain);}function showInfo(info){if(info.text.length>0){closeModal();const wrapper=document.createElement('div');wrapper.innerHTML=`<div class="Alert show" id="my_modal"><h2>Останній закріп</h2><p>${info.text}</p><button type="button" id="my_button">OK</button></div>`;document.body.appendChild(wrapper);const button=document.querySelector('#my_button');button.addEventListener('click',closeModal);}}function closeModal(){const modal=document.querySelector('#my_modal');if(modal)modal.remove();}async function loadFile(src){const resp=await fetch(src);const blob=await resp.blob();return new File([blob],'result.png',{type:'image/png',});}async function loadInfo(src){const resp=await fetch(src);return await resp.json();}function worldToScreen(x,y){return[((x-viewX)*globalScale)+(canvas.width/2),((y-viewY)*globalScale)+(canvas.height/2),];}function render(){try{const ctx=canvas.getContext('2d');ctx.clearRect(0,0,canvas.width,canvas.height);if(globalScale>0){const curTime=Date.now();let index=pixelList.length;while(index>0){index--;let[setTime,x,y,i,j,color]=pixelList[index];const timePassed=curTime-setTime;if(timePassed>NOTIFICATION_TIME){pixelList.splice(index,1);continue;}const[sx,sy]=worldToScreen(x,y).map((z)=>z+globalScale/2);if(sx<0||sy<0||sx>canvas.width||sx>canvas.height){pixelList.splice(index,1);continue;}const notRadius=timePassed/NOTIFICATION_TIME*notificationRadius;const circleScale=notRadius/100;ctx.save();ctx.scale(circleScale,circleScale);ctx.drawImage(notifCircles[color],Math.round(sx/circleScale-100),Math.round(sy/circleScale-100),);ctx.restore();}}}catch(err){console.error(`Render error`,err,);}setTimeout(render,10);}function addPixel(x,y,i,j,color){for(let k=0;k<pixelList.length;k++){if(pixelList[k][3]===i&&pixelList[k][4]===j){pixelList[k][1]=x;pixelList[k][2]=y;pixelList[k][5]=color;return;}}pixelList.unshift([Date.now(),x,y,i,j,color]);}function getPixelFromChunkOffset(i,j,offset,canvasSize){const tileSize=256;const x=i*tileSize-canvasSize/2+offset%tileSize;const y=j*tileSize-canvasSize/2+Math.trunc(offset/tileSize);return[x,y];}function renderPixel(i,j,offset,color){const canvasSize=65536;const[x,y]=getPixelFromChunkOffset(i,j,offset,canvasSize);addPixel(x,y,i,j,color);}function renderPixels({i,j,pixels}){pixels.forEach((pxl)=>{const[offset,color]=pxl;renderPixel(i,j,offset,color);});}function clamp(n,min,max){return Math.max(min,Math.min(n,max));}function updateScale(viewscale){globalScale=viewscale;notificationRadius=clamp(viewscale*10,20,400);}function updateView(val){viewX=val[0];viewY=val[1];}function onWindowResize(){canvas.width=window.innerWidth;canvas.height=window.innerHeight;}function dehydratePing(){return new Uint8Array([PING_OP]).buffer;}function dehydrateRegMChunks(chunks){const buffer=new ArrayBuffer(1+1+chunks.length*2);const view=new Uint16Array(buffer);view[0]=REG_MCHUNKS_OP;for(let cnt=0;cnt<chunks.length;cnt+=1){view[cnt+1]=chunks[cnt];}return buffer;}function hydratePixelUpdate(data){const i=data.getUint8(1);const j=data.getUint8(2);const pixels=[];let off=data.byteLength;while(off>3){const color=data.getUint8(off-=1);const offsetL=data.getUint16(off-=2);const offsetH=data.getUint8(off-=1)<<16;pixels.push([offsetH|offsetL,color]);}return{i,j,pixels,};}function onBinaryMessage(buffer){if(buffer.byteLength===0)return;const data=new DataView(buffer);const opcode=data.getUint8(0);if(opcode===PIXEL_UPDATE_OP||opcode===145){renderPixels(hydratePixelUpdate(data));}}function dehydrateRegCanvas(canvasId){const buffer=new ArrayBuffer(1+1);const view=new DataView(buffer);view.setInt8(0,REG_CANVAS_OP);view.setInt8(1,Number(canvasId));return buffer;}function onMessage({data:message}){try{if(typeof message!=='string'){onBinaryMessage(message);}}catch(err){console.error(`An error occurred while parsing websocket message ${message}`,err,);}}function socketConnect(i,url,allChunks){const ws=new WebSocket(url);ws.binaryType='arraybuffer';ws.onopen=()=>{console.log(`Socket ${i} opened`);ws.send(dehydrateRegCanvas(0));const chunkids=[];for(let j=17000*i;j<17000*(i+1)&&j<allChunks.length;j++){chunkids.push(allChunks[j]);}ws.send(dehydrateRegMChunks(chunkids));};ws.onmessage=onMessage;ws.onclose=()=>{console.log(`Socket ${i} closed`);setTimeout(()=>{socketConnect(i,url,allChunks)},1000);};ws.onerror=(err)=>{console.error('Socket encountered error, closing socket',err);};setInterval(()=>{if(ws.readyState!==WebSocket.CLOSED){ws.send(dehydratePing());}},23000)}async function radarMain(){canvas=document.createElement('canvas');canvas.style.position='fixed';canvas.style.top='0';canvas.style.left='0';canvas.style.zIndex='0';canvas.style.pointerEvents='none';onWindowResize();const ctx=canvas.getContext('2d');ctx.clearRect(0,0,canvas.width,canvas.height);document.body.appendChild(canvas);window.addEventListener('resize',onWindowResize);const colors=await loadColors();notifCircles=colors.map((color)=>{const circle=document.createElement('canvas');circle.width=200;circle.height=200;const ctx=circle.getContext('2d');ctx.fillStyle=`rgba(${color[0]},${color[1]},${color[2]},0.5)`;ctx.beginPath();ctx.arc(100,100,100,0,2*Math.PI);ctx.closePath();ctx.fill();return circle;});pixelPlanetEvents.on('setscale',updateScale);pixelPlanetEvents.on('setviewcoordinates',updateView);setTimeout(render,10);const url=`${window.location.protocol==='https:'?'wss:':'ws:'}//${window.location.host}/ws`;const allChunks=[];for(let i=0;i<=255;i++){for(let j=0;j<=255;j++){allChunks.push((i<<8)|j);}}for(let i=0;i<4;i++){setTimeout(()=>{socketConnect(i,url,allChunks)});}}async function loadColors(){const resp=await fetch('/api/me');const data=await resp.json();for(const[key,canvas]of Object.entries(data['canvases'])){if(canvas['ident']===window.location.hash.substring(1,2)){return canvas['colors'];}}return[[255,0,0],[0,255,0],[0,0,255],];}