Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Print Specifications Generator</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <style> | |
| .output-box { | |
| min-height: 300px; | |
| white-space: pre-wrap; | |
| font-family: monospace; | |
| } | |
| .copy-btn { | |
| transition: all 0.2s; | |
| } | |
| .copy-btn:hover { | |
| transform: translateY(-2px); | |
| } | |
| .copy-btn:active { | |
| transform: translateY(0); | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50"> | |
| <div class="container mx-auto px-4 py-8 max-w-4xl"> | |
| <h1 class="text-3xl font-bold text-center mb-6 text-gray-800">Print Specifications Generator</h1> | |
| <div class="bg-white rounded-lg shadow-md p-6 mb-8"> | |
| <div class="mb-4"> | |
| <label for="bookText" class="block text-sm font-medium text-gray-700 mb-2">Paste Book Text:</label> | |
| <textarea id="bookText" rows="10" class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500"></textarea> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4"> | |
| <div> | |
| <label for="printRun" class="block text-sm font-medium text-gray-700 mb-2">Print Run (copies):</label> | |
| <input type="number" id="printRun" min="1" value="100" class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500"> | |
| </div> | |
| <div> | |
| <label for="formatSize" class="block text-sm font-medium text-gray-700 mb-2">Format Size:</label> | |
| <select id="formatSize" class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500"> | |
| <option value="A5">A5 (148×210 mm)</option> | |
| <option value="A4">A4 (210×297 mm)</option> | |
| <option value="B5">B5 (176×250 mm)</option> | |
| <option value="custom">Custom</option> | |
| </select> | |
| </div> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="inline-flex items-center"> | |
| <input type="checkbox" id="hasImages" class="rounded border-gray-300 text-indigo-600 shadow-sm focus:border-indigo-300 focus:ring focus:ring-offset-0 focus:ring-indigo-200 focus:ring-opacity-50"> | |
| <span class="ml-2 text-sm text-gray-700">Contains images/illustrations</span> | |
| </label> | |
| </div> | |
| <div class="flex justify-center"> | |
| <button id="generateBtn" class="px-6 py-3 bg-indigo-600 text-white font-medium rounded-md shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"> | |
| Generate Print Specs | |
| </button> | |
| </div> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <div class="bg-white rounded-lg shadow-md p-6"> | |
| <div class="flex justify-between items-center mb-4"> | |
| <h2 class="text-xl font-semibold text-gray-800">Russian Version</h2> | |
| <button onclick="copyToClipboard('russianOutput')" class="copy-btn px-3 py-1 bg-gray-100 text-gray-700 text-sm rounded hover:bg-gray-200"> | |
| Copy Text | |
| </button> | |
| </div> | |
| <div id="russianOutput" class="output-box p-3 border border-gray-200 rounded bg-gray-50 text-gray-800 overflow-auto"></div> | |
| </div> | |
| <div class="bg-white rounded-lg shadow-md p-6"> | |
| <div class="flex justify-between items-center mb-4"> | |
| <h2 class="text-xl font-semibold text-gray-800">Chinese Version</h2> | |
| <button onclick="copyToClipboard('chineseOutput')" class="copy-btn px-3 py-1 bg-gray-100 text-gray-700 text-sm rounded hover:bg-gray-200"> | |
| Copy Text | |
| </button> | |
| </div> | |
| <div id="chineseOutput" class="output-box p-3 border border-gray-200 rounded bg-gray-50 text-gray-800 overflow-auto"></div> | |
| </div> | |
| </div> | |
| </div> | |
| <script> | |
| document.getElementById('generateBtn').addEventListener('click', generatePrintSpecs); | |
| function generatePrintSpecs() { | |
| const bookText = document.getElementById('bookText').value; | |
| const printRun = document.getElementById('printRun').value; | |
| const formatSize = document.getElementById('formatSize').value; | |
| const hasImages = document.getElementById('hasImages').checked; | |
| if (!bookText.trim()) { | |
| alert('Please paste the book text'); | |
| return; | |
| } | |
| // Calculate word count and pages | |
| const wordCount = bookText.trim().split(/\s+/).length; | |
| let wordsPerPage; | |
| switch(formatSize) { | |
| case 'A5': wordsPerPage = 280; break; | |
| case 'A4': wordsPerPage = 500; break; | |
| case 'B5': wordsPerPage = 350; break; | |
| default: wordsPerPage = 280; | |
| } | |
| const pageCount = Math.ceil(wordCount / wordsPerPage); | |
| // Determine binding method | |
| let bindingMethod; | |
| if (pageCount <= 48) { | |
| bindingMethod = 'скрепка (степлер)'; | |
| } else if (pageCount <= 96) { | |
| bindingMethod = 'клеевое бесшвейное скрепление (КБС)'; | |
| } else { | |
| bindingMethod = 'прошивка нитками'; | |
| } | |
| // Determine paper type | |
| const innerPaper = hasImages ? 'мелованная бумага 115 г/м²' : 'офсетная бумага 80 г/м²'; | |
| const coverPaper = 'картон 250 г/м² с матовой ламинацией'; | |
| // Generate Russian output | |
| const russianOutput = `Здравствуйте, | |
| Требуется расчет стоимости печати книги со следующими параметрами: | |
| • Формат: ${formatSize} | |
| • Объем: ~${pageCount} страниц | |
| • Тираж: ${printRun} экз. | |
| • Бумага внутреннего блока: ${innerPaper} | |
| • Бумага обложки: ${coverPaper} | |
| • Способ скрепления: ${bindingMethod} | |
| • Печать: ${hasImages ? 'цветная (4+4)' : 'черно-белая (1+1)'} | |
| ${hasImages ? '• Содержит иллюстрации/изображения\n' : ''} | |
| Прошу сообщить стоимость и сроки изготовления. | |
| Спасибо!`; | |
| // Generate Chinese output | |
| const chineseBinding = pageCount <= 48 ? '骑马钉' : (pageCount <= 96 ? '胶装' : '锁线胶装'); | |
| const chineseColor = hasImages ? '彩色印刷（4+4）' : '黑白印刷（1+1）'; | |
| const chineseOutput = `您好， | |
| 请报价以下印刷规格： | |
| 规格：${formatSize} | |
| 页数：约${pageCount}页 | |
| 印量：${printRun}本 | |
| 内页用纸：${hasImages ? '115克铜版纸' : '80克双胶纸'} | |
| 封面用纸：250克铜版纸+哑膜 | |
| 装订方式：${chineseBinding} | |
| 印刷方式：${chineseColor} | |
| ${hasImages ? '包含图片/插图\n' : ''} | |
| 请告知价格和交货时间。 | |
| 谢谢！`; | |
| // Display outputs | |
| document.getElementById('russianOutput').textContent = russianOutput; | |
| document.getElementById('chineseOutput').textContent = chineseOutput; | |
| } | |
| function copyToClipboard(elementId) { | |
| const element = document.getElementById(elementId); | |
| const range = document.createRange(); | |
| range.selectNode(element); | |
| window.getSelection().removeAllRanges(); | |
| window.getSelection().addRange(range); | |
| document.execCommand('copy'); | |
| window.getSelection().removeAllRanges(); | |
| // Show feedback | |
| const originalText = event.target.textContent; | |
| event.target.textContent = 'Copied!'; | |
| event.target.classList.add('bg-green-100', 'text-green-700'); | |
| setTimeout(() => { | |
| event.target.textContent = originalText; | |
| event.target.classList.remove('bg-green-100', 'text-green-700'); | |
| }, 2000); | |
| } | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Nekruz/specbook-generator" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |