Stylish Text Converter
var textArea = document.querySelector(".text-area");
var options = document.querySelectorAll(".option");
const textArea = document.querySelector('.text-area');
const options = document.querySelectorAll('.option');
function normal(text) {
return text;
}
function bold(text) {
return "" + text + "";
}
function italic(text) {
return "" + text + "";
}
function underline(text) {
return "" + text + "";
}
function strikethrough(text) {
return "" + text + "";
}
function uppercase(text) {
return text.toUpperCase();
}
function lowercase(text) {
return text.toLowerCase();
}
function titlecase(text) {
return text.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
}
function random(text) {
var result = "";
for (var i = 0; i < text.length; i++) {
var rand = Math.floor(Math.random() * 2);
if (rand = 0) {
result += text.charAt(i).toLowerCase();
} else {
result += text.charAt(i).toUpperCase();
}
}
return result;
}const normal = (text) => text;
const bold = (text) => `${text}`;
const italic = (text) => `${text}`;
const underline = (text) => `${text}`;
const strikethrough = (text) => `${text}`;
const uppercase = (text) => text.toUpperCase();
const lowercase = (text) => text.toLowerCase();
const titlecase = (text) => text.replace(/\b\w/g, (c) => c.toUpperCase());
const random = (text) => {
let output = '';
for (let i = 0; i < text.length; i++) {
const style = Math.floor(Math.random() * 4) + 1;
switch (style) {
case 1:
output += bold(text[i]);
break;
case 2:
output += italic(text[i]);
break;
case 3:
output += underline(text[i]);
break;
case 4:
output += strikethrough(text[i]);
break;
}
}
return output;
};
// Define the option click event handler
const handleClick = (e) => {
const style = e.target.getAttribute('data-style');
const convert = window[style];
const inputText = textArea.value;
const outputText = convert(inputText);
textArea.value = outputText;
};
// Attach the option click event handlers
for (const option of options) {
option.addEventListener('click', handleClick);
}
<
0 Comments