// Configuration const LANGUAGE_CODE = "en-US"; const LANGUAGE = "en"; const dataset = "gpblog"; // Default dataset const customSeasonSlug = null; // Can be set via URL parameter const DEBUG = true; // Set to true to enable debug logs // Stages translations object for all supported languages const stagesLabels = { en: { "Practice": "Practice", "Qualification": "Qualification", "Race": "Race", "Sprint Race": "Sprint Race", "Sprint Shootout": "Sprint Shootout", "First Practice": "First Practice", "Second Practice": "Second Practice", "Third Practice": "Third Practice", "Last Practice": "Last Practice", "First Qualification": "First Qualification", "Second Qualification": "Second Qualification", "Third Qualification": "Third Qualification", "Sprint Shootout 1": "Sprint Shootout 1", "Sprint Shootout 2": "Sprint Shootout 2", "Sprint Shootout 3": "Sprint Shootout 3", // UI labels "upcoming_race": "Upcoming race", "overview": "Overview", "timezone_info": "Times are in your local timezone" }, nl: { "Practice": "Training", "Qualification": "Kwalificatie", "Race": "Race", "Sprint Race": "Sprint Race", "Sprint Shootout": "Sprint Shootout", "First Practice": "Eerste Training", "Second Practice": "Tweede Training", "Third Practice": "Derde Training", "Last Practice": "Laatste Training", "First Qualification": "Eerste Kwalificatie", "Second Qualification": "Tweede Kwalificatie", "Third Qualification": "Derde Kwalificatie", "Sprint Shootout 1": "Sprint Kwalificatie 1", "Sprint Shootout 2": "Sprint Kwalificatie 2", "Sprint Shootout 3": "Sprint Kwalificatie 3", // UI labels "upcoming_race": "Komende race", "overview": "Overzicht", "timezone_info": "Tijden zijn in je lokale tijdzone" }, fr: { "Practice": "Essais", "Qualification": "Qualification", "Race": "Course", "Sprint Race": "Course Sprint", "Sprint Shootout": "Sprint Shootout", "First Practice": "Essais Libres 1", "Second Practice": "Essais Libres 2", "Third Practice": "Essais Libres 3", "Last Practice": "Derniers Essais Libres", "First Qualification": "Première Qualification", "Second Qualification": "Deuxième Qualification", "Third Qualification": "Troisième Qualification", "Sprint Shootout 1": "Qualifications Sprint 1", "Sprint Shootout 2": "Qualifications Sprint 2", "Sprint Shootout 3": "Qualifications Sprint 3", // UI labels "upcoming_race": "Prochaine course", "overview": "Aperçu", "timezone_info": "Les horaires sont dans votre fuseau horaire local" }, de: { "Practice": "Training", "Qualification": "Qualifikation", "Race": "Rennen", "Sprint Race": "Sprint-Rennen", "Sprint Shootout": "Sprint-Shootout", "First Practice": "Erstes Training", "Second Practice": "Zweites Training", "Third Practice": "Drittes Training", "Last Practice": "Letztes Training", "First Qualification": "Erste Qualifikation", "Second Qualification": "Zweite Qualifikation", "Third Qualification": "Dritte Qualifikation", "Sprint Shootout 1": "Sprint-Qualifikation 1", "Sprint Shootout 2": "Sprint-Qualifikation 2", "Sprint Shootout 3": "Sprint-Qualifikation 3", // UI labels "upcoming_race": "Nächstes Rennen", "overview": "Übersicht", "timezone_info": "Zeiten sind in Ihrer lokalen Zeitzone" }, es: { "Practice": "Práctica", "Qualification": "Clasificación", "Race": "Carrera", "Sprint Race": "Carrera Sprint", "Sprint Shootout": "Sprint Shootout", "First Practice": "Primera Práctica", "Second Practice": "Segunda Práctica", "Third Practice": "Tercera Práctica", "Last Practice": "Última Práctica", "First Qualification": "Primera Clasificación", "Second Qualification": "Segunda Clasificación", "Third Qualification": "Tercera Clasificación", "Sprint Shootout 1": "Clasificación Sprint 1", "Sprint Shootout 2": "Clasificación Sprint 2", "Sprint Shootout 3": "Clasificación Sprint 3", // UI labels "upcoming_race": "Próxima carrera", "overview": "Resumen", "timezone_info": "Los horarios están en tu zona horaria local" }, it: { "Practice": "Prove", "Qualification": "Qualifiche", "Race": "Gara", "Sprint Race": "Gara Sprint", "Sprint Shootout": "Sprint Shootout", "First Practice": "Prime Prove", "Second Practice": "Seconde Prove", "Third Practice": "Terze Prove", "Last Practice": "Ultime Prove", "First Qualification": "Prima Qualifica", "Second Qualification": "Seconda Qualifica", "Third Qualification": "Terza Qualifica", "Sprint Shootout 1": "Qualifiche Sprint 1", "Sprint Shootout 2": "Qualifiche Sprint 2", "Sprint Shootout 3": "Qualifiche Sprint 3", // UI labels "upcoming_race": "Prossima gara", "overview": "Panoramica", "timezone_info": "Gli orari sono nel tuo fuso orario locale" }, pt: { "Practice": "Treino", "Qualification": "Qualificação", "Race": "Corrida", "Sprint Race": "Corrida Sprint", "Sprint Shootout": "Sprint Shootout", "First Practice": "Primeiro Treino", "Second Practice": "Segundo Treino", "Third Practice": "Terceiro Treino", "Last Practice": "Último Treino", "First Qualification": "Primeira Qualificação", "Second Qualification": "Segunda Qualificação", "Third Qualification": "Terceira Qualificação", "Sprint Shootout 1": "Qualificação Sprint 1", "Sprint Shootout 2": "Qualificação Sprint 2", "Sprint Shootout 3": "Qualificação Sprint 3", // UI labels "upcoming_race": "Próxima corrida", "overview": "Visão geral", "timezone_info": "Os horários estão no seu fuso horário local" }, "pt-br": { "Practice": "Treino", "Qualification": "Qualificação", "Race": "Corrida", "Sprint Race": "Corrida Sprint", "Sprint Shootout": "Sprint Shootout", "First Practice": "Primeiro Treino", "Second Practice": "Segundo Treino", "Third Practice": "Terceiro Treino", "Last Practice": "Último Treino", "First Qualification": "Primeira Qualificação", "Second Qualification": "Segunda Qualificação", "Third Qualification": "Terceira Qualificação", "Sprint Shootout 1": "Classificação Sprint 1", "Sprint Shootout 2": "Classificação Sprint 2", "Sprint Shootout 3": "Classificação Sprint 3", // UI labels "upcoming_race": "Próxima corrida", "overview": "Visão geral", "timezone_info": "Os horários estão no seu fuso horário local" }, da: { "Practice": "Træning", "Qualification": "Kvalifikation", "Race": "Løb", "Sprint Race": "Sprintløb", "Sprint Shootout": "Sprint Shootout", "First Practice": "Første Træning", "Second Practice": "Anden Træning", "Third Practice": "Tredje Træning", "Last Practice": "Sidste Træning", "First Qualification": "Første Kvalifikation", "Second Qualification": "Anden Kvalifikation", "Third Qualification": "Tredje Kvalifikation", "Sprint Shootout 1": "Sprint Kvalifikation 1", "Sprint Shootout 2": "Sprint Kvalifikation 2", "Sprint Shootout 3": "Sprint Kvalifikation 3", // UI labels "upcoming_race": "Kommende løb", "overview": "Oversigt", "timezone_info": "Tiderne er i din lokale tidszone" }, lt: { "Practice": "Treniruotė", "Qualification": "Kvalifikacija", "Race": "Lenktynės", "Sprint Race": "Sprint Lenktynės", "Sprint Shootout": "Sprint Shootout", "First Practice": "Pirmoji Treniruotė", "Second Practice": "Antroji Treniruotė", "Third Practice": "Trečioji Treniruotė", "Last Practice": "Paskutinė Treniruotė", "First Qualification": "Pirmoji Kvalifikacija", "Second Qualification": "Antroji Kvalifikacija", "Third Qualification": "Trečioji Kvalifikacija", "Sprint Shootout 1": "Sprinto Kvalifikacija 1", "Sprint Shootout 2": "Sprinto Kvalifikacija 2", "Sprint Shootout 3": "Sprinto Kvalifikacija 3", // UI labels "upcoming_race": "Artėjančios lenktynės", "overview": "Apžvalga", "timezone_info": "Laikai yra jūsų vietinėje laiko juostoje" } }; // Helper function for translations function getGpBlogDatasetTranslatedModel(model) { const translations = { track: `${LANGUAGE}/grandsprix`, calendar: `${LANGUAGE}/f1-calendar`, }; return translations[model] || model; } // Fetch the latest season if no custom season is provided async function getLatestSeason() { try { const response = await fetch( `https://dataset-service.newsifier.nl/api/v1/gpblog/Season/items/index?orderBy%5Bname%5D=desc&take=1` ); if (!response.ok) { throw new Error("Failed to fetch latest season"); } const data = await response.json(); return data.data[0]?.slug || null; } catch (error) { console.error("Error fetching latest season:", error); return null; } } // Fetch stages for a season async function fetchStages(seasonSlug) { try { const response = await fetch( `https://dataset-service.newsifier.nl/api/v1/gpblog/Stage/items/index?orderBy%5Bdate_time%5D=asc&where%5Bseason%5D%5Bslug%5D=${seasonSlug}&include%5Btrack%5D%5Binclude%5D%5Bcountry%5D=true` ); if (!response.ok) { throw new Error("Failed to fetch stages"); } const data = await response.json(); return data.data || []; } catch (error) { console.error("Error fetching stages:", error); return []; } } // Process stages data function processStages(stages) { // Get unique track IDs const tracksIds = [...new Set(stages.map(stage => stage.track_id))]; // Group stages by track const tracks = stages.reduce((acc, stage) => { const trackId = stage.track_id; if (!acc[trackId]) { acc[trackId] = { ...stage.track, stages: [], }; } acc[trackId].stages.push(stage); return acc; }, {}); return { tracksIds, tracks }; } // Find the upcoming race track ID function findUpcomingRaceTrackId(stages) { const now = new Date(); // First, find the earliest stage that's in the future const upcomingStage = stages.find(stage => new Date(stage.date_time) >= now); // If we found an upcoming stage, return its track_id if (upcomingStage) { return upcomingStage.track_id; } // If all races are in the past, return the first track as fallback return stages.length > 0 ? stages[0].track_id : null; } // Format date for display function formatDate(dateString, options) { return new Date(dateString).toLocaleString(LANGUAGE_CODE, options); } // Group stages by day function groupStagesByDay(stages) { return stages.reduce((acc, stage) => { const dayName = new Date(stage.date_time).toLocaleDateString(LANGUAGE_CODE, { weekday: "long", }); if (!acc[dayName]) { acc[dayName] = []; } acc[dayName].push(stage); return acc; }, {}); } // Render the F1 calendar function renderF1Calendar(tracksIds, tracks, upcomingTrackId, tagData) { if (!tracksIds.length || !upcomingTrackId) { document.querySelectorAll(".f1-calendar-container").forEach(target => { target.innerHTML = '

