Category: Advanced using of twig with the JCI-Plugin

https://verkehr.autobahn.de/o/autobahn/details/warning/{warning.identifier}
gives details of a warnings (list of warnings, see here)

Local stored JSON: http://api.json-content-importer.com/extra/json/nZpel9fTE1TLU5JL3JfTE1TLU5JLzI0MDQ5M19EICBOSSBMTVMtTkkgIC4w.json

JCI-Template:

• name: detail-autobahn
• URL:
  “dummyrequest” does not do a http-request but gives basic info about the page. With that you can catch errors etc.

{% set url = "dummyrequest" %}
{% if urlparam.warningid %}
{% set url = "https://verkehr.autobahn.de/o/autobahn/details/warning/" ~ urlparam.warningid %}
{% endif %}
{{url}}

• urlparam4twig: warningid
• twig-template:

<a href="/api-verkehr-autobahn-de-o/">back to list</a><hr>
{% if subtitle %}
    <strong>{{subtitle}}</strong><br>
    {{description.0}}<br>
    coordinates: {{coordinate.lat}},{{coordinate.long}}<br>
    {% for k,v in description %}
        {% if v %}
            {{v}}<br>
        {% endif %}
    {% endfor %}
{% else %}
no warning found
{% endif %}

Shortcode:

[jsoncontentimporterpro nameoftemplate="detail-autobahn"]

In Action:

Challenge:
Show current and forecast weather data via
https://api.openweathermap.org/data/2.5/onecall?lat={{lat}}&lon={{lon}}&exclude={part}&appid=….
for a searchable location.

Solution:
Use the above API for the weather at a location defined by lat and lon. Also use the openweather-geocoding API to transform a locationname into lat & lon.

In Action:

See how this is done with a JCI-Shortcode:

[jsoncontentimporterpro nameoftemplate="openweather-forecast"]

With this JCI-template:

• urlparam4twig: su
• URL:

{% set su = "augsburg" %}{% if urlparam.su %}{% set su = urlparam.su %}{% endif %}
http://api.openweathermap.org/geo/1.0/direct?q={{su}}&limit=10&appid=...

• twig-template:
  For the weather-forecast each location points at /openweather-forecast/

{% set su = "augsburg" %}{% if urlparam.su %}{% set su = urlparam.su %}{% endif %}
<form action=".">
    <input type=text name=su placeholder="Insert name of a location" value="{{su}}">
    <input type=submit value="Search location and weather">
</form>
<hr>
{% for l in _context %}
    {% if l.lat %}
        {{l.name}} ({{l.country}}
        {% if l.state %}
            , {{l.state}}
        {% endif %})
        <a href="https://www.google.com/maps/place//@{{l.lat}},{{l.lon}},14z" target="_blank">show on map</a>
        |
        <a href="/openweather-forecast/?lat={{l.lat}}&lon={{l.lon}}&su={{l.name|e|url_encode}}">show weather</a>
        <br>
    {% endif %}
{% endfor %}

This page shows deatails for a MVG-Station in munich and the next departing vehicles:

• U1: UBAHN to Mangfallplatz
• U7: UBAHN to Sendlinger Tor
• 153: BUS to Odeonsplatz

Create a new JCI-template:

• urlparam4twig: stationid#su
• URL:

{% set su = "de:09162:180" %}
{% if urlparam.stationid %}{% set su = urlparam.stationid | trim | url_encode %}
{% endif %}
https://www.mvg.de/api/fahrinfo/departure/{{su}}?footway=4

twig-template:

<a href="/pro-mvg-api-munchner-verkehrsverbund-adresssuche/?su={{urlparam.su | url_encode}}">back to adress-search {{urlparam.su | e | stripslashes }}</a><hr>

servingLines:<br>
<ul>
{% for item in servingLines %}
<li>
    {{item.lineNumber}}: {{item.product}} to {{item.destination}}
    </li>
{% endfor %}
</ul>
<hr>
{% set hour = 3600 %}
{% set currenttimestamp = ("now"|date("U")) %}
current time: {{ (currenttimestamp+hour) |date("H:i:s") }}
<hr>
departures:<br>
<table border=1>
{% for i in departures | slice(0, 12) %}
       {% set deltasec = (i.departureTime/1000 - currenttimestamp) %}
    <tr><td>
        {% set mindist = (deltasec/60) |round(0, "floor") %}
        {% if mindist>60 %}
            {% set hrs = (deltasec/60/60) | round(0, "floor") %}
           {{hrs}} Hrs, {{mindist-60*hrs}} Min
        {% else %}
            {{mindist}} Min
        {% endif %}        
        
     </td><td>
       {{(i.departureTime/1000+hour) | date("H:i") }}
     </td><td>
       {{i.label}} 
    </td><td>
        {{i.destination}}
     </td><td>
        {{i.platform}}
   </td></tr>
{% endfor %}
</table>

API: https://www.mvg.de/api/fahrinfo/location/queryWeb?q=maillinger
“q” is the search-parameter you can use. If a station is found there is a link to another page which shows the next departing trains. more

