ai generated slop to make thread

Askinov

Askinov

๐–‹๐–š๐–™๐–š๐–—๐–Š ๐Ÿ”'๐Ÿ ๐–๐–™๐–“ ๐–˜๐–‘๐–†๐–ž๐–Š๐–— IN 2 MONTHs
Joined
Oct 31, 2025
Posts
4,781
Reputation
11,300
try i g this has all try on note pad and save it as .html im just doing bs rn well you can generate it too

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Forum BBCode & HTML Colorizer</title>
<style>
:root {
--bg-main: #121214;
--bg-card: #1a1a1e;
--bg-input: #26262b;
--accent: #00bcd4;
--accent-hover: #00acc1;
--text-main: #e2e8f0;
--text-muted: #94a3b8;
--border: #334155;
}

body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: var(--bg-main);
color: var(--text-main);
margin: 0;
padding: 20px;
display: flex;
justify-content: center;
}

.container {
width: 100%;
max-width: 900px;
background: var(--bg-card);
padding: 25px;
border-radius: 12px;
box-shadow: 0 8px 24px rgba(0,0,0,0.5);
border: 1px solid var(--border);
}

h1 {
text-align: center;
margin-top: 0;
color: #fff;
font-size: 24px;
text-transform: uppercase;
letter-spacing: 1px;
border-bottom: 2px solid var(--border);
padding-bottom: 15px;
}

.section-title {
font-size: 14px;
text-transform: uppercase;
color: var(--text-muted);
margin: 15px 0 8px 0;
letter-spacing: 0.5px;
font-weight: 600;
}

textarea {
width: 100%;
height: 120px;
background: var(--bg-input);
border: 1px solid var(--border);
border-radius: 6px;
color: #fff;
padding: 12px;
box-sizing: border-box;
font-size: 15px;
resize: vertical;
}

textarea:focus, select:focus {
outline: none;
border-color: var(--accent);
}

.toolbar {
display: flex;
flex-wrap: wrap;
gap: 10px;
background: var(--bg-input);
padding: 10px;
border-radius: 6px;
border: 1px solid var(--border);
align-items: center;
}

.tool-group {
display: flex;
align-items: center;
gap: 6px;
border-right: 1px solid var(--border);
padding-right: 10px;
}

.tool-group:last-child {
border-right: none;
padding-right: 0;
}

button.toggle-btn {
background: #334155;
border: 1px solid var(--border);
color: #fff;
padding: 6px 12px;
border-radius: 4px;
cursor: pointer;
font-weight: bold;
transition: all 0.2s;
}

button.toggle-btn.active {
background: var(--accent);
color: #000;
border-color: var(--accent);
}

select, input[type="color"] {
background: #334155;
border: 1px solid var(--border);
color: #fff;
padding: 5px;
border-radius: 4px;
cursor: pointer;
}

input[type="color"] {
width: 35px;
height: 28px;
padding: 0;
border: none;
}

.symbol-picker {
display: flex;
flex-wrap: wrap;
gap: 5px;
max-height: 75px;
overflow-y: auto;
background: var(--bg-input);
padding: 8px;
border-radius: 6px;
border: 1px solid var(--border);
}

.symbol-btn {
background: #334155;
border: 1px solid var(--border);
color: #fff;
padding: 4px 8px;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
}

.symbol-btn:hover {
background: var(--border);
}

.output-grid {
display: grid;
grid-template-columns: 1fr;
gap: 15px;
margin-top: 15px;
}

@media(min-width: 768px) {
.output-grid {
grid-template-columns: 1fr 1fr;
}
}

.output-wrapper {
position: relative;
}

.copy-btn {
position: absolute;
top: 32px;
right: 8px;
background: var(--accent);
border: none;
color: #000;
padding: 4px 8px;
border-radius: 4px;
font-size: 12px;
font-weight: 600;
cursor: pointer;
}

.copy-btn:hover {
background: var(--accent-hover);
}

.output-box {
width: 100%;
height: 100px;
background: #0f172a;
color: #38bdf8;
font-family: 'Courier New', Courier, monospace;
font-size: 13px;
padding: 10px;
box-sizing: border-box;
border-radius: 6px;
border: 1px solid var(--border);
}

