PDF to SVG Converter

Upload a PDF file with line drawings (white background with black lines works best)

\n \n \n \n

\n \n \n Crop bottom 5% of PDF\n \n

\n \n \n \n

Ready for PDF upload

\n \n \n \n\n`, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};","children",[],[162],"901c259e-02dc-11f0-936c-569c3dd06744","ultra-simple","901c2648-02dc-11f0-936c-569c3dd06744",16,["D",1742180678227],"export default async (c) => {\n return new Response(`\n\n\n Ultra Simple PDF to SVG\n \n \n\n\n

Ultra Simple PDF to SVG

Select a PDF file:

\n \n \n \n \n

Ready

\n \n \n\n`, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[172],"fbbd4ab2-02dc-11f0-b4b5-569c3dd06744","test","fbbd4bd4-02dc-11f0-b4b5-569c3dd06744",20,["D",1742180858798],"export default async (c) => {\n const html = `\n\n\n Simple Test\n\n\n

Simple Test

Click the button:

\n \n

\n \n \n\n`;\n\n return new Response(html, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[180],"66038360-02dc-11f0-86e5-569c3dd06744","super-simple","660383f6-02dc-11f0-86e5-569c3dd06744",15,["D",1742180607600],"export default async (c) => {\n return new Response(`\n\n\n\n Super Simple PDF to SVG\n \n \n\n\n

Super Simple PDF to SVG

Select a PDF file to convert to SVG:

\n \n \n \n \n

Ready

\n \n \n \n \n\n\n `, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[188],"2dbef144-02da-11f0-8d24-569c3dd06744","styles.css","2dbef1e4-02da-11f0-8d24-569c3dd06744",2,["D",1742179654205],"body {\n font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;\n line-height: 1.6;\n color: #333;\n max-width: 800px;\n margin: 0 auto;\n padding: 20px;\n background-color: #f5f5f7;\n}\n\n.container {\n background-color: white;\n padding: 30px;\n border-radius: 10px;\n box-shadow: 0 4px 6px rgba(0,0,0,0.1);\n}\n\nh1 {\n color: #1d1d1f;\n text-align: center;\n margin-bottom: 10px;\n}\n\np {\n text-align: center;\n color: #6e6e73;\n margin-bottom: 30px;\n}\n\n.upload-section {\n display: flex;\n flex-direction: column;\n gap: 15px;\n margin-bottom: 30px;\n}\n\ninput[type=\"file\"] {\n padding: 10px;\n border: 1px dashed #0066cc;\n border-radius: 5px;\n background-color: #f0f7ff;\n}\n\nbutton {\n padding: 12px 20px;\n border: none;\n border-radius: 5px;\n cursor: pointer;\n font-weight: 600;\n transition: all 0.2s ease;\n}\n\n.convert-button {\n background-color: #0066cc;\n color: white;\n}\n\n.convert-button:hover {\n background-color: #0055aa;\n}\n\n.convert-button:disabled {\n background-color: #cccccc;\n cursor: not-allowed;\n}\n\n.download-button {\n background-color: #34c759;\n color: white;\n}\n\n.download-button:hover {\n background-color: #2bb14f;\n}\n\n.error {\n color: #ff3b30;\n background-color: #ffeeee;\n padding: 10px;\n border-radius: 5px;\n margin-bottom: 20px;\n}\n\n.result-section {\n margin-top: 30px;\n padding-top: 20px;\n border-top: 1px solid #e0e0e0;\n}\n\n.preview {\n margin-top: 20px;\n padding: 15px;\n border: 1px solid #e0e0e0;\n border-radius: 5px;\n background-color: #fafafa;\n overflow: auto;\n max-height: 400px;\n}\n\n.preview svg {\n max-width: 100%;\n height: auto;\n display: block;\n margin: 0 auto;\n}\n\n.notes {\n margin-top: 40px;\n padding: 15px;\n background-color: #f0f7ff;\n border-radius: 5px;\n font-size: 0.9rem;\n}\n\n.notes h3 {\n margin-top: 0;\n color: #0066cc;\n}\n\n.notes ul {\n margin-bottom: 0;\n}\n\n.footer {\n text-align: center;\n margin-top: 30px;\n font-size: 0.8rem;\n color: #6e6e73;\n}\n\n.footer a {\n color: #0066cc;\n text-decoration: none;\n}\n\n.footer a:hover {\n text-decoration: underline;\n}\n\n@media (max-width: 600px) {\n .container {\n padding: 20px;\n }\n \n .upload-section {\n flex-direction: column;\n }\n}",[],[196],["D",1742179706561],[],[18],"a2cb84ac-02da-11f0-ae73-569c3dd06744","simple","a2cb8556-02da-11f0-ae73-569c3dd06744",9,["D",1742179850581],"export default async (c) => {\n return new Response(`\n \n \n Simple PDF to Vector\n \n \n \n

