🚨 Erreur de Chargement

Une erreur est survenue lors du chargement de l'application.

\n \n

\n );\n }\n\n return this.props.children;\n }\n}\n\n// Disney+ Inspired Theme Configuration\nconst theme = {\n colors: {\n primary: '#113CCF',\n secondary: '#1A2342',\n background: '#0D1321',\n surface: '#1E2745',\n text: {\n light: '#FFFFFF',\n muted: '#8E8E8E'\n },\n accent: {\n blue: '#1F4CFF',\n green: '#00E461',\n red: '#FF453A'\n }\n },\n typography: {\n fontFamily: '\"Avenir\", \"Helvetica Neue\", Helvetica, Arial, sans-serif',\n fontSizes: {\n small: '0.75rem',\n normal: '1rem',\n large: '1.25rem',\n title: '1.5rem'\n }\n },\n spacing: {\n xs: '0.5rem',\n sm: '1rem',\n md: '1.5rem',\n lg: '2rem'\n },\n borderRadius: '0.75rem',\n shadows: {\n soft: '0 4px 6px rgba(0,0,0,0.1)',\n medium: '0 6px 12px rgba(0,0,0,0.15)'\n }\n};\n\n// Disney+ Inspired Styles\nconst styles = {\n container: {\n maxWidth: '600px',\n margin: '0 auto',\n padding: theme.spacing.sm,\n fontFamily: theme.typography.fontFamily,\n backgroundColor: theme.colors.background,\n color: theme.colors.text.light\n },\n card: {\n backgroundColor: theme.colors.surface,\n borderRadius: theme.borderRadius,\n padding: theme.spacing.sm,\n marginBottom: theme.spacing.sm,\n boxShadow: theme.shadows.medium,\n border: `1px solid ${theme.colors.secondary}`,\n transition: 'transform 0.3s ease'\n },\n input: {\n width: '100%',\n padding: theme.spacing.xs,\n marginBottom: theme.spacing.xs,\n borderRadius: theme.borderRadius,\n backgroundColor: theme.colors.secondary,\n color: theme.colors.text.light,\n border: 'none',\n fontSize: theme.typography.fontSizes.normal\n },\n button: {\n width: '100%',\n padding: theme.spacing.xs,\n backgroundColor: theme.colors.accent.blue,\n color: theme.colors.text.light,\n border: 'none',\n borderRadius: theme.borderRadius,\n cursor: 'pointer',\n fontSize: theme.typography.fontSizes.normal,\n fontWeight: 'bold',\n transition: 'background-color 0.3s ease'\n },\n navigationBar: {\n display: 'flex',\n justifyContent: 'center',\n padding: theme.spacing.sm,\n backgroundColor: theme.colors.secondary,\n position: 'sticky',\n top: 0,\n zIndex: 100,\n boxShadow: theme.shadows.soft\n }\n};\n\n// Google Maps API Key\nconst GOOGLE_MAPS_API_KEY = 'AIzaSyBOti4mM-6x9WDnZIjIeyEU21OpBXqWBgw';\n\n// Utility Functions\nfunction calculateDistance(lat1, lon1, lat2, lon2) {\n const R = 6371; // Radius of the earth in km\n const dLat = (lat2 - lat1) * Math.PI / 180;\n const dLon = (lon2 - lon1) * Math.PI / 180;\n const a = \n Math.sin(dLat/2) * Math.sin(dLat/2) +\n Math.cos(lat1 * Math.PI / 180) * Math.cos(lat2 * Math.PI / 180) * \n Math.sin(dLon/2) * Math.sin(dLon/2);\n const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));\n return R * c; // Distance in kilometers\n}\n\n// Geocoding Utility Function\nasync function geocodeLocation(location) {\n const algerianLocations = {\n 'alger': { lat: 36.7538, lng: 3.0588, region: 'Alger' },\n 'oran': { lat: 35.6969, lng: -0.6336, region: 'Oran' },\n 'constantine': { lat: 36.3643, lng: 6.6147, region: 'Constantine' },\n 'annaba': { lat: 36.8667, lng: 7.7556, region: 'Annaba' },\n 'tlemcen': { lat: 34.8889, lng: -1.3182, region: 'Tlemcen' },\n 'batna': { lat: 35.5556, lng: 6.1746, region: 'Batna' },\n 'blida': { lat: 36.5039, lng: 2.8302, region: 'Blida' },\n 'skikda': { lat: 36.8667, lng: 6.9000, region: 'Skikda' },\n 'setif': { lat: 36.1899, lng: 5.4142, region: 'Setif' }\n };\n\n const normalizedLocation = location.toLowerCase().trim();\n \n const matchedLocation = Object.entries(algerianLocations).find(\n ([city]) => city === normalizedLocation || normalizedLocation.includes(city)\n );\n\n if (matchedLocation) {\n return matchedLocation[1];\n }\n\n return { \n lat: 28.0339, \n lng: 1.6596, \n region: 'Algérie',\n message: 'Localisation approximative'\n };\n}\n\n// Emergency Veterinary Contacts\nconst EMERGENCY_VETERINARY_CONTACTS = [\n { \n name: \"Clinique Vétérinaire Alger Centre\", \n phone: \"+213 21 XX XX XX\", \n address: \"Alger, Centre-ville\",\n coordinates: { lat: 36.7538, lng: 3.0588 }\n },\n { \n name: \"Centre Vétérinaire Oran\", \n phone: \"+213 41 XX XX XX\", \n address: \"Oran, Ouest Algérien\",\n coordinates: { lat: 35.6969, lng: -0.6336 }\n },\n { \n name: \"Urgence Animale Constantine\", \n phone: \"+213 31 XX XX XX\", \n address: \"Constantine, Est Algérien\",\n coordinates: { lat: 36.3643, lng: 6.6147 }\n },\n { \n name: \"Clinique Vétérinaire Annaba\", \n phone: \"+213 38 XX XX XX\", \n address: \"Annaba, Nord-Est\",\n coordinates: { lat: 36.8667, lng: 7.7556 }\n },\n { \n name: \"Centre Vétérinaire Tlemcen\", \n phone: \"+213 43 XX XX XX\", \n address: \"Tlemcen, Ouest\",\n coordinates: { lat: 34.8889, lng: -1.3182 }\n }\n];\n\n// Cat Report Form Component\nfunction CatReportForm() {\n const [report, setReport] = useState({\n location: '',\n condition: '',\n description: '',\n contactNumber: ''\n });\n\n const handleSubmit = (e) => {\n e.preventDefault();\n alert(\"🐱 Rapport envoyé !\");\n console.log(\"Rapport:\", report);\n };\n\n return (\n

