gtfs-to-html 2.9.0 → 2.9.2

package/views/default/js/timetable-menu.js

@@ -0,0 +1,57 @@
+/* global window, document, $, maps */
+/* eslint no-unused-vars: "off" */
+
+$(() => {
+  showSelectedTimetable();
+
+  $('#day_list_selector input[name="dayList"]').change(() => {
+    showSelectedTimetable();
+  });
+
+  $('#direction_name_selector input[name="directionName"]').change(() => {
+    showSelectedTimetable();
+  });
+
+  function showSelectedTimetable() {
+    if ($('.timetable').length === 1) {
+      showTimetable($('.timetable').data('timetable-id'));
+      return false;
+    }
+
+    $('#day_list_selector input[name="dayList"]').each((index, element) => {
+      $(element)
+        .parents('label')
+        .toggleClass('btn-blue', $(element).is(':checked'));
+      $(element)
+        .parents('label')
+        .toggleClass('btn-gray', $(element).is(':not(:checked)'));
+    });
+
+    $('#direction_name_selector input[name="directionName"]').each(
+      (index, element) => {
+        $(element)
+          .parents('label')
+          .toggleClass('btn-blue', $(element).is(':checked'));
+        $(element)
+          .parents('label')
+          .toggleClass('btn-gray', $(element).is(':not(:checked)'));
+      },
+    );
+
+    const dayList = $('#day_list_selector input[name="dayList"]:checked').val();
+    const directionName = $(
+      '#direction_name_selector input[name="directionName"]:checked',
+    ).val();
+
+    $('.timetable').hide();
+    const id = $(
+      `.timetable[data-day-list="${dayList}"][data-direction-name="${directionName}"]`,
+    ).data('timetable-id');
+    showTimetable(id);
+  }
+
+  function showTimetable(id) {
+    $(`#timetable_id_${id}`).show();
+    toggleMap(id);
+  }
+});

package/views/default/layout.pug

@@ -0,0 +1,11 @@
+doctype html
+html
+  head
+    title= title
+    meta(charset="utf-8")
+    meta(name="viewport" content="initial-scale=1.0, width=device-width")
+
+    block extraHeader
+
+  body
+    block content

package/views/default/overview.pug

@@ -0,0 +1,27 @@
+include formatting_functions.pug
+
+.timetable-overview
+  if !timetablePages || !timetablePages.length
+    h1 No timetables found
+  else
+    .overview-list
+      each timetablePageGroup in getAgencyTimetableGroups(timetablePages, agencies)
+        h1= `${!agency || !agency.agency_name ? '' : agency.agency_name} Routes`
+        each timetablePage in timetablePageGroup.timetablePages
+          if config.allowEmptyTimetables || timetablePage.consolidatedTimetables.length > 0
+            a.timetable-page-link(href=`${timetablePage.relativePath}` data-route-ids=`${timetablePage.route_ids ? timetablePage.route_ids.join(',') : ''}`)
+              - const timetableRouteList = _.uniqBy(_.flatMap(timetablePage.consolidatedTimetables, timetable => timetable.routes), 'route_id')
+              each route in timetableRouteList
+                .route-color-swatch-large(style=`background-color: ${formatRouteColor(route)}; color: ${formatRouteTextColor(route)};`)= route.route_short_name || ''
+              div
+                .timetable-page-label= timetablePage.timetable_page_label || timetableRouteList.map(route => formatRouteName(route)).join(' and ')
+                .badge-gray= timetablePage.dayList
+    if config.showMap
+      #system_map.overview-map
+
+      //- Use !{variable} format to inject values from pug to client side js
+      script.
+        (function() {
+          const geojson = !{JSON.stringify(geojson) || '\'\''};
+          createSystemMap('system_map', geojson);
+        })();

package/views/default/overview_full.pug