.preview-box {
width: 100%;
min-height: 80px;
background: #1e293b;
border: 1px solid var(--border);
border-radius: 6px;
padding: 15px;
box-sizing: border-box;
overflow-x: auto;
white-space: pre-wrap;
}
</style>
</head>
<body>

<div class="container">
<h1>Forum Text Colorizer</h1>

<div class="section-title">Input Text</div>
<textarea id="inputText" placeholder="Type your forum text or username here..."></textarea>

<div class="section-title">Cool Symbols (Click to inject)</div>
<div class="symbol-picker" id="symbolPicker"></div>

<div class="section-title">Formatting Options</div>
<div class="toolbar">
<!-- Standard Styles -->
<div class="tool-group">
<button class="toggle-btn" id="btnBold" onclick="toggleStyle('bold')">B</button>
<button class="toggle-btn" id="btnItalic" onclick="toggleStyle('italic')">I</button>
<button class="toggle-btn" id="btnUnderline" onclick="toggleStyle('underline')">U</button>
</div>

<!-- Font Family -->
<div class="tool-group">
<label style="font-size:12px;">Font:</label>
<select id="fontSelect" onchange="updateColors()">
<option value="">Default</option>
<option value="Arial">Arial</option>
<option value="Comic Sans MS">Comic Sans</option>
<option value="Courier New">Courier</option>
<option value="Georgia">Georgia</option>
<option value="Impact">Impact</option>
<option value="Lucida Sans Unicode">Lucida</option>
<option value="Tahoma">Tahoma</option>
<option value="Times New Roman">Times</option>
<option value="Trebuchet MS">Trebuchet</option>
<option value="Verdana">Verdana</option>
</select>
</div>

<!-- Coloring Types -->
<div class="tool-group">
<label style="font-size:12px;">Color Mode:</label>
<select id="colorMode" onchange="toggleColorMode()">
<option value="solid">Solid Color</option>
<option value="gradient">Gradient (Two Colors)</option>
</select>
<input type="color" id="colorStart" value="#ff0000" oninput="updateColors()">
<span id="gradientEndWrapper" style="display:none;">
<input type="color" id="colorEnd" value="#00ffff" oninput="updateColors()">
</span>
</div>

<!-- Glow Effect -->
<div class="tool-group">
<label style="font-size:12px; display:flex; align-items:center; gap:4px;">
<input type="checkbox" id="enableGlow" onchange="toggleGlowWrapper()"> Glow
</label>
<span id="glowColorWrapper" style="display:none;">
<input type="color" id="colorGlow" value="#ff00ff" oninput="updateColors()">
</span>
</div>
</div>

<div class="section-title">Live Preview</div>
<div class="preview-box" id="livePreview"></div>

<div class="output-grid">
<div class="output-wrapper">
<div class="section-title">BBCode Output</div>
<button class="copy-btn" onclick="copyToClipboard('bbcodeOutput')">Copy</button>
<textarea class="output-box" id="bbcodeOutput" readonly></textarea>
</div>
<div class="output-wrapper">
<div class="section-title">HTML Output</div>
<button class="copy-btn" onclick="copyToClipboard('htmlOutput')">Copy</button>
<textarea class="output-box" id="htmlOutput" readonly></textarea>
</div>
</div>
</div>

<script>
// State Tracking
const state = {
bold: false,
italic: false,
underline: false
};

// Curated list of decorative symbols
const symbols = [
"โ˜…", "โ˜†", "๐Ÿ”ฎ", "โœฆ", "โœง", "โœน", "๐ŸŒŒ", "๐Ÿ‘‘", "โ™›", "โ˜ ",
"โ˜ฃ", "โšก", "๐Ÿ”ฅ", "๐Ÿ’ง", "โ„", "๐Ÿ€", "๐Ÿ’Ž", "โœˆ", "โœ‰", "โš”",
"๐Ÿน", "๐Ÿ›ก", "โš™", "โ›“", "โ˜ฏ", "โœž", "๐Ÿ–ค", "โค๏ธ", "ใƒ„", "ๅฝก",
"ร—", "ยฎ", "โ„ข", "โ–ˆ", "โ–„", "โ–€", "โ–‘", "โ–’", "โ–“", "โ– "
];

