☰

Quick link

deadfrontier-This is a convenience button script

当前为 2024-11-08 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         Quick link
  3. // @namespace    http://tampermonkey.net/
  4. // @version      1.2
  5. // @description  deadfrontier-This is a convenience button script
  6. // @author       SHUNHK
  7. // @icon         https://i.imgur.com/WKv8txW.jpeg
  8. // @match        *fairview.deadfrontier.com/onlinezombiemmo/index.php*
  9. // @match        *fairview.deadfrontier.com/onlinezombiemmo/
  10. // @license      LGPL License
  11. // @downloadURL
  12. // @updateURL
  13. // ==/UserScript==
  14.  
  15. (function() {
  16.     'use strict';
  17.  
  18.     console.log('Script started');
  19.  
  20.     //
  21.     var container = createButtonContainer();
  22.     document.body.appendChild(container);
  23.  
  24.     //
  25.     function setCustomPosition(container) {
  26.     if (window.innerWidth <= 960) { //
  27.         container.style.top = '600px';
  28.         container.style.right = '715px';
  29.     } else { //
  30.         container.style.top = '230px';
  31.         container.style.right = '380px';
  32.     }
  33. }
  34.  
  35. //
  36. setCustomPosition(container);
  37.  
  38. //
  39. window.addEventListener('resize', function() {
  40.     setCustomPosition(container);
  41. });
  42.  
  43.     // 
  44.     addRainbowAnimation();
  45.  
  46.     function createButtonContainer() {
  47.         var container = document.createElement('div');
  48.         container.style.position = 'fixed';
  49.         container.style.top = '200px'; //
  50.         container.style.right = '380px'; //
  51.         container.style.zIndex = '1000';
  52.         container.style.backgroundImage = 'url("https://i.imgur.com/HW8B3sf.jpeg")';
  53.         container.style.backgroundSize = 'cover';
  54.         container.style.padding = '8px';
  55.         container.style.borderRadius = '50px';
  56.         container.style.display = 'flex';
  57.         container.style.flexDirection = 'column';
  58.         container.style.gap = '5px';
  59.         container.style.width = '60px'; //
  60.         container.style.height = 'auto'; //
  61.  
  62.         console.log('Container created');
  63.  
  64.         
  65.         var buttons = [
  66.             { name: 'Travel', link: 'https://fairview.deadfrontier.com/onlinezombiemmo/index.php?page=61' },
  67.             { name: 'Craft', link: 'https://fairview.deadfrontier.com/onlinezombiemmo/index.php?page=59' },
  68.             { name: 'Game', link: 'https://fairview.deadfrontier.com/onlinezombiemmo/index.php?page=49' },
  69.             { name: 'Venditron', link: 'https://fairview.deadfrontier.com/onlinezombiemmo/index.php?page=84' },
  70.             { name: 'Profile', link: 'https://fairview.deadfrontier.com/onlinezombiemmo/index.php?action=profile' },
  71.             { name: 'Marke', link: 'https://fairview.deadfrontier.com/onlinezombiemmo/index.php?page=35' },
  72.             { name: 'Bank', link: 'https://fairview.deadfrontier.com/onlinezombiemmo/index.php?page=15' },
  73.             { name: 'Storage', link: 'https://fairview.deadfrontier.com/onlinezombiemmo/index.php?page=50' },
  74.             { name: 'Yard', link: 'https://fairview.deadfrontier.com/onlinezombiemmo/index.php?page=24' },
  75.             { name: 'OP', link: 'https://fairview.deadfrontier.com/onlinezombiemmo/index.php?page=0' },
  76.         ];
  77.  
  78.         buttons.forEach(function(buttonInfo) {
  79.             createQuickNavigationButton(container, buttonInfo.name, buttonInfo.link);
  80.         });
  81.  
  82.         // 
  83.         createMoveButton(container);
  84.  
  85.         return container;
  86.     }
  87.  
  88.     function createQuickNavigationButton(container, buttonTitle, url) {
  89.         let button = document.createElement("button");
  90.         button.textContent = buttonTitle;
  91.         button.id = buttonTitle;
  92.         button.style.height = "max-content";
  93.         button.classList.add("nav-button");
  94.         button.addEventListener("click", function() {
  95.             window.location.href = url;
  96.         });
  97.         button.addEventListener('mouseover', function() {
  98.             button.style.animation = 'rainbow 3s infinite';
  99.         });
  100.         button.addEventListener('mouseout', function() {
  101.             button.style.animation = '';
  102.         });
  103.         container.appendChild(button);
  104.     }
  105.  
  106.     function createMoveButton(container) {
  107.         let moveButton = document.createElement("button");
  108.         moveButton.textContent = "move";
  109.         moveButton.style.padding = '10px';
  110.         moveButton.style.border = 'none';
  111.         moveButton.style.borderRadius = '5px';
  112.         moveButton.style.backgroundColor = '#28a745';
  113.         moveButton.style.color = 'white';
  114.         moveButton.style.cursor = 'pointer';
  115.         moveButton.addEventListener('mousedown', function(e) {
  116.             var offsetX = e.clientX - container.getBoundingClientRect().left;
  117.             var offsetY = e.clientY - container.getBoundingClientRect().top;
  118.  
  119.             function mouseMoveHandler(e) {
  120.                 container.style.left = `${e.clientX - offsetX}px`;
  121.                 container.style.top = `${e.clientY - offsetY}px`;
  122.             }
  123.  
  124.             function mouseUpHandler() {
  125.                 document.removeEventListener('mousemove', mouseMoveHandler);
  126.                 document.removeEventListener('mouseup', mouseUpHandler);
  127.             }
  128.  
  129.             document.addEventListener('mousemove', mouseMoveHandler);
  130.             document.addEventListener('mouseup', mouseUpHandler);
  131.         });
  132.         container.appendChild(moveButton);
  133.     }
  134.  
  135.     function addRainbowAnimation() {
  136.         var style = document.createElement('style');
  137.         style.innerHTML = `
  138.             @keyframes rainbow {
  139.                 0% { background-color: red; }
  140.                 14% { background-color: orange; }
  141.                 28% { background-color: yellow; }
  142.                 42% { background-color: green; }
  143.                 57% { background-color: blue; }
  144.                 71% { background-color: indigo; }
  145.                 85% { background-color: violet; }
  146.                 100% { background-color: red; }
  147.             }
  148.             .rainbow-animation {
  149.                 animation: rainbow 3s infinite;
  150.             }
  151.             .move-button {
  152.                 padding: 10px;
  153.                 border: none;
  154.                 border-radius: 5px;
  155.                 background-color: #28a745;
  156.                 color: white;
  157.                 cursor: pointer;
  158.             }
  159.         `;
  160.         document.head.appendChild(style);
  161.     }
  162.  
  163.  
  164.  
  165. })();