API tools faq
paste
smoothretro1982

Wall Edit v2.3 — customization update with Hex Code Display

smoothretro1982
May 22nd, 2026 (edited)
214
0
Never
6
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.72 KB | None | 0 0
raw download clone embed print report
  1. // Wall Edit v2.1 — HUD Theme Update with Enhanced Hex Code Visibility
  2. (function () {
  3. 'use strict';
  4.  
  5. const style = document.createElement('style');
  6. style.innerHTML = `
  7. #solar-wiper-hud input[type=number]::-webkit-inner-spin-button,
  8. #solar-wiper-hud input[type=number]::-webkit-outer-spin-button {
  9. -webkit-appearance: none;
  10. margin: 0;
  11. }
  12. #solar-wiper-hud input[type=number] { -moz-appearance: textfield; }
  13. #solar-wiper-hud input:focus { outline: 1px solid #555; }
  14. `;
  15. document.head.appendChild(style);
  16.  
  17. function safeWriteChar(char, fgColor, x, y, bgColor) {
  18. try {
  19. if (typeof writeCharToXY === 'function') {
  20. writeCharToXY(char, fgColor, x, y, bgColor);
  21. } else if (typeof window.writeCharAt === 'function') {
  22. window.writeCharAt(char, fgColor, x, y, bgColor);
  23. }
  24. } catch (e) { console.error("Write Error:", e); }
  25. }
  26.  
  27. class OWOTSolarWiper {
  28. constructor() {
  29. this.isWiping = false;
  30. this.stopRequested = false;
  31. this.createUI();
  32. window.OWOTSolarWiperInstance = this;
  33. }
  34.  
  35. updateStatus(msg, color = '#aaa') {
  36. const status = document.getElementById('hud-status');
  37. if (status) {
  38. status.textContent = msg;
  39. status.style.color = color;
  40. }
  41. }
  42.  
  43. createUI() {
  44. const existing = document.getElementById('solar-wiper-hud');
  45. if (existing) existing.remove();
  46.  
  47. const ui = document.createElement('div');
  48. ui.id = 'solar-wiper-hud';
  49. ui.style.cssText = `
  50. position: fixed; top: 20px; right: 20px;
  51. background: #1a1a1a; color: #e0e0e0; padding: 12px;
  52. border-radius: 8px; box-shadow: 0 6px 24px rgba(0,0,0,0.9);
  53. z-index: 10010; font-family: sans-serif;
  54. width: 300px; border:1px solid #333; font-size:12px;
  55. `;
  56.  
  57. ui.innerHTML = `
  58. <div id="hud-header" style="display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid #333;cursor:move;">
  59. <div style="font-weight:600;color:#fff;">WallEdit <span style="color:#2ecc71;font-size:10px;">v2.1</span></div>
  60. <div style="display:flex;gap:6px;">
  61. <button id="hud-toggle" style="background:transparent;border:1px solid #444;color:#888;width:22px;height:22px;cursor:pointer;">−</button>
  62. <button id="hud-close" style="background:transparent;border:1px solid #444;color:#888;width:22px;height:22px;cursor:pointer;">×</button>
  63. </div>
  64. </div>
  65. <div id="hud-body">
  66. <label style="display:block;font-size:10px;color:#aaa;margin-bottom:4px;">Character</label>
  67. <input id="wipe-text" value="█" style="width:100%;padding:6px;border-radius:4px;border:1px solid #333;background:#0d0d0d;color:#fff;margin-bottom:8px;box-sizing:border-box;">
  68.  
  69. <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-bottom:8px;text-align:center;">
  70. <div>
  71. <label style="display:block;font-size:10px;color:#aaa;margin-bottom:2px;">Foreground</label>
  72. <input id="fg-color" type="color" value="#ffff00" style="width:100%;height:26px;background:none;border:none;padding:0;cursor:pointer;">
  73. <span id="fg-hex" style="font-size:11px;color:#fff;font-weight:600;font-family:monospace;display:block;margin-top:3px;">#FFFF00</span>
  74. </div>
  75. <div>
  76. <label style="display:block;font-size:10px;color:#aaa;margin-bottom:2px;">Background</label>
  77. <input id="bg-color" type="color" value="#000000" style="width:100%;height:26px;background:none;border:none;padding:0;cursor:pointer;">
  78. <span id="bg-hex" style="font-size:11px;color:#fff;font-weight:600;font-family:monospace;display:block;margin-top:3px;">#000000</span>
  79. </div>
  80. <div>
  81. <label style="display:block;font-size:10px;color:#aaa;margin-bottom:2px;">HUD Color</label>
  82. <input id="hud-color" type="color" value="#1a1a1a" style="width:100%;height:26px;background:none;border:none;padding:0;cursor:pointer;">
  83. <span id="hud-hex" style="font-size:11px;color:#fff;font-weight:600;font-family:monospace;display:block;margin-top:3px;">#1A1A1A</span>
  84. </div>
  85. </div>
  86.  
  87. <div style="background:#0d0d0d;padding:8px;border-radius:6px;border:1px solid #282828;margin-bottom:8px;">
  88. <div style="display:grid;grid-template-columns:1fr 1fr;gap:6px;">
  89. <input id="start-x" type="number" value="0" placeholder="Start X" style="width:100%;background:#111;color:#fff;border:1px solid #333;text-align:center;padding:4px;">
  90. <input id="start-y" type="number" value="0" placeholder="Start Y" style="width:100%;background:#111;color:#fff;border:1px solid #333;text-align:center;padding:4px;">
  91. </div>
  92. <div style="display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:6px;">
  93. <input id="end-x" type="number" value="20" placeholder="End X" style="width:100%;background:#111;color:#fff;border:1px solid #333;text-align:center;padding:4px;">
  94. <input id="end-y" type="number" value="10" placeholder="End Y" style="width:100%;background:#111;color:#fff;border:1px solid #333;text-align:center;padding:4px;">
  95. </div>
  96. </div>
  97.  
  98. <div style="display:flex;flex-direction:column;gap:6px;">
  99. <div style="display:flex;align-items:center;justify-content:space-between;padding:6px;background:#0d0d0d;border:1px solid #282828;">
  100. <label style="font-size:10px;color:#aaa;">Delay (ms):</label>
  101. <input id="speed-delay" type="number" value="10" style="width:50px;background:#111;color:#fff;border:1px solid #333;text-align:center;">
  102. </div>
  103. <label style="display:flex;align-items:center;padding:6px;background:#0d0d0d;border:1px solid #282828;cursor:pointer;"><input id="fast-mode" type="checkbox" style="margin-right:8px;">Fast Mode (Batch 200)</label>
  104. </div>
  105.  
  106. <button id="start-wipe" style="width:100%;margin-top:10px;padding:10px;background:#fff;color:#000;font-weight:600;border:none;border-radius:4px;cursor:pointer;">Start Wipe</button>
  107. <button id="stop-wipe" style="width:100%;margin-top:10px;padding:10px;background:#c0392b;color:#fff;font-weight:600;border:none;border-radius:4px;display:none;cursor:pointer;">Stop Wipe</button>
  108.  
  109. <div id="progress-wrap" style="display:none;margin-top:10px;">
  110. <div style="background:#0d0d0d;height:6px;overflow:hidden;border-radius:3px;"><div id="progress-bar" style="width:0%;height:100%;background:#2ecc71;"></div></div>
  111. <div id="progress-text" style="text-align:center;color:#aaa;font-size:9px;margin-top:4px;">0 / 0</div>
  112. </div>
  113. <div id="hud-status" style="margin-top:8px;text-align:center;color:#aaa;font-size:11px;">Ready</div>
  114. </div>
  115. `;
  116.  
  117. document.body.appendChild(ui);
  118. this.makeHUDDraggable(ui);
  119.  
  120. const setupColorSync = (pickerId, labelId, callback) => {
  121. const picker = document.getElementById(pickerId);
  122. const label = document.getElementById(labelId);
  123. const update = () => {
  124. const val = picker.value.toUpperCase();
  125. label.textContent = val;
  126. if (callback) callback(val);
  127. };
  128. picker.oninput = update;
  129. };
  130.  
  131. setupColorSync('fg-color', 'fg-hex');
  132. setupColorSync('bg-color', 'bg-hex');
  133. setupColorSync('hud-color', 'hud-hex', (hex) => {
  134. ui.style.backgroundColor = hex;
  135. });
  136.  
  137. document.getElementById('start-wipe').onclick = () => this.startWipe();
  138. document.getElementById('stop-wipe').onclick = () => this.stopRequested = true;
  139. document.getElementById('hud-toggle').onclick = () => {
  140. const b = document.getElementById('hud-body');
  141. b.style.display = b.style.display === 'none' ? 'block' : 'none';
  142. };
  143. document.getElementById('hud-close').onclick = () => ui.remove();
  144. }
  145.  
  146. makeHUDDraggable(hud) {
  147. const header = hud.querySelector('#hud-header');
  148. let isDragging = false, offsetX, offsetY;
  149. header.onmousedown = (e) => { isDragging = true; offsetX = e.clientX - hud.offsetLeft; offsetY = e.clientY - hud.offsetTop; };
  150. document.addEventListener('mouseup', () => isDragging = false);
  151. document.addEventListener('mousemove', (e) => { if (isDragging) { hud.style.left = (e.clientX - offsetX) + 'px'; hud.style.top = (e.clientY - offsetY) + 'px'; hud.style.right = 'auto'; } });
  152. }
  153.  
  154. async startWipe() {
  155. if (this.isWiping) return;
  156. this.isWiping = true; this.stopRequested = false;
  157.  
  158. document.getElementById('start-wipe').style.display = 'none';
  159. document.getElementById('stop-wipe').style.display = 'block';
  160. document.getElementById('progress-wrap').style.display = 'block';
  161.  
  162. const char = document.getElementById('wipe-text').value;
  163. const fg = parseInt(document.getElementById('fg-color').value.slice(1), 16);
  164. const bg = parseInt(document.getElementById('bg-color').value.slice(1), 16);
  165.  
  166. const sX = parseInt(document.getElementById('start-x').value);
  167. const sY = -parseInt(document.getElementById('start-y').value);
  168. const eX = parseInt(document.getElementById('end-x').value);
  169. const eY = -parseInt(document.getElementById('end-y').value);
  170.  
  171. const isFast = document.getElementById('fast-mode').checked;
  172. const delay = parseInt(document.getElementById('speed-delay').value) || 0;
  173.  
  174. const minX = Math.min(sX, eX), maxX = Math.max(sX, eX);
  175. const minY = Math.min(sY, eY), maxY = Math.max(sY, eY);
  176.  
  177. const path = [];
  178. const TILE_W = 20, TILE_H = 10;
  179.  
  180. for (let y = minY; y <= maxY; y += TILE_H) {
  181. for (let x = minX; x <= maxX; x += TILE_W) {
  182. for (let cy = 0; cy < TILE_H; cy++) {
  183. for (let cx = 0; cx < TILE_W; cx++) {
  184. const curX = x + cx, curY = y + cy;
  185. if (curX <= maxX && curY <= maxY) path.push({ x: curX, y: curY });
  186. }
  187. }
  188. }
  189. }
  190.  
  191. let completed = 0;
  192. const batchSize = isFast ? 200 : 1;
  193.  
  194. for (let i = 0; i < path.length; i += batchSize) {
  195. if (this.stopRequested) break;
  196. for (let j = 0; j < batchSize && (i + j) < path.length; j++) {
  197. const p = path[i + j];
  198. safeWriteChar(char, fg, p.x, p.y, bg);
  199. completed++;
  200. }
  201.  
  202. const pct = Math.round((completed / path.length) * 100);
  203. document.getElementById('progress-bar').style.width = pct + '%';
  204. document.getElementById('progress-text').textContent = `${completed} / ${path.length}`;
  205. this.updateStatus(`Wiping: ${pct}%`);
  206.  
  207. if (delay > 0) await new Promise(r => setTimeout(r, delay));
  208. else if (completed % 1000 === 0) await new Promise(r => setTimeout(r, 0));
  209. }
  210.  
  211. this.isWiping = false;
  212. document.getElementById('start-wipe').style.display = 'block';
  213. document.getElementById('stop-wipe').style.display = 'none';
  214. this.updateStatus(this.stopRequested ? 'Wipe Stopped' : 'Wipe Complete', this.stopRequested ? '#c0392b' : '#2ecc71');
  215. }
  216. }
  217.  
  218. new OWOTSolarWiper();
  219. })();
Tags: textwall tw.2s4.me
Advertisement
Comments
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!