Simple PDF to Vector Converter

A minimalist approach to convert PDF line drawings to SVG

\n \n

\n \n \n \n

\n \n

Logs will appear here...

\n \n \n \n \n `, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[207],"399b550c-02da-11f0-8e4c-569c3dd06744","script.js","399b55c0-02da-11f0-8e4c-569c3dd06744",3,["D",1742179674105],"// Initialize PDF.js worker\npdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdn.jsdelivr.net/npm/pdfjs-dist@3.11.174/build/pdf.worker.min.js';\n\n// DOM elements\nconst pdfInput = document.getElementById('pdfInput');\nconst convertBtn = document.getElementById('convertBtn');\nconst downloadBtn = document.getElementById('downloadBtn');\nconst errorMessage = document.getElementById('errorMessage');\nconst resultSection = document.getElementById('resultSection');\nconst svgPreview = document.getElementById('svgPreview');\n\n// Variables to store data\nlet currentFile = null;\nlet svgData = null;\n\n// Initialize\nfunction init() {\n // Add event listeners\n pdfInput.addEventListener('change', handleFileSelect);\n convertBtn.addEventListener('click', handleConvert);\n downloadBtn.addEventListener('click', handleDownload);\n}\n\n// Handle file selection\nfunction handleFileSelect(event) {\n const file = event.target.files[0];\n \n if (file && file.type === 'application/pdf') {\n currentFile = file;\n convertBtn.disabled = false;\n hideError();\n } else {\n showError('Please select a valid PDF file');\n convertBtn.disabled = true;\n currentFile = null;\n }\n}\n\n// Convert PDF to SVG\nasync function handleConvert() {\n if (!currentFile) return;\n \n try {\n convertBtn.disabled = true;\n convertBtn.textContent = 'Converting...';\n resultSection.style.display = 'none';\n hideError();\n \n // Read the PDF file\n const arrayBuffer = await readFileAsArrayBuffer(currentFile);\n \n // Load PDF document\n const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;\n \n // Get first page\n const page = await pdf.getPage(1);\n \n // Create canvas to render the page\n const viewport = page.getViewport({ scale: 1.0 });\n const canvas = document.createElement('canvas');\n canvas.width = viewport.width;\n canvas.height = viewport.height;\n const context = canvas.getContext('2d');\n \n // Render the page to the canvas\n await page.render({ canvasContext: context, viewport }).promise;\n \n // Get image data\n const imageData = context.getImageData(0, 0, canvas.width, canvas.height);\n \n // Convert to SVG with Potrace\n Potrace.setParameter({\n turdsize: 5,\n alphamax: 1,\n opttolerance: 0.2,\n optcurve: true,\n threshold: 128\n });\n \n Potrace.loadImageFromData(imageData);\n Potrace.process(function() {\n // Get SVG data\n svgData = Potrace.getSVG(1);\n \n // Clean up SVG - make lines instead of filled shapes\n svgData = svgData.replace(/ {\n const reader = new FileReader();\n reader.onload = () => resolve(reader.result);\n reader.onerror = reject;\n reader.readAsArrayBuffer(file);\n });\n}\n\n// Initialize when DOM is loaded\nif (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', init);\n} else {\n init();\n}",[],[215],"59fed062-02da-11f0-8c75-569c3dd06744","script","59fed10c-02da-11f0-8c75-569c3dd06744",6,["D",1742179728445],"export default async (c) => {\n const script = `// Initialize PDF.js worker\npdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdn.jsdelivr.net/npm/pdfjs-dist@3.11.174/build/pdf.worker.min.js';\n\n// DOM elements\nconst pdfInput = document.getElementById('pdfInput');\nconst convertBtn = document.getElementById('convertBtn');\nconst downloadBtn = document.getElementById('downloadBtn');\nconst errorMessage = document.getElementById('errorMessage');\nconst resultSection = document.getElementById('resultSection');\nconst svgPreview = document.getElementById('svgPreview');\n\n// Variables to store data\nlet currentFile = null;\nlet svgData = null;\n\n// Initialize\nfunction init() {\n // Add event listeners\n pdfInput.addEventListener('change', handleFileSelect);\n convertBtn.addEventListener('click', handleConvert);\n downloadBtn.addEventListener('click', handleDownload);\n}\n\n// Handle file selection\nfunction handleFileSelect(event) {\n const file = event.target.files[0];\n \n if (file && file.type === 'application/pdf') {\n currentFile = file;\n convertBtn.disabled = false;\n hideError();\n } else {\n showError('Please select a valid PDF file');\n convertBtn.disabled = true;\n currentFile = null;\n }\n}\n\n// Convert PDF to SVG\nasync function handleConvert() {\n if (!currentFile) return;\n \n try {\n convertBtn.disabled = true;\n convertBtn.textContent = 'Converting...';\n resultSection.style.display = 'none';\n hideError();\n \n // Read the PDF file\n const arrayBuffer = await readFileAsArrayBuffer(currentFile);\n \n // Load PDF document\n const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;\n \n // Get first page\n const page = await pdf.getPage(1);\n \n // Create canvas to render the page\n const viewport = page.getViewport({ scale: 1.0 });\n const canvas = document.createElement('canvas');\n canvas.width = viewport.width;\n canvas.height = viewport.height;\n const context = canvas.getContext('2d');\n \n // Render the page to the canvas\n await page.render({ canvasContext: context, viewport }).promise;\n \n // Get image data\n const imageData = context.getImageData(0, 0, canvas.width, canvas.height);\n \n // Convert to SVG with Potrace\n Potrace.setParameter({\n turdsize: 5,\n alphamax: 1,\n opttolerance: 0.2,\n optcurve: true,\n threshold: 128\n });\n \n Potrace.loadImageFromData(imageData);\n Potrace.process(function() {\n // Get SVG data\n svgData = Potrace.getSVG(1);\n \n // Clean up SVG - make lines instead of filled shapes\n svgData = svgData.replace(/ {\n const reader = new FileReader();\n reader.onload = () => resolve(reader.result);\n reader.onerror = reject;\n reader.readAsArrayBuffer(file);\n });\n}\n\n// Initialize when DOM is loaded\nif (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', init);\n} else {\n init();\n}`;\n\n return new Response(script, {\n headers: { \"Content-Type\": \"application/javascript\" }\n });\n};",[],[223],"97978b2e-02dc-11f0-a671-569c3dd06744","one-file","97978bd8-02dc-11f0-a671-569c3dd06744",17,["D",1742180690780],"export default async (c) => {\n return new Response(`\n\n\n One-File PDF to SVG\n\n\n

One-File PDF to SVG Converter

This is a complete, self-contained PDF to SVG converter:

\n \n

\n \n \n

\n \n

Ready

\n\n \n\n`, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[231],"7cd598e0-02db-11f0-ab62-569c3dd06744","minimal","0581b0d0-02db-11f0-b46f-569c3dd06744",12,["D",1742180216386],"export default async (c) => {\n return new Response(`\n \n \n Minimal PDF to Vector\n \n \n \n

Minimal PDF to Vector

A simple converter for PDF line drawings

\n \n

Drop PDF file here or click to select

\n \n

\n \n Crop bottom 5% of PDF\n

\n \n

Ready to convert

\n \n

\n \n \n \n \n `, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[239],"a7b19b56-02de-11f0-85fe-569c3dd06744","logger.js","a7b19c78-02de-11f0-85fe-569c3dd06744",24,["D",1742181576787],"// Simple logging utility for Val Town projects\nexport class Logger {\n constructor(appName = 'app') {\n this.appName = appName;\n this.logs = [];\n this.maxLogs = 100;\n this.storeKey = `logs_${this.appName}`;\n this.loadLogs();\n }\n\n // Log levels\n info(message, data = null) {\n this._log('INFO', message, data);\n }\n\n error(message, error = null) {\n this._log('ERROR', message, error);\n }\n\n warn(message, data = null) {\n this._log('WARN', message, data);\n }\n\n debug(message, data = null) {\n this._log('DEBUG', message, data);\n }\n\n // Global error handler\n setupGlobalHandler() {\n if (typeof window !== 'undefined') {\n window.addEventListener('error', (event) => {\n this.error(`Uncaught error: ${event.message}`, {\n filename: event.filename,\n lineno: event.lineno,\n colno: event.colno,\n error: event.error?.stack || event.error?.toString() || 'Unknown error'\n });\n return false;\n });\n\n window.addEventListener('unhandledrejection', (event) => {\n this.error(`Unhandled promise rejection`, {\n reason: event.reason?.stack || event.reason?.toString() || 'Unknown reason'\n });\n });\n }\n }\n\n // Internal logging method\n _log(level, message, data) {\n const timestamp = new Date().toISOString();\n const logEntry = {\n timestamp,\n level,\n message,\n data: data !== null ? JSON.stringify(data, this._safeStringify) : null\n };\n \n // Output to console with appropriate styling\n const style = this._getConsoleStyle(level);\n console.log(`%c[${timestamp}][${level}] ${message}`, style);\n if (data) {\n console.log(data);\n }\n \n // Store in memory\n this.logs.unshift(logEntry);\n if (this.logs.length > this.maxLogs) {\n this.logs.pop();\n }\n \n // Save to storage\n this.saveLogs();\n }\n\n // Helper for circular references\n _safeStringify(key, value) {\n if (value instanceof Error) {\n return {\n message: value.message,\n stack: value.stack,\n name: value.name\n };\n }\n \n const seen = new WeakSet();\n return (key, value) => {\n if (typeof value === 'object' && value !== null) {\n if (seen.has(value)) {\n return '[Circular Reference]';\n }\n seen.add(value);\n }\n return value;\n };\n }\n\n // Console styling\n _getConsoleStyle(level) {\n switch(level) {\n case 'ERROR': return 'color: red; font-weight: bold';\n case 'WARN': return 'color: orange';\n case 'INFO': return 'color: blue';\n case 'DEBUG': return 'color: gray';\n default: return '';\n }\n }\n\n // Save logs to storage\n async saveLogs() {\n try {\n if (typeof window !== 'undefined' && window?.fetch) {\n const response = await fetch('/api/store-logs', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({\n key: this.storeKey,\n logs: this.logs,\n })\n });\n \n if (!response.ok) {\n console.error('Failed to save logs to server');\n }\n }\n } catch (error) {\n console.error('Error saving logs:', error);\n }\n }\n\n // Load logs from storage\n async loadLogs() {\n try {\n if (typeof window !== 'undefined' && window?.fetch) {\n const response = await fetch(`/api/load-logs?key=${this.storeKey}`);\n if (response.ok) {\n const data = await response.json();\n if (Array.isArray(data.logs)) {\n this.logs = data.logs;\n }\n }\n }\n } catch (error) {\n console.error('Error loading logs:', error);\n }\n }\n\n // Get logs as string\n getLogs() {\n return this.logs;\n }\n\n // Clear logs\n clearLogs() {\n this.logs = [];\n this.saveLogs();\n }\n}\n\n// Create default logger\nexport const logger = new Logger('pdf2vector');\n\n// Export a global error handler function\nexport function setupGlobalErrorLogging() {\n logger.setupGlobalHandler();\n return logger;\n}\n\n// Export a function to get logs\nexport function getLogs() {\n return logger.getLogs();\n}\n",[],[247],"05bfe71e-02dc-11f0-80e8-569c3dd06744","logger","05bfe7b4-02dc-11f0-80e8-569c3dd06744",13,["D",1742180446096],"import { blob } from \"https://esm.town/v/std/blob\";\n\nexport default async function (req) {\n const url = new URL(req.url);\n \n // Handle log viewing (GET request)\n if (req.method === \"GET\") {\n try {\n if (url.pathname.includes(\"/clear\")) {\n // Clear all logs\n await blob.delete(\"pdf2vector_logs\");\n return new Response(\"Logs cleared successfully\", {\n status: 200,\n headers: { \"Content-Type\": \"text/plain\" }\n });\n }\n \n // Get logs\n const logs = await blob.get(\"pdf2vector_logs\");\n \n // If no logs yet\n if (!logs) {\n return new Response(\"No logs available\", {\n status: 404,\n headers: { \"Content-Type\": \"text/plain\" }\n });\n }\n \n // Return as text or as HTML (for viewing in browser)\n if (url.searchParams.get(\"format\") === \"text\") {\n return new Response(logs, {\n status: 200,\n headers: { \"Content-Type\": \"text/plain\" }\n });\n } else {\n // Format as HTML for easy viewing\n return new Response(`\n \n \n \n PDF2Vector Logs\n \n \n \n

PDF2Vector Logs

\n \n \n \n

${logs}

\n \n \n \n \n `, {\n status: 200,\n headers: { \"Content-Type\": \"text/html\" }\n });\n }\n } catch (error) {\n return new Response(`Error retrieving logs: ${error.message}`, {\n status: 500,\n headers: { \"Content-Type\": \"text/plain\" }\n });\n }\n }\n \n // Handle log submission (POST request)\n if (req.method === \"POST\") {\n try {\n // Get the log message from the request body\n let logData;\n const contentType = req.headers.get(\"Content-Type\") || \"\";\n \n if (contentType.includes(\"application/json\")) {\n const body = await req.json();\n logData = body.log || JSON.stringify(body);\n } else {\n logData = await req.text();\n }\n \n // Add timestamp to log\n const timestamp = new Date().toISOString();\n const logEntry = `[${timestamp}] ${logData}\\n\\n`;\n \n // Get existing logs\n let existingLogs = \"\";\n try {\n const logs = await blob.get(\"pdf2vector_logs\");\n if (logs) {\n existingLogs = logs;\n }\n } catch (e) {\n // No existing logs, that's fine\n }\n \n // Append new log to existing logs - keep last 500 lines\n const allLogs = logEntry + existingLogs;\n const maxLines = 500;\n const lines = allLogs.split(\"\\n\");\n const truncatedLogs = lines.slice(0, maxLines).join(\"\\n\");\n \n // Store the logs\n await blob.set(\"pdf2vector_logs\", truncatedLogs);\n \n return new Response(\"Log saved successfully\", {\n status: 200,\n headers: { \"Content-Type\": \"text/plain\" }\n });\n } catch (error) {\n return new Response(`Error saving log: ${error.message}`, {\n status: 500,\n headers: { \"Content-Type\": \"text/plain\" }\n });\n }\n }\n \n // Handle other methods\n return new Response(\"This endpoint accepts GET and POST requests only\", {\n status: 405,\n headers: { \"Content-Type\": \"text/plain\" }\n });\n}",[],[255],"b694e3a8-02de-11f0-8c02-569c3dd06744","log-api.js","b694e470-02de-11f0-8c02-569c3dd06744",25,["D",1742181601765],"import { Hono } from \"npm:hono\";\n\nconst app = new Hono();\n\n// In-memory store for logs (will reset on server restart)\n// We could use Val Town's blob storage for persistence in a production app\nconst logStore = new Map();\n\n// Store logs from the client\napp.post('/api/store-logs', async (c) => {\n try {\n const body = await c.req.json();\n const { key, logs } = body;\n \n if (!key || !Array.isArray(logs)) {\n return c.json({ error: 'Invalid request format' }, 400);\n }\n \n logStore.set(key, logs);\n return c.json({ success: true });\n } catch (error) {\n console.error('Error storing logs:', error);\n return c.json({ error: 'Failed to store logs' }, 500);\n }\n});\n\n// Get logs for a specific key\napp.get('/api/load-logs', (c) => {\n try {\n const key = c.req.query('key');\n \n if (!key) {\n return c.json({ error: 'Key is required' }, 400);\n }\n \n const logs = logStore.get(key) || [];\n return c.json({ logs });\n } catch (error) {\n console.error('Error loading logs:', error);\n return c.json({ error: 'Failed to load logs' }, 500);\n }\n});\n\n// Get all available log keys\napp.get('/api/list-logs', (c) => {\n try {\n const keys = Array.from(logStore.keys());\n return c.json({ keys });\n } catch (error) {\n console.error('Error listing logs:', error);\n return c.json({ error: 'Failed to list logs' }, 500);\n }\n});\n\n// Debug endpoint to view logs in browser\napp.get('/logs', (c) => {\n const keys = Array.from(logStore.keys());\n \n let html = `\n \n \n \n Application Logs\n \n \n \n \n

Application Logs

\n \n `;\n \n if (keys.length === 0) {\n html += `

No logs available. The application hasn't generated any logs yet.

`;\n } else {\n // Create tabs for each log key\n html += `

`;\n keys.forEach((key, index) => {\n html += `

${key}

`;\n });\n html += `

`;\n \n // Create content for each tab\n keys.forEach((key, index) => {\n const logs = logStore.get(key) || [];\n \n html += `

`;\n html += `

${key} (${logs.length} entries)

`;\n \n if (logs.length === 0) {\n html += `

No log entries.

`;\n } else {\n html += `

`;\n logs.forEach(log => {\n html += `\n

\n [${log.timestamp}]\n [${log.level}]\n ${log.message}\n ${log.data ? `

${log.data}

` : ''}\n

\n `;\n });\n html += `

`;\n }\n \n html += `

`;\n });\n }\n \n html += `\n \n \n \n `;\n \n return c.html(html);\n});\n\nexport default app.fetch;\n",[],[263],"91d246e0-02da-11f0-a410-569c3dd06744","index",8,["D",1742179822101],"export default async (c) => {\n console.log(\"Request received:\", c.req);\n \n // More robust URL handling\n let origin = \"\";\n try {\n if (c.req && c.req.url) {\n console.log(\"Request URL:\", c.req.url);\n origin = new URL(c.req.url).origin;\n console.log(\"Origin extracted:\", origin);\n } else {\n console.log(\"Request or URL is undefined, using relative paths\");\n origin = \"\"; // Fallback to relative paths\n }\n } catch (error) {\n console.error(\"Error extracting origin:\", error);\n origin = \"\"; // Fallback to relative paths\n }\n \n const stylesPath = origin ? `${origin}/styles` : \"./styles\";\n const scriptPath = origin ? `${origin}/script` : \"./script\";\n \n console.log(\"Styles path:\", stylesPath);\n console.log(\"Script path:\", scriptPath);\n \n return new Response(`\n \n \n PDF to Vector Converter\n \n \n \n \n

PDF to Vector Converter

Upload a PDF with line drawings (white background with black lines works best)

\n \n

\n \n \n

\n \n

Conversion Complete!

\n \n

Preview:

\n \n

Notes:

This tool works best with simple black and white drawings
The SVG output may need additional editing for complex PDFs
Only the first page of multi-page PDFs will be converted
Processing happens in your browser - no files are uploaded to servers

\n \n \n \n \n \n \n \n \n `, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[271],"0080d76c-02dd-11f0-8b20-569c3dd06744","direct-html","0080d820-02dd-11f0-8b20-569c3dd06744",21,["D",1742180866791],"export default async (c) => {\n // HTML defined directly without using template literals\n let html = \"\";\n html += \"\";\n html += \"\";\n html += \"Direct HTML\";\n html += \"\";\n html += \"\";\n html += \"

Direct HTML Test

\";\n html += \"

This page uses directly concatenated HTML:

\";\n html += \"\";\n html += \"

\";\n \n // JavaScript as a separate string\n let js = \"document.getElementById('testBtn').onclick = function() {\";\n js += \" document.getElementById('result').textContent = 'Button clicked at ' + new Date();\";\n js += \"};\";\n \n // Complete the HTML\n html += \"\";\n html += \"\";\n html += \"\";\n\n return new Response(html, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[278],"bc5fafde-02de-11f0-88f3-569c3dd06744","debug-converter","bc5fb15a-02de-11f0-88f3-569c3dd06744",26,["D",1742181611483],"import { Hono } from \"npm:hono\";\nimport logApi from \"../log-api.js\";\nimport { serveStatic } from \"npm:hono/middleware\";\n\n// Create a Hono app\nconst app = new Hono();\n\n// Mount the log API\napp.route('/api', logApi);\n\n// Serve our main page\napp.get(\"/\", (c) => {\n return c.html(`\n \n \n \n PDF to Vector Converter (Debug Mode)\n \n \n \n \n

PDF to Vector Debugger

\n \n

PDF.js Library Test

Test if PDF.js libraries load correctly in your browser:

\n \n

File Selection Test

Select a PDF file to test the file handling:

\n \n

Canvas Rendering Test

Test rendering a PDF to a canvas element:

\n \n

Results will appear here...

\n \n View All Logs\n \n \n \n \n `, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[294],"2998b056-0338-11f0-8883-569c3dd06744","converter","e7d37d0e-02dd-11f0-bed9-569c3dd06744",["D",1742220019933],11,"import { Hono } from \"npm:hono\";\nimport { serveStatic } from \"npm:hono/middleware\";\nimport { cors } from \"npm:hono/cors\";\n\n// Create a Hono app\nconst app = new Hono();\n\n// Add CORS middleware to allow cross-origin requests\napp.use('/*', cors({\n origin: '*', // Allow all origins\n allowMethods: ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS'],\n allowHeaders: ['Content-Type', 'Authorization'],\n exposeHeaders: ['Content-Length', 'Content-Type'],\n maxAge: 86400,\n}));\n\n// Simple in-memory error log\nlet errorLog = [];\n\n// Add endpoint to view errors\napp.get(\"/errors\", (c) => {\n return c.json({ status: \"success\", logs: errorLog });\n});\n\n// Clear errors endpoint\napp.get(\"/clear-errors\", (c) => {\n errorLog = [];\n return c.json({ status: \"success\", message: \"Error logs cleared\" });\n});\n\n// SVG viewing endpoint - now using blob storage with proper content type\napp.get(\"/svg/:id\", async (c) => {\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const id = c.req.param('id');\n const blobKey = `svg_${id}`;\n \n try {\n // Get the SVG content from blob storage\n const svgBlob = await blob.get(blobKey);\n \n if (!svgBlob) {\n return c.html(`

SVG not found

The requested SVG with ID ${id} does not exist.

`, 404);\n }\n \n // Extract the SVG content\n const svgContent = await svgBlob.text();\n \n // Return with proper headers that force the browser to display it as an image\n return new Response(svgContent, {\n headers: {\n \"Content-Type\": \"image/svg+xml\",\n \"Content-Disposition\": \"inline\",\n \"X-Content-Type-Options\": \"nosniff\",\n \"Cache-Control\": \"public, max-age=31536000\"\n }\n });\n } catch (error) {\n console.error(`Error retrieving SVG (${blobKey}):`, error);\n return c.html(`

Error

Failed to retrieve SVG: ${error.message}

`, 500);\n }\n});\n\n// Serve our main page\napp.get(\"/\", (c) => {\n return c.html(`\n \n \n \n PDF to Vector Converter\n \n \n \n \n

PDF to Vector Converter

Upload a PDF with line drawings to convert it to SVG format.

\n \n

Click below to select your PDF file

\n \n \n

\n \n \n Crop bottom portion of PDF\n \n \n

\n Crop percentage: 20%\n \n

\n \n

\n Line thickness: 1.5\n \n

\n \n

\n \n \n Transparent background (otherwise white)\n \n

\n\n

\n \n \n Use currentColor (better for theming)\n \n

\n \n \n

\n \n

Ready

\n \n

\n\n

How to Use in Other Projects

To embed the SVG in another website with theme color support:

<img src=\"[Your SVG URL]\" style=\"color: currentColor;\" alt=\"Vector graphic\">

