🚀 Mobile Tire Website Generator

Generate professional websites from your original templates

Business Information

Preview

Fill out the form and click "Generate Website" to create your custom professional website.

What you'll get:

  • ✅ Professional customer website with booking system
  • ✅ Staff dispatch dashboard
  • ✅ SMS/calling integration
  • ✅ Google Maps integration
  • ✅ Revenue tracking
  • ✅ Mobile-responsive design
✅ Website generated successfully! Files are ready for download.

📄 index.html (Customer Website)

📊 dashboard.html (Staff Dashboard)

`; // Dashboard template dashboardTemplate = ` {{BUSINESS_NAME}} – Staff Dashboard
{{BUSINESS_NAME}} Dashboard
Export CSV
Open Jobs
0
Avg ETA (min)
—
Today Revenue
$0
Completed
0
Live Job Queue
Today Schedule
TimeCustomerServiceStatus
Service Area Map
`; console.log('Templates loaded successfully'); } function generateWebsite() { try { console.log('Starting website generation...'); // Get form data const data = { businessName: document.getElementById('businessName').value || 'Mobile Tire Pro', phone: document.getElementById('phone').value || '(555) 123-4567', email: document.getElementById('email').value || 'info@business.com', serviceArea: document.getElementById('serviceArea').value || 'Local Area', mapCenter: document.getElementById('mapCenter').value || 'Your City, State', brandColor: document.getElementById('brandColor').value || '#c8102e', hours: document.getElementById('hours').value || 'Mon-Fri 7:00 AM - 5:00 PM' }; console.log('Form data collected:', data); // Generate derived values const businessShort = data.businessName.split(' ')[0]; const logoInitials = data.businessName.split(' ').map(function(w) { return w[0]; }).join('').substring(0, 2).toUpperCase(); const phoneClean = data.phone.replace(/[^0-9]/g, ''); const phoneArea = phoneClean.substring(0, 3); const brandColorDark = adjustBrightness(data.brandColor, -20); console.log('Derived values:', { businessShort: businessShort, logoInitials: logoInitials, phoneClean: phoneClean, brandColorDark: brandColorDark }); // Check if templates are loaded if (!customerTemplate || !dashboardTemplate) { throw new Error('Templates not loaded yet. Please try again.'); } // Replace placeholders in customer template let customerHtml = customerTemplate .replace(/{{BUSINESS_NAME}}/g, data.businessName) .replace(/{{BUSINESS_SHORT}}/g, businessShort) .replace(/{{LOGO_INITIALS}}/g, logoInitials) .replace(/{{PHONE}}/g, data.phone) .replace(/{{PHONE_CLEAN}}/g, phoneClean) .replace(/{{PHONE_AREA}}/g, phoneArea) .replace(/{{EMAIL}}/g, data.email) .replace(/{{SERVICE_AREA}}/g, data.serviceArea) .replace(/{{MAP_CENTER}}/g, encodeURIComponent(data.mapCenter)) .replace(/{{BRAND_COLOR}}/g, data.brandColor) .replace(/{{BRAND_COLOR_DARK}}/g, brandColorDark) .replace(/{{BUSINESS_HOURS}}/g, data.hours); // Replace placeholders in dashboard template let dashboardHtml = dashboardTemplate .replace(/{{BUSINESS_NAME}}/g, data.businessName) .replace(/{{BUSINESS_SHORT}}/g, businessShort) .replace(/{{LOGO_INITIALS}}/g, logoInitials) .replace(/{{PHONE}}/g, data.phone) .replace(/{{PHONE_CLEAN}}/g, phoneClean) .replace(/{{PHONE_AREA}}/g, phoneArea) .replace(/{{EMAIL}}/g, data.email) .replace(/{{SERVICE_AREA}}/g, data.serviceArea) .replace(/{{MAP_CENTER}}/g, encodeURIComponent(data.mapCenter)) .replace(/{{BRAND_COLOR}}/g, data.brandColor) .replace(/{{BRAND_COLOR_DARK}}/g, brandColorDark) .replace(/{{BUSINESS_HOURS}}/g, data.hours); console.log('Templates processed successfully'); // Display files document.getElementById('customerFile').value = customerHtml; document.getElementById('dashboardFile').value = dashboardHtml; // Update preview document.getElementById('preview').innerHTML = '

✅ ' + data.businessName + ' Website Generated!

' + '
' + '🎨 Brand: ' + logoInitials + ' | ' + data.businessName + '
' + '📞 Phone: ' + data.phone + '
' + '🗺️ Area: ' + data.serviceArea + '
' + '🎯 Color: ' + data.brandColor + '' + '
' + '

✅ Professional features included:

' + ''; document.getElementById('output').style.display = 'block'; console.log('Website generation completed successfully!'); } catch (error) { console.error('Error generating website:', error); // Show error message document.getElementById('preview').innerHTML = '
' + '❌ Error: ' + error.message + '
' + 'Please check the console for details and try again.' + '
'; } } function adjustBrightness(hex, percent) { const num = parseInt(hex.replace("#", ""), 16); const amt = Math.round(2.55 * percent); const R = (num >> 16) + amt; const G = (num >> 8 & 0x00FF) + amt; const B = (num & 0x0000FF) + amt; return "#" + (0x1000000 + (R < 255 ? R < 1 ? 0 : R : 255) * 0x10000 + (G < 255 ? G < 1 ? 0 : G : 255) * 0x100 + (B < 255 ? B < 1 ? 0 : B : 255)).toString(16).slice(1); } function downloadFile(filename, textareaId) { const content = document.getElementById(textareaId).value; if (!content) { alert('Please generate the website first!'); return; } const blob = new Blob([content], { type: 'text/html' }); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = filename; document.body.appendChild(a); a.click(); document.body.removeChild(a); URL.revokeObjectURL(url); } function downloadAll() { downloadFile('index.html', 'customerFile'); setTimeout(function() { downloadFile('dashboard.html', 'dashboardFile'); }, 500); } console.log('Website generator script loaded successfully');