Skip to content

Instantly share code, notes, and snippets.

@theVDude
Last active August 29, 2015 14:01
Show Gist options
  • Save theVDude/70e1967ae2aae522a089 to your computer and use it in GitHub Desktop.
Save theVDude/70e1967ae2aae522a089 to your computer and use it in GitHub Desktop.
Gecko Tools for tagpro!
// ==UserScript==
// @name Gecko Tools
// @namespace http://www.reddit.com/user/thevdude
// @description A suite of customization options for TagPro
// @include http://tagpro-*.koalabeast.com*
// @include http://tangent.jukejuice.com*
// @license GNU General Public License
// @author GeckoPie & pooppants
// @version 1.0.3.1
// @grant GM_getValue
// @grant GM_setValue
// ==/UserScript==
/******************************************
****** GLOBAL CONFIGURATION SETTINGS ******
*******************************************/
window.menuOpen = false;
window.resizeTimer = false;
// Load settings from local storage
window.gt_customSounds = true;
if (GM_getValue('gt_customSounds') != undefined) {
gt_customSounds = eval(GM_getValue('gt_customSounds'));
}
window.gt_drawTiles = true;
if (GM_getValue('gt_drawTiles') != undefined) {
gt_drawTiles = eval(GM_getValue('gt_drawTiles'));
}
window.gt_drawWallpaper = true;
if (GM_getValue('gt_drawWallpaper') != undefined) {
gt_drawWallpaper = eval(GM_getValue('gt_drawWallpaper'));
}
window.gt_transparentBackground = false;
if (GM_getValue('gt_transparentBackground') != undefined) {
gt_transparentBackground = eval(GM_getValue('gt_transparentBackground'));
}
/*
//TODO: FIX THIS WHEN PATCH IS PUSHED TO MAPTEST! IN THE MEANTIME, SET TO FALSE
window.gt_maximize = false;
if (GM_getValue('gt_maximize') != undefined) {
gt_maximize = eval(GM_getValue('gt_maximize'));
}
*/
window.gt_maximize = false;
GM_setValue('gt_maximize', false);
window.gt_hideBorder = true;
if (GM_getValue('gt_hideBorder') != undefined) {
gt_hideBorder = eval(GM_getValue('gt_hideBorder'));
}
window.gt_hideIcons = true;
if (GM_getValue('gt_hideIcons') != undefined) {
gt_hideIcons = eval(GM_getValue('gt_hideIcons'));
}
window.addEventListener('DOMContentLoaded', function(e) {
/*******************************************
****** CONSTRUCT THE GECKO TOOLS MENU ******
********************************************/
// Build the message div
var message_div = document.createElement("div");
message_div.width = "140px";
message_div.style.opacity = "0.0";
message_div.style.display = "none";
message_div.style.bottom = "20px";
message_div.style.marginLeft = "50%"
message_div.style.left = "-70px";
message_div.style.position = "absolute";
message_div.style.backgroundColor = "#070707";
message_div.style.color="#47953d";
message_div.style.borderRadius="4px";
message_div.style.padding="8px";
message_div.innerHTML = "Files Accepted";
message_div.style.transition="opacity 0.25s linear";
document.body.appendChild(message_div);
// Build the icon
var gecko_icon = document.createElement("img");
gecko_icon.src = "http://i.imgur.com/eenIpmO.png";
gecko_icon.onclick=toggleMenu;
gecko_icon.style.opacity="0.0";
gecko_icon.onmouseover= function(){gecko_icon.style.opacity="1.0";gecko_icon.style.cursor="pointer";}
gecko_icon.onmouseout = function(){gecko_icon.style.opacity= menuOpen ? "1.0" : "0.0";}
gecko_icon.style.transition="opacity 0.25s linear";
document.body.appendChild(gecko_icon);
// Position the icon
function repositionIcon() {
gecko_icon.style.position="absolute";
gecko_icon.style.right = "20px";
gecko_icon.style.bottom = "20px";
}
// Build the menu
var gecko_menu = document.createElement("div");
gecko_menu.style.opacity="0.0";
gecko_menu.style.backgroundColor="#7eaeca";
gecko_menu.style.background="linear-gradient(#7db5d4,#598ca9)";
gecko_menu.style.borderRadius="4px";
gecko_menu.style.padding="0px";
gecko_menu.style.boxShadow="0px 0px 8px #000000";
gecko_menu.style.transition="opacity 0.25s linear";
var inner_div = document.createElement("div");
inner_div.style.margin="10px";
inner_div.style.display="none";
inner_div.innerHTML="<div style=\"background-color:#070707;border-radius:4px;width:inherit;padding:8px;\">" +
"<strong style=\"color:#47953d;\">Gecko Tools 1.0.3</strong></div>" +
"<br>" +
"<table>" +
"<tr><td><span style=\"color:#000000;font-weight:bold;\">Custom Sounds</span>" +
"<br><small>Drag and drop your sound files onto the browser window</small></td>" +
"<td width=60>&nbsp;</td>" +
"<td align=\"right\"><span style=\"color:#47953d;font-weight:bold;background-color:#070707;" +
"border-radius:16px;padding:8px;cursor:pointer;\" id=\"btn_sounds\">On</span></td></tr>" +
"<tr height=8><td></td></tr>" +
"<tr><td><span style=\"color:#000000;font-weight:bold;\">Custom Tiles</span>" +
"<br><small>Drag and drop your tiles onto the browser window</small></td>" +
"<td width=60>&nbsp;</td>" +
"<td align=\"right\"><span style=\"color:#47953d;font-weight:bold;background-color:#070707;" +
"border-radius:16px;padding:8px;cursor:pointer;\" id=\"btn_tiles\">On</span></td></tr>" +
"<tr height=8><td></td></tr>" +
"<tr><td><span style=\"color:#000000;font-weight:bold;\">Custom Wallpaper</span>" +
"<br><small>Drag and drop your wallpaper onto the browser window</small></td>" +
"<td width=60>&nbsp;</td>" +
"<td align=\"right\"><span style=\"color:#47953d;font-weight:bold;background-color:#070707;" +
"border-radius:16px;padding:8px;cursor:pointer;\" id=\"btn_wallpaper\">On</span></td></tr>" +
"<tr height=8><td></td></tr>" +
"<tr><td><span style=\"color:#000000;font-weight:bold;\">Transparent Background</span>" +
"<br><small>Removes the black background around the outside of the map</small></td>" +
"<td width=60>&nbsp;</td>" +
"<td align=\"right\"><span style=\"color:#ff011f;font-weight:bold;background-color:#070707;" +
"border-radius:16px;padding:8px;cursor:pointer;\" id=\"btn_background\">Off</span></td></tr>" +
"<tr height=8><td></td></tr>" +
/*
"<tr><td><span style=\"color:#000000;font-weight:bold;\">Maximize Viewport</span>" +
"<br><small>Stretches the viewport to fill up the entire browser window</small></td>" +
"<td width=60>&nbsp;</td>" +
"<td align=\"right\"><span style=\"color:#ff011f;font-weight:bold;background-color:#070707;" +
"border-radius:16px;padding:8px;cursor:pointer;\" id=\"btn_maximize\">Off</span></td></tr>" +
"<tr height=8><td></td></tr>" +
*/
'<tr><td><span style="color:#000000;font-weight:bold;">Hide Border</span>' +
'<br><small>Hides the border around the viewport, may help FPS</small></td>' +
'<td width=60>&nbsp;</td>' +
'<td align="right"><span style="color:#ff011f;font-weight:bold;background-color:#070707;' +
'border-radius:16px;padding:8px;cursor:pointer;" id="btn_hideBorder">On</span></td></tr>' +
"<tr><td><span style=\"color:#000000;font-weight:bold;\">Hide Icons</span>" +
"<br><small>Hides the exit, donate, music and sound buttons during game</small></td>" +
"<td width=60>&nbsp;</td>" +
"<td align=\"right\"><span style=\"color:#ff011f;font-weight:bold;background-color:#070707;" +
"border-radius:16px;padding:8px;cursor:pointer;\" id=\"btn_hideIcons\">On</span></td></tr>" +
"</table>";
document.body.appendChild(gecko_menu);
gecko_menu.appendChild(inner_div);
// Position the menu
function repositionMenu() {
gecko_menu.style.position="absolute";
gecko_menu.style.right = (gecko_icon.width*0.9 + 20) + "px";
gecko_menu.style.bottom = (gecko_icon.height*0.9 + 20) + "px";
}
// Toggle the menu
function toggleMenu() {
menuOpen = !menuOpen;
if (menuOpen) {
showMenu();
} else {
hideMenu();
}
}
function showMenu() {
gecko_icon.style.cursor="pointer";
gecko_menu.style.opacity = "1.0";
gecko_icon.style.opacity="1.0";
inner_div.style.display="inline-block";
}
function hideMenu() {
gecko_icon.style.cursor="default";
gecko_menu.style.opacity="0.0";
gecko_icon.style.opacity="0.0";
inner_div.style.display="none";
}
// Add drag-and-drop functionality
function handleDragOver(e) {
e.stopPropagation();
e.preventDefault();
e.dataTransfer.dropEffect = 'copy';
}
function handleFileSelect(e) {
e.stopPropagation();
e.preventDefault();
var files = e.dataTransfer.files;
var tileTypes = [];
var soundTypes = [];
for(var i = 0, file; file = files[i]; i++) {
if(file.type.match('image.*')) {
var reader = new FileReader();
// Determine what kind of tile it is
var name = escape(file.name);
if (name.match(/[tiles|splats|speedpad|speedpadred|speedpadblue|portal]\.png/)) {
var regex = /(.*)\.png/;
var tileType = regex.exec(name)[1];
tileTypes.push(tileType);
eval("reader.onload = (function(thisFile) {"+
"return function(x) {"+
"GM_setValue('gt_" + tileType + "', x.target.result);"+
"};"+
"})(file);");
} else {
// It must be a wallpaper, load it as a wallpaper
reader.onload = (function(thisFile) {
return function(x) {
GM_setValue('gt_wallpaper', x.target.result);
setTimeout(function(){updateWallpaper();},2e2);
};
})(file);
}
reader.readAsDataURL(file);
} else {
// Most likely a sound file
var name = escape(file.name);
if (name.match(/[burst|alert|cheering|drop|sigh|powerup|pop|click|explosion|countdown|friendlydrop|friendlyalert|alertlong|go|degreeup|teleport]\.[mp3|m4a|ogg]/)) {
var reader = new FileReader();
var regex = /(.*)\.[mp3|m4a|ogg]/;
var soundType = regex.exec(name)[1];
soundTypes.push(soundType);
eval("reader.onload = (function(thisFile) {"+
"return function(x) {"+
"GM_setValue('gt_" + soundType + "', x.target.result);"+
"};"+
"})(file);");
reader.readAsDataURL(file);
}
}
}
//Call update on all items dropped
tileTypes.length > 0 && setTimeout(function(){updateTiles();},1e2);
soundTypes.length > 0 && setTimeout(function(){updateSounds();},1e2);
if (tileTypes.length > 0 || soundTypes.length > 0) {
message_div.style.display = "inline-block";
setTimeout(function() {message_div.style.opacity = "1.0";},10);
setTimeout(function() {
message_div.style.opacity = "0.0";
setTimeout(function() {
message_div.style.display = "none";
},0.25e3);
}, 1.25e3);
}
}
document.documentElement.addEventListener('dragover', handleDragOver, false);
document.documentElement.addEventListener('drop', handleFileSelect, false);
// Toggle tiles button:
var btn_tiles = document.getElementById("btn_tiles");
btn_tiles.onclick=toggle_btnTiles;
function toggle_btnTiles(){
gt_drawTiles = !gt_drawTiles;
GM_setValue('gt_drawTiles',gt_drawTiles.toString());
update_btnTiles();
updateTiles();
}
function update_btnTiles() {
btn_tiles.innerHTML = gt_drawTiles == true ? "On" : "Off";
btn_tiles.style.color = gt_drawTiles == true ? "#47953d" : "#ff011f";
}
// Update the tiles:
function updateTiles() {
if (gt_drawTiles && GM_getValue('gt_drawTiles')) {
if (document.getElementById('tiles')) {
var tileTypes = ['tiles','splats','speedpad','speedpadred','speedpadblue','portal'];
for (var i=0; i<tileTypes.length; i++) {
if(document.getElementById(tileTypes[i])) {
document.getElementById(tileTypes[i]).src = "";
document.getElementById(tileTypes[i]).src = (gt_drawTiles && GM_getValue('gt_' + tileTypes[i])) ? GM_getValue('gt_' + tileTypes[i]) : "http://" + document.location.hostname + "/images/" + tileTypes[i] + ".png";
}
}
setTimeout(unsafeWindow.tagpro.api.redrawBackground,1e2);
}
}
}
// Toggle sounds button:
var btn_sounds = document.getElementById("btn_sounds");
btn_sounds.onclick=toggle_btnSounds;
function toggle_btnSounds(){
gt_customSounds = !gt_customSounds;
GM_setValue('gt_customSounds',gt_customSounds.toString());
update_btnSounds();
updateSounds();
}
function update_btnSounds() {
btn_sounds.innerHTML = gt_customSounds == true ? "On" : "Off";
btn_sounds.style.color = gt_customSounds == true ? "#47953d" : "#ff011f";
}
// Update the sounds
function updateSounds() {
if (document.getElementById('countdown')) {
var soundTypes = ['burst', 'alert', 'cheering', 'drop', 'sigh', 'powerup', 'pop', 'click', 'explosion', 'countdown', 'friendlydrop', 'friendlyalert', 'alertlong', 'go', 'degreeup', 'teleport'];
for (var i=0; i<soundTypes.length; i++) {
if(document.getElementById(soundTypes[i])) {
if (gt_customSounds && GM_getValue('gt_' + soundTypes[i]) != undefined) {
var newSource = document.createElement('source');
newSource.src = GM_getValue('gt_' + soundTypes[i]);
var regex = /data:(.*);base64/;
var type = regex.exec(newSource.src)[1];
newSource.type = type;
var audioTag = eval("document.getElementsByTagName(\"audio\")." + soundTypes[i]);
audioTag.innerHTML = "";
audioTag.appendChild(newSource);
audioTag.load();
} else {
var audioTag = eval("document.getElementsByTagName(\"audio\")." + soundTypes[i]);
audioTag.innerHTML = "<source type=\"audio/mp3\" src=\"http://" + document.location.hostname + "/sounds/" + soundTypes[i] + ".mp3\"></source><source type=\"audio/m4a\" src=\"http://" + document.location.hostname + "/sounds/" + soundTypes[i] + ".m4a\"></source><source type=\"audio/ogg\" src=\"http://" + document.location.hostname + "/sounds/" + soundTypes[i] + ".ogg\"></source>";
audioTag.load();
}
}
}
}
}
// Toggle wallpaper button:
var btn_wallpaper = document.getElementById("btn_wallpaper");
btn_wallpaper.onclick=toggle_btnWallpaper;
function toggle_btnWallpaper(){
gt_drawWallpaper = !gt_drawWallpaper;
GM_setValue('gt_drawWallpaper',gt_drawWallpaper.toString());
update_btnWallpaper();
updateWallpaper();
}
function update_btnWallpaper() {
btn_wallpaper.innerHTML = gt_drawWallpaper == true ? "On" : "Off";
btn_wallpaper.style.color = gt_drawWallpaper == true ? "#47953d" : "#ff011f";
}
// Update the wallpaper
function updateWallpaper() {
if (gt_drawWallpaper && GM_getValue('gt_wallpaper')) {
document.documentElement.style.background = "url(" + GM_getValue('gt_wallpaper') + ")";
} else {
document.documentElement.style.background = "url(\"http://" + document.location.hostname + "/images/background.jpg\")";
}
document.documentElement.style.backgroundRepeat = "no-repeat";
document.documentElement.style.backgroundAttachment = "fixed";
document.documentElement.style.backgroundPosition = "center center";
document.documentElement.style.backgroundSize = "cover";
}
// Toggle background button:
var btn_background = document.getElementById("btn_background");
btn_background.onclick=toggle_btnBackground;
function toggle_btnBackground(){
gt_transparentBackground = !gt_transparentBackground;
GM_setValue('gt_transparentBackground',gt_transparentBackground.toString());
update_btnBackground();
}
function update_btnBackground() {
btn_background.innerHTML = gt_transparentBackground == true ? "On" : "Off";
btn_background.style.color = gt_transparentBackground == true ? "#47953d" : "#ff011f";
updateBackground();
}
function updateBackground() {
if (document.getElementById("viewPort")) {
var vp = document.getElementById("viewPort");
vp.style.backgroundColor = gt_transparentBackground ? "rgba(0,0,0,0)" : "black";
}
}
/*
//TODO: THIS IS BUSTED, WILL FIX WHEN PATCH COMES TO MAPTEST
// Toggle maximize button:
var btn_maximize = document.getElementById("btn_maximize");
btn_maximize.onclick=toggle_btnMaximize;
function toggle_btnMaximize(){
gt_maximize = !gt_maximize;
GM_setValue('gt_maximize',gt_maximize.toString());
update_btnMaximize();
updateMaximize();
}
function update_btnMaximize() {
btn_maximize.innerHTML = gt_maximize == true ? "On" : "Off";
btn_maximize.style.color = gt_maximize == true ? "#47953d" : "#ff011f";
}
function updateMaximize() {
if (document.getElementById("viewPort")) {
var vp = document.getElementById("viewPort");
var vw = vp.width;
var vh = vp.height;
if (gt_maximize) {
// Stetch to fit while maintaining aspect ratio
var w = window.innerWidth;
var h = window.innerHeight;
var ratio = w/h;
if (ratio > vw/vh) {
// Width dominates, the top/bottom will have to be clipped
vp.style.width = w + "px";
vp.style.height = w*(vh/vw) + "px";
vp.style.marginLeft = "0px";
vp.style.marginTop = (window.innerHeight - parseInt(vp.style.height))/2 + "px";
} else {
// Height dominates, the left/right will have to be clipped
vp.style.height = h + "px";
vp.style.width = h*(vw/vh) + "px";
vp.style.marginTop = "0px";
vp.style.marginLeft = (window.innerWidth - parseInt(vp.style.width))/2 + "px";
}
vp.style.border = "none";
} else {
// Revert back to normal
vp.style.width = vw + "px";
vp.style.height = vh + "px";
vp.style.border = "10px solid white";
vp.style.marginTop = (window.innerHeight - (vh + 20))/2 + "px";
vp.style.marginLeft = (window.innerWidth - (vw + 20))/2 + "px";
}
}
}
*/
// Toggle border button:
var btn_hideBorder = document.getElementById('btn_hideBorder');
btn_hideBorder.onclick = toggle_btnHideBorder;
function toggle_btnHideBorder() {
gt_hideBorder = !gt_hideBorder;
GM_setValue('gt_hideBorder', gt_hideBorder.toString());
update_btnHideBorder();
updateHideBorder();
}
function update_btnHideBorder() {
btn_hideBorder.innerHTML = gt_hideBorder == true ? 'On' : 'Off';
btn_hideBorder.style.color = gt_hideBorder == true ? '#47953d' : '#ff011f';
}
// Update the border
function updateHideBorder() {
if (document.getElementById('viewPortDiv')){
var vpd = document.getElementById('viewPortDiv');
gt_hideBorder ? vpd.style.border = 'none' : vpd.style.border = '10px solid white';
}
}
// Toggle icons button:
var btn_hideIcons = document.getElementById("btn_hideIcons");
btn_hideIcons.onclick=toggle_btnHideIcons;
function toggle_btnHideIcons(){
gt_hideIcons = !gt_hideIcons;
GM_setValue('gt_hideIcons',gt_hideIcons.toString());
update_btnHideIcons();
updateHideIcons();
}
function update_btnHideIcons() {
btn_hideIcons.innerHTML = gt_hideIcons == true ? "On" : "Off";
btn_hideIcons.style.color = gt_hideIcons == true ? "#47953d" : "#ff011f";
}
// Update the icons
function updateHideIcons() {
if (gt_hideIcons) {
if (document.getElementById("soundEffects")) {
document.getElementById("soundEffects").style.visibility="hidden";
document.getElementById("soundEffects").style.display="none";
}
if (document.getElementById("soundMusic")) {
document.getElementById("soundMusic").style.visibility="hidden";
document.getElementById("soundMusic").style.display="none";
}
if (document.getElementById("exit")) {
document.getElementById("exit").style.visibility="hidden";
document.getElementById("exit").style.display="none";
}
if (document.getElementById("donate")) {
document.getElementById("donate").style.visibility="hidden";
document.getElementById("donate").style.display="none";
}
} else {
if (document.getElementById("soundEffects")) {
document.getElementById("soundEffects").style.visibility="visible";
document.getElementById("soundEffects").style.display="inline-block";
}
if (document.getElementById("soundMusic")) {
document.getElementById("soundMusic").style.visibility="visible";
document.getElementById("soundMusic").style.display="inline-block";
}
if (document.getElementById("exit")) {
document.getElementById("exit").style.visibility="visible";
document.getElementById("exit").style.display="inline-block";
}
if (document.getElementById("donate")) {
document.getElementById("donate").style.visibility="visible";
document.getElementById("donate").style.display="inline-block";
}
}
}
// Position menu and load initial button states
setTimeout(function() {
repositionIcon();
repositionMenu();
update_btnTiles();
updateTiles();
update_btnSounds();
updateSounds();
update_btnWallpaper();
update_btnBackground();
updateBackground();
updateWallpaper();
update_btnHideIcons();
updateHideIcons();
update_btnHideBorder();
setTimeout(updateBorder,1e3);
}, 1e2);
// Handle resize event
window.onresize=function(){
repositionIcon();
repositionMenu();
if (resizeTimer) {
clearTimeout(resizeTimer);
resizeTimer = false;
}
resizeTimer = setTimeout(function() {
updateBorder();
resizeTimer = false;
tagpro.ui.resize();
}, 1100);
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment