☰

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.     // Create the executor window
  67.     const executorWindow = document.createElement('div');
  68.     executorWindow.id = 'executorWindow';
  69.     document.body.appendChild(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.     // Make the window draggable
  101.     let pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
  102.     titleBar.onmousedown = dragMouseDown;
  103.  
  104.     function dragMouseDown(e) {
  105.         e = e || window.event;
  106.         e.preventDefault();
  107.         pos3 = e.clientX;
  108.         pos4 = e.clientY;
  109.         document.onmouseup = closeDragElement;
  110.         document.onmousemove = elementDrag;
  111.     }
  112.  
  113.     function elementDrag(e) {
  114.         e = e || window.event;
  115.         e.preventDefault();
  116.         pos1 = pos3 - e.clientX;
  117.         pos2 = pos4 - e.clientY;
  118.         pos3 = e.clientX;
  119.         pos4 = e.clientY;
  120.         executorWindow.style.top = (executorWindow.offsetTop - pos2) + "px";
  121.         executorWindow.style.left = (executorWindow.offsetLeft - pos1) + "px";
  122.     }
  123.  
  124.     function closeDragElement() {
  125.         document.onmouseup = null;
  126.         document.onmousemove = null;
  127.     }
  128. })();