Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>ASP to PHP Converter</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <style> | |
| .dropzone { | |
| border: 2px dashed #cbd5e0; | |
| transition: all 0.3s; | |
| } | |
| .dropzone.active { | |
| border-color: #4f46e5; | |
| background-color: #eef2ff; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50 min-h-screen"> | |
| <div class="max-w-4xl mx-auto py-12 px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-12"> | |
| <div class="flex justify-center mb-4"> | |
| <div class="bg-indigo-100 p-4 rounded-full"> | |
| <i data-feather="wifi" class="w-12 h-12 text-indigo-600"></i> | |
| </div> | |
| </div> | |
| <h1 class="text-3xl font-extrabold text-gray-900 sm:text-4xl"> | |
| ASP to PHP Converter | |
| </h1> | |
| <p class="mt-3 text-xl text-gray-500"> | |
| Upload your ASP files and convert them to PHP for Windows 11 | |
| </p> | |
| </div> | |
| <div class="bg-white shadow rounded-lg overflow-hidden"> | |
| <div class="p-6"> | |
| <div id="dropzone" class="dropzone rounded-lg p-12 text-center cursor-pointer"> | |
| <div class="flex justify-center mb-4"> | |
| <i data-feather="upload" class="w-10 h-10 text-gray-400"></i> | |
| </div> | |
| <h3 class="text-lg font-medium text-gray-900">Drag and drop files here</h3> | |
| <p class="mt-1 text-sm text-gray-500">or click to browse</p> | |
| <input type="file" id="fileInput" class="hidden" multiple accept=".asp,.aspx"> | |
| </div> | |
| <div class="mt-6"> | |
| <button id="convertBtn" class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-medium py-3 px-4 rounded-md shadow-sm flex items-center justify-center transition-colors duration-200"> | |
| <i data-feather="refresh-cw" class="w-5 h-5 mr-2"></i> | |
| Convert Files | |
| </button> | |
| </div> | |
| </div> | |
| <div id="fileList" class="border-t border-gray-200 divide-y divide-gray-200"> | |
| <!-- Files will be listed here --> | |
| </div> | |
| </div> | |
| <div class="mt-8 bg-white shadow rounded-lg overflow-hidden"> | |
| <div class="px-6 py-4 border-b border-gray-200"> | |
| <h3 class="text-lg font-medium text-gray-900">Conversion Guide</h3> | |
| </div> | |
| <div class="p-6"> | |
| <div class="space-y-4"> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <div class="flex items-center justify-center h-6 w-6 rounded-full bg-green-100 text-green-800"> | |
| <i data-feather="check" class="w-4 h-4"></i> | |
| </div> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm text-gray-700"> | |
| All ASP files will be converted to PHP format compatible with Windows 11 | |
| </p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <div class="flex items-center justify-center h-6 w-6 rounded-full bg-green-100 text-green-800"> | |
| <i data-feather="check" class="w-4 h-4"></i> | |
| </div> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm text-gray-700"> | |
| Supports multiple file upload and batch conversion | |
| </p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <div class="flex items-center justify-center h-6 w-6 rounded-full bg-green-100 text-green-800"> | |
| <i data-feather="check" class="w-4 h-4"></i> | |
| </div> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm text-gray-700"> | |
| Automatic download of converted files | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <script> | |
| feather.replace(); | |
| // Add loader icon to feather | |
| feather.icons.loader = { | |
| contents: '<line x1="12" y1="2" x2="12" y2="6"/><line x1="12" y1="18" x2="12" y2="22"/><line x1="4.93" y1="4.93" x2="7.76" y2="7.76"/><line x1="16.24" y1="16.24" x2="19.07" y2="19.07"/><line x1="2" y1="12" x2="6" y2="12"/><line x1="18" y1="12" x2="22" y2="12"/><line x1="4.93" y1="19.07" x2="7.76" y2="16.24"/><line x1="16.24" y1="7.76" x2="19.07" y2="4.93"/>' | |
| }; | |
| const dropzone = document.getElementById('dropzone'); | |
| const fileInput = document.getElementById('fileInput'); | |
| const fileList = document.getElementById('fileList'); | |
| const convertBtn = document.getElementById('convertBtn'); | |
| let files = []; | |
| // Handle drag and drop | |
| ['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => { | |
| dropzone.addEventListener(eventName, preventDefaults, false); | |
| }); | |
| function preventDefaults(e) { | |
| e.preventDefault(); | |
| e.stopPropagation(); | |
| } | |
| ['dragenter', 'dragover'].forEach(eventName => { | |
| dropzone.addEventListener(eventName, highlight, false); | |
| }); | |
| ['dragleave', 'drop'].forEach(eventName => { | |
| dropzone.addEventListener(eventName, unhighlight, false); | |
| }); | |
| function highlight() { | |
| dropzone.classList.add('active'); | |
| } | |
| function unhighlight() { | |
| dropzone.classList.remove('active'); | |
| } | |
| dropzone.addEventListener('drop', handleDrop, false); | |
| dropzone.addEventListener('click', () => fileInput.click()); | |
| fileInput.addEventListener('change', function(e) { | |
| handleFiles(e.target.files); | |
| }); | |
| function handleDrop(e) { | |
| const dt = e.dataTransfer; | |
| handleFiles(dt.files); | |
| } | |
| function handleFiles(newFiles) { | |
| files = [...files, ...Array.from(newFiles)]; | |
| updateFileList(); | |
| } | |
| function updateFileList() { | |
| fileList.innerHTML = ''; | |
| if (files.length === 0) { | |
| const emptyState = document.createElement('div'); | |
| emptyState.className = 'p-4 text-center text-gray-500'; | |
| emptyState.textContent = 'No files selected'; | |
| fileList.appendChild(emptyState); | |
| return; | |
| } | |
| files.forEach((file, index) => { | |
| const fileItem = document.createElement('div'); | |
| fileItem.className = 'p-4 flex items-center justify-between'; | |
| const fileInfo = document.createElement('div'); | |
| fileInfo.className = 'flex items-center'; | |
| const icon = document.createElement('div'); | |
| icon.className = 'flex-shrink-0'; | |
| icon.innerHTML = '<i data-feather="file" class="w-5 h-5 text-gray-500"></i>'; | |
| const fileName = document.createElement('div'); | |
| fileName.className = 'ml-3'; | |
| fileName.innerHTML = `<p class="text-sm font-medium text-gray-900">${file.name}</p> | |
| <p class="text-xs text-gray-500">${formatFileSize(file.size)}</p>`; | |
| fileInfo.appendChild(icon); | |
| fileInfo.appendChild(fileName); | |
| const removeBtn = document.createElement('button'); | |
| removeBtn.className = 'ml-4 text-red-500 hover:text-red-700'; | |
| removeBtn.innerHTML = '<i data-feather="trash-2" class="w-5 h-5"></i>'; | |
| removeBtn.onclick = () => { | |
| files.splice(index, 1); | |
| updateFileList(); | |
| }; | |
| fileItem.appendChild(fileInfo); | |
| fileItem.appendChild(removeBtn); | |
| fileList.appendChild(fileItem); | |
| }); | |
| feather.replace(); | |
| } | |
| function formatFileSize(bytes) { | |
| if (bytes === 0) return '0 Bytes'; | |
| const k = 1024; | |
| const sizes = ['Bytes', 'KB', 'MB', 'GB']; | |
| const i = Math.floor(Math.log(bytes) / Math.log(k)); | |
| return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]; | |
| } | |
| convertBtn.addEventListener('click', async function() { | |
| if (files.length === 0) { | |
| alert('Please select files to convert'); | |
| return; | |
| } | |
| // Show processing indicator | |
| convertBtn.disabled = true; | |
| convertBtn.innerHTML = '<i data-feather="loader" class="w-5 h-5 mr-2 animate-spin"></i>Processing...'; | |
| for (const file of files) { | |
| try { | |
| const content = await readFileAsText(file); | |
| const phpContent = convertASPtoPHP(content); | |
| const phpFileName = file.name.replace(/\.asp$/, '.php').replace(/\.aspx$/, '.php'); | |
| // Save file locally | |
| const blob = new Blob([phpContent], { type: 'text/plain' }); | |
| const url = URL.createObjectURL(blob); | |
| const a = document.createElement('a'); | |
| a.href = url; | |
| a.download = phpFileName; | |
| document.body.appendChild(a); | |
| a.click(); | |
| document.body.removeChild(a); | |
| URL.revokeObjectURL(url); | |
| } catch (error) { | |
| console.error('Error converting file:', file.name, error); | |
| alert(`Error converting ${file.name}: ${error.message}`); | |
| } | |
| } | |
| // Reset after conversion | |
| convertBtn.disabled = false; | |
| convertBtn.innerHTML = '<i data-feather="refresh-cw" class="w-5 h-5 mr-2"></i>Convert Files'; | |
| files = []; | |
| updateFileList(); | |
| alert('Conversion complete! Files downloaded.'); | |
| }); | |
| function readFileAsText(file) { | |
| return new Promise((resolve, reject) => { | |
| const reader = new FileReader(); | |
| reader.onload = () => resolve(reader.result); | |
| reader.onerror = () => reject(new Error('Failed to read file')); | |
| reader.readAsText(file); | |
| }); | |
| } | |
| function convertASPtoPHP(content) { | |
| // Basic ASP to PHP conversions | |
| let phpContent = content | |
| .replace(/<%=\s*/g, '<?= ') | |
| .replace(/<%([^=])/g, '<?php $1') | |
| .replace(/%>/g, '?>') | |
| .replace(/Response\.Write/g, 'echo') | |
| .replace(/Server\.CreateObject\(/g, 'new ') | |
| .replace(/Set\s+(\w+)\s*=\s*/g, '$1 = ') | |
| .replace(/\bSub\b/g, 'function') | |
| .replace(/\bEnd Sub\b/g, '}') | |
| .replace(/\bFunction\b/g, 'function') | |
| .replace(/\bEnd Function\b/g, '}') | |
| .replace(/\bDim\b/g, '</script> | |
| </body> | |
| </html> | |
| ) | |
| .replace(/\bThen\b/g, '') | |
| .replace(/End If/g, '}') | |
| .replace(/If\s+(.*?)\s+Then/g, 'if ($1) {') | |
| .replace(/End While/g, '}') | |
| .replace(/While\s+(.*?)/g, 'while ($1) {') | |
| .replace(/Loop/g, '}'); | |
| // Add PHP opening tag if not present | |
| if (!phpContent.includes(' | |