// Initialization
window.onload = function() {
const picker = document.getElementById('symbolPicker');
symbols.forEach(sym => {
const btn = document.createElement('button');
btn.className = 'symbol-btn';
btn.innerText = sym;
btn.onclick = () => injectSymbol(sym);
picker.appendChild(btn);
});

document.getElementById('inputText').addEventListener('input', updateColors);
// Default text seed
document.getElementById('inputText').value = "โ˜… CUSTOM FORUM TEXT โ˜…";
updateColors();
};

function injectSymbol(sym) {
const txtArea = document.getElementById('inputText');
const start = txtArea.selectionStart;
const end = txtArea.selectionEnd;
const text = txtArea.value;
txtArea.value = text.substring(0, start) + sym + text.substring(end);
txtArea.focus();
txtArea.selectionStart = txtArea.selectionEnd = start + sym.length;
updateColors();
}

function toggleStyle(style) {
state[style] = !state[style];
document.getElementById('btn' + style.charAt(0).toUpperCase() + style.slice(1)).classList.toggle('active', state[style]);
updateColors();
}

function toggleColorMode() {
const mode = document.getElementById('colorMode').value;
document.getElementById('gradientEndWrapper').style.display = (mode === 'gradient') ? 'inline' : 'none';
updateColors();
}

function toggleGlowWrapper() {
const isGlow = document.getElementById('enableGlow').checked;
document.getElementById('glowColorWrapper').style.display = isGlow ? 'inline' : 'none';
updateColors();
}

// Hex Color Processing Math
function hexToRgb(hex) {
const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
return result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
}

function rgbToHex(r, g, b) {
return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
}

function interpolateColor(color1, color2, factor) {
const c1 = hexToRgb(color1);
const c2 = hexToRgb(color2);
const r = Math.round(c1.r + factor * (c2.r - c1.r));
const g = Math.round(c1.g + factor * (c2.g - c1.g));
const b = Math.round(c1.b + factor * (c2.b - c1.b));
return rgbToHex(r, g, b);
}

// Main Formatting Engine
function updateColors() {
const text = document.getElementById('inputText').value;
const colorMode = document.getElementById('colorMode').value;
const colorStart = document.getElementById('colorStart').value;
const colorEnd = document.getElementById('colorEnd').value;
const font = document.getElementById('fontSelect').value;
const enableGlow = document.getElementById('enableGlow').checked;
const colorGlow = document.getElementById('colorGlow').value;

if (!text) {
document.getElementById('bbcodeOutput').value = "";
document.getElementById('htmlOutput').value = "";
document.getElementById('livePreview').innerHTML = "";
return;
}

let bbcode = "";
let html = "";

// Core text parsing & coloring engine
if (colorMode === 'solid') {
bbcode = `[color=${colorStart}]${text}[/color]`;
html = `<span style="color: ${colorStart};">${escapeHtml(text)}</span>`;
} else {
// Letter-by-Letter Gradient calculation
for (let i = 0; i < text.length; i++) {
const char = text;
if (char === " ") {
bbcode += " ";
html += " ";
continue;
}
// Handle single character cases smoothly to prevent division by zero
const factor = text.length > 1 ? i / (text.length - 1) : 0;
const curColor = interpolateColor(colorStart, colorEnd, factor);

bbcode += `[color=${curColor}]${char}[/color]`;
html += `<span style="color: ${curColor};">${escapeHtml(char)}</span>`;
}
}

// Apply Font configuration
if (font) {
bbcode = `[font=${font}]${bbcode}[/font]`;
html = `<span style="font-family: '${font}';">${html}</span>`;
}

// Apply Glow formatting
if (enableGlow) {
// Note: Forum plugins differ on Glow tags. [glow=Color] is the most widely supported.
bbcode = `[glow=${colorGlow}]${bbcode}[/glow]`;
html = `<span style="text-shadow: 0 0 4px ${colorGlow}, 0 0 8px ${colorGlow};">${html}</span>`;
}

// Apply Standard Typography Modifications
if (state.underline) {
bbcode = `${bbcode}`;
html = `<u>${html}</u>`;
}
if (state.italic) {
bbcode = `${bbcode}`;
html = `<em>${html}</em>`;
}
if (state.bold) {
bbcode = `${bbcode}`;
html = `<strong>${html}</strong>`;
}

// Commit outputs to the DOM UI
document.getElementById('bbcodeOutput').value = bbcode;
document.getElementById('htmlOutput').value = html;
document.getElementById('livePreview').innerHTML = html;
}

