☰

Greasy Fork 还支持 简体中文。

HTML Markup in junon.io | EN

Allows to paste HTML+CSS elements into chat

目前為 2025-02-10 提交的版本，檢視 最新版本。

  1. // ==UserScript==
  2. // @name         HTML Markup in junon.io | EN
  3. // @namespace    http://tampermonkey.net/
  4. // @version      2.0
  5. // @description  Allows to paste HTML+CSS elements into chat
  6. // @author       Belogvardeec
  7. // @match        *://junon.io/*
  8. // @grant        none
  9. // ==/UserScript==
  10.  
  11. (function() {
  12.     'use strict';
  13.  
  14.     function convertContentToHTMLCSS(element) {
  15.         if (element.id === 'chat_input') return; // ignoring chat input for better experience
  16.  
  17.         let content = element.value || element.textContent;
  18.         const regex = /#(.*?)#/g;
  19.  
  20.         if (!regex.test(content)) return; // if no #...# found, then do nothing
  21.  
  22.         // deleting previous custom element for not copying
  23.         element.querySelectorAll('.custom-content').forEach(el => el.remove());
  24.  
  25.         // adding one style for one time
  26.         if (!document.querySelector('.custom-style')) {
  27.             const style = document.createElement('style');
  28.             style.className = 'custom-style';
  29.             style.innerHTML = `
  30.                 .custom-content {
  31.                     color: white;
  32.                     font-size: 16px;
  33.                 }
  34.             `;
  35.             document.head.appendChild(style);
  36.         }
  37.  
  38.         // replace #...# on HTML+CSS content
  39.         const newContent = content.replace(regex, (_, p1) => {
  40.             return `<span class="custom-content">${p1}</span>`;
  41.         });
  42.  
  43.         // inputs except chat_input are enabled too, for preview
  44.         if (element.tagName.toLowerCase() === 'input') {
  45.             let output = element.parentNode.querySelector('.custom-content-container');
  46.             if (!output) {
  47.                 output = document.createElement('div');
  48.                 output.className = 'custom-content-container';
  49.                 element.insertAdjacentElement('afterend', output);
  50.             }
  51.             output.innerHTML = newContent;
  52.         } else {
  53.             element.innerHTML = newContent;
  54.         }
  55.  
  56.         // set element as converted
  57.         element.dataset.converted = "true";
  58.     }
  59.  
  60.     function processElements() {
  61.         document.querySelectorAll('input, .chat_content').forEach(element => {
  62.             convertContentToHTMLCSS(element);
  63.         });
  64.     }
  65.  
  66.     setInterval(processElements, 450);
  67.  
  68. })();