Text to Binary Tool<\/title>\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n .gp-text-to-binary-tool {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background-color: #f5f5f5;\n min-height: 100vh;\n padding: 20px;\n }\n\n .gp-text-to-binary-container {\n max-width: 1200px;\n margin: 0 auto;\n }\n\n .gp-text-to-binary-header {\n background: white;\n padding: 25px;\n border-radius: 12px;\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n margin-bottom: 20px;\n display: flex;\n align-items: center;\n gap: 20px;\n }\n\n .gp-text-to-binary-icon {\n width: 80px;\n height: 80px;\n background: linear-gradient(135deg, #4285f4, #1a73e8);\n border-radius: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 24px;\n font-weight: 900;\n color: white;\n flex-shrink: 0;\n }\n\n .gp-text-to-binary-title-section h1 {\n font-size: 32px;\n color: #000;\n font-weight: 900;\n margin-bottom: 8px;\n }\n\n .gp-text-to-binary-title-section p {\n font-size: 18px;\n color: #000;\n font-weight: 700;\n }\n\n .gp-text-to-binary-main {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 20px;\n margin-bottom: 20px;\n }\n\n .gp-text-to-binary-section {\n background: white;\n border-radius: 12px;\n padding: 25px;\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n height: fit-content;\n }\n\n .gp-text-to-binary-section h2 {\n font-size: 20px;\n color: #000;\n font-weight: 900;\n margin-bottom: 15px;\n display: flex;\n align-items: center;\n gap: 10px;\n }\n\n .gp-text-to-binary-textarea {\n width: 100%;\n height: 300px;\n border: 2px solid #e0e0e0;\n border-radius: 8px;\n padding: 15px;\n font-family: 'Segoe UI', monospace;\n font-size: 14px;\n font-weight: 700;\n color: #000;\n resize: vertical;\n transition: border-color 0.3s ease;\n line-height: 1.5;\n word-break: break-all;\n }\n\n .gp-text-to-binary-textarea:focus {\n outline: none;\n border-color: #4285f4;\n }\n\n .gp-text-to-binary-controls {\n margin-top: 15px;\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 15px;\n }\n\n .gp-text-to-binary-control-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n\n .gp-text-to-binary-control-row {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .gp-text-to-binary-control-row label {\n font-weight: 700;\n color: #000;\n font-size: 14px;\n min-width: 80px;\n }\n\n .gp-text-to-binary-select {\n padding: 8px 12px;\n border: 2px solid #e0e0e0;\n border-radius: 6px;\n font-family: 'Segoe UI', sans-serif;\n font-weight: 700;\n color: #000;\n background: white;\n cursor: pointer;\n flex: 1;\n }\n\n .gp-text-to-binary-checkbox-group {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-wrap: wrap;\n }\n\n .gp-text-to-binary-checkbox-group input[type=\"checkbox\"] {\n width: 18px;\n height: 18px;\n cursor: pointer;\n }\n\n .gp-text-to-binary-checkbox-group label {\n font-weight: 700;\n color: #000;\n cursor: pointer;\n font-size: 14px;\n min-width: auto;\n }\n\n .gp-text-to-binary-button {\n background: #000;\n color: white;\n border: none;\n padding: 12px 20px;\n border-radius: 8px;\n font-family: 'Segoe UI', sans-serif;\n font-weight: 700;\n font-size: 14px;\n cursor: pointer;\n transition: all 0.3s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n justify-content: center;\n }\n\n .gp-text-to-binary-button:hover {\n background: #333;\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(0,0,0,0.2);\n }\n\n .gp-text-to-binary-button:active {\n transform: translateY(0);\n }\n\n .gp-text-to-binary-button.secondary {\n background: #666;\n }\n\n .gp-text-to-binary-button.secondary:hover {\n background: #555;\n }\n\n .gp-text-to-binary-actions {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 12px;\n margin-top: 15px;\n }\n\n .gp-text-to-binary-stats {\n background: white;\n border-radius: 12px;\n padding: 25px;\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n margin-bottom: 20px;\n }\n\n .gp-text-to-binary-stats h2 {\n font-size: 20px;\n color: #000;\n font-weight: 900;\n margin-bottom: 15px;\n }\n\n .gp-text-to-binary-stats-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 20px;\n }\n\n .gp-text-to-binary-stat {\n text-align: center;\n }\n\n .gp-text-to-binary-stat-number {\n font-size: 32px;\n font-weight: 900;\n color: #D97757;\n display: block;\n margin-bottom: 5px;\n transition: all 0.3s ease;\n }\n\n .gp-text-to-binary-stat-label {\n font-size: 14px;\n font-weight: 900;\n color: #000;\n }\n\n .gp-text-to-binary-description {\n background: #CBCADC;\n border-left: 4px solid #D97757;\n padding: 20px;\n border-radius: 8px;\n margin-bottom: 20px;\n }\n\n .gp-text-to-binary-description h3 {\n font-size: 18px;\n color: #000;\n font-weight: 900;\n margin-bottom: 10px;\n }\n\n .gp-text-to-binary-description p {\n font-size: 14px;\n color: #000;\n font-weight: 700;\n line-height: 1.5;\n }\n\n .gp-text-to-binary-history {\n background: white;\n border-radius: 12px;\n padding: 25px;\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n margin-bottom: 20px;\n }\n\n .gp-text-to-binary-history h2 {\n font-size: 20px;\n color: #000;\n font-weight: 900;\n margin-bottom: 15px;\n }\n\n .gp-text-to-binary-history-item {\n background: #f8f9fa;\n border: 1px solid #e0e0e0;\n border-radius: 6px;\n padding: 12px;\n margin-bottom: 10px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .gp-text-to-binary-history-text {\n font-size: 14px;\n color: #000;\n font-weight: 700;\n flex: 1;\n }\n\n .gp-text-to-binary-history-restore {\n background: #4285f4;\n color: white;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n font-weight: 700;\n font-size: 12px;\n cursor: pointer;\n }\n\n .gp-text-to-binary-toast {\n position: fixed;\n top: 20px;\n right: 20px;\n background: #000;\n color: white;\n padding: 12px 20px;\n border-radius: 8px;\n font-weight: 700;\n z-index: 1000;\n transform: translateX(400px);\n transition: transform 0.3s ease;\n }\n\n .gp-text-to-binary-toast.show {\n transform: translateX(0);\n }\n\n .gp-text-to-binary-pulse {\n animation: pulse 0.5s ease-in-out;\n }\n\n @keyframes pulse {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.1); }\n 100% { transform: scale(1); }\n }\n\n .gp-text-to-binary-preview {\n background: #f8f9fa;\n border: 1px solid #e0e0e0;\n border-radius: 6px;\n padding: 15px;\n margin-top: 15px;\n font-family: 'Segoe UI', monospace;\n font-size: 12px;\n font-weight: 700;\n color: #000;\n max-height: 150px;\n overflow-y: auto;\n white-space: pre-wrap;\n word-break: break-all;\n }\n\n .gp-text-to-binary-format-example {\n background: #f0f8ff;\n border: 1px solid #4285f4;\n border-radius: 6px;\n padding: 10px;\n margin-top: 10px;\n font-family: 'Segoe UI', monospace;\n font-size: 12px;\n font-weight: 700;\n color: #000;\n }\n\n \/* Mobile Responsive *\/\n @media (max-width: 768px) {\n .gp-text-to-binary-tool {\n padding: 15px;\n }\n\n .gp-text-to-binary-header {\n flex-direction: column;\n text-align: center;\n padding: 20px;\n }\n\n .gp-text-to-binary-title-section h1 {\n font-size: 24px;\n }\n\n .gp-text-to-binary-title-section p {\n font-size: 16px;\n }\n\n .gp-text-to-binary-main {\n grid-template-columns: 1fr;\n gap: 15px;\n }\n\n .gp-text-to-binary-section {\n padding: 20px;\n }\n\n .gp-text-to-binary-textarea {\n height: 250px;\n }\n\n .gp-text-to-binary-stats-grid {\n grid-template-columns: repeat(2, 1fr);\n gap: 15px;\n }\n\n .gp-text-to-binary-actions {\n grid-template-columns: 1fr;\n }\n\n .gp-text-to-binary-controls {\n grid-template-columns: 1fr;\n }\n\n .gp-text-to-binary-control-row {\n flex-direction: column;\n align-items: stretch;\n gap: 5px;\n }\n\n .gp-text-to-binary-control-row label {\n min-width: auto;\n }\n\n .gp-text-to-binary-checkbox-group {\n justify-content: center;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"gp-text-to-binary-tool\">\n <div class=\"gp-text-to-binary-container\">\n \n <div class=\"gp-text-to-binary-header\">\n <div class=\"gp-text-to-binary-icon\">10<\/div>\n <div class=\"gp-text-to-binary-title-section\">\n <h1>Text to Binary<\/h1>\n <p>Convert text to binary code and binary to text with multiple encoding formats and customization options<\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-description\" id=\"descriptionBox\">\n <h3>Pro Tip<\/h3>\n <p id=\"rotatingTip\">Perfect for programming education, data encoding, cryptography learning, and understanding computer data representation.<\/p>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-main\">\n \n <div class=\"gp-text-to-binary-section\">\n <h2>\ud83d\udcdd Input Text<\/h2>\n <textarea \n class=\"gp-text-to-binary-textarea\" \n id=\"inputText\" \n placeholder=\"Enter your text here to convert to binary...\n\nExample:\nHello World!\n\nOr paste binary code to convert back to text:\n01001000 01100101 01101100 01101100 01101111\"\n ><\/textarea>\n \n <div class=\"gp-text-to-binary-controls\">\n <div class=\"gp-text-to-binary-control-group\">\n <div class=\"gp-text-to-binary-control-row\">\n <label for=\"conversionMode\">Mode:<\/label>\n <select class=\"gp-text-to-binary-select\" id=\"conversionMode\">\n <option value=\"text-to-binary\">Text \u2192 Binary<\/option>\n <option value=\"binary-to-text\">Binary \u2192 Text<\/option>\n <option value=\"auto\">Auto Detect<\/option>\n <\/select>\n <\/div>\n <div class=\"gp-text-to-binary-control-row\">\n <label for=\"encoding\">Encoding:<\/label>\n <select class=\"gp-text-to-binary-select\" id=\"encoding\">\n <option value=\"utf8\">UTF-8<\/option>\n <option value=\"ascii\">ASCII<\/option>\n <option value=\"utf16\">UTF-16<\/option>\n <option value=\"latin1\">Latin-1<\/option>\n <\/select>\n <\/div>\n <\/div>\n \n <div class=\"gp-text-to-binary-control-group\">\n <div class=\"gp-text-to-binary-control-row\">\n <label for=\"binaryFormat\">Format:<\/label>\n <select class=\"gp-text-to-binary-select\" id=\"binaryFormat\">\n <option value=\"spaced\">Spaced (01001000 01100101)<\/option>\n <option value=\"grouped\">Grouped (01001000-01100101)<\/option>\n <option value=\"continuous\">Continuous (0100100001100101)<\/option>\n <option value=\"comma\">Comma (01001000,01100101)<\/option>\n <option value=\"newline\">New Line (line per byte)<\/option>\n <\/select>\n <\/div>\n <div class=\"gp-text-to-binary-control-row\">\n <label for=\"bitLength\">Bits:<\/label>\n <select class=\"gp-text-to-binary-select\" id=\"bitLength\">\n <option value=\"8\">8-bit<\/option>\n <option value=\"16\">16-bit<\/option>\n <option value=\"7\">7-bit<\/option>\n <option value=\"auto\">Auto<\/option>\n <\/select>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"gp-text-to-binary-controls\">\n <div class=\"gp-text-to-binary-checkbox-group\">\n <input type=\"checkbox\" id=\"showDecimal\">\n <label for=\"showDecimal\">Show Decimal<\/label>\n <\/div>\n <div class=\"gp-text-to-binary-checkbox-group\">\n <input type=\"checkbox\" id=\"showHex\">\n <label for=\"showHex\">Show Hex<\/label>\n <\/div>\n <div class=\"gp-text-to-binary-checkbox-group\">\n <input type=\"checkbox\" id=\"showChar\">\n <label for=\"showChar\">Show Character<\/label>\n <\/div>\n <div class=\"gp-text-to-binary-checkbox-group\">\n <input type=\"checkbox\" id=\"preserveSpaces\" checked>\n <label for=\"preserveSpaces\">Preserve Spaces<\/label>\n <\/div>\n <\/div>\n\n <div class=\"gp-text-to-binary-actions\">\n <button class=\"gp-text-to-binary-button\" onclick=\"convertText()\">\n \ud83d\udd04 Convert\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"clearInput()\">\n \ud83d\uddd1\ufe0f Clear\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"undoAction()\">\n \u21b6 Undo\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"redoAction()\">\n \u21b7 Redo\n <\/button>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-preview\" id=\"livePreview\">\n Live preview will appear here…\n <\/div>\n\n \n <div class=\"gp-text-to-binary-format-example\" id=\"formatExample\">\n Example: “A” = 01000001 (65 in decimal, 0x41 in hex)\n <\/div>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-section\">\n <h2>\u2705 Converted Output<\/h2>\n <textarea \n class=\"gp-text-to-binary-textarea\" \n id=\"outputText\" \n readonly\n placeholder=\"Your converted result will appear here...\"\n ><\/textarea>\n\n <div class=\"gp-text-to-binary-actions\">\n <button class=\"gp-text-to-binary-button\" onclick=\"copyToClipboard()\">\n \ud83d\udccb Copy to Clipboard\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"downloadResult()\">\n \ud83d\udcbe Download\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"copyToInput()\">\n \u2b05\ufe0f Copy to Input\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"swapInputOutput()\">\n \ud83d\udd04 Swap\n <\/button>\n <\/div>\n\n \n <div id=\"additionalOutputs\" style=\"margin-top: 15px;\"><\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-stats\">\n <h2>\ud83d\udcca Statistics<\/h2>\n <div class=\"gp-text-to-binary-stats-grid\">\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"inputChars\">0<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Input Characters<\/span>\n <\/div>\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"outputBits\">0<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Output Bits<\/span>\n <\/div>\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"totalBytes\">0<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Total Bytes<\/span>\n <\/div>\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"compressionRatio\">0%<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Size Change<\/span>\n <\/div>\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"unicodeChars\">0<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Unicode Chars<\/span>\n <\/div>\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"binaryGroups\">0<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Binary Groups<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-history\">\n <h2>\ud83d\udcda Operation History<\/h2>\n <div id=\"historyContainer\">\n <p style=\"color: #000; font-weight: 700; text-align: center; padding: 20px;\">No operations performed yet<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-toast\" id=\"toast\"><\/div>\n <\/div>\n\n <script>\n \/\/ Global variables\n let history = [];\n let historyIndex = -1;\n let operationHistory = [];\n \n \/\/ Rotating tips\n const tips = [\n \"Perfect for programming education, data encoding, cryptography learning, and understanding computer data representation.\",\n \"Binary is the foundation of all computer data - every text, image, and program is ultimately stored as 1s and 0s.\",\n \"UTF-8 encoding allows for international characters while ASCII is limited to basic English characters.\",\n \"Use 'Auto Detect' mode to automatically determine if your input is text or binary code.\",\n \"The 'Show Decimal' option displays the numeric value of each character alongside its binary representation.\",\n \"Different binary formats help with readability - spaced format is easier to read, continuous saves space.\",\n \"8-bit encoding represents each character with exactly 8 binary digits, creating consistent formatting.\",\n \"Binary-to-text conversion helps decode binary messages and understand how computers store text data.\"\n ];\n \n let currentTipIndex = 0;\n \n \/\/ Rotate tips every 5 seconds\n setInterval(() => {\n currentTipIndex = (currentTipIndex + 1) % tips.length;\n document.getElementById('rotatingTip').textContent = tips[currentTipIndex];\n }, 5000);\n\n \/\/ Initialize\n document.addEventListener('DOMContentLoaded', function() {\n const inputText = document.getElementById('inputText');\n inputText.addEventListener('input', updateStats);\n inputText.addEventListener('input', debounce(updateLivePreview, 300));\n \n \/\/ Add event listeners for all controls\n ['conversionMode', 'encoding', 'binaryFormat', 'bitLength', 'showDecimal', 'showHex', 'showChar', 'preserveSpaces'].forEach(id => {\n const element = document.getElementById(id);\n if (element) {\n element.addEventListener('change', updateLivePreview);\n element.addEventListener('input', debounce(updateLivePreview, 300));\n }\n });\n \n \/\/ Load sample data\n inputText.value = `Hello World!\nBinary: 01001000 01100101 01101100 01101100 01101111 00100000 01010111 01101111 01110010 01101100 01100100 00100001`;\n updateStats();\n updateLivePreview();\n updateFormatExample();\n });\n\n \/\/ Debounce function\n function debounce(func, wait) {\n let timeout;\n return function executedFunction(...args) {\n const later = () => {\n clearTimeout(timeout);\n func(...args);\n };\n clearTimeout(timeout);\n timeout = setTimeout(later, wait);\n };\n }\n\n \/\/ Auto-detect if input is binary or text\n function detectInputType(text) {\n \/\/ Check if text contains only binary characters, spaces, and separators\n const binaryPattern = \/^[01\\s\\-,\\n\\r]+$\/;\n if (binaryPattern.test(text.trim())) {\n \/\/ Count binary digits vs other characters\n const binaryChars = text.replace(\/[^01]\/g, '').length;\n const totalChars = text.replace(\/\\s\/g, '').length;\n if (binaryChars \/ totalChars > 0.7) {\n return 'binary';\n }\n }\n return 'text';\n }\n\n \/\/ Convert text to binary\n function textToBinary(text) {\n const encoding = document.getElementById('encoding').value;\n const binaryFormat = document.getElementById('binaryFormat').value;\n const bitLength = document.getElementById('bitLength').value;\n const preserveSpaces = document.getElementById('preserveSpaces').checked;\n \n let result = [];\n let additionalOutputs = [];\n \n for (let i = 0; i < text.length; i++) {\n const char = text[i];\n if (!preserveSpaces && char === ' ') continue;\n \n let charCode;\n switch (encoding) {\n case 'ascii':\n charCode = char.charCodeAt(0);\n if (charCode > 127) charCode = 63; \/\/ Replace with '?'\n break;\n case 'utf16':\n charCode = char.charCodeAt(0);\n break;\n case 'latin1':\n charCode = char.charCodeAt(0);\n if (charCode > 255) charCode = 63;\n break;\n default: \/\/ utf8\n charCode = new TextEncoder().encode(char)[0];\n break;\n }\n \n let bits = bitLength === 'auto' ? 8 : parseInt(bitLength);\n let binary = charCode.toString(2).padStart(bits, '0');\n \n result.push(binary);\n \n \/\/ Additional format information\n if (document.getElementById('showDecimal').checked || document.getElementById('showHex').checked || document.getElementById('showChar').checked) {\n let info = [];\n if (document.getElementById('showChar').checked) info.push(`'${char}'`);\n if (document.getElementById('showDecimal').checked) info.push(`Dec: ${charCode}`);\n if (document.getElementById('showHex').checked) info.push(`Hex: 0x${charCode.toString(16).toUpperCase()}`);\n additionalOutputs.push(`${binary} (${info.join(', ')})`);\n }\n }\n \n \/\/ Format output\n let formattedResult;\n switch (binaryFormat) {\n case 'spaced':\n formattedResult = result.join(' ');\n break;\n case 'grouped':\n formattedResult = result.join('-');\n break;\n case 'continuous':\n formattedResult = result.join('');\n break;\n case 'comma':\n formattedResult = result.join(',');\n break;\n case 'newline':\n formattedResult = result.join('\\n');\n break;\n default:\n formattedResult = result.join(' ');\n }\n \n return {\n result: formattedResult,\n additional: additionalOutputs\n };\n }\n\n \/\/ Convert binary to text\n function binaryToText(binaryText) {\n const encoding = document.getElementById('encoding').value;\n \n \/\/ Clean and parse binary input\n let binaryDigits = binaryText.replace(\/[^01]\/g, '');\n \n \/\/ Split into bytes (8-bit chunks by default)\n let bytes = [];\n for (let i = 0; i < binaryDigits.length; i += 8) {\n let byte = binaryDigits.substr(i, 8);\n if (byte.length === 8) {\n bytes.push(byte);\n }\n }\n \n let result = '';\n let additionalOutputs = [];\n \n for (let byte of bytes) {\n let charCode = parseInt(byte, 2);\n let char;\n \n try {\n switch (encoding) {\n case 'ascii':\n char = charCode <= 127 ? String.fromCharCode(charCode) : '?';\n break;\n case 'utf16':\n char = String.fromCharCode(charCode);\n break;\n case 'latin1':\n char = String.fromCharCode(charCode);\n break;\n default: \/\/ utf8\n char = String.fromCharCode(charCode);\n break;\n }\n } catch (e) {\n char = '?';\n }\n \n result += char;\n \n \/\/ Additional format information\n if (document.getElementById('showDecimal').checked || document.getElementById('showHex').checked || document.getElementById('showChar').checked) {\n let info = [];\n if (document.getElementById('showChar').checked) info.push(`'${char}'`);\n if (document.getElementById('showDecimal').checked) info.push(`Dec: ${charCode}`);\n if (document.getElementById('showHex').checked) info.push(`Hex: 0x${charCode.toString(16).toUpperCase()}`);\n additionalOutputs.push(`${byte} (${info.join(', ')})`);\n }\n }\n \n return {\n result: result,\n additional: additionalOutputs\n };\n }\n\n \/\/ Update live preview\n function updateLivePreview() {\n const inputText = document.getElementById('inputText').value;\n if (!inputText.trim()) {\n document.getElementById('livePreview').textContent = 'Live preview will appear here...';\n return;\n }\n\n const mode = document.getElementById('conversionMode').value;\n let detectedMode = mode;\n \n if (mode === 'auto') {\n detectedMode = detectInputType(inputText);\n detectedMode = detectedMode === 'binary' ? 'binary-to-text' : 'text-to-binary';\n }\n\n try {\n let result;\n if (detectedMode === 'text-to-binary') {\n result = textToBinary(inputText.substring(0, 50)); \/\/ Preview first 50 chars\n } else {\n result = binaryToText(inputText.substring(0, 200)); \/\/ Preview first 200 chars\n }\n \n let preview = result.result;\n if (inputText.length > (detectedMode === 'text-to-binary' ? 50 : 200)) {\n preview += '\\n... (truncated for preview)';\n }\n \n document.getElementById('livePreview').textContent = preview;\n } catch (error) {\n document.getElementById('livePreview').textContent = 'Invalid input format';\n }\n \n updateFormatExample();\n }\n\n \/\/ Update format example\n function updateFormatExample() {\n const encoding = document.getElementById('encoding').value;\n const binaryFormat = document.getElementById('binaryFormat').value;\n const bitLength = document.getElementById('bitLength').value;\n \n const exampleChar = 'A';\n const charCode = exampleChar.charCodeAt(0);\n const bits = bitLength === 'auto' ? 8 : parseInt(bitLength);\n const binary = charCode.toString(2).padStart(bits, '0');\n \n let example = `Example: \"${exampleChar}\" = ${binary} (${charCode} in decimal, 0x${charCode.toString(16)} in hex)`;\n \n switch (binaryFormat) {\n case 'grouped':\n example += ` | Format: ${binary.match(\/.{1,4}\/g).join('-')}`;\n break;\n case 'comma':\n example += ` | Format: ${binary},`;\n break;\n case 'newline':\n example += ` | Format: One byte per line`;\n break;\n }\n \n document.getElementById('formatExample').textContent = example;\n }\n\n \/\/ Main conversion function\n function convertText() {\n const inputText = document.getElementById('inputText').value;\n const outputText = document.getElementById('outputText');\n const additionalOutputs = document.getElementById('additionalOutputs');\n \n if (!inputText.trim()) {\n outputText.value = '';\n additionalOutputs.innerHTML = '';\n updateStats();\n showToast('Please enter some text first!', 'error');\n return;\n }\n\n \/\/ Save to history\n saveToHistory(inputText);\n \n const mode = document.getElementById('conversionMode').value;\n let conversionMode = mode;\n \n if (mode === 'auto') {\n const detected = detectInputType(inputText);\n conversionMode = detected === 'binary' ? 'binary-to-text' : 'text-to-binary';\n }\n\n try {\n let result;\n let operationType;\n \n if (conversionMode === 'text-to-binary') {\n result = textToBinary(inputText);\n operationType = `Text \u2192 Binary (${document.getElementById('encoding').value.toUpperCase()})`;\n } else {\n result = binaryToText(inputText);\n operationType = `Binary \u2192 Text (${document.getElementById('encoding').value.toUpperCase()})`;\n }\n \n outputText.value = result.result;\n \n \/\/ Display additional outputs if any\n if (result.additional && result.additional.length > 0) {\n additionalOutputs.innerHTML = `\n <div style=\"background: #f8f9fa; border: 1px solid #e0e0e0; border-radius: 6px; padding: 15px;\">\n <h3 style=\"font-size: 16px; color: #000; font-weight: 900; margin-bottom: 10px;\">Detailed Breakdown:<\/h3>\n <div style=\"font-family: 'Segoe UI', monospace; font-size: 12px; font-weight: 700; color: #000; max-height: 200px; overflow-y: auto;\">\n ${result.additional.join('\\n')}\n <\/div>\n <\/div>\n `;\n } else {\n additionalOutputs.innerHTML = '';\n }\n \n updateStats();\n \n \/\/ Add to operation history\n const operation = {\n type: operationType,\n timestamp: new Date().toLocaleTimeString(),\n inputLength: inputText.length,\n outputLength: result.result.length,\n originalText: inputText\n };\n addToOperationHistory(operation);\n \n showToast('Conversion completed successfully!');\n \n } catch (error) {\n outputText.value = '';\n additionalOutputs.innerHTML = '';\n updateStats();\n showToast('Conversion failed: ' + error.message, 'error');\n }\n }\n\n \/\/ Update statistics\n function updateStats() {\n const inputText = document.getElementById('inputText').value;\n const outputText = document.getElementById('outputText').value;\n \n const inputChars = inputText.length;\n const outputChars = outputText.length;\n \n \/\/ Calculate binary-specific stats\n const binaryGroups = outputText ? outputText.split(\/[\\s\\-,\\n]+\/).filter(group => group.match(\/^[01]+$\/)).length : 0;\n const outputBits = outputText ? outputText.replace(\/[^01]\/g, '').length : 0;\n const totalBytes = Math.ceil(outputBits \/ 8);\n \n \/\/ Unicode character count\n const unicodeChars = inputText ? [...inputText].filter(char => char.charCodeAt(0) > 127).length : 0;\n \n \/\/ Size change calculation\n const sizeChange = inputChars > 0 ? Math.round(((outputChars - inputChars) \/ inputChars) * 100) : 0;\n \n \/\/ Animate number changes\n animateNumber('inputChars', inputChars);\n animateNumber('outputBits', outputBits);\n animateNumber('totalBytes', totalBytes);\n animateNumber('compressionRatio', sizeChange + '%');\n animateNumber('unicodeChars', unicodeChars);\n animateNumber('binaryGroups', binaryGroups);\n }\n\n \/\/ Animate number changes\n function animateNumber(elementId, newValue) {\n const element = document.getElementById(elementId);\n const currentValue = element.textContent;\n \n if (currentValue !== newValue.toString()) {\n element.classList.add('gp-text-to-binary-pulse');\n setTimeout(() => {\n element.textContent = newValue;\n element.classList.remove('gp-text-to-binary-pulse');\n }, 250);\n }\n }\n\n \/\/ Copy to clipboard\n async function copyToClipboard() {\n const outputText = document.getElementById('outputText').value;\n if (!outputText) {\n showToast('Nothing to copy!', 'error');\n return;\n }\n \n try {\n await navigator.clipboard.writeText(outputText);\n showToast('Copied to clipboard!');\n } catch (err) {\n \/\/ Fallback for older browsers\n const textarea = document.getElementById('outputText');\n textarea.select();\n document.execCommand('copy');\n showToast('Copied to clipboard!');\n }\n }\n\n \/\/ Download result\n function downloadResult() {\n const outputText = document.getElementById('outputText').value;\n if (!outputText) {\n showToast('Nothing to download!', 'error');\n return;\n }\n \n const mode = document.getElementById('conversionMode').value;\n const filename = mode.includes('binary') ? 'binary-output.txt' : 'text-output.txt';\n \n const blob = new Blob([outputText], { type: 'text\/plain' });\n const url = URL.createObjectURL(blob);\n const a = document.createElement('a');\n a.href = url;\n a.download = filename;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n URL.revokeObjectURL(url);\n \n showToast('File downloaded!');\n }\n\n \/\/ Copy output to input\n function copyToInput() {\n const outputText = document.getElementById('outputText').value;\n if (!outputText) {\n showToast('Nothing to copy!', 'error');\n return;\n }\n \n document.getElementById('inputText').value = outputText;\n updateStats();\n updateLivePreview();\n showToast('Copied to input!');\n }\n\n \/\/ Swap input and output\n function swapInputOutput() {\n const inputText = document.getElementById('inputText').value;\n const outputText = document.getElementById('outputText').value;\n \n if (!outputText) {\n showToast('No output to swap!', 'error');\n return;\n }\n \n document.getElementById('inputText').value = outputText;\n document.getElementById('outputText').value = inputText;\n \n \/\/ Auto-adjust conversion mode\n const detectedType = detectInputType(outputText);\n const modeSelect = document.getElementById('conversionMode');\n if (detectedType === 'binary') {\n modeSelect.value = 'binary-to-text';\n } else {\n modeSelect.value = 'text-to-binary';\n }\n \n updateStats();\n updateLivePreview();\n showToast('Input and output swapped!');\n }\n\n \/\/ Clear input\n function clearInput() {\n const inputText = document.getElementById('inputText');\n saveToHistory(inputText.value);\n inputText.value = '';\n document.getElementById('outputText').value = '';\n document.getElementById('additionalOutputs').innerHTML = '';\n updateStats();\n updateLivePreview();\n showToast('Input cleared!');\n }\n\n \/\/ History management\n function saveToHistory(text) {\n if (text && (history.length === 0 || history[history.length - 1] !== text)) {\n history.push(text);\n historyIndex = history.length - 1;\n \n \/\/ Keep only last 20 entries\n if (history.length > 20) {\n history.shift();\n historyIndex--;\n }\n }\n }\n\n \/\/ Undo action\n function undoAction() {\n if (historyIndex > 0) {\n historyIndex--;\n document.getElementById('inputText').value = history[historyIndex];\n updateStats();\n updateLivePreview();\n showToast('Undo successful!');\n } else {\n showToast('Nothing to undo!', 'error');\n }\n }\n\n \/\/ Redo action\n function redoAction() {\n if (historyIndex < history.length - 1) {\n historyIndex++;\n document.getElementById('inputText').value = history[historyIndex];\n updateStats();\n updateLivePreview();\n showToast('Redo successful!');\n } else {\n showToast('Nothing to redo!', 'error');\n }\n }\n\n \/\/ Add to operation history\n function addToOperationHistory(operation) {\n operationHistory.unshift(operation);\n \n \/\/ Keep only last 10 operations\n if (operationHistory.length > 10) {\n operationHistory.pop();\n }\n \n updateOperationHistoryDisplay();\n }\n\n \/\/ Update operation history display\n function updateOperationHistoryDisplay() {\n const container = document.getElementById('historyContainer');\n \n if (operationHistory.length === 0) {\n container.innerHTML = '<p style=\"color: #000; font-weight: 700; text-align: center; padding: 20px;\">No operations performed yet<\/p>';\n return;\n }\n \n container.innerHTML = operationHistory.map(op => `\n <div class=\"gp-text-to-binary-history-item\">\n <div class=\"gp-text-to-binary-history-text\">\n ${op.type} at ${op.timestamp} (${op.inputLength} \u2192 ${op.outputLength} chars)\n <\/div>\n <button class=\"gp-text-to-binary-history-restore\" onclick=\"restoreFromHistory('${op.originalText.replace(\/'\/g, \"\\\\'\")}')\">\n Restore\n <\/button>\n <\/div>\n `).join('');\n }\n\n \/\/ Restore from history\n function restoreFromHistory(text) {\n document.getElementById('inputText').value = text.replace(\/\\\\'\/g, \"'\");\n updateStats();\n updateLivePreview();\n showToast('Restored from history!');\n }\n\n \/\/ Show toast notification\n function showToast(message, type = 'success') {\n const toast = document.getElementById('toast');\n toast.textContent = message;\n toast.className = `gp-text-to-binary-toast show ${type}`;\n \n setTimeout(() => {\n toast.classList.remove('show');\n }, 3000);\n }\n\n \/\/ Keyboard shortcuts\n document.addEventListener('keydown', function(e) {\n if (e.ctrlKey || e.metaKey) {\n switch (e.key) {\n case 'Enter':\n e.preventDefault();\n convertText();\n break;\n case 'z':\n if (e.shiftKey) {\n e.preventDefault();\n redoAction();\n } else {\n e.preventDefault();\n undoAction();\n }\n break;\n case 'k':\n e.preventDefault();\n clearInput();\n break;\n }\n }\n });\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Text to Binary Tool 10 Text to Binary Convert text to binary code and binary to text with multiple encoding … <\/p>\n<p class=\"read-more-container\"><a title=\"Text to Binary\" class=\"read-more button\" href=\"https:\/\/vijaypandit.in\/?page_id=337#more-337\" aria-label=\"More on Text to Binary\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-337","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/pages\/337","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/vijaypandit.in\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=337"}],"version-history":[{"count":1,"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/pages\/337\/revisions"}],"predecessor-version":[{"id":338,"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/pages\/337\/revisions\/338"}],"wp:attachment":[{"href":"https:\/\/vijaypandit.in\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=337"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":337,"date":"2025-07-26T14:12:29","date_gmt":"2025-07-26T14:12:29","guid":{"rendered":"https:\/\/vijaypandit.in\/?page_id=337"},"modified":"2025-07-26T14:12:29","modified_gmt":"2025-07-26T14:12:29","slug":"text-to-binary","status":"publish","type":"page","link":"https:\/\/vijaypandit.in\/?page_id=337","title":{"rendered":"Text to Binary"},"content":{"rendered":"\n\n\n\n \n \n Text to Binary Tool<\/title>\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n .gp-text-to-binary-tool {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background-color: #f5f5f5;\n min-height: 100vh;\n padding: 20px;\n }\n\n .gp-text-to-binary-container {\n max-width: 1200px;\n margin: 0 auto;\n }\n\n .gp-text-to-binary-header {\n background: white;\n padding: 25px;\n border-radius: 12px;\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n margin-bottom: 20px;\n display: flex;\n align-items: center;\n gap: 20px;\n }\n\n .gp-text-to-binary-icon {\n width: 80px;\n height: 80px;\n background: linear-gradient(135deg, #4285f4, #1a73e8);\n border-radius: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 24px;\n font-weight: 900;\n color: white;\n flex-shrink: 0;\n }\n\n .gp-text-to-binary-title-section h1 {\n font-size: 32px;\n color: #000;\n font-weight: 900;\n margin-bottom: 8px;\n }\n\n .gp-text-to-binary-title-section p {\n font-size: 18px;\n color: #000;\n font-weight: 700;\n }\n\n .gp-text-to-binary-main {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 20px;\n margin-bottom: 20px;\n }\n\n .gp-text-to-binary-section {\n background: white;\n border-radius: 12px;\n padding: 25px;\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n height: fit-content;\n }\n\n .gp-text-to-binary-section h2 {\n font-size: 20px;\n color: #000;\n font-weight: 900;\n margin-bottom: 15px;\n display: flex;\n align-items: center;\n gap: 10px;\n }\n\n .gp-text-to-binary-textarea {\n width: 100%;\n height: 300px;\n border: 2px solid #e0e0e0;\n border-radius: 8px;\n padding: 15px;\n font-family: 'Segoe UI', monospace;\n font-size: 14px;\n font-weight: 700;\n color: #000;\n resize: vertical;\n transition: border-color 0.3s ease;\n line-height: 1.5;\n word-break: break-all;\n }\n\n .gp-text-to-binary-textarea:focus {\n outline: none;\n border-color: #4285f4;\n }\n\n .gp-text-to-binary-controls {\n margin-top: 15px;\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 15px;\n }\n\n .gp-text-to-binary-control-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n\n .gp-text-to-binary-control-row {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .gp-text-to-binary-control-row label {\n font-weight: 700;\n color: #000;\n font-size: 14px;\n min-width: 80px;\n }\n\n .gp-text-to-binary-select {\n padding: 8px 12px;\n border: 2px solid #e0e0e0;\n border-radius: 6px;\n font-family: 'Segoe UI', sans-serif;\n font-weight: 700;\n color: #000;\n background: white;\n cursor: pointer;\n flex: 1;\n }\n\n .gp-text-to-binary-checkbox-group {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-wrap: wrap;\n }\n\n .gp-text-to-binary-checkbox-group input[type=\"checkbox\"] {\n width: 18px;\n height: 18px;\n cursor: pointer;\n }\n\n .gp-text-to-binary-checkbox-group label {\n font-weight: 700;\n color: #000;\n cursor: pointer;\n font-size: 14px;\n min-width: auto;\n }\n\n .gp-text-to-binary-button {\n background: #000;\n color: white;\n border: none;\n padding: 12px 20px;\n border-radius: 8px;\n font-family: 'Segoe UI', sans-serif;\n font-weight: 700;\n font-size: 14px;\n cursor: pointer;\n transition: all 0.3s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n justify-content: center;\n }\n\n .gp-text-to-binary-button:hover {\n background: #333;\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(0,0,0,0.2);\n }\n\n .gp-text-to-binary-button:active {\n transform: translateY(0);\n }\n\n .gp-text-to-binary-button.secondary {\n background: #666;\n }\n\n .gp-text-to-binary-button.secondary:hover {\n background: #555;\n }\n\n .gp-text-to-binary-actions {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 12px;\n margin-top: 15px;\n }\n\n .gp-text-to-binary-stats {\n background: white;\n border-radius: 12px;\n padding: 25px;\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n margin-bottom: 20px;\n }\n\n .gp-text-to-binary-stats h2 {\n font-size: 20px;\n color: #000;\n font-weight: 900;\n margin-bottom: 15px;\n }\n\n .gp-text-to-binary-stats-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 20px;\n }\n\n .gp-text-to-binary-stat {\n text-align: center;\n }\n\n .gp-text-to-binary-stat-number {\n font-size: 32px;\n font-weight: 900;\n color: #D97757;\n display: block;\n margin-bottom: 5px;\n transition: all 0.3s ease;\n }\n\n .gp-text-to-binary-stat-label {\n font-size: 14px;\n font-weight: 900;\n color: #000;\n }\n\n .gp-text-to-binary-description {\n background: #CBCADC;\n border-left: 4px solid #D97757;\n padding: 20px;\n border-radius: 8px;\n margin-bottom: 20px;\n }\n\n .gp-text-to-binary-description h3 {\n font-size: 18px;\n color: #000;\n font-weight: 900;\n margin-bottom: 10px;\n }\n\n .gp-text-to-binary-description p {\n font-size: 14px;\n color: #000;\n font-weight: 700;\n line-height: 1.5;\n }\n\n .gp-text-to-binary-history {\n background: white;\n border-radius: 12px;\n padding: 25px;\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n margin-bottom: 20px;\n }\n\n .gp-text-to-binary-history h2 {\n font-size: 20px;\n color: #000;\n font-weight: 900;\n margin-bottom: 15px;\n }\n\n .gp-text-to-binary-history-item {\n background: #f8f9fa;\n border: 1px solid #e0e0e0;\n border-radius: 6px;\n padding: 12px;\n margin-bottom: 10px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .gp-text-to-binary-history-text {\n font-size: 14px;\n color: #000;\n font-weight: 700;\n flex: 1;\n }\n\n .gp-text-to-binary-history-restore {\n background: #4285f4;\n color: white;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n font-weight: 700;\n font-size: 12px;\n cursor: pointer;\n }\n\n .gp-text-to-binary-toast {\n position: fixed;\n top: 20px;\n right: 20px;\n background: #000;\n color: white;\n padding: 12px 20px;\n border-radius: 8px;\n font-weight: 700;\n z-index: 1000;\n transform: translateX(400px);\n transition: transform 0.3s ease;\n }\n\n .gp-text-to-binary-toast.show {\n transform: translateX(0);\n }\n\n .gp-text-to-binary-pulse {\n animation: pulse 0.5s ease-in-out;\n }\n\n @keyframes pulse {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.1); }\n 100% { transform: scale(1); }\n }\n\n .gp-text-to-binary-preview {\n background: #f8f9fa;\n border: 1px solid #e0e0e0;\n border-radius: 6px;\n padding: 15px;\n margin-top: 15px;\n font-family: 'Segoe UI', monospace;\n font-size: 12px;\n font-weight: 700;\n color: #000;\n max-height: 150px;\n overflow-y: auto;\n white-space: pre-wrap;\n word-break: break-all;\n }\n\n .gp-text-to-binary-format-example {\n background: #f0f8ff;\n border: 1px solid #4285f4;\n border-radius: 6px;\n padding: 10px;\n margin-top: 10px;\n font-family: 'Segoe UI', monospace;\n font-size: 12px;\n font-weight: 700;\n color: #000;\n }\n\n \/* Mobile Responsive *\/\n @media (max-width: 768px) {\n .gp-text-to-binary-tool {\n padding: 15px;\n }\n\n .gp-text-to-binary-header {\n flex-direction: column;\n text-align: center;\n padding: 20px;\n }\n\n .gp-text-to-binary-title-section h1 {\n font-size: 24px;\n }\n\n .gp-text-to-binary-title-section p {\n font-size: 16px;\n }\n\n .gp-text-to-binary-main {\n grid-template-columns: 1fr;\n gap: 15px;\n }\n\n .gp-text-to-binary-section {\n padding: 20px;\n }\n\n .gp-text-to-binary-textarea {\n height: 250px;\n }\n\n .gp-text-to-binary-stats-grid {\n grid-template-columns: repeat(2, 1fr);\n gap: 15px;\n }\n\n .gp-text-to-binary-actions {\n grid-template-columns: 1fr;\n }\n\n .gp-text-to-binary-controls {\n grid-template-columns: 1fr;\n }\n\n .gp-text-to-binary-control-row {\n flex-direction: column;\n align-items: stretch;\n gap: 5px;\n }\n\n .gp-text-to-binary-control-row label {\n min-width: auto;\n }\n\n .gp-text-to-binary-checkbox-group {\n justify-content: center;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"gp-text-to-binary-tool\">\n <div class=\"gp-text-to-binary-container\">\n \n <div class=\"gp-text-to-binary-header\">\n <div class=\"gp-text-to-binary-icon\">10<\/div>\n <div class=\"gp-text-to-binary-title-section\">\n <h1>Text to Binary<\/h1>\n <p>Convert text to binary code and binary to text with multiple encoding formats and customization options<\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-description\" id=\"descriptionBox\">\n <h3>Pro Tip<\/h3>\n <p id=\"rotatingTip\">Perfect for programming education, data encoding, cryptography learning, and understanding computer data representation.<\/p>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-main\">\n \n <div class=\"gp-text-to-binary-section\">\n <h2>\ud83d\udcdd Input Text<\/h2>\n <textarea \n class=\"gp-text-to-binary-textarea\" \n id=\"inputText\" \n placeholder=\"Enter your text here to convert to binary...\n\nExample:\nHello World!\n\nOr paste binary code to convert back to text:\n01001000 01100101 01101100 01101100 01101111\"\n ><\/textarea>\n \n <div class=\"gp-text-to-binary-controls\">\n <div class=\"gp-text-to-binary-control-group\">\n <div class=\"gp-text-to-binary-control-row\">\n <label for=\"conversionMode\">Mode:<\/label>\n <select class=\"gp-text-to-binary-select\" id=\"conversionMode\">\n <option value=\"text-to-binary\">Text \u2192 Binary<\/option>\n <option value=\"binary-to-text\">Binary \u2192 Text<\/option>\n <option value=\"auto\">Auto Detect<\/option>\n <\/select>\n <\/div>\n <div class=\"gp-text-to-binary-control-row\">\n <label for=\"encoding\">Encoding:<\/label>\n <select class=\"gp-text-to-binary-select\" id=\"encoding\">\n <option value=\"utf8\">UTF-8<\/option>\n <option value=\"ascii\">ASCII<\/option>\n <option value=\"utf16\">UTF-16<\/option>\n <option value=\"latin1\">Latin-1<\/option>\n <\/select>\n <\/div>\n <\/div>\n \n <div class=\"gp-text-to-binary-control-group\">\n <div class=\"gp-text-to-binary-control-row\">\n <label for=\"binaryFormat\">Format:<\/label>\n <select class=\"gp-text-to-binary-select\" id=\"binaryFormat\">\n <option value=\"spaced\">Spaced (01001000 01100101)<\/option>\n <option value=\"grouped\">Grouped (01001000-01100101)<\/option>\n <option value=\"continuous\">Continuous (0100100001100101)<\/option>\n <option value=\"comma\">Comma (01001000,01100101)<\/option>\n <option value=\"newline\">New Line (line per byte)<\/option>\n <\/select>\n <\/div>\n <div class=\"gp-text-to-binary-control-row\">\n <label for=\"bitLength\">Bits:<\/label>\n <select class=\"gp-text-to-binary-select\" id=\"bitLength\">\n <option value=\"8\">8-bit<\/option>\n <option value=\"16\">16-bit<\/option>\n <option value=\"7\">7-bit<\/option>\n <option value=\"auto\">Auto<\/option>\n <\/select>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"gp-text-to-binary-controls\">\n <div class=\"gp-text-to-binary-checkbox-group\">\n <input type=\"checkbox\" id=\"showDecimal\">\n <label for=\"showDecimal\">Show Decimal<\/label>\n <\/div>\n <div class=\"gp-text-to-binary-checkbox-group\">\n <input type=\"checkbox\" id=\"showHex\">\n <label for=\"showHex\">Show Hex<\/label>\n <\/div>\n <div class=\"gp-text-to-binary-checkbox-group\">\n <input type=\"checkbox\" id=\"showChar\">\n <label for=\"showChar\">Show Character<\/label>\n <\/div>\n <div class=\"gp-text-to-binary-checkbox-group\">\n <input type=\"checkbox\" id=\"preserveSpaces\" checked>\n <label for=\"preserveSpaces\">Preserve Spaces<\/label>\n <\/div>\n <\/div>\n\n <div class=\"gp-text-to-binary-actions\">\n <button class=\"gp-text-to-binary-button\" onclick=\"convertText()\">\n \ud83d\udd04 Convert\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"clearInput()\">\n \ud83d\uddd1\ufe0f Clear\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"undoAction()\">\n \u21b6 Undo\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"redoAction()\">\n \u21b7 Redo\n <\/button>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-preview\" id=\"livePreview\">\n Live preview will appear here…\n <\/div>\n\n \n <div class=\"gp-text-to-binary-format-example\" id=\"formatExample\">\n Example: “A” = 01000001 (65 in decimal, 0x41 in hex)\n <\/div>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-section\">\n <h2>\u2705 Converted Output<\/h2>\n <textarea \n class=\"gp-text-to-binary-textarea\" \n id=\"outputText\" \n readonly\n placeholder=\"Your converted result will appear here...\"\n ><\/textarea>\n\n <div class=\"gp-text-to-binary-actions\">\n <button class=\"gp-text-to-binary-button\" onclick=\"copyToClipboard()\">\n \ud83d\udccb Copy to Clipboard\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"downloadResult()\">\n \ud83d\udcbe Download\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"copyToInput()\">\n \u2b05\ufe0f Copy to Input\n <\/button>\n <button class=\"gp-text-to-binary-button secondary\" onclick=\"swapInputOutput()\">\n \ud83d\udd04 Swap\n <\/button>\n <\/div>\n\n \n <div id=\"additionalOutputs\" style=\"margin-top: 15px;\"><\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-stats\">\n <h2>\ud83d\udcca Statistics<\/h2>\n <div class=\"gp-text-to-binary-stats-grid\">\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"inputChars\">0<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Input Characters<\/span>\n <\/div>\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"outputBits\">0<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Output Bits<\/span>\n <\/div>\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"totalBytes\">0<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Total Bytes<\/span>\n <\/div>\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"compressionRatio\">0%<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Size Change<\/span>\n <\/div>\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"unicodeChars\">0<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Unicode Chars<\/span>\n <\/div>\n <div class=\"gp-text-to-binary-stat\">\n <span class=\"gp-text-to-binary-stat-number\" id=\"binaryGroups\">0<\/span>\n <span class=\"gp-text-to-binary-stat-label\">Binary Groups<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-history\">\n <h2>\ud83d\udcda Operation History<\/h2>\n <div id=\"historyContainer\">\n <p style=\"color: #000; font-weight: 700; text-align: center; padding: 20px;\">No operations performed yet<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"gp-text-to-binary-toast\" id=\"toast\"><\/div>\n <\/div>\n\n <script>\n \/\/ Global variables\n let history = [];\n let historyIndex = -1;\n let operationHistory = [];\n \n \/\/ Rotating tips\n const tips = [\n \"Perfect for programming education, data encoding, cryptography learning, and understanding computer data representation.\",\n \"Binary is the foundation of all computer data - every text, image, and program is ultimately stored as 1s and 0s.\",\n \"UTF-8 encoding allows for international characters while ASCII is limited to basic English characters.\",\n \"Use 'Auto Detect' mode to automatically determine if your input is text or binary code.\",\n \"The 'Show Decimal' option displays the numeric value of each character alongside its binary representation.\",\n \"Different binary formats help with readability - spaced format is easier to read, continuous saves space.\",\n \"8-bit encoding represents each character with exactly 8 binary digits, creating consistent formatting.\",\n \"Binary-to-text conversion helps decode binary messages and understand how computers store text data.\"\n ];\n \n let currentTipIndex = 0;\n \n \/\/ Rotate tips every 5 seconds\n setInterval(() => {\n currentTipIndex = (currentTipIndex + 1) % tips.length;\n document.getElementById('rotatingTip').textContent = tips[currentTipIndex];\n }, 5000);\n\n \/\/ Initialize\n document.addEventListener('DOMContentLoaded', function() {\n const inputText = document.getElementById('inputText');\n inputText.addEventListener('input', updateStats);\n inputText.addEventListener('input', debounce(updateLivePreview, 300));\n \n \/\/ Add event listeners for all controls\n ['conversionMode', 'encoding', 'binaryFormat', 'bitLength', 'showDecimal', 'showHex', 'showChar', 'preserveSpaces'].forEach(id => {\n const element = document.getElementById(id);\n if (element) {\n element.addEventListener('change', updateLivePreview);\n element.addEventListener('input', debounce(updateLivePreview, 300));\n }\n });\n \n \/\/ Load sample data\n inputText.value = `Hello World!\nBinary: 01001000 01100101 01101100 01101100 01101111 00100000 01010111 01101111 01110010 01101100 01100100 00100001`;\n updateStats();\n updateLivePreview();\n updateFormatExample();\n });\n\n \/\/ Debounce function\n function debounce(func, wait) {\n let timeout;\n return function executedFunction(...args) {\n const later = () => {\n clearTimeout(timeout);\n func(...args);\n };\n clearTimeout(timeout);\n timeout = setTimeout(later, wait);\n };\n }\n\n \/\/ Auto-detect if input is binary or text\n function detectInputType(text) {\n \/\/ Check if text contains only binary characters, spaces, and separators\n const binaryPattern = \/^[01\\s\\-,\\n\\r]+$\/;\n if (binaryPattern.test(text.trim())) {\n \/\/ Count binary digits vs other characters\n const binaryChars = text.replace(\/[^01]\/g, '').length;\n const totalChars = text.replace(\/\\s\/g, '').length;\n if (binaryChars \/ totalChars > 0.7) {\n return 'binary';\n }\n }\n return 'text';\n }\n\n \/\/ Convert text to binary\n function textToBinary(text) {\n const encoding = document.getElementById('encoding').value;\n const binaryFormat = document.getElementById('binaryFormat').value;\n const bitLength = document.getElementById('bitLength').value;\n const preserveSpaces = document.getElementById('preserveSpaces').checked;\n \n let result = [];\n let additionalOutputs = [];\n \n for (let i = 0; i < text.length; i++) {\n const char = text[i];\n if (!preserveSpaces && char === ' ') continue;\n \n let charCode;\n switch (encoding) {\n case 'ascii':\n charCode = char.charCodeAt(0);\n if (charCode > 127) charCode = 63; \/\/ Replace with '?'\n break;\n case 'utf16':\n charCode = char.charCodeAt(0);\n break;\n case 'latin1':\n charCode = char.charCodeAt(0);\n if (charCode > 255) charCode = 63;\n break;\n default: \/\/ utf8\n charCode = new TextEncoder().encode(char)[0];\n break;\n }\n \n let bits = bitLength === 'auto' ? 8 : parseInt(bitLength);\n let binary = charCode.toString(2).padStart(bits, '0');\n \n result.push(binary);\n \n \/\/ Additional format information\n if (document.getElementById('showDecimal').checked || document.getElementById('showHex').checked || document.getElementById('showChar').checked) {\n let info = [];\n if (document.getElementById('showChar').checked) info.push(`'${char}'`);\n if (document.getElementById('showDecimal').checked) info.push(`Dec: ${charCode}`);\n if (document.getElementById('showHex').checked) info.push(`Hex: 0x${charCode.toString(16).toUpperCase()}`);\n additionalOutputs.push(`${binary} (${info.join(', ')})`);\n }\n }\n \n \/\/ Format output\n let formattedResult;\n switch (binaryFormat) {\n case 'spaced':\n formattedResult = result.join(' ');\n break;\n case 'grouped':\n formattedResult = result.join('-');\n break;\n case 'continuous':\n formattedResult = result.join('');\n break;\n case 'comma':\n formattedResult = result.join(',');\n break;\n case 'newline':\n formattedResult = result.join('\\n');\n break;\n default:\n formattedResult = result.join(' ');\n }\n \n return {\n result: formattedResult,\n additional: additionalOutputs\n };\n }\n\n \/\/ Convert binary to text\n function binaryToText(binaryText) {\n const encoding = document.getElementById('encoding').value;\n \n \/\/ Clean and parse binary input\n let binaryDigits = binaryText.replace(\/[^01]\/g, '');\n \n \/\/ Split into bytes (8-bit chunks by default)\n let bytes = [];\n for (let i = 0; i < binaryDigits.length; i += 8) {\n let byte = binaryDigits.substr(i, 8);\n if (byte.length === 8) {\n bytes.push(byte);\n }\n }\n \n let result = '';\n let additionalOutputs = [];\n \n for (let byte of bytes) {\n let charCode = parseInt(byte, 2);\n let char;\n \n try {\n switch (encoding) {\n case 'ascii':\n char = charCode <= 127 ? String.fromCharCode(charCode) : '?';\n break;\n case 'utf16':\n char = String.fromCharCode(charCode);\n break;\n case 'latin1':\n char = String.fromCharCode(charCode);\n break;\n default: \/\/ utf8\n char = String.fromCharCode(charCode);\n break;\n }\n } catch (e) {\n char = '?';\n }\n \n result += char;\n \n \/\/ Additional format information\n if (document.getElementById('showDecimal').checked || document.getElementById('showHex').checked || document.getElementById('showChar').checked) {\n let info = [];\n if (document.getElementById('showChar').checked) info.push(`'${char}'`);\n if (document.getElementById('showDecimal').checked) info.push(`Dec: ${charCode}`);\n if (document.getElementById('showHex').checked) info.push(`Hex: 0x${charCode.toString(16).toUpperCase()}`);\n additionalOutputs.push(`${byte} (${info.join(', ')})`);\n }\n }\n \n return {\n result: result,\n additional: additionalOutputs\n };\n }\n\n \/\/ Update live preview\n function updateLivePreview() {\n const inputText = document.getElementById('inputText').value;\n if (!inputText.trim()) {\n document.getElementById('livePreview').textContent = 'Live preview will appear here...';\n return;\n }\n\n const mode = document.getElementById('conversionMode').value;\n let detectedMode = mode;\n \n if (mode === 'auto') {\n detectedMode = detectInputType(inputText);\n detectedMode = detectedMode === 'binary' ? 'binary-to-text' : 'text-to-binary';\n }\n\n try {\n let result;\n if (detectedMode === 'text-to-binary') {\n result = textToBinary(inputText.substring(0, 50)); \/\/ Preview first 50 chars\n } else {\n result = binaryToText(inputText.substring(0, 200)); \/\/ Preview first 200 chars\n }\n \n let preview = result.result;\n if (inputText.length > (detectedMode === 'text-to-binary' ? 50 : 200)) {\n preview += '\\n... (truncated for preview)';\n }\n \n document.getElementById('livePreview').textContent = preview;\n } catch (error) {\n document.getElementById('livePreview').textContent = 'Invalid input format';\n }\n \n updateFormatExample();\n }\n\n \/\/ Update format example\n function updateFormatExample() {\n const encoding = document.getElementById('encoding').value;\n const binaryFormat = document.getElementById('binaryFormat').value;\n const bitLength = document.getElementById('bitLength').value;\n \n const exampleChar = 'A';\n const charCode = exampleChar.charCodeAt(0);\n const bits = bitLength === 'auto' ? 8 : parseInt(bitLength);\n const binary = charCode.toString(2).padStart(bits, '0');\n \n let example = `Example: \"${exampleChar}\" = ${binary} (${charCode} in decimal, 0x${charCode.toString(16)} in hex)`;\n \n switch (binaryFormat) {\n case 'grouped':\n example += ` | Format: ${binary.match(\/.{1,4}\/g).join('-')}`;\n break;\n case 'comma':\n example += ` | Format: ${binary},`;\n break;\n case 'newline':\n example += ` | Format: One byte per line`;\n break;\n }\n \n document.getElementById('formatExample').textContent = example;\n }\n\n \/\/ Main conversion function\n function convertText() {\n const inputText = document.getElementById('inputText').value;\n const outputText = document.getElementById('outputText');\n const additionalOutputs = document.getElementById('additionalOutputs');\n \n if (!inputText.trim()) {\n outputText.value = '';\n additionalOutputs.innerHTML = '';\n updateStats();\n showToast('Please enter some text first!', 'error');\n return;\n }\n\n \/\/ Save to history\n saveToHistory(inputText);\n \n const mode = document.getElementById('conversionMode').value;\n let conversionMode = mode;\n \n if (mode === 'auto') {\n const detected = detectInputType(inputText);\n conversionMode = detected === 'binary' ? 'binary-to-text' : 'text-to-binary';\n }\n\n try {\n let result;\n let operationType;\n \n if (conversionMode === 'text-to-binary') {\n result = textToBinary(inputText);\n operationType = `Text \u2192 Binary (${document.getElementById('encoding').value.toUpperCase()})`;\n } else {\n result = binaryToText(inputText);\n operationType = `Binary \u2192 Text (${document.getElementById('encoding').value.toUpperCase()})`;\n }\n \n outputText.value = result.result;\n \n \/\/ Display additional outputs if any\n if (result.additional && result.additional.length > 0) {\n additionalOutputs.innerHTML = `\n <div style=\"background: #f8f9fa; border: 1px solid #e0e0e0; border-radius: 6px; padding: 15px;\">\n <h3 style=\"font-size: 16px; color: #000; font-weight: 900; margin-bottom: 10px;\">Detailed Breakdown:<\/h3>\n <div style=\"font-family: 'Segoe UI', monospace; font-size: 12px; font-weight: 700; color: #000; max-height: 200px; overflow-y: auto;\">\n ${result.additional.join('\\n')}\n <\/div>\n <\/div>\n `;\n } else {\n additionalOutputs.innerHTML = '';\n }\n \n updateStats();\n \n \/\/ Add to operation history\n const operation = {\n type: operationType,\n timestamp: new Date().toLocaleTimeString(),\n inputLength: inputText.length,\n outputLength: result.result.length,\n originalText: inputText\n };\n addToOperationHistory(operation);\n \n showToast('Conversion completed successfully!');\n \n } catch (error) {\n outputText.value = '';\n additionalOutputs.innerHTML = '';\n updateStats();\n showToast('Conversion failed: ' + error.message, 'error');\n }\n }\n\n \/\/ Update statistics\n function updateStats() {\n const inputText = document.getElementById('inputText').value;\n const outputText = document.getElementById('outputText').value;\n \n const inputChars = inputText.length;\n const outputChars = outputText.length;\n \n \/\/ Calculate binary-specific stats\n const binaryGroups = outputText ? outputText.split(\/[\\s\\-,\\n]+\/).filter(group => group.match(\/^[01]+$\/)).length : 0;\n const outputBits = outputText ? outputText.replace(\/[^01]\/g, '').length : 0;\n const totalBytes = Math.ceil(outputBits \/ 8);\n \n \/\/ Unicode character count\n const unicodeChars = inputText ? [...inputText].filter(char => char.charCodeAt(0) > 127).length : 0;\n \n \/\/ Size change calculation\n const sizeChange = inputChars > 0 ? Math.round(((outputChars - inputChars) \/ inputChars) * 100) : 0;\n \n \/\/ Animate number changes\n animateNumber('inputChars', inputChars);\n animateNumber('outputBits', outputBits);\n animateNumber('totalBytes', totalBytes);\n animateNumber('compressionRatio', sizeChange + '%');\n animateNumber('unicodeChars', unicodeChars);\n animateNumber('binaryGroups', binaryGroups);\n }\n\n \/\/ Animate number changes\n function animateNumber(elementId, newValue) {\n const element = document.getElementById(elementId);\n const currentValue = element.textContent;\n \n if (currentValue !== newValue.toString()) {\n element.classList.add('gp-text-to-binary-pulse');\n setTimeout(() => {\n element.textContent = newValue;\n element.classList.remove('gp-text-to-binary-pulse');\n }, 250);\n }\n }\n\n \/\/ Copy to clipboard\n async function copyToClipboard() {\n const outputText = document.getElementById('outputText').value;\n if (!outputText) {\n showToast('Nothing to copy!', 'error');\n return;\n }\n \n try {\n await navigator.clipboard.writeText(outputText);\n showToast('Copied to clipboard!');\n } catch (err) {\n \/\/ Fallback for older browsers\n const textarea = document.getElementById('outputText');\n textarea.select();\n document.execCommand('copy');\n showToast('Copied to clipboard!');\n }\n }\n\n \/\/ Download result\n function downloadResult() {\n const outputText = document.getElementById('outputText').value;\n if (!outputText) {\n showToast('Nothing to download!', 'error');\n return;\n }\n \n const mode = document.getElementById('conversionMode').value;\n const filename = mode.includes('binary') ? 'binary-output.txt' : 'text-output.txt';\n \n const blob = new Blob([outputText], { type: 'text\/plain' });\n const url = URL.createObjectURL(blob);\n const a = document.createElement('a');\n a.href = url;\n a.download = filename;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n URL.revokeObjectURL(url);\n \n showToast('File downloaded!');\n }\n\n \/\/ Copy output to input\n function copyToInput() {\n const outputText = document.getElementById('outputText').value;\n if (!outputText) {\n showToast('Nothing to copy!', 'error');\n return;\n }\n \n document.getElementById('inputText').value = outputText;\n updateStats();\n updateLivePreview();\n showToast('Copied to input!');\n }\n\n \/\/ Swap input and output\n function swapInputOutput() {\n const inputText = document.getElementById('inputText').value;\n const outputText = document.getElementById('outputText').value;\n \n if (!outputText) {\n showToast('No output to swap!', 'error');\n return;\n }\n \n document.getElementById('inputText').value = outputText;\n document.getElementById('outputText').value = inputText;\n \n \/\/ Auto-adjust conversion mode\n const detectedType = detectInputType(outputText);\n const modeSelect = document.getElementById('conversionMode');\n if (detectedType === 'binary') {\n modeSelect.value = 'binary-to-text';\n } else {\n modeSelect.value = 'text-to-binary';\n }\n \n updateStats();\n updateLivePreview();\n showToast('Input and output swapped!');\n }\n\n \/\/ Clear input\n function clearInput() {\n const inputText = document.getElementById('inputText');\n saveToHistory(inputText.value);\n inputText.value = '';\n document.getElementById('outputText').value = '';\n document.getElementById('additionalOutputs').innerHTML = '';\n updateStats();\n updateLivePreview();\n showToast('Input cleared!');\n }\n\n \/\/ History management\n function saveToHistory(text) {\n if (text && (history.length === 0 || history[history.length - 1] !== text)) {\n history.push(text);\n historyIndex = history.length - 1;\n \n \/\/ Keep only last 20 entries\n if (history.length > 20) {\n history.shift();\n historyIndex--;\n }\n }\n }\n\n \/\/ Undo action\n function undoAction() {\n if (historyIndex > 0) {\n historyIndex--;\n document.getElementById('inputText').value = history[historyIndex];\n updateStats();\n updateLivePreview();\n showToast('Undo successful!');\n } else {\n showToast('Nothing to undo!', 'error');\n }\n }\n\n \/\/ Redo action\n function redoAction() {\n if (historyIndex < history.length - 1) {\n historyIndex++;\n document.getElementById('inputText').value = history[historyIndex];\n updateStats();\n updateLivePreview();\n showToast('Redo successful!');\n } else {\n showToast('Nothing to redo!', 'error');\n }\n }\n\n \/\/ Add to operation history\n function addToOperationHistory(operation) {\n operationHistory.unshift(operation);\n \n \/\/ Keep only last 10 operations\n if (operationHistory.length > 10) {\n operationHistory.pop();\n }\n \n updateOperationHistoryDisplay();\n }\n\n \/\/ Update operation history display\n function updateOperationHistoryDisplay() {\n const container = document.getElementById('historyContainer');\n \n if (operationHistory.length === 0) {\n container.innerHTML = '<p style=\"color: #000; font-weight: 700; text-align: center; padding: 20px;\">No operations performed yet<\/p>';\n return;\n }\n \n container.innerHTML = operationHistory.map(op => `\n <div class=\"gp-text-to-binary-history-item\">\n <div class=\"gp-text-to-binary-history-text\">\n ${op.type} at ${op.timestamp} (${op.inputLength} \u2192 ${op.outputLength} chars)\n <\/div>\n <button class=\"gp-text-to-binary-history-restore\" onclick=\"restoreFromHistory('${op.originalText.replace(\/'\/g, \"\\\\'\")}')\">\n Restore\n <\/button>\n <\/div>\n `).join('');\n }\n\n \/\/ Restore from history\n function restoreFromHistory(text) {\n document.getElementById('inputText').value = text.replace(\/\\\\'\/g, \"'\");\n updateStats();\n updateLivePreview();\n showToast('Restored from history!');\n }\n\n \/\/ Show toast notification\n function showToast(message, type = 'success') {\n const toast = document.getElementById('toast');\n toast.textContent = message;\n toast.className = `gp-text-to-binary-toast show ${type}`;\n \n setTimeout(() => {\n toast.classList.remove('show');\n }, 3000);\n }\n\n \/\/ Keyboard shortcuts\n document.addEventListener('keydown', function(e) {\n if (e.ctrlKey || e.metaKey) {\n switch (e.key) {\n case 'Enter':\n e.preventDefault();\n convertText();\n break;\n case 'z':\n if (e.shiftKey) {\n e.preventDefault();\n redoAction();\n } else {\n e.preventDefault();\n undoAction();\n }\n break;\n case 'k':\n e.preventDefault();\n clearInput();\n break;\n }\n }\n });\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Text to Binary Tool 10 Text to Binary Convert text to binary code and binary to text with multiple encoding … <\/p>\n<p class=\"read-more-container\"><a title=\"Text to Binary\" class=\"read-more button\" href=\"https:\/\/vijaypandit.in\/?page_id=337#more-337\" aria-label=\"More on Text to Binary\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-337","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/pages\/337","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/vijaypandit.in\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=337"}],"version-history":[{"count":1,"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/pages\/337\/revisions"}],"predecessor-version":[{"id":338,"href":"https:\/\/vijaypandit.in\/index.php?rest_route=\/wp\/v2\/pages\/337\/revisions\/338"}],"wp:attachment":[{"href":"https:\/\/vijaypandit.in\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=337"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}