No F1 calendar data available

'; }); return; } // Get the upcoming race track const track = tracks[upcomingTrackId]; const tag = tagData.find((tag) => tag.model_id === track.id); const slug = tag?.slug || track.slug; const name = tag?.title || track.name; const translatedTrack = getGpBlogDatasetTranslatedModel("track"); // Group stages by day for the upcoming race const stagesByDay = groupStagesByDay(track.stages || []); // Create HTML for desktop schedule let desktopScheduleHTML = ""; Object.entries(stagesByDay).forEach(([dayName, dayStages]) => { if (dayStages.length > 0) { let stagesHTML = ""; // Get the date from the first stage in this day const date = new Date(dayStages[0].date_time); const formattedDate = `${String(date.getDate()).padStart(2, "0")}.${String( date.getMonth() + 1 ).padStart(2, "0")}.${String(date.getFullYear()).slice(-2)}`; dayStages.forEach(stage => { const stageTime = new Date(stage.date_time).toLocaleString(LANGUAGE_CODE, { hour: "2-digit", minute: "2-digit", }); // Translate stage name using stagesLabels if available const stageName = stagesLabels[LANGUAGE]?.[stage.name] || stage.name; stagesHTML += `

${stageName}

${stageTime}

`; }); desktopScheduleHTML += `