function escapeHtml(str) {
return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
}

function copyToClipboard(id) {
const copyText = document.getElementById(id);
copyText.select();
copyText.setSelectionRange(0, 99999);
navigator.clipboard.writeText(copyText.value);
}
</script>

</body>
</html>



1781884022405

glowing text wont work when you toggle bb code its off
 
  • +1
Reactions: Revan and Psl King
bump @Jason Voorhees i think make my idea more advance
 
  • +1
Reactions: Jason Voorhees
bump
 
Askinov said:
try i g this has all try on note pad and save it as .html im just doing bs rn well you can generate it too

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Forum BBCode & HTML Colorizer</title>
<style>
:root {
--bg-main: #121214;
--bg-card: #1a1a1e;
--bg-input: #26262b;
--accent: #00bcd4;
--accent-hover: #00acc1;
--text-main: #e2e8f0;
--text-muted: #94a3b8;
--border: #334155;
}

body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: var(--bg-main);
color: var(--text-main);
margin: 0;
padding: 20px;
display: flex;
justify-content: center;
}

.container {
width: 100%;
max-width: 900px;
background: var(--bg-card);
padding: 25px;
border-radius: 12px;
box-shadow: 0 8px 24px rgba(0,0,0,0.5);
border: 1px solid var(--border);
}

h1 {
text-align: center;
margin-top: 0;
color: #fff;
font-size: 24px;
text-transform: uppercase;
letter-spacing: 1px;
border-bottom: 2px solid var(--border);
padding-bottom: 15px;
}

.section-title {
font-size: 14px;
text-transform: uppercase;
color: var(--text-muted);
margin: 15px 0 8px 0;
letter-spacing: 0.5px;
font-weight: 600;
}

textarea {
width: 100%;
height: 120px;
background: var(--bg-input);
border: 1px solid var(--border);
border-radius: 6px;
color: #fff;
padding: 12px;
box-sizing: border-box;
font-size: 15px;
resize: vertical;
}

textarea:focus, select:focus {
outline: none;
border-color: var(--accent);
}

.toolbar {
display: flex;
flex-wrap: wrap;
gap: 10px;
background: var(--bg-input);
padding: 10px;
border-radius: 6px;
border: 1px solid var(--border);
align-items: center;
}

.tool-group {
display: flex;
align-items: center;
gap: 6px;
border-right: 1px solid var(--border);
padding-right: 10px;
}

.tool-group:last-child {
border-right: none;
padding-right: 0;
}

button.toggle-btn {
background: #334155;
border: 1px solid var(--border);
color: #fff;
padding: 6px 12px;
border-radius: 4px;
cursor: pointer;
font-weight: bold;
transition: all 0.2s;
}

button.toggle-btn.active {
background: var(--accent);
color: #000;
border-color: var(--accent);
}

select, input[type="color"] {
background: #334155;
border: 1px solid var(--border);
color: #fff;
padding: 5px;
border-radius: 4px;
cursor: pointer;
}

input[type="color"] {
width: 35px;
height: 28px;
padding: 0;
border: none;
}

.symbol-picker {
display: flex;
flex-wrap: wrap;
gap: 5px;
max-height: 75px;
overflow-y: auto;
background: var(--bg-input);
padding: 8px;
border-radius: 6px;
border: 1px solid var(--border);
}

