O projektu

Odjezdník je jednoduchý web, který zobrazuje aktuální i budoucí odjezdy pražské MHD z otevřených dat PID. Vznikl jako první malý projekt, kde jsem si chtěl vyzkoušet práci s opendaty PIDu a zároveň si udělat něco hezkého.

Na vývoji pracuju postupně a s pomocí ChatGPT, který mi usnadňuje psaní kódu i testování nápadů. Cílem je vytvořit přehledný a spolehlivý panel pro dopravní nadšence i běžné cestující – použitelný na mobilu, tabletu i počítači.

Autorem projektu je Anlex, řidič tramvaje a spoluautor pořadu Metrobus, kterého baví doprava, grafika a propojování obojího v malých webových projektech.

Ovládání

• Kliknutím na název zastávky otevřeš výběrové okno s našeptávačem.
• Tlačítka + a − posouvají čas o minutu dopředu nebo dozadu.
• Kliknutím na čas se vše vrátí do reálného času.
• Filtr nástupišť umožní zobrazit jen konkrétní větev zastávky.

Zatím Odjezdník zpracovává data pouze pro zastávky na území Prahy. Do budoucna plánuju rozšíření i na Středočeský kraj.

Zpětná vazba

Pokud máš nápad, připomínku nebo jsi narazil na chybu, budu rád, když napíšeš:

• 📩 e-mail: anlex@anlex.cz
• 📱 Instagram: @anlexcz

Každý nápad nebo postřeh pomůže projekt posunout dál.

Changelog

23. prosince 2025 – verze 1.1.2

• Odkazy na konkrétní nastavení filtrů:
  • Do URL se ukládají filtry nástupišť a druhů dopravy přes query parametry ?p=… a &m=….
  • Otevření odkazu obnoví stejné filtry a UI je rovnou zobrazí jako aktivní čipy.
  • Neplatné hodnoty (neexistující nástupiště / neznámý mód) se automaticky zahodí a URL se sama „očistí“.
• Chování historie prohlížeče:
  • Změny filtrů aktualizují URL bez spamu v historii (používá se replaceState).
  • Změna zastávky se ukládá do historie jako běžná navigace (pushState).
  • Tlačítka zpět/vpřed obnovují i filtry z URL.

22. prosince 2025 – verze 1.1.1

• Spuštění projektu v podadresáři:
  • Doplněný BASE_PATH (funguje stejně na webu i na localu v /odjezdnik/).
  • Sjednocené skládání cest přes js/base.js a withBase().
• Stabilita načítání dat:
  • Ošetřené HTTP chyby při fetchování (konec pádů typu „Unexpected token <“ při HTML odpovědi).
  • Chytřejší refresh logika: oddělení přepočtu tabule od skutečného fetchování.
• Mapa nástupišť:
  • Přepínání podkladu (Tmavá / Satelit) + zapamatování volby.
  • Opravené zavírání overlaye (křížek, klik mimo, Escape) + cleanup Leaflet instance.
• Bezpečnost:
  • .htaccess: povolené jen nezbytné veřejné soubory v /xml/, zbytek interních cest blokovaný.
  • Endpoint pro logování zastávek povolen, historie blokovaná (neveřejná).

15. listopadu 2025 – verze 1.1

• Vylepšené filtry druhů dopravy:
  • Oddělené módy pro vlak, metro, tramvaj, trolejbus, městské a regionální autobusy a přívoz.
  • Rozlišení městských a regionálních autobusů nejen barvou, ale i ve filtrech.
  • Nový vzhled čipů: neutrální šedé pozadí, barevná spodní linka podle druhu dopravy, najetím myši se vybarví ikonka.
  • Metro na přestupních stanicích má dvoubarevný gradient (A/B nebo B/C) ve spodní lince, ikoně i aktivním stavu.
  • Samostatný čip pro trolejbusy s vlastní barvou.
  • Vlak lze jednoduše schovat přes módový filtr.
• Mapa nástupišť:
  • Tlačítko pro otevření mapy nástupišť přesunuto k filtrům druhů dopravy – vizuálně sjednoceno s ostatními čipy.
• Zobrazení vozidel:
  • Skrytí badge s evidenčním číslem tam, kde nedává smysl (metro, přívozy, prázdné nebo „-“ hodnoty).
• Časové okno odjezdů:
  • Zobrazení zpožděných spojů až 30 minut zpátky.
  • Chytré rozšíření výhledu dopředu nad 60 minut podle počtu spojů (až zhruba na 2 hodiny, aby tabule nebyla prázdná).
• Ovládání zastávky:
  • Vedle názvu zastávky přidáno tlačítko s lupou pro rychlou změnu zastávky.
• Aktualizace datové logiky (real-time režim):
  • Automatické stahování aktuálních dat z Golemia každých 15 sekund v reálném čase (force refresh), aby bylo možné sledovat skutečný příjezd a pohyb vozidel.
  • Oddělení přepočtu dat v tabulce od skutečného fetchování – simulace času neprovádí zbytečné dotazy na API.
  • Vylepšené zpracování zpoždění a poslední projeté zastávky včetně plynulého stárnutí údajů („před X s“).
• Nové barevné rozsahy zpoždění:
  • Předjetí 60 s a více – zelená.
  • −59 až +59 s – standardní šedá.
  • +60 až +119 s – žlutá.
  • +120 až +359 s – oranžová.
  • +360 s a více – červená.
  • Nová logika implementována v fmtDelayText() a sjednocena pro všechny části UI.