${dayName} ${formattedDate}

${stagesHTML}

`; } }); // Create HTML for mobile schedule let mobileScheduleHTML = ""; // Group stages by date for mobile view const stagesByDate = {}; track.stages.forEach(stage => { const currentDate = new Date(stage.date_time); const dateKey = `${currentDate.getFullYear()}-${currentDate.getMonth()}-${currentDate.getDate()}`; if (!stagesByDate[dateKey]) { stagesByDate[dateKey] = []; } stagesByDate[dateKey].push(stage); }); // Find the next upcoming stage const now = new Date(); let upcomingEvent = null; let upcomingDateKey = null; if (DEBUG) console.log(`F1 Calendar: Finding upcoming event. Current time: ${now.toLocaleString()}`); // Find the next upcoming event and its date key for (const [dateKey, stages] of Object.entries(stagesByDate)) { const sortedStages = [...stages].sort((a, b) => new Date(a.date_time) - new Date(b.date_time)); for (const stage of sortedStages) { const stageTime = new Date(stage.date_time); if (DEBUG) console.log(`F1 Calendar: Checking stage '${stage.name}' at ${stageTime.toLocaleString()}`); if (stageTime >= now) { upcomingEvent = stage; upcomingDateKey = dateKey; if (DEBUG) console.log(`F1 Calendar: Found upcoming event: '${stage.name}' (id: ${stage.id}) at ${stageTime.toLocaleString()}`); break; } } if (upcomingEvent) break; } // If no upcoming event, use the last event if (!upcomingEvent && Object.keys(stagesByDate).length > 0) { const lastDateKey = Object.keys(stagesByDate).sort().pop(); const lastStages = stagesByDate[lastDateKey]; upcomingEvent = lastStages[lastStages.length - 1]; upcomingDateKey = lastDateKey; if (DEBUG) console.log(`F1 Calendar: No upcoming events found, using last event: '${upcomingEvent.name}' (id: ${upcomingEvent.id})`); } let upcomingStageIndex = -1; // Render groups of stages by date for mobile Object.entries(stagesByDate).forEach(([dateKey, stages], dateIndex) => { // Get the date from the first stage in this group const date = new Date(stages[0].date_time); const formattedDate = `${String(date.getDate()).padStart(2, "0")}.${String( date.getMonth() + 1 ).padStart(2, "0")}.${String(date.getFullYear()).slice(-2)}`; // Get the day name, same as used in desktop view const dayName = date.toLocaleDateString(LANGUAGE_CODE, { weekday: "long", }); const isUpcomingDateGroup = dateKey === upcomingDateKey; if (DEBUG && isUpcomingDateGroup) { console.log(`F1 Calendar: Marking date group as upcoming: ${dayName} ${formattedDate}`); } mobileScheduleHTML += `