In Action:

• TRAM tariffZones: m, next trains - München , Deutsches Museum , GoogleMaps
• München , Speiserei Volksbad , GoogleMaps
• München , Müllersches Volksbad , GoogleMaps
• Kirchheim (b München) , Raiffeisen- und Volksbank , GoogleMaps
• Münsing , Volksbank München Land eG , GoogleMaps
• Haimhausen , Volksbank Raiffeisenbank München-Nord , GoogleMaps
• Bruckmühl (Mangfall) , Volksbank Raiffeisenbank Rosenheim-Chiemsee eG, Heufeld , GoogleMaps
• Landsberied , Volksbank , GoogleMaps
• Karlsfeld (Obb) , Volksbank Raiffeisenbank , GoogleMaps
• Bad Feilnbach , Volksbank Raiffeisenbank , GoogleMaps
• Großkarolinenfeld , Volksbank Raiffeisenbank , GoogleMaps
• Dachau , Volksbank Raiffeisenbank Dachau , GoogleMaps
• Haimhausen , Volksbank Raiffeisenbank Dachau , GoogleMaps
• Hilgertshausen , Volksbank Raiffeisenbank Dachau , GoogleMaps
• Markt Indersdorf , Volksbank Raiffeisenbank Dachau , GoogleMaps
• Petershausen , Volksbank Raiffeisenbank Dachau , GoogleMaps
• Odelzhausen , Volksbank Raiffeisenbank Dachau eG , GoogleMaps
• Röhrmoos (Kr DAH) , Volksbank Raiffeisenbank Dachau e.G. , GoogleMaps
• Maisach , Volksbank Raiffeisenbank Fürstenfeldbruck eG , GoogleMaps
• Vierkirchen (b DAH) , Volksbank Raiffeisenbank Dachau eG, GS Vierkirchen , GoogleMaps
• Bad Feilnbach , Volksbank Raiffeisenbank Rosenheim-Chiemsee | Au , GoogleMaps
• Alling (Oberbay) , Volksbank Raiffeisenbank Fürstenfeldbruck eG - Geschäftsstelle Biburg , GoogleMaps
• Wörthsee , Volksbank Raiffeisenbank Starnberg-Herrsching-Landsberg eG , GoogleMaps
• Fürstenfeldbruck , Volksbank Raiffeisenbank Fürstenfeldbruck eG - Geschäftsstelle Center-Buchenau , GoogleMaps
• Hattenhofen (Kr FFB) , Volksbank Raiffeisenbank Fürstenfeldbruck eG, Geschäftsstelle Hattenhofen , GoogleMaps
• Bichl (b Bad Tölz) , Volksbank , GoogleMaps
• Eichenau (b München) , Volksbank , GoogleMaps
• Mammendorf (Oberbay) , Volksbank , GoogleMaps
• Puchheim (Obb) , Volksbank , GoogleMaps
• Benediktbeuern , Volksbank , GoogleMaps
• Murnau a.Staffelsee , Volksbank , GoogleMaps
• Pörnbach , Volksbank , GoogleMaps
• Frauenneuharting , Volksbank Ebersberg , GoogleMaps
• Mainburg/Kr Kelheim , Hallertauer Volksbank , GoogleMaps
• Steinhöring (Kr EBE) , Raiffeisen-Volksbank , GoogleMaps
• Weyarn , Raiffeisen-Volksbank , GoogleMaps
• Pfaffenhofen (Ilm) , Hallertauer Volksbank , GoogleMaps
• Allershausen (Oberbay) , Volksbank-Raiffeisenbank , GoogleMaps
• Alling (Oberbay) , Volksbank Raiffeisenbank , GoogleMaps
• Altomünster , Volksbank-Raiffeisenbank , GoogleMaps
• Bergkirchen (Kr DAH) , Volksbank Raiffeisenbank , GoogleMaps
• Bruckmühl (Mangfall) , Volksbank Raiffeisenbank , GoogleMaps
• Bruckmühl (Mangfall) , Volksbank Raiffeisenbank (Justus-von-Liebig-Straße 4) , GoogleMaps
• Brunnthal (b München) , Volksbank Raiffeisenbank , GoogleMaps
• Emmering (Kr FFB) , Volksbank Raiffeisenbank , GoogleMaps
• Fürstenfeldbruck , Volksbank Raiffeisenbank , GoogleMaps
• Germering , Volksbank Raiffeisenbank , GoogleMaps
• Germering , Volksbank Raiffeisenbank (Untere Bahnhofstraße 38) , GoogleMaps
• Hebertshausen , Volksbank Raiffeisenbank , GoogleMaps
• Mittelstetten (FFB) , Volksbank Raiffeisenbank , GoogleMaps
• München , Volksbank Raiffeisenbank , GoogleMaps
• Oberpframmern , Raiffeisenbank-Volksbank , GoogleMaps
• Reichertshausen (Ilm) , Volksbank Raiffeisenbank , GoogleMaps
• Schwabhausen (b DAH) , Volksbank Raiffeisenbank , GoogleMaps
• Weßling , Volksbank Raiffeisenbank , GoogleMaps
• Kiefersfelden , Volksbank Raiffeisenbank , GoogleMaps
• Prutting , Volksbank Raiffeisenbank , GoogleMaps
• Rosenheim , Volksbank Raiffeisenbank (Westerndorfer Straße 65) , GoogleMaps
• Rosenheim , Volksbank Raiffeisenbank (Kufsteiner Straße 12) , GoogleMaps
• Rosenheim , Volksbank Raiffeisenbank , GoogleMaps
• Stephanskirchen , Volksbank Raiffeisenbank , GoogleMaps
• Buch am Buchrain , Raiffeisen-Volksbank Isen-Sempt , GoogleMaps
• Ebersberg (Oberbay) , Raiffeisen Volksbank Ebersberg , GoogleMaps
• Hohenlinden , Raiffeisen-Volksbank Isen Sempt , GoogleMaps
• Maisach , Volksbank Raiffeisenbank Maisach , GoogleMaps
• Freising , Freisinger Bank Volksbank-Raiffeisenbank , GoogleMaps
• Grafing (b München) , Raiffeisen-Volksbank Ebersberg eG , GoogleMaps
• München , Volksbank Raiffeisenbank Ismaning eG , GoogleMaps
• Wolfersdorf (Oberbay) , Freisinger Bank eG Volksbank-Raiffeisenbank , GoogleMaps
• Wolnzach , Hallertauer Volksbank, Filiale Wolnzach , GoogleMaps
• Pfaffenhofen (Ilm) , Hallertauer Volksbank Filiale Uttenhofen , GoogleMaps
• Scheyern , Volksbank Raiffeisenbank Bayern Mitte , GoogleMaps
• Grafing (b München) , Raiffeisen-Volksbank SB Grafing Bahnhof , GoogleMaps
• Aying , Volksbank Raiffeisenbank Rosenheim-Chiemsee eG , GoogleMaps
• Höhenkirchen-Siegertsbrunn , Volksbank Raiffeisenbank Rosenheim-Chiemsee eG (Rosenheimer Straße 18) , GoogleMaps
• Höhenkirchen-Siegertsbrunn , Volksbank Raiffeisenbank Rosenheim-Chiemsee eG (Bahnhofstraße 34) , GoogleMaps
• Hohenbrunn (Obb) , Volksbank Raiffeisenbank Rosenheim-Chiemsee eG , GoogleMaps
• Neufahrn (b Freising) , Freisinger Bank eG Volksbank-Raiffeisenbank , GoogleMaps
• Ottobrunn , Volksbank Raiffeisenbank Rosenheim-Chiemsee eG , GoogleMaps
• Paunzhausen , Volksbank Raiffeisenbank Bayern Mitte eG , GoogleMaps
• Hausham (Obb) , Volksbank Raiffeisenbank Rosenheim-Chiemsee eG , GoogleMaps
• Moosburg (an der Isar) , Volksbank Raiffeisenbank Bayern Mitte eG, Geschäftsstelle Moosburg , GoogleMaps
• Raubling , Volksbank Raiffeisenbank Rosenheim-Chiemsee eG, Raubling, Poststraße , GoogleMaps