• Zobrazení reálného času odjezdu:
  • Reálný čas nyní využívá stejnou delay-třídu jako samotné zpoždění, aby bylo na první pohled zřejmé, že jde o opožděný či předjetý spoj.
  • Experimentální styly (outline / glow) nahrazeny jemnějším a čistším vizuálním řešením.
• Úpravy renderování tabulky:
  • Zjednodušené předávání delay-tříd do všech částí řádku (reálný čas, bublina zpoždění, doplňkové informace).
  • Refaktor renderTable() a sjednocení práce s odjezdy, platformami, ikonami vozidel a animacemi.

14. listopadu 2025

• Optimalizace jádra a výkonu:
  • Opravené cesty k databázím vozidel a odstraněný duplicitní $vehUrl.
  • Sjednocená časová zóna a vyčištěné debug výpisy.
  • Přepracované načítání dat systémem cache-first pro odstranění zbytečných fetchů.
  • Oddělený fetch a render pro stabilnější tabulku bez blikání.
  • Živé počítání stáří polohy vozidla (aktualizace 1× za sekundu).
  • Filtry zpracovávají data přímo z cache a zobrazují přesnější stavové hlášky.
• Úpravy mapy a nástupišť:
  • Nástupiště se barví podle typů dopravy, včetně 2–3barevných gradientů při kombinacích linek.
  • Noční linky neovlivňují barvu, pokud na stejném nástupišti jezdí i denní linky.
  • Vylepšené vykreslování ikon – createPlatformIcon()podporuje plné barvy i gradienty.
• Úpravy tabulky odjezdů:
  • Barvení nástupišť v tabulce odstraněno – zůstává jen neutrální badge.
  • Odstraněny staré gradientové funkce z renderTable.js.
  • Refaktorem zjednodušené řazení, filtrace a vykreslování zpoždění.
  • Ujasněno časové okno pro zobrazované spoje: −20 min až +120 min.

13. listopadu 2025

• Zobrazení odjezdů je přehlednější a realističtější:
  • Řazení probíhá podle skutečného času odjezdu (jízdní řád + zpoždění).
  • V tabulce se nově ukazuje plánovaný čas, reálný čas i zpoždění.
  • Barvy zpoždění rozlišují míru zdržení – šedá, oranžová, červená a zelená.
• Linky a typy dopravy:
  • Noční spoje mají tmavší odstíny než denní linky.
  • Náhradní doprava (linky X) má výrazný oranžový okraj, ale zachovává barvu podle typu dopravy.
• Čas a aktualizace:
  • Kliknutí na hodiny nebo změna času (+ / −) teď provede okamžitý refresh dat.
  • Vzhled časů byl sjednocen a působí čistěji a čitelněji.

10. listopadu 2025

• Přidány filtry druhů dopravy (tramvaj, autobus, trolejbus, metro, vlak, přívoz):
  • Každý druh dopravy má vlastní ikonu (SVG v img/modes/).
  • Filtry mají barvy odpovídající PID (červená = tram, modrá = bus, zelená = trolejbus, fialová = metro).
  • Neaktivní módy se zobrazují tmavě, aktivní mají tlumenou barvu pro kontrast s bílou ikonou.
• Refaktor filtrování:
  • Odděleno do nového modulu js/filters.js (nástupiště + druh dopravy).
  • Hlavní skript script.js zjednodušen – filtry volány přes renderFilters().
• Detekce typu dopravy vylepšena:
  • Určuje se primárně podle StopsList.json.
  • Přidán fallback podle číselné řady PID:
    • 1–49, 60–99 = tram
    • 50–59 = trolejbus
    • 100–999 = autobus
    • A, B, C = metro
• Úpravy designu:
  • Ikony módů mají bílou konturu a tmavé pozadí při neaktivitě.
  • V odjezdové tabulce má písmeno nástupiště vlastní „chip“ (badge).
  • Sladěné styly filtrů, přechody, hover efekty a kontrastní barvy.

7. listopadu 2025

• Dokončena logika zobrazení odjezdů:
  • Řazení podle jízdního řádu a zpoždění (kombinace scheduled + delay).
  • Ve výhledu zobrazovány i spoje zpožděné až o 20 minut zpět.
  • V real-time režimu spoje mizí 15 sekund po skutečném odjezdu.
  • Při simulaci času spoje zůstávají aktivní do svého odjezdu, bez krátkého zpoždění.
• Vylepšená detekce a načítání vozidel – přidána databáze KT8D5 a 14T s rozpoznáním nátěrů a automatickými ikonami.
• Uživatelská personalizace:
  • Poslední zvolená zastávka se ukládá do prohlížeče (localStorage).
  • Možnost simulace času pomocí tlačítek + a −.
  • Čas se zobrazuje v reálném čase a reaguje na každou sekundu.
• Grafické změny:
  • Přidán přehledný overlay pro výběr zastávky s našeptávačem a historií.
  • Lepší stylování inputů, žádný horizontální posuvník, ladění kontrastu.
  • Ikony vozidel zmenšeny (20 px) a zarovnány s textem.
  • Na název zastávky reaguje klik – otevře výběr, ne celá hlavička.
• Optimalizace výkonu a načítání:
  • Načítání dat každých 15 s synchronizováno s hodinami.
  • Jednotné rozdělení skriptů do modulů (script.js, clock.js, renderTable.js, vehicleIcons.js).