root = Card([header, statusStrip, weatherCard, alertsCard, congestionCard, transitCard, airCard, energyCard, waterCard, incidentsCard, emergencyCard, parkingCard, eventsCard, reportsCard, backlogCard, roadworksCard, maintenanceCard, districtCard, dispatchCard, alertCard], "card", "column", "l")
header = CardHeader("City Operations Center", "Live overview • Thursday, Nov 14")
statusStrip = Card([liveTag, weatherTag, incidentTag], "sunk", "row", "m")
liveTag = Tag("Live", null, "sm", "success")
weatherTag = Tag("64°F Partly Cloudy", null, "sm", "info")
incidentTag = Tag("4 open incidents", null, "sm", "warning")
weatherCard = Card([weatherCallout], "sunk")
weatherCallout = TextCallout("info", "Current weather", "64°F, partly cloudy — wind 8 mph NW, humidity 58%")
alertsCard = Card([congestionAlert, airAlert], "sunk")
congestionAlert = Alert("High traffic alert", "I-5 northbound is at 92% capacity near downtown.", "warning")
airAlert = Alert("Air quality advisory", "AQI unhealthy in Eastside district.", "info")
congestionCard = Card([congestionTitle, congestionChart], "sunk")
congestionTitle = Heading("Congestion now", "h3")
congestionChart = HorizontalBarChart(["I-5 N", "Harbor Blvd", "Main St", "1st Ave"], [congestionSeries], null, "Road", "Congestion %")
congestionSeries = Series("Congestion", [92, 71, 58, 44])
transitCard = Card([transitTitle, transitChart], "sunk")
transitTitle = Heading("Transit punctuality", "h3")
transitChart = BarChart(["Bus 12", "Bus 40", "Metro A", "Metro B"], [transitSeries], "grouped", "Line", "On-time %")
transitSeries = Series("On-time", [92, 85, 78, 96])
airCard = Card([airTitle, airTable], "sunk")
airTitle = Heading("Air quality by district", "h3")
airTable = Table([districtCol, aqiCol, aqiStatusCol])
districtCol = Col("District", ["Downtown", "Eastside", "Riverside", "Northgate"])
aqiCol = Col("AQI", [58, 142, 73, 41])
aqiStatusCol = Col("Status", ["Moderate", "Unhealthy", "Moderate", "Good"])
energyCard = Card([energyTitle, energyChart], "sunk")
energyTitle = Heading("Energy use — past week", "h3")
energyChart = AreaChart(["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], [energySeries], "natural", "Day", "MWh")
energySeries = Series("Energy", [1120, 1180, 1240, 1200, 1340, 980, 1030])
waterCard = Card([waterTitle, waterProgress], "sunk")
waterTitle = Heading("Water use today", "h3")
waterProgress = Progress(61, "61% of daily budget used")
incidentsCard = Card([incidentsTitle, incidentsTable], "sunk")
incidentsTitle = Heading("Open incidents", "h3")
incidentsTable = Table([incidentTypeCol, incidentLocationCol, incidentSeverityCol])
incidentTypeCol = Col("Incident", ["Fire response", "Traffic collision", "Utility outage", "Spill"])
incidentLocationCol = Col("Location", ["3rd & Main", "I-5 Exit 21", "Riverside substation", "Harbor Blvd"])
incidentSeverityCol = Col("Severity", ["High", "Medium", "High", "Low"])
emergencyCard = Card([emergencyTitle, emergencyTable], "sunk")
emergencyTitle = Heading("Emergency vehicles deployed", "h3")
emergencyTable = Table([unitCol, typeCol, locationCol])
unitCol = Col("Unit", ["E-4", "E-9", "R-2", "A-7"])
typeCol = Col("Type", ["Engine", "Ambulance", "Rescue", "Ambulance"])
locationCol = Col("Location", ["Downtown", "Eastside", "Riverside", "Northgate"])
parkingCard = Card([parkingTitle, parkingTable], "sunk")
parkingTitle = Heading("Downtown parking availability", "h3")
parkingTable = Table([garageCol, availableCol, pStatusCol])
garageCol = Col("Garage", ["City Center", "Market St", "Union Plaza", "Harbor"])
availableCol = Col("Available", [128, 47, 230, 96])
pStatusCol = Col("Status", ["Open", "Almost full", "Open", "Open"])
eventsCard = Card([eventsTitle, eventsList], "sunk")
eventsTitle = Heading("Public events this weekend", "h3")
eventsList = ListBlock([event1, event2, event3], "number")
event1 = ListItem("Riverfront Festival", "Saturday 10am – 6pm • Riverfront Park")
event2 = ListItem("Downtown Farmers Market", "Sunday 8am – 1pm • Main Street")
event3 = ListItem("City Marathon", "Sunday 6am – 12pm • Closed route")
reportsCard = Card([reportsTitle, reportsList], "sunk")
reportsTitle = Heading("Citizen reports — live", "h3")
reportsList = ListBlock([report1, report2, report3])
report1 = ListItem("Pothole on 5th Ave", "Submitted 2 min ago • 5th & Oak")
report2 = ListItem("Streetlight out", "Submitted 8 min ago • Maple St")
report3 = ListItem("Noise complaint", "Submitted 15 min ago • Union Plaza")
backlogCard = Card([backlogTitle, backlogChart], "sunk")
backlogTitle = Heading("Service request backlog", "h3")
backlogChart = HorizontalBarChart(["Potholes", "Graffiti", "Streetlights", "Trash"], [backlogSeries], null, "Category", "Open requests")
backlogSeries = Series("Backlog", [420, 310, 260, 255])
roadworksCard = Card([roadworksTitle, roadworksTable], "sunk")
roadworksTitle = Heading("Roadworks planned this month", "h3")
roadworksTable = Table([roadCol, districtCol2, datesCol])
roadCol = Col("Road", ["Harbor Blvd", "5th Ave", "Parkway", "Oak St"])
districtCol2 = Col("District", ["Downtown", "Northgate", "Riverside", "Eastside"])
datesCol = Col("Dates", ["Nov 15–19", "Nov 18–22", "Nov 20–24", "Nov 25–27"])
maintenanceCard = Card([maintenanceTitle, maintenanceTable], "sunk")
maintenanceTitle = Heading("Infrastructure jobs due for maintenance", "h3")
maintenanceTable = Table([assetCol, dueCol, priorityCol])
assetCol = Col("Asset", ["Rail bridge", "Water main", "Traffic signal", "Sewer line"])
dueCol = Col("Due", ["Nov 20", "Nov 25", "Dec 1", "Dec 5"])
priorityCol = Col("Priority", ["High", "High", "Medium", "Low"])
districtCard = Card([districtTitle, districtForm], "sunk")
districtTitle = Heading("Focus on a district", "h3")
districtForm = Form("district-focus", districtButtons, [districtField])
districtField = FormControl("Select district", districtSelect, "Dashboard views will narrow to this district")
districtSelect = Select("district", [districtDowntown, districtEast, districtRiver, districtNorth], "Choose district")
districtDowntown = SelectItem("downtown", "Downtown")
districtEast = SelectItem("eastside", "Eastside")
districtRiver = SelectItem("riverside", "Riverside")
districtNorth = SelectItem("northgate", "Northgate")
districtButtons = Buttons([districtApply])
districtApply = Button("Apply focus", null, "primary")
dispatchCard = Card([dispatchTitle, dispatchForm], "sunk")
dispatchTitle = Heading("Dispatch a crew", "h3")
dispatchForm = Form("dispatch", dispatchButtons, [crewTypeField, crewLocationField])
crewTypeField = FormControl("Crew type", crewTypeSelect)
crewTypeSelect = Select("crew_type", [crewWaste, crewUtility, crewTraffic, crewParks], "Select crew")
crewWaste = SelectItem("waste", "Waste management")
crewUtility = SelectItem("utility", "Utility repair")
crewTraffic = SelectItem("traffic", "Traffic control")
crewParks = SelectItem("parks", "Parks & grounds")
crewLocationField = FormControl("Location", crewLocationInput)
crewLocationInput = Input("location", "Street / intersection")
dispatchButtons = Buttons([dispatchBtn])
dispatchBtn = Button("Dispatch crew", null, "primary")
alertCard = Card([alertTitle, alertForm], "sunk")
alertTitle = Heading("Send a public alert", "h3")
alertForm = Form("public-alert", alertButtons, [alertMessageField, alertChannelField])
alertMessageField = FormControl("Message", alertMessageInput, "This will be sent to the public")
alertMessageInput = Input("message", "Alert text...")
alertChannelField = FormControl("Channel", alertChannelRadio)
alertChannelRadio = RadioGroup("channel", [channelPush, channelSms, channelEmail])
channelPush = RadioItem("Push", "City app notification", "push")
channelSms = RadioItem("SMS", "Text message blast", "sms")
channelEmail = RadioItem("Email", "Email subscribers", "email")
alertButtons = Buttons([sendAlertBtn, clearAlertBtn])
sendAlertBtn = Button("Send alert", null, "primary")
clearAlertBtn = Button("Clear", null, "tertiary")