@@ -0,0 +1,16 @@
+extends layout
+block content
+  include overview.pug
+
+block extraHeader
+  if config.showMap
+    script(src="https://unpkg.com/jquery@3.7.1/dist/jquery.min.js" crossorigin="anonymous")
+    script(src="https://unpkg.com/lodash@4.17.21/lodash.min.js" crossorigin="anonymous")
+    script(src="https://api.mapbox.com/mapbox-gl-js/v3.6.0/mapbox-gl.js")
+    script.
+      mapboxgl.accessToken = '#{config.mapboxAccessToken}';
+    script(src=`${config.assetPath}js/system-map.js`)
+
+    link(href="https://api.mapbox.com/mapbox-gl-js/v3.6.0/mapbox-gl.css" rel="stylesheet")
+
+  link(rel="stylesheet" href=`${config.assetPath}css/overview_styles.css`)

package/views/default/timetable_continuation_as.pug

@@ -0,0 +1,7 @@
+- const routeColorCss = trip.continues_as_route ? getRouteColorsAsCss(trip.continues_as_route.route) : ''
+td.run-footer(style=routeColorCss)
+  if trip.continues_as_route
+    if trip.continues_as_route.route.route_url
+      a.continues-as-route(href=`${trip.continues_as_route.route.route_url}` style=routeColorCss data-trip-id=trip.continues_as_route.trip_id)= trip.continues_as_route.route.route_short_name
+    else
+      .continues-as-route(data-trip-id=trip.continues_as_route.trip_id)= trip.continues_as_route.route.route_short_name

package/views/default/timetable_continuation_from.pug

@@ -0,0 +1,7 @@
+- const routeColorCss = trip.continues_from_route ? getRouteColorsAsCss(trip.continues_from_route.route) : ''
+td.run-footer(style=routeColorCss)
+  if trip.continues_from_route
+    if trip.continues_from_route.route.route_url
+      a.continues-from-route(href=`${trip.continues_from_route.route.route_url}` style=routeColorCss data-trip-id=trip.continues_from_route.trip_id)= trip.continues_from_route.route.route_short_name
+    else
+      .continues-from-route(data-trip-id=trip.continues_from_route.trip_id)= trip.continues_from_route.route.route_short_name

package/views/default/timetable_horizontal.pug

@@ -0,0 +1,42 @@
+.table-container
+  table.table-horizontal(summary=`This table shows schedules for a selection of key stops on the route for ${timetable.timetable_label} ${timetable.dayList}. Schedule times are listed in rows, starting with the stop name in the first cell of the row.` data-orientation="horizontal")
+    caption.sr-only= `${timetable.timetable_label} | ${timetable.dayList}`
+    colgroup
+      col
+      each trip, idx in timetable.orderedTrips
+        col(id=`trip_id_${formatHtmlId(trip.trip_id)}` class=`run_${idx} ${(trip.trip_short_name) ? 'trip_short_name_' + trip.trip_short_name : ''}`)
+    thead
+      tr
+        th.stop-header(scope="col") Stop
+        each trip, idx in timetable.orderedTrips
+          th.run-header(scope="col")= formatTripName(trip, idx, timetable)
+            each note in getNotesForTrip(timetable.notes, trip)
+              include timetable_note_symbol.pug
+      if timetable.frequencies && !timetable.frequencyExactTimes
+        tr.trip-row
+          td.trip-frequency(colspan=`${timetable.orderedTrips.length + 1}`)!= formatFrequencyWarning(timetable.frequencies)
+    tbody
+      if timetable.has_continues_from_route
+        tr.continues-from-row
+          th Continues from route
+          each trip in timetable.orderedTrips
+            include timetable_continuation_from.pug
+      - let previousCity = null;
+      each stop in timetable.stops
+        if stop.stop_city !== '' && previousCity !== stop.stop_city && config.showStopCity
+          tr.city-row
+            th(scope="row" colspan=`${stop.trips.length + 1}`)= stop.stop_city
+          - previousCity = stop.stop_city
+
+        tr.stop-row(id=`stop_id_${formatHtmlId(stop.stop_id)}` data-stop-id=`${stop.stop_id}` data-is-timepoint=`${stop.is_timepoint}`)
+          th.stop-name-container(scope="row")
+            include timetable_stop_name.pug
+
+          each stoptime in stop.trips
+            include timetable_stoptime.pug
+
+      if timetable.has_continues_as_route
+        tr.continues-as-row
+          th Continues as route
+          each trip in timetable.orderedTrips
+            include timetable_continuation_as.pug