🐱 Signalement de Chat

\n \n

\n );\n}\n\n// Veterinary Contacts Component\nfunction VeterinaryContacts() {\n const mapRef = useRef(null);\n const [location, setLocation] = useState('');\n const [nearestVets, setNearestVets] = useState(EMERGENCY_VETERINARY_CONTACTS);\n const [searchRadius, setSearchRadius] = useState(50);\n const [locationCoords, setLocationCoords] = useState(null);\n const [locationFeedback, setLocationFeedback] = useState('');\n const [markers, setMarkers] = useState([]);\n\n // Load Google Maps Script\n useEffect(() => {\n const loadGoogleMapsScript = () => {\n if (window.google && window.google.maps) return;\n\n const script = document.createElement('script');\n script.src = `https://maps.googleapis.com/maps/api/js?key=${GOOGLE_MAPS_API_KEY}&libraries=places`;\n script.async = true;\n script.defer = true;\n\n script.onload = () => {\n // Script is loaded, but we'll initialize map when location is set\n };\n\n document.head.appendChild(script);\n };\n\n loadGoogleMapsScript();\n }, []);\n\n // Initialize or update map when location changes\n useEffect(() => {\n if (!locationCoords || !window.google || !window.google.maps) return;\n\n // Clear existing markers\n markers.forEach(marker => marker.setMap(null));\n\n // Create or update map\n const mapOptions = {\n center: { lat: locationCoords.lat, lng: locationCoords.lng },\n zoom: 12\n };\n\n const newMap = new window.google.maps.Map(mapRef.current, mapOptions);\n\n // Add location marker\n const locationMarker = new window.google.maps.Marker({\n position: { lat: locationCoords.lat, lng: locationCoords.lng },\n map: newMap,\n title: location,\n icon: {\n url: 'data:image/svg+xml;utf8,',\n scaledSize: new window.google.maps.Size(40, 40)\n }\n });\n\n // Add veterinary markers\n const newMarkers = nearestVets.map(vet => \n new window.google.maps.Marker({\n position: { lat: vet.coordinates.lat, lng: vet.coordinates.lng },\n map: newMap,\n title: vet.name,\n icon: {\n url: 'data:image/svg+xml;utf8,',\n scaledSize: new window.google.maps.Size(30, 30)\n }\n })\n );\n\n setMarkers([locationMarker, ...newMarkers]);\n }, [locationCoords, nearestVets, location]);\n\n // Find nearest vets based on location\n useEffect(() => {\n async function findNearestVets() {\n if (!locationCoords) {\n setNearestVets(EMERGENCY_VETERINARY_CONTACTS);\n setLocationFeedback('');\n return;\n }\n\n const filteredVets = EMERGENCY_VETERINARY_CONTACTS.filter(vet => {\n const distance = calculateDistance(\n locationCoords.lat, \n locationCoords.lng, \n vet.coordinates.lat, \n vet.coordinates.lng\n );\n return distance <= searchRadius;\n }).sort((a, b) => \n calculateDistance(\n locationCoords.lat, \n locationCoords.lng, \n a.coordinates.lat, \n a.coordinates.lng\n ) - \n calculateDistance(\n locationCoords.lat, \n locationCoords.lng, \n b.coordinates.lat, \n b.coordinates.lng\n )\n );\n\n setNearestVets(filteredVets);\n \n if (filteredVets.length === 0) {\n setLocationFeedback(`Aucun vétérinaire trouvé dans un rayon de ${searchRadius} km.`);\n } else {\n setLocationFeedback(`${filteredVets.length} vétérinaire(s) trouvé(s) près de ${location}`);\n }\n }\n\n findNearestVets();\n }, [locationCoords, searchRadius, location]);\n\n // Location input handler\n const handleLocationInput = async (inputLocation) => {\n setLocation(inputLocation);\n try {\n const coords = await geocodeLocation(inputLocation);\n setLocationCoords(coords);\n\n if (coords.message) {\n setLocationFeedback(coords.message);\n }\n } catch (error) {\n console.error(\"Geocoding error:\", error);\n setLocationCoords({ lat: 28.0339, lng: 1.6596 });\n setLocationFeedback('Localisation par défaut utilisée');\n }\n };\n\n return (\n

