script.js

/**
 * Text Case Converter - Core Application Logic
 * A lightweight, vanilla JavaScript case converter with real-time updates
 */

// Utility functions for text processing
const utils = {
    /**
     * Split text into words, handling mixed case formats intelligently
     * @param {string} text - Input text to split
     * @returns {string[]} Array of words
     */
    splitWords(text) {
        if (!text || typeof text !== 'string') return [];
        
        return text
            // Handle camelCase and PascalCase
            .replace(/([a-z])([A-Z])/g, '$1 $2')
            // Handle numbers adjacent to letters
            .replace(/([a-zA-Z])(\d)/g, '$1 $2')
            .replace(/(\d)([a-zA-Z])/g, '$1 $2')
            // Split on common delimiters
            .split(/[\s\-_]+/)
            // Filter out empty strings
            .filter(word => word.length > 0);
    },

    /**
     * Sanitize input text by removing excessive whitespace
     * @param {string} text - Input text to sanitize
     * @returns {string} Sanitized text
     */
    sanitizeInput(text) {
        if (!text || typeof text !== 'string') return '';
        return text.trim().replace(/\s+/g, ' ');
    },

    /**
     * Capitalize first letter of a word
     * @param {string} word - Word to capitalize
     * @returns {string} Capitalized word
     */
    capitalize(word) {
        if (!word) return '';
        return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
    },

    /**
     * Debounce function to limit frequent calls
     * @param {Function} func - Function to debounce
     * @param {number} wait - Wait time in milliseconds
     * @returns {Function} Debounced function
     */
    debounce(func, wait) {
        let timeout;
        return function executedFunction(...args) {
            const later = () => {
                clearTimeout(timeout);
                func(...args);
            };
            clearTimeout(timeout);
            timeout = setTimeout(later, wait);
        };
    }
};

// Case conversion functions - pure functions with no side effects
const converters = {
    /**
     * Convert to camelCase (firstName)
     * @param {string} text - Input text
     * @returns {string} camelCase formatted text
     */
    toCamelCase(text) {
        const words = utils.splitWords(text);
        if (words.length === 0) return '';
        
        return words[0].toLowerCase() + 
               words.slice(1).map(word => utils.capitalize(word)).join('');
    },

    /**
     * Convert to PascalCase (FirstName)
     * @param {string} text - Input text
     * @returns {string} PascalCase formatted text
     */
    toPascalCase(text) {
        const words = utils.splitWords(text);
        return words.map(word => utils.capitalize(word)).join('');
    },

    /**
     * Convert to snake_case (first_name)
     * @param {string} text - Input text
     * @returns {string} snake_case formatted text
     */
    toSnakeCase(text) {
        const words = utils.splitWords(text);
        return words.map(word => word.toLowerCase()).join('_');
    },

    /**
     * Convert to kebab-case (first-name)
     * @param {string} text - Input text
     * @returns {string} kebab-case formatted text
     */
    toKebabCase(text) {
        const words = utils.splitWords(text);
        return words.map(word => word.toLowerCase()).join('-');
    },

    /**
     * Convert to SCREAMING_SNAKE_CASE (FIRST_NAME)
     * @param {string} text - Input text
     * @returns {string} SCREAMING_SNAKE_CASE formatted text
     */
    toScreamingSnakeCase(text) {
        const words = utils.splitWords(text);
        return words.map(word => word.toUpperCase()).join('_');
    },

    /**
     * Convert to lowercase (firstname)
     * @param {string} text - Input text
     * @returns {string} lowercase formatted text
     */
    toLowercase(text) {
        return utils.sanitizeInput(text).toLowerCase();
    },

    /**
     * Convert to UPPERCASE (FIRSTNAME)
     * @param {string} text - Input text
     * @returns {string} UPPERCASE formatted text
     */
    toUppercase(text) {
        return utils.sanitizeInput(text).toUpperCase();
    },

    /**
     * Convert to Title Case (First Name)
     * @param {string} text - Input text
     * @returns {string} Title Case formatted text
     */
    toTitleCase(text) {
        const words = utils.splitWords(text);
        return words.map(word => utils.capitalize(word)).join(' ');
    },

    /**
     * Convert to Sentence case (First name)
     * @param {string} text - Input text
     * @returns {string} Sentence case formatted text
     */
    toSentenceCase(text) {
        const words = utils.splitWords(text);
        if (words.length === 0) return '';
        
        return utils.capitalize(words[0]) + 
               (words.length > 1 ? ' ' + words.slice(1).map(word => word.toLowerCase()).join(' ') : '');
    }
};