package/views/default/timetable_hourly.pug

@@ -0,0 +1,30 @@
+.table-container
+  table.table-hourly(summary=`This table shows schedules for a selection of key stops on the route for ${timetable.timetable_label} ${timetable.dayList}. Schedule times are listed in rows, starting with the stop name in the first cell of the row and the minutes after the hour in the second row.` data-orientation="hourly")
+    caption.sr-only= `${timetable.timetable_label} | ${timetable.dayList}`
+    thead
+      tr
+        th.stop-header(scope="col") Stop
+        th(scope="col") Minutes after the hour
+
+    tbody
+      if timetable.frequencies && !timetable.frequencyExactTimes
+        tr.trip-row
+          td.trip-frequency(colspan="2")!= formatFrequencyWarning(timetable.frequencies)
+      - let previousCity
+      each stop in timetable.stops
+        if previousCity !== stop.stop_city && config.showStopCity
+          tr.city-row
+            th(scope="row" colspan="2")= stop.stop_city
+        - previousCity = stop.stop_city
+
+        tr.stop-row(id=`stop_id_${formatHtmlId(stop.stop_id)}` data-stop-id=`${stop.stop_id}`)
+          th.stop-name-container(scope="row")
+            include timetable_stop_name.pug
+
+          td.stop-time= stop.hourlyTimes.join(', ')
+
+- const firstStop = timetable.stops[0]
+- const firstTripStartTime = firstStop.trips[0]
+- const lastStop = timetable.stops[timetable.stops.length - 1]
+- const lastTripEndTime = lastStop.trips[lastStop.trips.length - 1]
+.table-hourly-notes!= `Service begins at ${firstStop.stop_name} at ${firstTripStartTime.formatted_time} and ends at ${lastStop.stop_name} at ${lastTripEndTime.formatted_time}.`

package/views/default/timetable_map.pug

@@ -0,0 +1,15 @@
+.map-container
+  .map(id=`map_timetable_id_${formatHtmlId(timetable.timetable_id)}`)
+  .map-legend
+    .legend-item
+      .legend-icon
+        .stop-marker
+      .legend-text 
+        <b>Stops</b>
+    .legend-item.vehicle-legend-item(style="display: none;")
+      .legend-icon
+        .vehicle-marker
+          .vehicle-marker-arrow
+      .legend-text
+        <b>Current Vehicle Locations</b><br />
+        <small>Hover or tap to see arrival times.</small>

package/views/default/timetable_menu.pug

@@ -0,0 +1,48 @@
+if timetablePage.consolidatedTimetables.length > 1
+  if config.menuType === 'simple'
+    ul.timetable-simple-menu
+      - const showTimetableLabel = timetablePageHasDifferentLabels(timetablePage);
+      - const showDayList = timetablePageHasDifferentDays(timetablePage);
+      each timetable in timetablePage.consolidatedTimetables
+        li
+          a(href=`#timetable_id_${timetable.timetable_id}`)
+            if showTimetableLabel
+              span= timetable.timetable_label
+            if showTimetableLabel && showDayList
+              span  | 
+            if showDayList
+              span= timetable.dayListLong
+            
+  if config.menuType === 'jump'
+    -
+      const groupedTimetables = timetablePage.consolidatedTimetables.reduce((memo, timetable) => {
+        if (!memo.hasOwnProperty(timetable.dayList)) {
+          memo[timetable.dayList] = []
+        }
+        memo[timetable.dayList].push(timetable);
+        return memo;
+      }, {});
+    .timetable-jump-menu
+      each group, dayList in groupedTimetables
+        div
+          h3= dayList
+          each timetable in group
+            a.btn-blue(href=`#timetable_id_${timetable.timetable_id}`)= timetable.timetable_label
+
+  if config.menuType === 'radio'
+    .timetable-radio-menu
+      -const directionNames = _.uniq(timetablePage.consolidatedTimetables.map(timetable => timetable.direction_name));
+      div(hidden=directionNames.length <= 1)
+        #direction_name_selector
+          h3 Service Direction
+          each directionName, idx in directionNames
+            label(class=idx === 0 ? 'btn-blue' : 'btn-gray')
+              input.hidden(type="radio" name="directionName" autocomplete="off" value=directionName checked=(idx === 0))
+              span= directionName
+      div(hidden=timetablePage.dayLists.length <= 1)
+        #day_list_selector
+          h3 Day of Week
+          each dayList, idx in timetablePage.dayLists
+            label(class=idx === 0 ? 'btn-blue' : 'btn-gray')
+              input.hidden(type="radio" name="dayList" autocomplete="off" value=dayList checked=(idx === 0))
+              span= dayList

