UNPKG

@unglish/word-generator

Version:

A simple generator for creating unglish words.

138 lines (122 loc) 6.16 kB
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Unglish Word Generator Demo</title> <script type="module"> import unglish from '../dist/index.js'; document.addEventListener('DOMContentLoaded', () => { document.body.innerHTML = ` <div id="singleWord">Generating single word...</div> <div id="haiku">Generating haiku...</div> <div id="slogan">Generating slogan...</div> <div id="duplicates">Generating duplicate word search...</div> `; // Function to generate a single word const generateSingleWord = () => { const singleWord = unglish.generateWord(); console.log(singleWord); document.getElementById('singleWord').innerHTML = ` <h2>Single Word:</h2> ${singleWord.written.clean} <br/> <code>${singleWord.pronunciation}</code> <br/> `; }; // Function to generate a single word const generateSlogan = () => { const singleWord = unglish.generateWord({syllableCount: 1}); console.log(singleWord); const firstWords = [ "Ignore Haters —", "Always", "Just", "Never", "Forever", "Never Quit —", "Passionately", "Fearlessly", "Endlessly", "Forget Fear —", "You Can", "Relentlessly", ]; const lastWords = [ "It", "Your Dreams", "Success", "Your Enemies", "Fear", "Love", "Tomorrow", "Yourself", "The Future", "Greatness", "Excellence", "Possibilities", "Potential", "Destiny", "The World", "Your Goals", "Perfection", "Innovation", "Happiness", "Victory", "Hard Things" ]; const slogan = `${firstWords[Math.floor(Math.random()*firstWords.length)]} ${singleWord.written.clean} ${lastWords[Math.floor(Math.random()*lastWords.length)]}`; document.getElementById('slogan').innerHTML = ` <h2>Slogan:</h2> <span style="text-transform: capitalize"> ${slogan} </span> `; }; // Function to generate a haiku const generateHaiku = () => { const haiku = [ [unglish.generateWord({ syllableCount: 2 }), unglish.generateWord({ syllableCount: 2 }), unglish.generateWord({ syllableCount: 1 })], [unglish.generateWord({ syllableCount: 3 }), unglish.generateWord({ syllableCount: 2 }), unglish.generateWord({ syllableCount: 2 })], [unglish.generateWord({ syllableCount: 2 }), unglish.generateWord({ syllableCount: 1 }), unglish.generateWord({ syllableCount: 2 })], ] console.log(haiku); const writtenHaiku = haiku.map( line => line.map(word => word.written.clean).join(' ') ).join('<br/>'); const pronouncedHaiku = haiku.map( line => line.map(word => word.pronunciation).join(' ') ).join('<br/>'); document.getElementById('haiku').innerHTML = ` <h2>Haiku:</h2> <p>${writtenHaiku}</p> <code>${pronouncedHaiku}</code> `; }; // Function to find duplicate words const findDuplicateWords = () => { const generatedWords = new Map(); const iterations = 10000; let currentIteration = 0; function generateWords() { const batchSize = 10; for (let i = 0; i < batchSize && currentIteration < iterations; i++, currentIteration++) { const newWord = unglish.generateWord(); const wordKey = `${newWord.written.clean} (${newWord.pronunciation})`; generatedWords.set(wordKey, (generatedWords.get(wordKey) || 0) + 1); } // Update progress document.getElementById('duplicates').innerHTML = ` <h2>Duplicate Word Search:</h2> <p>Generated ${currentIteration} of ${iterations} words...</p> `; if (currentIteration < iterations) { requestAnimationFrame(generateWords); } else { finalizeDuplicates(); } } function finalizeDuplicates() { const duplicates = Array.from(generatedWords.entries()) .filter(([_, count]) => count > 1) .sort((a, b) => b[1] - a[1]); const totalDuplicates = duplicates.length; console.log(duplicates); // Format duplicates for display const formattedDuplicates = duplicates .map(([word, count]) => `${word} (${count})`) .join(', '); // Add the result to the HTML document.getElementById('duplicates').innerHTML = ` <h2>Duplicate Word Search:</h2> <p>Generated ${iterations} words.</p> <p>Repeated ${totalDuplicates} words: ${formattedDuplicates}</p> `; } generateWords(); }; // Schedule tasks to run after the initial paint requestAnimationFrame(() => { generateSingleWord(); generateSlogan(); generateHaiku(); findDuplicateWords(); }); }); </script> </head> <body> <!-- The generated content will be inserted here --> </body> </html>