🏥 Contacts Urgence Vétérinaires

\n \n {/* Location Input */}\n

\n handleLocationInput(e.target.value)}\n style={styles.input}\n />\n {locationFeedback && (\n

\n {locationFeedback}\n

\n )}\n

\n \n {/* Search Radius Selector */}\n

\n \n Rayon de recherche : \n \n \n

\n\n {/* Google Maps Container */}\n {locationCoords && (\n

\n )}\n\n {/* Veterinary List */}\n {nearestVets.length > 0 ? (\n nearestVets.map((vet, index) => (\n

{vet.name}

📞 {vet.phone}

📍 {vet.address}

\n {locationCoords && (\n

\n 🚗 Distance: {calculateDistance(\n locationCoords.lat, \n locationCoords.lng, \n vet.coordinates.lat, \n vet.coordinates.lng\n ).toFixed(1)} km\n

\n )}\n

\n \n \n

\n ))\n ) : (\n

\n Aucun vétérinaire trouvé dans le rayon sélectionné.\n Essayez d'élargir votre recherche ou de vérifier l'orthographe.\n

\n )}\n

\n );\n}\n\n// Main App Component\nfunction App() {\n const [view, setView] = useState('report');\n\n return (\n

\n \n \n

\n\n {view === 'report' ? (\n \n ) : (\n \n )}\n

\n );\n}\n\n// Rendering Function\nfunction renderApp() {\n const rootElement = document.getElementById(\"root\");\n if (!rootElement) return;\n\n try {\n const root = ReactDOM.createRoot(rootElement);\n root.render(\n \n \n \n \n \n );\n } catch (error) {\n console.error(\"Rendering error:\", error);\n rootElement.innerHTML = `\n

Loading Error

${error.message}

\n `;\n }\n}\n\n// Run client-side rendering\nif (typeof document !== 'undefined') {\n document.readyState === 'loading'\n ? document.addEventListener('DOMContentLoaded', renderApp)\n : renderApp();\n}\n\n// Server Response Handler\nexport default async function server(request: Request): Promise {\n return new Response(`\n \n \n \n Réseau de Sauvetage des Chats - Algérie\n \n \n \n \n \n \n \n \n \n

\n \n \n \n \n \n `, {\n headers: { \n 'Content-Type': 'text/html',\n 'Cache-Control': 'no-cache, no-store, must-revalidate'\n }\n });\n}","deleted","label",[99],"permalink","https://www.val.town/x/bladesquad/thrillingAmaranthKiwi/code/main.tsx","extension","actionData","errors"]