package/views/default/timetable_note_symbol.pug

@@ -0,0 +1,5 @@
+a(href=`#note-${timetable.timetable_id}-${note.note_id}` class=`timetable-note-${note.note_id}`).symbol
+  if timetable.routes.length <= 1 && timetable.orientation === 'vertical'
+    span= note.symbol
+  else
+    sup= note.symbol

package/views/default/timetable_stop_name.pug

@@ -0,0 +1,13 @@
+- const stopName = `${stop.stop_name}${stop.type === 'arrival' ? ' (Arrival)' : stop.type === 'departure' ? ' (Departure)' : ''}`;
+
+if config.linkStopUrls && stop.stop_url
+  a.stop-name(href=`${stop.stop_url}`)= stopName
+    each note in getNotesForStop(timetable.notes, stop)
+      include timetable_note_symbol.pug
+else
+  .stop-name= stopName
+    each note in getNotesForStop(timetable.notes, stop)
+      include timetable_note_symbol.pug
+.stop-code= stop.stop_code
+if config.showStopDescription
+  .stop-description= stop.stop_desc

package/views/default/timetable_stoptime.pug

@@ -0,0 +1,17 @@
+td.stop-time(class=`${stoptime.classes.join(' ')}`)
+  if config.showStoptimesForRequestStops || (!stoptime.requestDropoff && !stoptime.requestPickup)
+    span.stop-time-text!= stoptime.formatted_time
+  if stoptime.skipped && timetable.noServiceSymbol !== null
+    a(href=`#note-${timetable.timetable_id}-no-service`).symbol= timetable.noServiceSymbol
+  if stoptime.interpolated && timetable.interpolatedStopSymbol !== null
+    a(href=`#note-${timetable.timetable_id}-interpolated-stop`).symbol= timetable.interpolatedStopSymbol
+  if stoptime.requestPickup && timetable.requestPickupSymbol !== null
+    a(href=`#note-${timetable.timetable_id}-request-pickup`).symbol= timetable.requestPickupSymbol
+  if stoptime.noPickup && timetable.noPickupSymbol !== null
+    a(href=`#note-${timetable.timetable_id}-no-pickup`).symbol= timetable.noPickupSymbol
+  if stoptime.requestDropoff && timetable.requestDropoffSymbol !== null
+    a(href=`#note-${timetable.timetable_id}-request-dropoff`).symbol= timetable.requestDropoffSymbol
+  if stoptime.noDropoff && timetable.noDropoffSymbol !== null
+    a(href=`#note-${timetable.timetable_id}-no-dropoff`).symbol= timetable.noDropoffSymbol
+  each note in getNotesForStoptime(timetable.notes, stoptime)
+    include timetable_note_symbol.pug

package/views/default/timetable_vertical.pug