For dark mode support, use CSS variables:

\n:root {\n  --svg-color: black;\n}\n.dark-mode {\n  --svg-color: white;\n}\n.svg-container img {\n  filter: var(--svg-filter);\n}\n

\n \n \n \n \n \n `);\n});\n\n// Add endpoint to receive error logs\napp.post(\"/errors\", async (c) => {\n try {\n const error = await c.req.json();\n errorLog.push(error);\n \n // Keep only the last 20 errors\n if (errorLog.length > 20) {\n errorLog = errorLog.slice(-20);\n }\n \n return c.json({ success: true });\n } catch (e) {\n console.error(\"Error logging error:\", e);\n return c.json({ success: false, error: e.message });\n }\n});\n\n// Add endpoint to store SVGs - now using blob storage\napp.post(\"/store-svg\", async (c) => {\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n \n try {\n const { id, svg } = await c.req.json();\n \n if (!id || !svg) {\n return c.json({ success: false, error: \"Missing id or svg\" }, 400);\n }\n \n // Create a unique blob key with prefix for easy identification\n const blobKey = `svg_${id}`;\n \n // Store SVG content in blob storage with proper content type\n await blob.set(blobKey, new TextEncoder().encode(svg), { \n contentType: \"image/svg+xml\",\n contentDisposition: \"inline\"\n });\n \n console.log(`Successfully stored SVG with key: ${blobKey}`);\n \n return c.json({ \n success: true, \n id,\n message: \"SVG stored in permanent blob storage\"\n });\n } catch (e) {\n console.error(\"Error storing SVG in blob:\", e);\n return c.json({ success: false, error: e.message }, 500);\n }\n});\n\n// Error handler\napp.onError((err, c) => {\n console.error(\"App error:\", err);\n \n // Log the error\n errorLog.push({\n message: err.message,\n stack: err.stack,\n url: c.req.url,\n method: c.req.method,\n timestamp: new Date().toISOString()\n });\n \n return c.html(`\n \n \n Error\n \n \n \n \n

Error

Something went wrong while processing your request.

Error details: ${err.message}

Return to converter

\n \n \n `, 500);\n});\n\nexport default app.fetch;",[],[302],"b752b468-02da-11f0-bdf1-569c3dd06744","basic","b752b4f4-02da-11f0-bdf1-569c3dd06744",10,["D",1742179885020],"export default async (c) => {\n return new Response(`\n \n \n Basic PDF to SVG\n \n \n \n

Basic PDF to SVG Converter

This is a minimal version that focuses on reliable conversion.

\n \n

📄 Upload a PDF with line drawings on white background

\n \n

Process Log:

Waiting for PDF upload...

\n \n \n \n \n `, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[310],"f85c4fee-02dc-11f0-bcef-569c3dd06744","bare-minimum","f85c5070-02dc-11f0-bcef-569c3dd06744",19,["D",1742180853130],"export default async (c) => {\n return new Response(`\n\n\n Bare Minimum\n\n\n

Bare Minimum Test

This page has absolutely minimal JavaScript:

\n \n \n

\n \n \n\n\n`, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n};",[],[318],["D",1742179596989],{"_11":12,"_97":93},{"_11":12,"_90":91,"_92":93,"_30":49,"_94":95,"_96":24},{"_79":80,"_13":16,"_37":81,"_82":38,"_83":-5,"_84":-5,"_85":-5,"_86":-5,"_87":-5,"_88":14,"_89":12},"ctx",{"_72":-5,"_116":362,"_363":364,"_365":366,"_367":24,"_368":24,"_369":24,"_370":53,"_371":-5,"_372":-7,"_373":-7,"_374":26,"_375":24,"_376":24,"_377":-5,"_378":24,"_379":24,"_380":24,"_381":-5},"ENV",{"_333":334,"_335":336,"_337":16,"_338":339,"_340":341,"_342":343,"_344":345,"_346":347,"_348":349,"_350":351,"_352":353,"_354":355,"_356":357,"_358":359,"_360":361},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","71c1b20804b3232a7e513be260cfffc1932a9e97","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

History · styles