.symbol-btn {
background: #334155;
border: 1px solid var(--border);
color: #fff;
padding: 4px 8px;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
}

.symbol-btn:hover {
background: var(--border);
}

.output-grid {
display: grid;
grid-template-columns: 1fr;
gap: 15px;
margin-top: 15px;
}

@media(min-width: 768px) {
.output-grid {
grid-template-columns: 1fr 1fr;
}
}

.output-wrapper {
position: relative;
}

.copy-btn {
position: absolute;
top: 32px;
right: 8px;
background: var(--accent);
border: none;
color: #000;
padding: 4px 8px;
border-radius: 4px;
font-size: 12px;
font-weight: 600;
cursor: pointer;
}

.copy-btn:hover {
background: var(--accent-hover);
}

.output-box {
width: 100%;
height: 100px;
background: #0f172a;
color: #38bdf8;
font-family: 'Courier New', Courier, monospace;
font-size: 13px;
padding: 10px;
box-sizing: border-box;
border-radius: 6px;
border: 1px solid var(--border);
}

.preview-box {
width: 100%;
min-height: 80px;
background: #1e293b;
border: 1px solid var(--border);
border-radius: 6px;
padding: 15px;
box-sizing: border-box;
overflow-x: auto;
white-space: pre-wrap;
}
</style>
</head>
<body>

<div class="container">
<h1>Forum Text Colorizer</h1>

<div class="section-title">Input Text</div>
<textarea id="inputText" placeholder="Type your forum text or username here..."></textarea>

<div class="section-title">Cool Symbols (Click to inject)</div>
<div class="symbol-picker" id="symbolPicker"></div>

<div class="section-title">Formatting Options</div>
<div class="toolbar">
<!-- Standard Styles -->
<div class="tool-group">
<button class="toggle-btn" id="btnBold" onclick="toggleStyle('bold')">B</button>
<button class="toggle-btn" id="btnItalic" onclick="toggleStyle('italic')">I</button>
<button class="toggle-btn" id="btnUnderline" onclick="toggleStyle('underline')">U</button>
</div>

<!-- Font Family -->
<div class="tool-group">
<label style="font-size:12px;">Font:</label>
<select id="fontSelect" onchange="updateColors()">
<option value="">Default</option>
<option value="Arial">Arial</option>
<option value="Comic Sans MS">Comic Sans</option>
<option value="Courier New">Courier</option>
<option value="Georgia">Georgia</option>
<option value="Impact">Impact</option>
<option value="Lucida Sans Unicode">Lucida</option>
<option value="Tahoma">Tahoma</option>
<option value="Times New Roman">Times</option>
<option value="Trebuchet MS">Trebuchet</option>
<option value="Verdana">Verdana</option>
</select>
</div>

<!-- Coloring Types -->
<div class="tool-group">
<label style="font-size:12px;">Color Mode:</label>
<select id="colorMode" onchange="toggleColorMode()">
<option value="solid">Solid Color</option>
<option value="gradient">Gradient (Two Colors)</option>
</select>
<input type="color" id="colorStart" value="#ff0000" oninput="updateColors()">
<span id="gradientEndWrapper" style="display:none;">
<input type="color" id="colorEnd" value="#00ffff" oninput="updateColors()">
</span>
</div>

<!-- Glow Effect -->
<div class="tool-group">
<label style="font-size:12px; display:flex; align-items:center; gap:4px;">
<input type="checkbox" id="enableGlow" onchange="toggleGlowWrapper()"> Glow
</label>
<span id="glowColorWrapper" style="display:none;">
<input type="color" id="colorGlow" value="#ff00ff" oninput="updateColors()">
</span>
</div>
</div>

<div class="section-title">Live Preview</div>
<div class="preview-box" id="livePreview"></div>

<div class="output-grid">
<div class="output-wrapper">
<div class="section-title">BBCode Output</div>
<button class="copy-btn" onclick="copyToClipboard('bbcodeOutput')">Copy</button>
<textarea class="output-box" id="bbcodeOutput" readonly></textarea>
</div>
<div class="output-wrapper">
<div class="section-title">HTML Output</div>
<button class="copy-btn" onclick="copyToClipboard('htmlOutput')">Copy</button>
<textarea class="output-box" id="htmlOutput" readonly></textarea>
</div>
</div>
</div>