${dayName} ${formattedDate}

`; // Add all stages for this date stages.forEach((stage, stageIndex) => { const stageDateTime = new Date(stage.date_time).toLocaleString(LANGUAGE_CODE, { weekday: "short", hour: "2-digit", minute: "2-digit", }); // Translate stage name using stagesLabels if available const stageName = stagesLabels[LANGUAGE]?.[stage.name] || stage.name; const isUpcomingStage = upcomingEvent && stage.id === upcomingEvent.id; if (isUpcomingStage) { upcomingStageIndex = stageIndex; if (DEBUG) console.log(`F1 Calendar: Marking stage as upcoming: '${stageName}' at index ${stageIndex}`); } mobileScheduleHTML += `

${stageName}

${stageDateTime}

`; }); // Close the date group container mobileScheduleHTML += `

`; }); // Create the main HTML const html = ` ${stagesLabels[LANGUAGE]?.upcoming_race || "Komende race"}

${desktopScheduleHTML}

${mobileScheduleHTML}

${stagesLabels[LANGUAGE]?.timezone_info || "Tijden zijn in je lokale tijdzone"}

`; document.querySelectorAll(".f1-calendar-container").forEach(target => { // Check if already initialized to prevent duplicate initialization if (target.classList.contains('f1-calendar-initialized')) { return; } target.classList.add('f1-calendar-initialized'); target.innerHTML = html; // Completely rewritten horizontal scrolling to upcoming event const initScrollToUpcoming = () => { if (DEBUG) console.log(`F1 Calendar: Initializing scroll to upcoming event`); // Use requestAnimationFrame to ensure DOM is fully rendered const performScroll = () => { if (DEBUG) console.log(`F1 Calendar: Performing scroll operation`); // Find the upcoming event element const upcomingStage = target.querySelector('[data-upcoming-stage="true"]'); if (DEBUG) { console.log(`F1 Calendar: Upcoming stage found: ${!!upcomingStage}`); // Debug all events const allEvents = target.querySelectorAll('.mobile-event'); console.log(`F1 Calendar: Total mobile events: ${allEvents.length}`); allEvents.forEach((event, index) => { const hasUpcoming = event.hasAttribute('data-upcoming-stage'); console.log(`F1 Calendar: Event ${index} has upcoming attribute: ${hasUpcoming}`); }); } if (!upcomingStage) { if (DEBUG) console.log(`F1 Calendar: No upcoming stage found, cannot scroll`); return false; } // Find the scrollable container that contains this event let scrollContainer = upcomingStage.closest('.mobile-stages-container'); if (DEBUG) { console.log(`F1 Calendar: Scroll container found: ${!!scrollContainer}`); // Debug the container hierarchy if (scrollContainer) { console.log(`F1 Calendar: Container class list:`, scrollContainer.classList.toString()); console.log(`F1 Calendar: Container computed style overflow-x:`, getComputedStyle(scrollContainer).overflowX); console.log(`F1 Calendar: Container computed style white-space:`, getComputedStyle(scrollContainer).whiteSpace); // Check all children to see the layout const children = scrollContainer.children; console.log(`F1 Calendar: Container has ${children.length} direct children`); let totalChildrenWidth = 0; for (let i = 0; i < children.length; i++) { const child = children[i]; const childWidth = child.offsetWidth; totalChildrenWidth += childWidth; console.log(`F1 Calendar: Child ${i} width: ${childWidth}px, class: ${child.className}`); } console.log(`F1 Calendar: Total children width: ${totalChildrenWidth}px`); } } if (!scrollContainer) { if (DEBUG) console.log(`F1 Calendar: No scroll container found`); return false; } // Check if this container actually has horizontal scrolling const hasHorizontalScroll = scrollContainer.scrollWidth > scrollContainer.clientWidth; if (!hasHorizontalScroll) { if (DEBUG) console.log(`F1 Calendar: Current container doesn't have horizontal scroll, searching for alternative...`); // Look for a parent container that has horizontal scrolling let parent = upcomingStage.parentElement; let foundScrollableParent = null; while (parent && !foundScrollableParent) { if (parent.scrollWidth > parent.clientWidth) { foundScrollableParent = parent; if (DEBUG) console.log(`F1 Calendar: Found scrollable parent:`, parent.className); break; } parent = parent.parentElement; } if (foundScrollableParent) { scrollContainer = foundScrollableParent; } else { if (DEBUG) console.log(`F1 Calendar: No scrollable container found in hierarchy`); return false; } } // Get current scroll position and container dimensions const containerWidth = scrollContainer.clientWidth; const containerScrollWidth = scrollContainer.scrollWidth; // Get the position of the upcoming event relative to its container const eventRect = upcomingStage.getBoundingClientRect(); const containerRect = scrollContainer.getBoundingClientRect(); const eventOffsetInContainer = upcomingStage.offsetLeft; const eventWidth = upcomingStage.offsetWidth; if (DEBUG) { console.log(`F1 Calendar: Container width: ${containerWidth}px`); console.log(`F1 Calendar: Container scroll width: ${containerScrollWidth}px`); console.log(`F1 Calendar: Event offset in container: ${eventOffsetInContainer}px`); console.log(`F1 Calendar: Event width: ${eventWidth}px`); console.log(`F1 Calendar: Event rect:`, eventRect); console.log(`F1 Calendar: Container rect:`, containerRect); } // Calculate the scroll position to center the event const targetScrollLeft = eventOffsetInContainer - (containerWidth / 2) + (eventWidth / 2); // Ensure scroll position is within bounds const maxScrollLeft = containerScrollWidth - containerWidth; const finalScrollLeft = Math.max(0, Math.min(targetScrollLeft, maxScrollLeft)); if (DEBUG) { console.log(`F1 Calendar: Target scroll left: ${targetScrollLeft}px`); console.log(`F1 Calendar: Max scroll left: ${maxScrollLeft}px`); console.log(`F1 Calendar: Final scroll left: ${finalScrollLeft}px`); console.log(`F1 Calendar: Current scroll left: ${scrollContainer.scrollLeft}px`); } // Apply the scroll try { // Try smooth scrolling first scrollContainer.scrollTo({ left: finalScrollLeft, behavior: 'smooth' }); // Fallback for immediate scrolling setTimeout(() => { if (Math.abs(scrollContainer.scrollLeft - finalScrollLeft) > 5) { scrollContainer.scrollLeft = finalScrollLeft; if (DEBUG) console.log(`F1 Calendar: Applied fallback scroll: ${scrollContainer.scrollLeft}px`); } }, 1000); if (DEBUG) { setTimeout(() => { console.log(`F1 Calendar: Final scroll position after 300ms: ${scrollContainer.scrollLeft}px`); }, 3000); } return true; } catch (error) { if (DEBUG) console.error(`F1 Calendar: Error during scroll:`, error); return false; } }; // Try scrolling with multiple timing strategies let attempts = 0; const maxAttempts = 5; const tryScroll = () => { attempts++; if (DEBUG) console.log(`F1 Calendar: Scroll attempt ${attempts}/${maxAttempts}`); const success = performScroll(); if (!success && attempts < maxAttempts) { // Retry with exponential backoff const delay = Math.min(100 * Math.pow(2, attempts - 1), 1000); if (DEBUG) console.log(`F1 Calendar: Retrying in ${delay}ms`); setTimeout(tryScroll, delay); } }; // Start with requestAnimationFrame for better timing requestAnimationFrame(() => { requestAnimationFrame(() => { tryScroll(); }); }); }; // Initialize scrolling initScrollToUpcoming(); }); } // Main function to initialize the calendar async function initF1Calendar() { // Check if there are any uninitialized calendar containers const containers = document.querySelectorAll(".f1-calendar-container:not(.f1-calendar-initialized)"); if (!containers.length) { return; } try { // Get season slug let seasonSlug = customSeasonSlug; if (!seasonSlug) { seasonSlug = await getLatestSeason(); } if (!seasonSlug) { throw new Error("No season found"); } // Fetch stages for the season const stages = await fetchStages(seasonSlug); if (!stages.length) { throw new Error("No stages found for this season"); } // Find the upcoming race track ID const upcomingTrackId = findUpcomingRaceTrackId(stages); // Process the stages data const { tracksIds, tracks } = processStages(stages); const tagData = await getCollectionItemsTags( dataset, "grandsprix", [upcomingTrackId] ); // Render the calendar renderF1Calendar(tracksIds, tracks, upcomingTrackId, tagData); } catch (error) { console.error("Error initializing F1 calendar:", error); document.querySelectorAll(".f1-calendar-container:not(.f1-calendar-initialized)").forEach(container => { container.classList.add('f1-calendar-initialized'); container.innerHTML = `

