From a7c98c58baf6ebf999273d4742f40f34a9c00238 Mon Sep 17 00:00:00 2001 From: Hokeun Kim Date: Wed, 26 Nov 2025 12:00:05 -0700 Subject: [PATCH 1/9] Add template files for Events tab. --- docusaurus.config.ts | 1 + src/components/Events/events.tsx | 46 ++++++ src/components/Events/index.tsx | 201 ++++++++++++++++++++++++ src/components/Events/styles.module.css | 126 +++++++++++++++ src/pages/events.tsx | 3 + 5 files changed, 377 insertions(+) create mode 100644 src/components/Events/events.tsx create mode 100644 src/components/Events/index.tsx create mode 100644 src/components/Events/styles.module.css create mode 100644 src/pages/events.tsx diff --git a/docusaurus.config.ts b/docusaurus.config.ts index 39d46c65d..2f6e72d25 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -84,6 +84,7 @@ const config: Config = { {to: '/blog', label: 'Blog', position: 'left'}, {to: '/research', label: 'Research', position: 'left'}, {to: '/community', label: 'Community', position: 'left'}, + {to: '/events', label: 'Events', position: 'left'}, { type: 'docsVersionDropdown', position: 'right', diff --git a/src/components/Events/events.tsx b/src/components/Events/events.tsx new file mode 100644 index 000000000..92f719254 --- /dev/null +++ b/src/components/Events/events.tsx @@ -0,0 +1,46 @@ +export interface Event { + title: string; + date: string; + endDate?: string; + location: string; + description: string; + link?: string; + type: "conference" | "workshop" | "meetup" | "webinar" | "hackathon"; + isUpcoming: boolean; +} + +// Add your events here +// Events are automatically sorted by date +export const events: Event[] = [ + // Example events - replace with actual events + // { + // title: "Lingua Franca Workshop 2025", + // date: "2025-03-15", + // endDate: "2025-03-16", + // location: "UC Berkeley, CA", + // description: "A two-day workshop on reactor-oriented programming with Lingua Franca.", + // link: "https://example.com/workshop", + // type: "workshop", + // isUpcoming: true, + // }, +]; + +// Helper to sort events by date +export const sortEventsByDate = (eventList: Event[], ascending = true): Event[] => { + return [...eventList].sort((a, b) => { + const dateA = new Date(a.date).getTime(); + const dateB = new Date(b.date).getTime(); + return ascending ? dateA - dateB : dateB - dateA; + }); +}; + +export const upcomingEvents = sortEventsByDate( + events.filter((e) => e.isUpcoming), + true +); + +export const pastEvents = sortEventsByDate( + events.filter((e) => !e.isUpcoming), + false +); + diff --git a/src/components/Events/index.tsx b/src/components/Events/index.tsx new file mode 100644 index 000000000..0bfc5e4d1 --- /dev/null +++ b/src/components/Events/index.tsx @@ -0,0 +1,201 @@ +import clsx from "clsx"; + +import Translate from "@docusaurus/Translate"; +import Layout from "@theme/Layout"; +import Heading from "@theme/Heading"; +import Link from "@docusaurus/Link"; + +import { Event, upcomingEvents, pastEvents } from "./events"; +import styles from "./styles.module.css"; + +// Calendar icon +const CalendarIcon = () => ( + + + + + + +); + +// Location pin icon +const LocationIcon = () => ( + + + + +); + +// Empty calendar icon +const EmptyCalendarIcon = () => ( + + + + + + +); + +const formatDate = (dateStr: string, endDateStr?: string): string => { + const options: Intl.DateTimeFormatOptions = { + year: "numeric", + month: "long", + day: "numeric", + }; + const startDate = new Date(dateStr).toLocaleDateString("en-US", options); + + if (endDateStr) { + const endDate = new Date(endDateStr).toLocaleDateString("en-US", options); + return `${startDate} - ${endDate}`; + } + + return startDate; +}; + +const EventCard = ({ event }: { event: Event }) => { + const typeClassName = styles[event.type] || ""; + + return ( +
+
+
+
+ + {event.type} + + + {event.link ? ( + {event.title} + ) : ( + event.title + )} + +
+
+
+
+

{event.description}

+
+ + {formatDate(event.date, event.endDate)} + + + {event.location} + +
+
+ {event.link && ( +
+ + Learn More + +
+ )} +
+ ); +}; + +const EmptyState = ({ message }: { message: string }) => ( +
+ +

{message}

+
+); + +export default function Events(): JSX.Element { + return ( + + {/* Hero Section */} +
+
+ + Events + +

+ + Join us at conferences, workshops, and meetups to learn more about + Lingua Franca and connect with the community. + +

+
+
+ + {/* Upcoming Events */} +
+
+ + Upcoming Events + + {upcomingEvents.length > 0 ? ( +
+
+ {upcomingEvents.map((event, idx) => ( + + ))} +
+
+ ) : ( + + )} +
+
+ + {/* Past Events */} +
+
+ + Past Events + + {pastEvents.length > 0 ? ( +
+
+ {pastEvents.map((event, idx) => ( + + ))} +
+
+ ) : ( + + )} +
+
+ + ); +} + diff --git a/src/components/Events/styles.module.css b/src/components/Events/styles.module.css new file mode 100644 index 000000000..f6818267f --- /dev/null +++ b/src/components/Events/styles.module.css @@ -0,0 +1,126 @@ +/** + * Events page styles + */ + +.eventCard { + border-left: 4px solid var(--ifm-color-primary); + transition: transform 0.2s ease, box-shadow 0.2s ease; +} + +.eventCard:hover { + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); +} + +[data-theme="dark"] .eventCard:hover { + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); +} + +.eventType { + display: inline-block; + padding: 2px 10px; + border-radius: 12px; + font-size: 0.75rem; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.5px; +} + +.conference { + background-color: #e3f2fd; + color: #1565c0; +} + +[data-theme="dark"] .conference { + background-color: #1565c0; + color: #e3f2fd; +} + +.workshop { + background-color: #f3e5f5; + color: #7b1fa2; +} + +[data-theme="dark"] .workshop { + background-color: #7b1fa2; + color: #f3e5f5; +} + +.meetup { + background-color: #e8f5e9; + color: #2e7d32; +} + +[data-theme="dark"] .meetup { + background-color: #2e7d32; + color: #e8f5e9; +} + +.webinar { + background-color: #fff3e0; + color: #ef6c00; +} + +[data-theme="dark"] .webinar { + background-color: #ef6c00; + color: #fff3e0; +} + +.hackathon { + background-color: #fce4ec; + color: #c2185b; +} + +[data-theme="dark"] .hackathon { + background-color: #c2185b; + color: #fce4ec; +} + +.eventMeta { + display: flex; + flex-wrap: wrap; + gap: 16px; + margin-top: 8px; + font-size: 0.9rem; + color: var(--ifm-color-emphasis-700); +} + +.eventMeta svg { + margin-right: 4px; + vertical-align: middle; +} + +.emptyState { + text-align: center; + padding: 60px 20px; + color: var(--ifm-color-emphasis-600); +} + +.emptyState svg { + margin-bottom: 16px; + opacity: 0.5; +} + +.heroSection { + background: linear-gradient(135deg, var(--ifm-color-primary-darker) 0%, var(--ifm-color-primary) 100%); + color: white; + padding: 60px 0; + text-align: center; +} + +[data-theme="dark"] .heroSection { + background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); +} + +.heroTitle { + color: white; + margin-bottom: 16px; +} + +.heroSubtitle { + opacity: 0.9; + max-width: 600px; + margin: 0 auto; + font-size: 1.1rem; +} + diff --git a/src/pages/events.tsx b/src/pages/events.tsx new file mode 100644 index 000000000..4f1495983 --- /dev/null +++ b/src/pages/events.tsx @@ -0,0 +1,3 @@ +import Events from "@site/src/components/Events"; +export default Events; + From 5c21af7d66e184d2c18b61a687644439ffd7f6a1 Mon Sep 17 00:00:00 2001 From: Hokeun Kim Date: Wed, 26 Nov 2025 14:28:48 -0700 Subject: [PATCH 2/9] Add more events pages. --- src/components/Events/events.tsx | 45 ++- src/components/Events/index.tsx | 36 ++- src/pages/events/esweek-2021-tutorial.tsx | 339 ++++++++++++++++++++++ src/pages/events/event-page.module.css | 170 +++++++++++ src/pages/events/recps-2026.tsx | 146 ++++++++++ 5 files changed, 722 insertions(+), 14 deletions(-) create mode 100644 src/pages/events/esweek-2021-tutorial.tsx create mode 100644 src/pages/events/event-page.module.css create mode 100644 src/pages/events/recps-2026.tsx diff --git a/src/components/Events/events.tsx b/src/components/Events/events.tsx index 92f719254..78e0859c4 100644 --- a/src/components/Events/events.tsx +++ b/src/components/Events/events.tsx @@ -7,22 +7,45 @@ export interface Event { link?: string; type: "conference" | "workshop" | "meetup" | "webinar" | "hackathon"; isUpcoming: boolean; + isExternal?: boolean; // true if link goes to external site } // Add your events here // Events are automatically sorted by date export const events: Event[] = [ - // Example events - replace with actual events - // { - // title: "Lingua Franca Workshop 2025", - // date: "2025-03-15", - // endDate: "2025-03-16", - // location: "UC Berkeley, CA", - // description: "A two-day workshop on reactor-oriented programming with Lingua Franca.", - // link: "https://example.com/workshop", - // type: "workshop", - // isUpcoming: true, - // }, + // Upcoming Events + { + title: "ReCPS: Workshop on Reactive Cyber-Physical Systems", + date: "2026-03-31", + location: "DATE 2026 Conference, Valencia, Spain", + description: + "Workshop on Reactive Cyber-Physical Systems: Design, Simulation, and Coordination. Co-located with the Design, Automation and Test in Europe (DATE) Conference 2026.", + link: "/events/recps-2026", + type: "workshop", + isUpcoming: true, + }, + // Past Events + { + title: "TCRS Workshop Series", + date: "2024-01-01", + location: "Various Locations", + description: + "Workshop series on Timing Centric Reactive Software, exploring reactor-oriented programming and time-sensitive applications.", + link: "https://www.tcrs.io/", + type: "workshop", + isUpcoming: false, + isExternal: true, + }, + { + title: "Lingua Franca Tutorial at ESWEEK 2021", + date: "2021-10-08", + location: "Online (EMSOFT Conference)", + description: + "A comprehensive tutorial introducing Lingua Franca, a polyglot coordination language for concurrent and time-sensitive applications. Part of the Embedded Systems Week (ESWEEK) 2021.", + link: "/events/esweek-2021-tutorial", + type: "workshop", + isUpcoming: false, + }, ]; // Helper to sort events by date diff --git a/src/components/Events/index.tsx b/src/components/Events/index.tsx index 0bfc5e4d1..64ae2b671 100644 --- a/src/components/Events/index.tsx +++ b/src/components/Events/index.tsx @@ -79,8 +79,30 @@ const formatDate = (dateStr: string, endDateStr?: string): string => { return startDate; }; +// External link icon +const ExternalLinkIcon = () => ( + + + + + +); + const EventCard = ({ event }: { event: Event }) => { const typeClassName = styles[event.type] || ""; + const linkProps = event.isExternal + ? { target: "_blank", rel: "noopener noreferrer" } + : {}; return (
@@ -92,7 +114,10 @@ const EventCard = ({ event }: { event: Event }) => { {event.link ? ( - {event.title} + + {event.title} + {event.isExternal && } + ) : ( event.title )} @@ -113,8 +138,13 @@ const EventCard = ({ event }: { event: Event }) => {
{event.link && (
- - Learn More + + {event.isExternal ? "Visit Website" : "Learn More"} + {event.isExternal && }
)} diff --git a/src/pages/events/esweek-2021-tutorial.tsx b/src/pages/events/esweek-2021-tutorial.tsx new file mode 100644 index 000000000..846631cf6 --- /dev/null +++ b/src/pages/events/esweek-2021-tutorial.tsx @@ -0,0 +1,339 @@ +import clsx from "clsx"; +import Layout from "@theme/Layout"; +import Heading from "@theme/Heading"; +import Link from "@docusaurus/Link"; + +import styles from "./event-page.module.css"; + +interface VideoSection { + title: string; + description: string; + videoUrl: string; + topics: { name: string; timestamp: string; url: string }[]; +} + +const videoSections: VideoSection[] = [ + { + title: "Part I: Introduction", + description: + "This part briefly describes the background of the project and explains how to get started with the software.", + videoUrl: + "https://www.youtube.com/watch?v=7vkhX5tS_oI&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=1", + topics: [ + { + name: "Introduction", + timestamp: "0:00", + url: "https://www.youtube.com/watch?v=7vkhX5tS_oI&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=1&t=0s", + }, + { + name: "Motivation", + timestamp: "1:01", + url: "https://www.youtube.com/watch?v=7vkhX5tS_oI&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=1&t=61s", + }, + { + name: "Overview of this tutorial", + timestamp: "3:05", + url: "https://www.youtube.com/watch?v=7vkhX5tS_oI&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=1&t=185s", + }, + { + name: "History of the project", + timestamp: "11:08", + url: "https://www.youtube.com/watch?v=7vkhX5tS_oI&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=1&t=668s", + }, + { + name: "Participating", + timestamp: "14:57", + url: "https://www.youtube.com/watch?v=7vkhX5tS_oI&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=1&t=897s", + }, + { + name: "Getting started", + timestamp: "15:25", + url: "https://www.youtube.com/watch?v=7vkhX5tS_oI&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=1&t=925s", + }, + { + name: "Native releases (Epoch IDE and lfc)", + timestamp: "17:43", + url: "https://www.youtube.com/watch?v=7vkhX5tS_oI&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=1&t=1063s", + }, + { + name: "Virtual Machine with LF pre-installed", + timestamp: "21:51", + url: "https://www.youtube.com/watch?v=7vkhX5tS_oI&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=1&t=1311s", + }, + ], + }, + { + title: "Part II: Hello World", + description: + "This part introduces the language with a simple example.", + videoUrl: + "https://www.youtube.com/watch?v=GNwaf4OpfPM&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=2", + topics: [ + { + name: "Open Epoch and create a project", + timestamp: "0:00", + url: "https://www.youtube.com/watch?v=GNwaf4OpfPM&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=2&t=0s", + }, + { + name: "Hello World", + timestamp: "1:44", + url: "https://www.youtube.com/watch?v=GNwaf4OpfPM&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=2&t=104s", + }, + { + name: "Adding a timer", + timestamp: "4:44", + url: "https://www.youtube.com/watch?v=GNwaf4OpfPM&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=2&t=284s", + }, + ], + }, + { + title: "Part III: Target Languages", + description: + "This part describes how different target languages work with Lingua Franca.", + videoUrl: + "https://www.youtube.com/watch?v=k0LtpH9VFCE&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=3", + topics: [], + }, + { + title: "Part IV: Basic Concepts", + description: + "This part covers fundamental concepts including composing reactors, parameters, state variables, and physical actions.", + videoUrl: + "https://www.youtube.com/watch?v=tl3F_jgc248&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=4", + topics: [], + }, + { + title: "Part V: Concurrency", + description: + "This part focuses on how the language expresses concurrency, exploits multicore, and supports distributed execution.", + videoUrl: + "https://www.youtube.com/watch?v=MoTf8L0jOD0&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=5", + topics: [ + { + name: "Introduction", + timestamp: "0:00", + url: "https://www.youtube.com/watch?v=MoTf8L0jOD0&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=5&t=0s", + }, + { + name: "Banks and Multiports", + timestamp: "0:39", + url: "https://www.youtube.com/watch?v=MoTf8L0jOD0&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=5&t=39s", + }, + { + name: "Utilizing Multicore", + timestamp: "9:29", + url: "https://www.youtube.com/watch?v=MoTf8L0jOD0&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=5&t=569s", + }, + { + name: "Tracing", + timestamp: "17:49", + url: "https://www.youtube.com/watch?v=MoTf8L0jOD0&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=5&t=1069s", + }, + { + name: "Performance", + timestamp: "23:40", + url: "https://www.youtube.com/watch?v=MoTf8L0jOD0&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=5&t=1420s", + }, + { + name: "Federated Execution", + timestamp: "29:25", + url: "https://www.youtube.com/watch?v=MoTf8L0jOD0&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=5&t=1765s", + }, + ], + }, + { + title: "Part VI: Research Overview", + description: + "This part focuses on a few of the research projects that have been stimulated by the Lingua Franca project.", + videoUrl: + "https://www.youtube.com/watch?v=afJowM35YHg&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=6", + topics: [ + { + name: "Introduction", + timestamp: "0:00", + url: "https://www.youtube.com/watch?v=afJowM35YHg&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=6&t=0s", + }, + { + name: "AUTOSAR", + timestamp: "6:15", + url: "https://www.youtube.com/watch?v=afJowM35YHg&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=6&t=375s", + }, + { + name: "Autoware/Carla", + timestamp: "14:27", + url: "https://www.youtube.com/watch?v=afJowM35YHg&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=6&t=867s", + }, + { + name: "Bare Iron Platforms", + timestamp: "27:43", + url: "https://www.youtube.com/watch?v=afJowM35YHg&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=6&t=1663s", + }, + { + name: "Modal Models", + timestamp: "34:36", + url: "https://www.youtube.com/watch?v=afJowM35YHg&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=6&t=2076s", + }, + { + name: "Automated Verification", + timestamp: "40:32", + url: "https://www.youtube.com/watch?v=afJowM35YHg&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=6&t=2432s", + }, + { + name: "Secure Federated Execution", + timestamp: "47:57", + url: "https://www.youtube.com/watch?v=afJowM35YHg&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=6&t=2877s", + }, + { + name: "LF Language Server", + timestamp: "54:07", + url: "https://www.youtube.com/watch?v=afJowM35YHg&list=PL4zzL7roKtfXyKE3k8lOwPub9YEjulS4o&index=6&t=3247s", + }, + ], + }, +]; + +const VideoCard = ({ section }: { section: VideoSection }) => ( +
+
+ {section.title} +
+
+

{section.description}

+ {section.topics.length > 0 && ( +
+ Topics covered: +
    + {section.topics.map((topic, idx) => ( +
  • + + {topic.name} ({topic.timestamp}) + +
    • + ))} +
+
+ )} +
+
+ + Watch Video + +
+
+); + +export default function ESWEEKTutorial(): JSX.Element { + return ( + + {/* Hero Section */} +
+
+
Past Event
+ + Lingua Franca Tutorial + +

+ EMSOFT Conference at Embedded Systems Week (ESWEEK) 2021 +

+
+ 📅 October 8, 2021 + 📍 Online +
+
+
+ + {/* Overview Section */} +
+
+
+
+ About This Tutorial +

+ Lingua Franca (LF) is a polyglot coordination language for + concurrent and possibly time-sensitive applications ranging from + low-level embedded code to distributed cloud and edge + applications. This tutorial was offered on October 8, 2021, as + part of the EMSOFT conference at ESWEEK (Embedded Systems Week). +

+

+ The complete tutorial is available as a{" "} + + video playlist on YouTube + + , organized into six segments covering everything from basic + concepts to advanced research topics. +

+ +
+ Quick Links +
    +
  • + + Complete Video Playlist + +
    • +
  • + + Original Tutorial Wiki Page + +
    • +
  • + Current Lingua Franca Documentation +
    • +
+
+
+
+
+
+ + {/* Video Sections */} +
+
+ + Tutorial Videos + +
+
+ {videoSections.map((section, idx) => ( + + ))} +
+
+
+
+ + {/* Call to Action */} +
+
+ Ready to Get Started? +

+ Check out our up-to-date documentation and start building with + Lingua Franca today. +

+
+ + Install Lingua Franca + + + Read the Docs + +
+
+
+ + ); +} + diff --git a/src/pages/events/event-page.module.css b/src/pages/events/event-page.module.css new file mode 100644 index 000000000..c92ab4064 --- /dev/null +++ b/src/pages/events/event-page.module.css @@ -0,0 +1,170 @@ +/** + * Shared styles for individual event pages + */ + +.heroSection { + background: linear-gradient( + 135deg, + var(--ifm-color-primary-darker) 0%, + var(--ifm-color-primary) 100% + ); + color: white; + padding: 80px 0; + text-align: center; +} + +[data-theme="dark"] .heroSection { + background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); +} + +.heroTitle { + color: white; + margin-bottom: 8px; + font-size: 3rem; +} + +.heroSubtitle { + opacity: 0.95; + max-width: 700px; + margin: 0 auto 24px; + font-size: 1.25rem; +} + +.eventBadge { + display: inline-block; + padding: 4px 16px; + border-radius: 20px; + font-size: 0.85rem; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.5px; + margin-bottom: 16px; + background-color: rgba(255, 255, 255, 0.2); + color: white; +} + +.eventBadge.upcoming { + background-color: #4caf50; +} + +.eventMeta { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 24px; + margin-top: 24px; + font-size: 1.1rem; +} + +.eventMeta span { + display: flex; + align-items: center; + gap: 6px; +} + +.heroLink { + color: white; + text-decoration: underline; +} + +.heroLink:hover { + color: rgba(255, 255, 255, 0.85); +} + +/* Video card styles */ +.videoCard { + border-left: 4px solid var(--ifm-color-primary); +} + +.topicList { + margin-top: 16px; +} + +.topicList ul { + margin-top: 8px; + margin-bottom: 0; +} + +.topicList li { + margin-bottom: 4px; +} + +/* Resource links */ +.resourceLinks { + margin-top: 32px; + padding: 24px; + background-color: var(--ifm-color-emphasis-100); + border-radius: 8px; +} + +.resourceLinks ul { + margin-bottom: 0; +} + +/* CTA buttons */ +.ctaButtons { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 16px; + margin-top: 24px; +} + +/* Info box for upcoming events */ +.infoBox { + margin-top: 32px; + padding: 24px; + background-color: #e3f2fd; + border-left: 4px solid var(--ifm-color-primary); + border-radius: 4px; +} + +[data-theme="dark"] .infoBox { + background-color: rgba(33, 150, 243, 0.15); +} + +.infoBox h3 { + margin-top: 0; +} + +.infoBox p:last-child { + margin-bottom: 0; +} + +/* Placeholder cards */ +.placeholderCard { + height: 100%; + text-align: center; +} + +.placeholderCard .card__body { + color: var(--ifm-color-emphasis-600); + font-style: italic; +} + +/* Responsive adjustments */ +@media (max-width: 768px) { + .heroTitle { + font-size: 2rem; + } + + .heroSubtitle { + font-size: 1rem; + } + + .eventMeta { + flex-direction: column; + gap: 12px; + } + + .ctaButtons { + flex-direction: column; + align-items: center; + } + + .ctaButtons .button { + width: 100%; + max-width: 280px; + } +} + diff --git a/src/pages/events/recps-2026.tsx b/src/pages/events/recps-2026.tsx new file mode 100644 index 000000000..013767332 --- /dev/null +++ b/src/pages/events/recps-2026.tsx @@ -0,0 +1,146 @@ +import clsx from "clsx"; +import Layout from "@theme/Layout"; +import Heading from "@theme/Heading"; +import Link from "@docusaurus/Link"; + +import styles from "./event-page.module.css"; + +export default function ReCPS2026(): JSX.Element { + return ( + + {/* Hero Section */} +
+
+
+ Upcoming Event +
+ + ReCPS Workshop + +

+ Workshop on Reactive Cyber-Physical Systems: Design, Simulation, and + Coordination +

+
+ 📅 March 31, 2026 + 📍 Valencia, Spain + + 🎯 Co-located with{" "} + + DATE 2026 + + +
+
+
+ + {/* Main Content */} +
+
+
+
+ About the Workshop +

+ The ReCPS (Reactive Cyber-Physical Systems) Workshop brings + together researchers and practitioners working on the design, + simulation, and coordination of reactive cyber-physical systems. +

+

+ This workshop is co-located with the{" "} + + Design, Automation and Test in Europe (DATE) Conference 2026 + + , one of the premier conferences in electronic system design and + test. +

+ +
+ 📢 More Information Coming Soon +

+ The workshop has been accepted to DATE 2026. Detailed + information about the program, call for papers, submission + deadlines, and registration will be posted here as it becomes + available. +

+

+ In the meantime, feel free to join our{" "} + + Zulip community + {" "} + for updates and discussions. +

+
+
+
+
+
+ + {/* Placeholder Sections */} +
+
+
+
+
+
+ 📝 Call for Papers +
+
+

Coming soon

+
+
+
+
+
+
+ 📅 Important Dates +
+
+

Coming soon

+
+
+
+
+
+
+ 👥 Organizers +
+
+

Coming soon

+
+
+
+
+
+
+ + {/* Related Links */} +
+
+ Related Resources +

Learn more about reactive programming and Lingua Franca.

+
+ + DATE 2026 Conference + + + Lingua Franca Docs + + + Research Publications + +
+
+
+ + ); +} + From eefa7ab6b29e576f02f22c2d77a861d399e9436e Mon Sep 17 00:00:00 2001 From: Hokeun Kim Date: Wed, 26 Nov 2025 14:31:38 -0700 Subject: [PATCH 3/9] Fix date and location for ReCPS. --- src/components/Events/events.tsx | 5 +++-- src/pages/events/recps-2026.tsx | 4 ++-- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/src/components/Events/events.tsx b/src/components/Events/events.tsx index 78e0859c4..ee32b0c63 100644 --- a/src/components/Events/events.tsx +++ b/src/components/Events/events.tsx @@ -16,8 +16,9 @@ export const events: Event[] = [ // Upcoming Events { title: "ReCPS: Workshop on Reactive Cyber-Physical Systems", - date: "2026-03-31", - location: "DATE 2026 Conference, Valencia, Spain", + date: "2026-04-20", + endDate: "2026-04-22", + location: "DATE 2026 Conference, Verona, Italy", description: "Workshop on Reactive Cyber-Physical Systems: Design, Simulation, and Coordination. Co-located with the Design, Automation and Test in Europe (DATE) Conference 2026.", link: "/events/recps-2026", diff --git a/src/pages/events/recps-2026.tsx b/src/pages/events/recps-2026.tsx index 013767332..0d73aac9c 100644 --- a/src/pages/events/recps-2026.tsx +++ b/src/pages/events/recps-2026.tsx @@ -25,8 +25,8 @@ export default function ReCPS2026(): JSX.Element { Coordination

- 📅 March 31, 2026 - 📍 Valencia, Spain + 📅 April 20-22, 2026 + 📍 Verona, Italy 🎯 Co-located with{" "} From e7267697703b36d45a21a3776d6abbb2b29788f9 Mon Sep 17 00:00:00 2001 From: Hokeun Kim Date: Wed, 26 Nov 2025 14:45:08 -0700 Subject: [PATCH 4/9] Update event details. --- src/pages/events/esweek-2021-tutorial.tsx | 2 +- src/pages/events/event-page.module.css | 32 +++++++++++++++ src/pages/events/recps-2026.tsx | 47 ++++++++++++++++------- 3 files changed, 67 insertions(+), 14 deletions(-) diff --git a/src/pages/events/esweek-2021-tutorial.tsx b/src/pages/events/esweek-2021-tutorial.tsx index 846631cf6..80c441d7c 100644 --- a/src/pages/events/esweek-2021-tutorial.tsx +++ b/src/pages/events/esweek-2021-tutorial.tsx @@ -225,7 +225,7 @@ const VideoCard = ({ section }: { section: VideoSection }) => (
); -export default function ESWEEKTutorial(): JSX.Element { +export default function ESWEEKTutorial() { return ( - {/* Placeholder Sections */} + {/* Call for Papers & Important Dates */}
-
-
+
+
📝 Call for Papers
-

Coming soon

+

+ We invite submissions of research papers and demo abstracts + on topics related to reactive cyber-physical systems, + including but not limited to design methodologies, + simulation techniques, and coordination frameworks. +

+

More details on submission guidelines coming soon.

-
-
-
+ +
📅 Important Dates
-

Coming soon

+
    +
  • + February 16, 2026: Research papers and + demo abstracts submission deadline +
    • +
  • + March 2, 2026: Notification of acceptance +
    • +
-
-
-
+ +
👥 Organizers
-

Coming soon

+
    +
  • + General Chair: Hokeun Kim (Arizona State + University, United States) +
    • +
  • + Program Chair: Sebastiano Gaiardelli + (University of Verona, Italy) +
    • +
From 8084d9adb792d02a6a5d7b47115d5e4ee1438e4e Mon Sep 17 00:00:00 2001 From: Hokeun Kim Date: Wed, 26 Nov 2025 14:48:08 -0700 Subject: [PATCH 5/9] Split TCRS into each year's page. --- src/components/Events/events.tsx | 30 ++++++++++++++++++++++++++---- 1 file changed, 26 insertions(+), 4 deletions(-) diff --git a/src/components/Events/events.tsx b/src/components/Events/events.tsx index ee32b0c63..cd592fbc9 100644 --- a/src/components/Events/events.tsx +++ b/src/components/Events/events.tsx @@ -27,16 +27,38 @@ export const events: Event[] = [ }, // Past Events { - title: "TCRS Workshop Series", - date: "2024-01-01", - location: "Various Locations", + title: "TCRS '25: Time-Centric Reactive Software", + date: "2025-10-02", + location: "Taipei, Taiwan (ESWEEK 2025)", description: - "Workshop series on Timing Centric Reactive Software, exploring reactor-oriented programming and time-sensitive applications.", + "Third edition of the workshop on Time-Centric Reactive Software, co-located with Embedded Systems Week (ESWEEK) 2025 at the Taipei International Convention Center.", link: "https://www.tcrs.io/", type: "workshop", isUpcoming: false, isExternal: true, }, + { + title: "TCRS '24: Time-Centric Reactive Software", + date: "2024-10-03", + location: "Raleigh, NC, USA (ESWEEK 2024)", + description: + "Second edition of the workshop on Time-Centric Reactive Software, co-located with Embedded Systems Week (ESWEEK) 2024.", + link: "https://www.tcrs.io/2024/", + type: "workshop", + isUpcoming: false, + isExternal: true, + }, + { + title: "TCRS '23: Time-Centric Reactive Software", + date: "2023-05-09", + location: "San Antonio, Texas (CPS-IoT Week 2023)", + description: + "First edition of the workshop on Time-Centric Reactive Software, co-located with ACM/IEEE CPS-IoT Week 2023.", + link: "https://www.tcrs.io/2023/", + type: "workshop", + isUpcoming: false, + isExternal: true, + }, { title: "Lingua Franca Tutorial at ESWEEK 2021", date: "2021-10-08", From 42c5f17684292947f8c9913bf0a1bbfa47c4afd6 Mon Sep 17 00:00:00 2001 From: Hokeun Kim Date: Wed, 26 Nov 2025 14:51:29 -0700 Subject: [PATCH 6/9] Update event type for ESWEEK tutorial. --- src/components/Events/events.tsx | 4 ++-- src/components/Events/styles.module.css | 10 ++++++++++ 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/src/components/Events/events.tsx b/src/components/Events/events.tsx index cd592fbc9..0c9919b86 100644 --- a/src/components/Events/events.tsx +++ b/src/components/Events/events.tsx @@ -5,7 +5,7 @@ export interface Event { location: string; description: string; link?: string; - type: "conference" | "workshop" | "meetup" | "webinar" | "hackathon"; + type: "conference" | "workshop" | "meetup" | "webinar" | "hackathon" | "tutorial"; isUpcoming: boolean; isExternal?: boolean; // true if link goes to external site } @@ -66,7 +66,7 @@ export const events: Event[] = [ description: "A comprehensive tutorial introducing Lingua Franca, a polyglot coordination language for concurrent and time-sensitive applications. Part of the Embedded Systems Week (ESWEEK) 2021.", link: "/events/esweek-2021-tutorial", - type: "workshop", + type: "tutorial", isUpcoming: false, }, ]; diff --git a/src/components/Events/styles.module.css b/src/components/Events/styles.module.css index f6818267f..809202199 100644 --- a/src/components/Events/styles.module.css +++ b/src/components/Events/styles.module.css @@ -76,6 +76,16 @@ color: #fce4ec; } +.tutorial { + background-color: #e0f7fa; + color: #00838f; +} + +[data-theme="dark"] .tutorial { + background-color: #00838f; + color: #e0f7fa; +} + .eventMeta { display: flex; flex-wrap: wrap; From af31733dd89e93c69cd93ee9e597e7035cb541a9 Mon Sep 17 00:00:00 2001 From: Hokeun Kim Date: Wed, 26 Nov 2025 15:01:48 -0700 Subject: [PATCH 7/9] Minor changes. --- src/components/Events/events.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Events/events.tsx b/src/components/Events/events.tsx index 0c9919b86..cc14851b9 100644 --- a/src/components/Events/events.tsx +++ b/src/components/Events/events.tsx @@ -18,9 +18,9 @@ export const events: Event[] = [ title: "ReCPS: Workshop on Reactive Cyber-Physical Systems", date: "2026-04-20", endDate: "2026-04-22", - location: "DATE 2026 Conference, Verona, Italy", + location: "Verona, Italy (DATE 2026 Conference)", description: - "Workshop on Reactive Cyber-Physical Systems: Design, Simulation, and Coordination. Co-located with the Design, Automation and Test in Europe (DATE) Conference 2026.", + "Workshop on Reactive Cyber-Physical Systems: Design, Simulation, and Coordination, co-located with the Design, Automation and Test in Europe (DATE) Conference 2026.", link: "/events/recps-2026", type: "workshop", isUpcoming: true, From 448cd8720dc2acfbe9de9ce88b212b1ef43a4fea Mon Sep 17 00:00:00 2001 From: Hokeun Kim Date: Wed, 26 Nov 2025 15:23:32 -0700 Subject: [PATCH 8/9] Update ReCPS page. --- src/components/Events/index.tsx | 2 +- src/pages/events/recps-2026.tsx | 215 +++++++++++++++++++++++--------- 2 files changed, 156 insertions(+), 61 deletions(-) diff --git a/src/components/Events/index.tsx b/src/components/Events/index.tsx index 64ae2b671..55e313ffe 100644 --- a/src/components/Events/index.tsx +++ b/src/components/Events/index.tsx @@ -173,7 +173,7 @@ export default function Events(): JSX.Element {

- Join us at conferences, workshops, and meetups to learn more about + Join us at conferences, workshops, and tutorials to learn more about Lingua Franca and connect with the community.

diff --git a/src/pages/events/recps-2026.tsx b/src/pages/events/recps-2026.tsx index 3eb25d4e8..f9e0ff922 100644 --- a/src/pages/events/recps-2026.tsx +++ b/src/pages/events/recps-2026.tsx @@ -9,7 +9,7 @@ export default function ReCPS2026() { return ( {/* Hero Section */}
@@ -18,7 +18,7 @@ export default function ReCPS2026() { Upcoming Event
- ReCPS Workshop + Reactive CPS (ReCPS)

Workshop on Reactive Cyber-Physical Systems: Design, Simulation, and @@ -29,7 +29,10 @@ export default function ReCPS2026() { 📍 Verona, Italy 🎯 Co-located with{" "} - + DATE 2026 @@ -37,71 +40,81 @@ export default function ReCPS2026() {

- {/* Main Content */} + {/* About Section */}
About the Workshop

- The ReCPS (Reactive Cyber-Physical Systems) Workshop brings - together researchers and practitioners working on the design, - simulation, and coordination of reactive cyber-physical systems. -

-

- This workshop is co-located with the{" "} - - Design, Automation and Test in Europe (DATE) Conference 2026 - - , one of the premier conferences in electronic system design and - test. + The Reactive CPS (ReCPS) Workshop at{" "} + DATE 2026{" "} + is a new workshop dedicated to the modeling, design, simulation, + analysis, and verification of reactive cyber-physical systems + (CPS). ReCPS emphasizes reactive CPS architectures that + continuously interact with their environment in real time, + leveraging methodologies and tools such as the reactor model of + computation and the{" "} + Lingua Franca coordination language.

-
- 📢 More Information Coming Soon -

- The workshop has been accepted to DATE 2026. Detailed - information about the program, call for papers, submission - deadlines, and registration will be posted here as it becomes - available. -

-

- In the meantime, feel free to join our{" "} - - Zulip community - {" "} - for updates and discussions. -

-
+ + Tentative Workshop Program + +

The workshop program will feature:

+
    +
  • + Keynote talk by Prof. Edward A. Lee, UC Berkeley +
    • +
  • + Presentations of technical papers +
    • +
  • + Demo sessions +
    • +
+
- {/* Call for Papers & Important Dates */} + {/* Organizers Section */}
-
-
- 📝 Call for Papers -
+ + 👥 Organizers + +
-

- We invite submissions of research papers and demo abstracts - on topics related to reactive cyber-physical systems, - including but not limited to design methodologies, - simulation techniques, and coordination frameworks. -

-

More details on submission guidelines coming soon.

+
    +
  • + General Chair: Hokeun Kim (Arizona State + University, United States) +
    • +
  • + Program Chair: Sebastiano Gaiardelli + (University of Verona, Italy) +
    • +
+
+
+
+
-
-
- 📅 Important Dates -
+ {/* Important Dates Section */} +
+
+
+
+ + 📅 Important Dates + +
  • @@ -111,34 +124,117 @@ export default function ReCPS2026() {
  • March 2, 2026: Notification of acceptance
    • +
  • + April 20-22, 2026: Workshop at DATE 2026, + Verona, Italy +
+
+
+
+
+ {/* Topics Section */} +
+
+
+
+ + 📋 Topics of Interest + +

Scope and topics to be considered include:

+
+
+
+
    +
  • Cyber-physical production systems (CPPS)
    • +
  • Safety-critical CPS
    • +
  • Distributed CPS
    • +
  • Real-time scheduling and coordination
    • +
  • Simulation of CPS
    • +
  • Digital twins
    • +
+
+
+
    +
  • Verification and testing of CPS
    • +
  • Predictability and determinism of CPS
    • +
  • Integration and deployment of CPS
    • +
  • AI/ML-driven autonomous CPS
    • +
  • Modeling & simulation of human-in-the-loop CPS
    • +
  • CPS-human interaction via LLMs
    • +
+
+
+
+
+
+
+
+
+ + {/* Submission Section */} +
+
+
+
+ + 📝 Submission Guidelines + +

We invite the following types of contributions:

+ +
- 👥 Organizers + Research Papers
-
    -
  • - General Chair: Hokeun Kim (Arizona State - University, United States) -
    • -
  • - Program Chair: Sebastiano Gaiardelli - (University of Verona, Italy) -
    • -
+

+ Original research contributions on topics related to + reactive cyber-physical systems design, simulation, + verification, and deployment. +

+ +
+
+ Demo Abstracts +
+
+

+ Short abstracts describing working prototypes, tools, or + demonstrations related to reactive CPS and the Lingua Franca + ecosystem. +

+
+
+ +
+
+ Review Process +
+
+

+ Single blind review (no need to anonymize submissions) by a program committee with acceptance + decisions. +

+

+ Submission system: EasyChair (link coming + soon) +

+
+
+
{/* Related Links */} -
+
Related Resources

Learn more about reactive programming and Lingua Franca.

@@ -164,4 +260,3 @@ export default function ReCPS2026() { ); } - From 6ec88bcb9d9560c6aa0696b49076f1b3266585a8 Mon Sep 17 00:00:00 2001 From: Hokeun Kim Date: Wed, 26 Nov 2025 15:45:11 -0700 Subject: [PATCH 9/9] Add page limit and format. --- src/pages/events/recps-2026.tsx | 20 ++++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) diff --git a/src/pages/events/recps-2026.tsx b/src/pages/events/recps-2026.tsx index f9e0ff922..f3dbfad73 100644 --- a/src/pages/events/recps-2026.tsx +++ b/src/pages/events/recps-2026.tsx @@ -191,11 +191,19 @@ export default function ReCPS2026() { Research Papers
-

+

Original research contributions on topics related to reactive cyber-physical systems design, simulation, verification, and deployment.

+
    +
  • + Page limit: 4 pages (including references) +
    • +
  • + Format: IEEE conference format +
    • +
@@ -204,11 +212,19 @@ export default function ReCPS2026() { Demo Abstracts
-

+

Short abstracts describing working prototypes, tools, or demonstrations related to reactive CPS and the Lingua Franca ecosystem.

+
    +
  • + Page limit: 2 pages (including references) +
    • +
  • + Format: IEEE conference format +
    • +