<script>
// State Tracking
const state = {
bold: false,
italic: false,
underline: false
};

// Curated list of decorative symbols
const symbols = [
"โ˜…", "โ˜†", "๐Ÿ”ฎ", "โœฆ", "โœง", "โœน", "๐ŸŒŒ", "๐Ÿ‘‘", "โ™›", "โ˜ ",
"โ˜ฃ", "โšก", "๐Ÿ”ฅ", "๐Ÿ’ง", "โ„", "๐Ÿ€", "๐Ÿ’Ž", "โœˆ", "โœ‰", "โš”",
"๐Ÿน", "๐Ÿ›ก", "โš™", "โ›“", "โ˜ฏ", "โœž", "๐Ÿ–ค", "โค๏ธ", "ใƒ„", "ๅฝก",
"ร—", "ยฎ", "โ„ข", "โ–ˆ", "โ–„", "โ–€", "โ–‘", "โ–’", "โ–“", "โ– "
];

// Initialization
window.onload = function() {
const picker = document.getElementById('symbolPicker');
symbols.forEach(sym => {
const btn = document.createElement('button');
btn.className = 'symbol-btn';
btn.innerText = sym;
btn.onclick = () => injectSymbol(sym);
picker.appendChild(btn);
});

document.getElementById('inputText').addEventListener('input', updateColors);
// Default text seed
document.getElementById('inputText').value = "โ˜… CUSTOM FORUM TEXT โ˜…";
updateColors();
};

function injectSymbol(sym) {
const txtArea = document.getElementById('inputText');
const start = txtArea.selectionStart;
const end = txtArea.selectionEnd;
const text = txtArea.value;
txtArea.value = text.substring(0, start) + sym + text.substring(end);
txtArea.focus();
txtArea.selectionStart = txtArea.selectionEnd = start + sym.length;
updateColors();
}

function toggleStyle(style) {
state[style] = !state[style];
document.getElementById('btn' + style.charAt(0).toUpperCase() + style.slice(1)).classList.toggle('active', state[style]);
updateColors();
}

function toggleColorMode() {
const mode = document.getElementById('colorMode').value;
document.getElementById('gradientEndWrapper').style.display = (mode === 'gradient') ? 'inline' : 'none';
updateColors();
}

function toggleGlowWrapper() {
const isGlow = document.getElementById('enableGlow').checked;
document.getElementById('glowColorWrapper').style.display = isGlow ? 'inline' : 'none';
updateColors();
}

// Hex Color Processing Math
function hexToRgb(hex) {
const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
return result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
}

function rgbToHex(r, g, b) {
return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
}

function interpolateColor(color1, color2, factor) {
const c1 = hexToRgb(color1);
const c2 = hexToRgb(color2);
const r = Math.round(c1.r + factor * (c2.r - c1.r));
const g = Math.round(c1.g + factor * (c2.g - c1.g));
const b = Math.round(c1.b + factor * (c2.b - c1.b));
return rgbToHex(r, g, b);
}