@@ -0,0 +1,67 @@
+- let columnCount = timetable.stops.length;
+- if (config.showStopCity) {
+-   columnCount += timetable.stops.reduce((memo, stop, index) => {
+-     if (index === 0 || stop.stop_city !== timetable.stops[index - 1].stop_city) {
+-       memo += 1;
+-     }
+-     return memo;
+-   }, 0);
+- }
+- const timetableHasTripNotes = timetable.orderedTrips.flatMap(trip => getNotesForTrip(timetable.notes, trip)).length > 0;
+.table-container
+  table.table-vertical(summary=`This table shows schedules for a selection of key stops on the route for ${timetable.timetable_label} ${timetable.dayList}.  Stops and their schedule times are listed in the columns.` data-orientation="vertical")
+    caption.sr-only= `${timetable.timetable_label} | ${timetable.dayList}`
+    colgroup
+      each stop, idx in timetable.stops
+        col(id=`stop_id_${formatHtmlId(stop.stop_id)}` class=`stop-${idx}` data-stop-id=`${stop.stop_id}` data-is-timepoint=`${stop.is_timepoint}`)
+    thead
+      tr
+        if timetableHasTripNotes || timetable.routes.length > 1
+          th
+        if timetable.has_continues_from_route
+          th.stop-header.continues-from Continues from route
+
+        - let previousCity = null;
+        each stop, idx in timetable.stops
+          if stop.stop_city !== '' && previousCity !== stop.stop_city && config.showStopCity
+            th.city-column= stop.stop_city
+            - previousCity = stop.stop_city
+
+          th.stop-header(scope="col" width=`${(100 / columnCount).toFixed(2)}%`)
+            include timetable_stop_name.pug
+
+        if timetable.has_continues_as_route
+          th.stop-header.continues-as Continues as route
+
+    tbody
+      if timetable.frequencies && !timetable.frequencyExactTimes
+        tr.trip-row
+          if timetableHasTripNotes || timetable.routes.length > 1
+            td
+          if timetable.has_continues_from_route
+            td
+
+          td.trip-frequency(colspan=`${columnCount}`)!= formatFrequencyWarning(timetable.frequencies)
+            
+          if timetable.has_continues_as_route
+            td
+      each trip, idx in timetable.orderedTrips
+        tr.trip-row(id=`trip_id_${formatHtmlId(trip.trip_id)}`)
+          if timetableHasTripNotes || timetable.routes.length > 1
+            td.trip-notes= formatTripName(trip, idx, timetable)
+              each note in getNotesForTrip(timetable.notes, trip)
+                include timetable_note_symbol.pug
+          if timetable.has_continues_from_route
+            include timetable_continuation_from.pug
+
+          - let previousCity = null;
+          each stop in timetable.stops
+            if stop.stop_city !== '' && previousCity !== stop.stop_city && config.showStopCity
+              td
+              - previousCity = stop.stop_city
+
+            - stoptime = stop.trips[idx]
+            include timetable_stoptime.pug
+
+          if timetable.has_continues_as_route
+            include timetable_continuation_as.pug

package/views/default/timetablepage.pug