To realize such form do this create a JCI-PRO-Template:

• urlparam4twig: su
• URL (default search “blutenburg”):

{% set su = "blutenburg" %}
{% if urlparam.su %}{% set su = urlparam.su | trim | url_encode %}
{% endif %}
https://www.mvg.de/api/fahrinfo/location/queryWeb?q={{su}}

twig-template:

{% set su = "blutenburg" %}
{% if urlparam.su %}
    {% set su = urlparam.su | trim %}
{% endif %}
<form action ="">
    <input type=text name=su value="{{su | e | stripslashes }}">
    <input type=submit value="Search">
</form>
<hr>
{% set hits = (locations | length ) %}
{% if hits>0 %}
    {{hits}} Treffer:<br>
    <ul>
    {% for item in locations %}
        <li>
        {% for prok, prov in item.products %}
            {{prov}} 
        {% endfor %}
        
        {% if item.type=="station" %}
            tariffZones: {{item.tariffZones}}, <a href="/pro-mvg-api-stationdetails/?stationid={{item.id}}&su={{su | url_encode}}">next trains</a> - 
        {% endif %}

        {{item.place}}
        {% if item.street %}
            , {{item.street}}
        {% endif %}
        {% if item.name %}
            , {{item.name}}
        {% endif %}
        , <a href="https://www.google.com/maps/dir//{{item.latitude}},{{item.longitude}}/@{{item.latitude}},{{item.longitude}},15z?hl=en" target="_blank">GoogleMaps</a>
        </li>
    {% endfor %}
    </ul>
{% else %}
nothing found
{% endif %}
Examples: 
<a href="./?su=volksbad">"Volksbad" also finds "Volksbank"</a> |
<a href="./?su=sushi">Sushi in Munich</a> |
<a href="./?su=fc+bayern">FC Bayern</a>