// Main Formatting Engine
function updateColors() {
const text = document.getElementById('inputText').value;
const colorMode = document.getElementById('colorMode').value;
const colorStart = document.getElementById('colorStart').value;
const colorEnd = document.getElementById('colorEnd').value;
const font = document.getElementById('fontSelect').value;
const enableGlow = document.getElementById('enableGlow').checked;
const colorGlow = document.getElementById('colorGlow').value;

if (!text) {
document.getElementById('bbcodeOutput').value = "";
document.getElementById('htmlOutput').value = "";
document.getElementById('livePreview').innerHTML = "";
return;
}

let bbcode = "";
let html = "";

// Core text parsing & coloring engine
if (colorMode === 'solid') {
bbcode = `[color=${colorStart}]${text}[/color]`;
html = `<span style="color: ${colorStart};">${escapeHtml(text)}</span>`;
} else {
// Letter-by-Letter Gradient calculation
for (let i = 0; i < text.length; i++) {
const char = text;
if (char === " ") {
bbcode += " ";
html += " ";
continue;
}
// Handle single character cases smoothly to prevent division by zero
const factor = text.length > 1 ? i / (text.length - 1) : 0;
const curColor = interpolateColor(colorStart, colorEnd, factor);

bbcode += `[color=${curColor}]${char}[/color]`;
html += `<span style="color: ${curColor};">${escapeHtml(char)}</span>`;
}
}

// Apply Font configuration
if (font) {
bbcode = `[font=${font}]${bbcode}[/font]`;
html = `<span style="font-family: '${font}';">${html}</span>`;
}

// Apply Glow formatting
if (enableGlow) {
// Note: Forum plugins differ on Glow tags. [glow=Color] is the most widely supported.
bbcode = `[glow=${colorGlow}]${bbcode}[/glow]`;
html = `<span style="text-shadow: 0 0 4px ${colorGlow}, 0 0 8px ${colorGlow};">${html}</span>`;
}

// Apply Standard Typography Modifications
if (state.underline) {
bbcode = `${bbcode}`;
html = `<u>${html}</u>`;
}
if (state.italic) {
bbcode = `${bbcode}`;
html = `<em>${html}</em>`;
}
if (state.bold) {
bbcode = `${bbcode}`;
html = `<strong>${html}</strong>`;
}

// Commit outputs to the DOM UI
document.getElementById('bbcodeOutput').value = bbcode;
document.getElementById('htmlOutput').value = html;
document.getElementById('livePreview').innerHTML = html;
}

function escapeHtml(str) {
return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
}

function copyToClipboard(id) {
const copyText = document.getElementById(id);
copyText.select();
copyText.setSelectionRange(0, 99999);
navigator.clipboard.writeText(copyText.value);
}
</script>

</body>
</html>

View attachment 5242981
glowing text wont work when you toggle bb code its off
Click to expand...
Im rotting on my phone so it doesn't matter
 
  • +1
Reactions: Askinov
โ€œchatpgt make me a successful racebait .org threadโ€
 
  • JFL
Reactions: Askinov
Askinov said:
bump @Jason Voorhees i think make my idea more advance
Click to expand...
I dnrd the code but The glow "not working" isn't a bug. Xenforo forums just don't support [glow] by default. It renders in your preview but dies when pasted. Drop it from the BBCode output
 
  • +1
Reactions: Askinov
Jason Voorhees said:
I dnrd the code but The glow "not working" isn't a bug. Xenforo forums just don't support [glow] by default. It renders in your preview but dies when pasted. Drop it from the BBCode output
Click to expand...
yeah i also thought+ dnrd code wtf every one is dnr'ing that :lul:
 
  • +1
Reactions: Jason Voorhees
Askinov said:
yeah i also thought+ dnrd code wtf every one is dnr'ing that :lul:
Click to expand...
No one is interested in reading html and vanilla java script nigga
 
  • +1
Reactions: Askinov
Jason Voorhees said:
No one is interested in reading html and vanilla java script nigga
Click to expand...
Any way make some intresting sofware for us guide makers. pls like this but heavily upgraded
Ill tag you in my upcommiing threads
 
You must log in or register to reply here.

Similar threads

Orka
ai slop
Replies
3
Views
53
Nyrะพ
Nyrะพ
lookingforadvicecel
Blackpill ai slop maxxing
Replies
2
Views
50
IronMike
IronMike
resting
The bible is 85% AI Generated according to ZeroGPT
Replies
9
Views
100
DarkAscender
DarkAscender
astatin
JFL Was the "uncensored AI" banner also generated by AI?
Replies
1
Views
49
dexamphethamine
dexamphethamine
iabsolvenico
Blackpill I just AI generated a pic of me with blue eyes [BROWNEYECELS BEWARE]
Replies
8
Views
92
Ghoulish
Ghoulish

Users who are viewing this thread

Total: 1 (Looksmaxers: 0, Bluepillers: 1)
Back
Top