@@ -0,0 +1,64 @@
+include formatting_functions.pug
+
+<!-- Timetable generated on #{new Date().toISOString()} using GTFS-to-HTML version #{config.gtfsToHtmlVersion} -->
+.timetable-page(class=`menu-type-${config.menuType}`)
+  if config.showRouteTitle
+    - const timetableRouteList = _.uniqBy(_.flatMap(timetablePage.consolidatedTimetables, timetable => timetable.routes), 'route_id')
+    h1
+      each route in timetableRouteList
+        .route-color-swatch-large(style=`background-color: ${formatRouteColor(route)}; color: ${formatRouteTextColor(route)};`)= route.route_short_name || ''
+      div= timetablePage.timetable_page_label || timetableRouteList.map(route => formatRouteName(route)).join(' and ')
+    if config.effectiveDate
+      .effective-date= `Effective ${config.effectiveDate}`
+
+  include timetable_menu.pug
+
+  each timetable in timetablePage.consolidatedTimetables
+    .timetable(id=`timetable_id_${formatHtmlId(timetable.timetable_id)}` data-day-list=timetable.dayList data-direction-name=timetable.direction_name data-timetable-id=timetable.timetable_id data-direction-id=timetable.direction_id data-route-id=timetable.route_ids.join('_'))
+      if config.showRouteTitle
+        .timetable-label
+          h2= `${timetable.timetable_label} | ${timetable.dayListLong}`
+            each note in getNotesForTimetableLabel(timetable.notes)
+              include timetable_note_symbol.pug
+          if timetable.service_notes !== null
+            .timetable-service-notes= timetable.service_notes
+
+      if config.showMap
+        include timetable_map.pug
+      if timetable.orientation === 'horizontal'
+        include timetable_horizontal.pug
+      else if timetable.orientation === 'hourly'
+        include timetable_hourly.pug
+      else if timetable.orientation === 'vertical'
+        include timetable_vertical.pug
+
+      .timetable-footer
+        if hasNotesOrNotices(timetable)
+          .notes
+            if timetable.requestPickupSymbolUsed
+              .note(id=`note-${timetable.timetable_id}-request-pickup`)= `${config.requestPickupSymbol} = ${config.requestPickupText}`
+            if timetable.noPickupSymbolUsed
+              .note(id=`note-${timetable.timetable_id}-no-pickup`)= `${config.noPickupSymbol} = ${config.noPickupText}`
+            if timetable.requestDropoffSymbolUsed
+              .note(id=`note-${timetable.timetable_id}-request-dropoff`)= `${config.requestDropoffSymbol} = ${config.requestDropoffText}`
+            if timetable.noDropoffSymbolUsed
+              .note(id=`note-${timetable.timetable_id}-no-dropoff`)= `${config.noDropoffSymbol} = ${config.noDropoffText}`
+            if timetable.noServiceSymbolUsed
+              .note(id=`note-${timetable.timetable_id}-no-service`)= `${config.noServiceSymbol} = ${config.noServiceText}`
+            if timetable.interpolatedStopSymbolUsed
+              .note(id=`note-${timetable.timetable_id}-interpolated-stop`)= `${config.interpolatedStopSymbol} = ${config.interpolatedStopText}`
+            each note in _.uniqBy(timetable.notes, 'note_id')
+              .note(id=`note-${timetable.timetable_id}-${note.note_id}`)
+                span= note.symbol 
+                span &nbsp;=&nbsp;
+                span!= md(note.note)
+
+        if config.showCalendarExceptions && timetable.calendarDates.includedDates.length
+          .included-dates= `${config.serviceProvidedOnText}: ${timetable.calendarDates.includedDates.join(', ')}`
+
+        if config.showCalendarExceptions && timetable.calendarDates.excludedDates.length
+          .excluded-dates= `${config.serviceNotProvidedOnText}: ${timetable.calendarDates.excludedDates.join(', ')}`
+
+  script.
+    const { geojsons, tripIds, routes, stops, gtfsRealtimeUrls } = !{JSON.stringify(prepareMapData(timetablePage, config))};
+    createMaps();

package/views/default/timetablepage_full.pug

@@ -0,0 +1,25 @@
+extends layout
+block content
+  include timetablepage.pug
+
+block extraHeader
+  script(src="https://unpkg.com/jquery@3.7.1/dist/jquery.min.js" crossorigin="anonymous")
+
+  if config.menuType === 'radio'
+    script(src=`${config.assetPath}js/timetable-menu.js`)
+
+  if config.showMap
+    if config.hasGtfsRealtime
+      script(src=`${config.assetPath}js/pbf.js`)
+      script(src=`${config.assetPath}js/gtfs-realtime.browser.proto.js`)
+    script(src="https://api.mapbox.com/mapbox-gl-js/v3.6.0/mapbox-gl.js")
+    script.
+      mapboxgl.accessToken = '#{config.mapboxAccessToken}';
+    script(src=`${config.assetPath}js/timetable-map.js`)
+
+    link(href="https://api.mapbox.com/mapbox-gl-js/v3.6.0/mapbox-gl.css" rel="stylesheet")
+
+  link(rel="stylesheet" href=`${config.assetPath}css/timetable_styles.css`)
+  if config.outputFormat === 'pdf'
+    link(rel="stylesheet" href=`${config.assetPath}css/timetable_pdf_styles.css`)
+