// UI Controller - handles DOM manipulation and user interactions
const ui = {
    // Cache DOM elements for better performance
    elements: {
        inputText: null,
        clearBtn: null,
        charCount: null,
        outputFields: null,
        copyBtns: null,
        notification: null
    },

    /**
     * Initialize UI elements and event listeners
     */
    init() {
        this.cacheElements();
        this.setupEventListeners();
        this.updateCharCount('');
    },

    /**
     * Cache frequently used DOM elements
     */
    cacheElements() {
        this.elements.inputText = document.getElementById('input-text');
        this.elements.clearBtn = document.getElementById('clear-btn');
        this.elements.charCount = document.getElementById('char-count');
        this.elements.outputFields = document.querySelectorAll('.output-field');
        this.elements.copyBtns = document.querySelectorAll('.copy-btn');
        this.elements.notification = document.getElementById('copy-notification');
    },

    /**
     * Set up all event listeners
     */
    setupEventListeners() {
        // Debounced input handler for performance
        const debouncedUpdate = utils.debounce((text) => {
            this.updateOutputs(text);
        }, 150);

        this.elements.inputText.addEventListener('input', (e) => {
            const text = e.target.value;
            this.updateCharCount(text);
            debouncedUpdate(text);
        });

        this.elements.clearBtn.addEventListener('click', () => {
            this.clearInput();
        });

        // Copy button handlers
        this.elements.copyBtns.forEach(btn => {
            btn.addEventListener('click', (e) => {
                const caseType = e.currentTarget.dataset.case;
                this.copyToClipboard(caseType, e.currentTarget);
            });
        });

        // Keyboard shortcuts
        document.addEventListener('keydown', (e) => {
            if (e.ctrlKey || e.metaKey) {
                if (e.key === 'k') {
                    e.preventDefault();
                    this.elements.inputText.focus();
                }
            }
        });
    },

    /**
     * Update character count display
     * @param {string} text - Current input text
     */
    updateCharCount(text) {
        const count = text.length;
        const words = text.trim() ? utils.splitWords(text).length : 0;
        this.elements.charCount.textContent = `${count} characters, ${words} words`;
    },

    /**
     * Update all output fields with converted text
     * @param {string} inputText - Input text to convert
     */
    updateOutputs(inputText) {
        const sanitizedText = utils.sanitizeInput(inputText);
        
        // Mapping of case types to converter functions
        const caseMap = {
            'camelCase': converters.toCamelCase,
            'PascalCase': converters.toPascalCase,
            'snake_case': converters.toSnakeCase,
            'kebab-case': converters.toKebabCase,
            'SCREAMING_SNAKE_CASE': converters.toScreamingSnakeCase,
            'lowercase': converters.toLowercase,
            'UPPERCASE': converters.toUppercase,
            'Title Case': converters.toTitleCase,
            'Sentence case': converters.toSentenceCase
        };

        // Update each output field
        this.elements.outputFields.forEach(field => {
            const caseType = field.closest('.converter-item').dataset.case;
            const converter = caseMap[caseType];
            
            if (converter) {
                field.value = converter(sanitizedText);
            }
        });
    },

    /**
     * Clear input and all outputs
     */
    clearInput() {
        this.elements.inputText.value = '';
        this.elements.inputText.focus();
        this.updateCharCount('');
        this.updateOutputs('');
    },

    /**
     * Copy text to clipboard with visual feedback
     * @param {string} caseType - Type of case being copied
     * @param {HTMLElement} button - Copy button element
     */
    async copyToClipboard(caseType, button) {
        const outputField = button.parentElement.querySelector('.output-field');
        const textToCopy = outputField.value;

        if (!textToCopy) {
            this.showNotification('Nothing to copy!', 'error');
            return;
        }

        try {
            // Modern Clipboard API
            if (navigator.clipboard && window.isSecureContext) {
                await navigator.clipboard.writeText(textToCopy);
            } else {
                // Fallback for older browsers
                this.fallbackCopyToClipboard(textToCopy);
            }

            this.showCopySuccess(button, caseType);
            this.showNotification(`${caseType} copied to clipboard!`);
        } catch (err) {
            console.error('Copy failed:', err);
            this.showNotification('Copy failed. Please try again.', 'error');
        }
    },

    /**
     * Fallback copy method for older browsers
     * @param {string} text - Text to copy
     */
    fallbackCopyToClipboard(text) {
        const textArea = document.createElement('textarea');
        textArea.value = text;
        textArea.style.position = 'fixed';
        textArea.style.left = '-999999px';
        textArea.style.top = '-999999px';
        document.body.appendChild(textArea);
        textArea.focus();
        textArea.select();
        
        try {
            document.execCommand('copy');
        } finally {
            document.body.removeChild(textArea);
        }
    },

    /**
     * Show visual feedback for successful copy
     * @param {HTMLElement} button - Copy button element
     * @param {string} caseType - Type of case copied
     */
    showCopySuccess(button, caseType) {
        const originalText = button.querySelector('.copy-text').textContent;
        const copyText = button.querySelector('.copy-text');
        
        button.classList.add('copied');
        copyText.textContent = 'Copied!';
        
        setTimeout(() => {
            button.classList.remove('copied');
            copyText.textContent = originalText;
        }, 2000);
    },

    /**
     * Show notification message
     * @param {string} message - Message to display
     * @param {string} type - Type of notification ('success' or 'error')
     */
    showNotification(message, type = 'success') {
        this.elements.notification.textContent = message;
        this.elements.notification.className = `copy-notification ${type}`;
        this.elements.notification.classList.add('show');

        setTimeout(() => {
            this.elements.notification.classList.remove('show');
        }, 3000);
    }
};

// Application initialization
document.addEventListener('DOMContentLoaded', () => {
    ui.init();
    
    // Add some example text if the URL has a parameter
    const urlParams = new URLSearchParams(window.location.search);
    const exampleText = urlParams.get('text');
    if (exampleText) {
        ui.elements.inputText.value = decodeURIComponent(exampleText);
        ui.updateCharCount(ui.elements.inputText.value);
        ui.updateOutputs(ui.elements.inputText.value);
    }
});

// Export for testing purposes (if running in Node.js environment)
if (typeof module !== 'undefined' && module.exports) {
    module.exports = { utils, converters, ui };
}