Error loading F1 calendar: ${error.message}

`; }); } } const getCollectionItemsTags = async (dataset, collection, ids) => { try { const res = await fetch(`https://cloud1-service.newsifier.nl/api/v2/tag/dataset/${dataset}/${collection}?ids=${ids.join(',')}`, { headers: { "Content-Type": "application/json", "x-tenant": `gpblog.com-${LANGUAGE}`, "accept-language": LANGUAGE, }, }); const data = await res.json(); return data.data; } catch (err) { return []; } }; initF1Calendar()

Pos.	Driver	Team
1	Alexander Albon Alexander Albon	WilliamsWIL
2	Fernando Alonso Fernando Alonso	Aston MartinAST
3	Kimi Antonelli Kimi Antonelli	MercedesMER
4	Oliver Bearman Oliver Bearman	HaasHAA
5	Gabriel Bortoleto Gabriel Bortoleto	AudiAUD
6	Valtteri Bottas Valtteri Bottas	CadillacCAD
7	Franco Colapinto Franco Colapinto	AlpineALP
8	Pierre Gasly Pierre Gasly	AlpineALP
9	Isack Hadjar Isack Hadjar	Red Bull RacingRBR
10	Lewis Hamilton Lewis Hamilton	FerrariFER
11	Nico Hulkenberg Nico Hulkenberg	AudiAUD
12	Liam Lawson Liam Lawson	Racing BullsRCB
13	Charles Leclerc Charles Leclerc	FerrariFER
14	Arvid Lindblad Arvid Lindblad	Racing BullsRCB
15	Lando Norris Lando Norris	McLarenMCL
16	Esteban Ocon Esteban Ocon	HaasHAA
17	Sergio Perez Sergio Perez	CadillacCAD
18	Oscar Piastri Oscar Piastri	McLarenMCL
19	George Russell George Russell	MercedesMER
20	Carlos Sainz Carlos Sainz	WilliamsWIL
21	Lance Stroll Lance Stroll	Aston MartinAST
22	Max Verstappen Max Verstappen	Red Bull RacingRBR

This is the FIA showcase car for 2026 season: pictures from all angles!

byEstéban den Toom

Front view

Side view

Photo diagonally from front

Photo diagonally from behind

FIA showcase plans for new F1 regulations in 2026: This is what will change

First AI generated F1 trophy to debut in Canada this weekend

Welcome to the new GPblog!

Ducati 'slapped in the face' by Aprilia according to team boss

Newey drops bold claim about the AMR26 despite engine struggles

Russell reacts boldly to major F1 predictions as 2026 season kicks off

Stroll brutally honest on Aston Martin woes ahead of Australian GP: ‘It’s sh*t'

Formula 1 could go a month without races if Bahrain and Saudi Arabia are cancelled

Herta challenges Cadillac ‘top 10’ F2 target: ‘My goal is to win’

MotoGP26 video game release date revealed in new cinematic trailer

CAREERS: GPblog Is looking for new talent for the 2026 Formula 1 season

Welcome to the new GPblog!

Ducati 'slapped in the face' by Aprilia according to team boss

Newey drops bold claim about the AMR26 despite engine struggles

Popular on GPBlog

Season

FIA showcase plans for new F1 regulations in 2026: This is what will change

First AI generated F1 trophy to debut in Canada this weekend