Inserts logout button to dead frontier outpost page
// ==UserScript==
// @name Logout Button
// @namespace Lucky11(13831671)
// @version 1
// @description Inserts logout button to dead frontier outpost page
// @author Lucky11(13831671)
// @license MIT
// @match https://fairview.deadfrontier.com/onlinezombiemmo/index.php?page=21
// @grant GM_cookie
// @run-at document-end
// ==/UserScript==
(function() {
'use strict';
const BUTTON_ID = 'logOffClearBtn';
const cookieUrl = window.location.origin;
function createButton() {
const existing = document.getElementById(BUTTON_ID);
if (existing) return existing;
const btn = document.createElement('button');
btn.id = BUTTON_ID;
btn.type = 'button';
btn.textContent = 'Logout→';
// Base visual style matching your other button (but clickable)
Object.assign(btn.style, {
background: 'none',
border: 'none',
color: 'white',
textShadow: '0 0 10px red',
fontSize: '20px',
cursor: 'pointer',
padding: '6px 8px',
fontWeight: 'normal',
});
btn.addEventListener('mouseenter', () => {
btn.style.textShadow = '0 0 10px red, 0 0 10px red, 0 0 10px red';
});
btn.addEventListener('mouseleave', () => {
btn.style.textShadow = '0 0 10px red';
});
return btn;
}
function findTargetContainer() {
// Heuristic: match the container from your example
return Array.from(document.querySelectorAll('div')).find(d => {
const s = d.getAttribute('style') || '';
return /width:\s*700px/.test(s) && /margin-left:\s*auto/.test(s) && /margin-right:\s*auto/.test(s);
}) || null;
}
function placeButton() {
// 1. Don't add if button already exists
if (document.getElementById(BUTTON_ID)) return;
let container = findTargetContainer();
// 2. If container doesn't exist, create and inject it
if (!container) {
const containerHTML = `
<div id="tm-custom-container" style="position: relative; width: 700px; margin: 0 auto; top: 0px; z-index: 9999; height: 40px;">
<style>
#backToOutpostSubmit {background: none; border: none; color: white; text-shadow: 0 0 10px red; font-size: 20px; cursor: pointer;}
#backToOutpostSubmit:hover {text-shadow: 0 0 10px red, 0 0 10px red, 0 0 10px red;}
</style>
<button id="logOffClearBtn" type="button" style="background: none; border: none; color: white; text-shadow: red 0px 0px 10px; font-size: 20px; cursor: pointer; padding: 6px 8px; position: absolute; right: 10px; top: 0px;">Logout→</button>
</div>
`;
//document.body.insertAdjacentHTML('afterbegin', containerHTML);
const target = document.getElementById('block13') || document.querySelector('div[id^="block"]');
if (target) {
target.insertAdjacentHTML('afterbegin', containerHTML);
} else {
// fallback to body if target not yet present
document.body.insertAdjacentHTML('afterbegin', containerHTML);
}
// Now that it's in the DOM, find it so we can use it
container = document.getElementById('tm-custom-container');
}
// 3. Prepare and attach the button
const btn = createButton();
const cs = getComputedStyle(container);
// Ensure the container can hold absolute-positioned children
if (cs.position === 'static') {
container.style.position = 'relative';
}
// 2. Add the clearing logic
btn.onclick = function() {
// List all cookies for this site
GM_cookie.list({ url: window.location.href }, (cookies, error) => {
if (!error) {
// Delete every cookie found
cookies.forEach(cookie => {
GM_cookie.delete({ name: cookie.name, url: window.location.href });
});
// 3. Refresh the site after clearing
setTimeout(() => {
window.location.reload();
}, 500);
} else {
console.warn('GM_cookie.list error or no cookies:', error);
}
});
};
Object.assign(btn.style, {
position: 'absolute',
right: '80px',
top: '0',
});
container.appendChild(btn);
}
placeButton();
const observer = new MutationObserver(() => {
const btn = document.getElementById(BUTTON_ID);
const container = findTargetContainer();
if (btn && container && btn.parentElement !== container) {
// move existing button into container so it's aligned with the other button
const cs = getComputedStyle(container);
if (cs.position === 'static') container.style.position = 'relative';
Object.assign(btn.style, {
position: 'absolute',
right: '10px',
top: '0',
zIndex: '',
backgroundColor: '',
border: '',
padding: '',
fontWeight: 'normal',
});
container.appendChild(btn);
return;
}
if (!btn) placeButton();
});
observer.observe(document.documentElement || document.body, { childList: true, subtree: true });
setTimeout(() => observer.disconnect(), 3000);
})();