☰

Website Executor

Website Executor like Xeno

  1. // ==UserScript==
  2. // @name         Website Executor
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.1
  5. // @description  Website Executor like Xeno
  6. // @match        *://*/*
  7. // @grant        GM_addStyle
  8. // ==/UserScript==
  9.  
  10. (function() {
  11.     'use strict';
  12.  
  13.     // Add custom style
  14.     GM_addStyle(`
  15.         #executorWindow {
  16.             position: fixed;
  17.             top: 20px;
  18.             left: 20px;
  19.             width: 600px;
  20.             height: 400px;
  21.             background-color: #1e1e1e;
  22.             color: #fff;
  23.             border: 1px solid #00ffff;
  24.             box-shadow: 0 0 10px #00ffff;
  25.             z-index: 1000;
  26.         }
  27.  
  28.         #titleBar {
  29.             background-color: #333;
  30.             padding: 10px;
  31.             cursor: move;
  32.             display: flex;
  33.             justify-content: space-between;
  34.         }
  35.  
  36.         #contentArea {
  37.             padding: 10px;
  38.         }
  39.  
  40.         #codeEditor {
  41.             width: 100%;
  42.             height: 300px;
  43.             background-color: #222;
  44.             color: #fff;
  45.             border: none;
  46.             padding: 5px;
  47.             font-family: monospace;
  48.         }
  49.  
  50.         #bottomBar {
  51.             background-color: #333;
  52.             padding: 10px;
  53.             display: flex;
  54.             justify-content: space-around;
  55.         }
  56.  
  57.         #bottomBar button {
  58.             background-color: #444;
  59.             color: #fff;
  60.             border: none;
  61.             padding: 5px 10px;
  62.             cursor: pointer;
  63.         }
  64.     `);
  65.  
  66.     function initializeExecutor() {
  67.         // Create the executor window
  68.         const executorWindow = document.createElement('div');
  69.         executorWindow.id = 'executorWindow';
  70.  
  71.         // Title bar
  72.         const titleBar = document.createElement('div');
  73.         titleBar.id = 'titleBar';
  74.         titleBar.textContent = 'Website Executor';
  75.         executorWindow.appendChild(titleBar);
  76.  
  77.         // Content area
  78.         const contentArea = document.createElement('div');
  79.         contentArea.id = 'contentArea';
  80.         executorWindow.appendChild(contentArea);
  81.  
  82.         // Code editor
  83.         const codeEditor = document.createElement('textarea');
  84.         codeEditor.id = 'codeEditor';
  85.         contentArea.appendChild(codeEditor);
  86.  
  87.         // Bottom bar
  88.         const bottomBar = document.createElement('div');
  89.         bottomBar.id = 'bottomBar';
  90.         executorWindow.appendChild(bottomBar);
  91.  
  92.         // Buttons
  93.         const buttons = ['Settings', 'Open', 'Save', 'Clear', 'Run'];
  94.         buttons.forEach(text => {
  95.             const button = document.createElement('button');
  96.             button.textContent = text;
  97.             bottomBar.appendChild(button);
  98.         });
  99.  
  100.         // Append executorWindow to document.body
  101.         document.body.appendChild(executorWindow);
  102.  
  103.         // Make the window draggable
  104.         let pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
  105.         titleBar.onmousedown = dragMouseDown;
  106.  
  107.         function dragMouseDown(e) {
  108.             e = e || window.event;
  109.             e.preventDefault();
  110.             pos3 = e.clientX;
  111.             pos4 = e.clientY;
  112.             document.onmouseup = closeDragElement;
  113.             document.onmousemove = elementDrag;
  114.         }
  115.  
  116.         function elementDrag(e) {
  117.             e = e || window.event;
  118.             e.preventDefault();
  119.             pos1 = pos3 - e.clientX;
  120.             pos2 = pos4 - e.clientY;
  121.             pos3 = e.clientX;
  122.             pos4 = e.clientY;
  123.             executorWindow.style.top = (executorWindow.offsetTop - pos2) + "px";
  124.             executorWindow.style.left = (executorWindow.offsetLeft - pos1) + "px";
  125.         }
  126.  
  127.         function closeDragElement() {
  128.             document.onmouseup = null;
  129.             document.onmousemove = null;
  130.         }
  131.     }
  132.  
  133.     // Initialize the executor when the DOM is fully loaded
  134.     if (document.readyState === 'loading') {
  135.         document.addEventListener('DOMContentLoaded', initializeExecutor);
  136.     } else {
  137.         initializeExecutor();
  138.     }
  139. })();