API: Details verkehr.autobahn.de/o/…

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:

back to list
no warning found

PRO: oAuth2-Demo by using Shortcode in twig-code

This pages shows you how to get access to the data at
http://api.json-content-importer.com/extra/api/getdata.php?gd=acc

This API / URL expects:

  • Useragent: mozilla
  • HTTP-Header with “Authorization:Bearer TOKEN”
  • “TOKEN” has to be obtained from
    http://api.json-content-importer.com/extra/api/gettoken.php
    For that user / password has to be sent by CURL-POST.

This is called oAuth2, to avoid sending user / password via http, but a TOKEN the API can check if user / password is ok.

We need two JCI-Shortcodes for that.

JCI-Template 1: The Shortcode (orderofshortcodeeval=1 tells the plugin to first execute the twig code and then the Shortcode – 10 would not execute the Shortcode, then you can see the TOKEN…)

[jsoncontentimporterpro nameoftemplate="demo-oauth" orderofshortcodeeval=1]

is for the page which will show us the data.

Defined it like this:

  • Name: demo-oauth
  • URL: http://api.json-content-importer.com/extra/api/gettoken.php
  • method: CURL-POST
  • curloptions: CURLOPT_POSTFIELDS={“user”: “test”, “password”: “mypass”}
  • twig-template:
test<br>
[jsoncontentimporterpro nameoftemplate="demo-oauth2" curloptions="CURLOPT_USERAGENT=mozilla;CURLOPT_HTTPHEADER=Authorization:Bearer {{access_token | striptags}}"]

Ok, we need JCI-Template 2:

  • name: demo-oath2
  • URL: http://api.json-content-importer.com/extra/api/getdata.php?gd=acc
  • method: CURL-GET
  • curloptions: are sent from the other JCI-Template, where this Shortcode is used
  • twig-template:
{% if datasuccess %}
{% for b in boat %}
boat-id: {{b.id}}<br>
{% endfor %}
<hr>
{% for h in harbour %}
harbour-id: {{h.id}}<br>
{% endfor %}
{% endif %}

In Action:

test
boat-id: 1589595
boat-id: 5883953
boat-id: 3803341
boat-id: 4364416
boat-id: 200306
boat-id: 638101

harbour-id: 1315823
harbour-id: 712349

PRO: Update CPT with new JSON-data

This pages shows you how to update Custom Post Type-Pages by running a twig-script which is loading the JSON-data and updates Page by Page.

Create a JCI-Template with

  • URL: http://api.json-content-importer.com/extra/json/meetup/1.json
  • twig-template:
    • wp_clear_taxonomy: remove all taxconomy-enties from the taxonomy defined by “taxonomyslug”
    • “{% for i in _context %}”: Loop through JSON-data
    • wp_get_cp_by_cpf_keyvalue: Check if there are existing Pages of the CPT slug (=”cptexample”), where the CPF “cpf1” matches the JSON-datafield “id”
    • If there is a Page use wp_insert_custom_field_keyvalue to insert / overwrite a CPF. And wp_insert_taxonomy to insert a taxonomy-value.
{% set slug = 'cptexample' %}
{% set taxonomyslug = 'cptaxonomyexample' %}
{% set cleartax = wp_clear_taxonomy(taxonomyslug, FALSE) %}
{% for i in _context %}
{% if i.id %}
name: {{i.name}}<br>
{% set cpfound = wp_get_cp_by_cpf_keyvalue(slug , 'cpf1', i.id)  %}
{% if cpfound.0 %}
{% set tz = date().format('U') %}
{% set rescpf = wp_insert_custom_field_keyvalue(cpfound.0, 'cpf2', tz ~ ' - '~i.name, FALSE) %}
{% set taxval= 'tax-'~cpfound.0 %}
{% set addtax = wp_insert_taxonomy(cpfound.0, taxonomyslug, taxval, TRUE) %}
{% endif %}
{% endif %}
{% endfor %}

In Action:

name: Love Breakfast
add taxonomy to page 10296: cptaxonomyexample
name: Drupal Coworking Day
add taxonomy to page 10297: cptaxonomyexample
name: Geeks - Februrary Edition
add taxonomy to page 10298: cptaxonomyexample
name: February 2019 Meetup
add taxonomy to page 10299: cptaxonomyexample
name: UG February Event
add taxonomy to page 10300: cptaxonomyexample
name: Ignite Talks & Networking
add taxonomy to page 10301: cptaxonomyexample
name: public Event
add taxonomy to page 10302: cptaxonomyexample
name: D-Meetup
add taxonomy to page 10303: cptaxonomyexample

PRO: Openweather Forecast – search location, show weather

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:


Augsburg (DE , Bavaria ) show on map | show weather
Augsburg (DE , Schleswig-Holstein ) show on map | show weather
Augsburg (US , Illinois ) show on map | show weather
Augsburg (US , Arkansas ) show on map | show weather
Augsburg (GY , Mahaica-Berbice ) show on map | show weather

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=...
{% 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 %}

twig-matches: Check values by a regular expression

Challenge: Load http://api.json-content-importer.com/extra/json/casinochompcasinocom/manifest_multicurrency.json and display those game-items containing a defined title.

Solution: Create a new JCI-template with the following settings.

  • URL: see above
  • twig-template:
    Note
    In older twig-Versions this was ok:
    {% for g in games if g.title matches ‘/’~t~’/i’ %}
    In twig 3 and above this is not ok. There you must separate for and if
{% set t = 'Mont' %}
{% if urlparam.t %}
{% set t = urlparam.t %}
{% endif %}
term: {{t}}<br>
{% for g in games %}
    {% if g.title matches '/'~t~'/i' %}
        title: {{g.title}}<br>
        {% for i in g.images %}
            {{i.url}}
        {% endfor %}
        <hr>
    {% endif %}
{% endfor %}

In Action:

term: Mont
title: Montezuma
/content/all/images/montezuma/banner.jpg /content/all/images/montezuma/tile.jpg

PRO: JSON meets JCI and jQuery for a facet-search

Selecting a hotel for oyur holiday depends on options like location and price. With a facet-search you select several locations out of the all available and define a range for the price. Then the matcihing hotels should be displayed.

This can be done with the JCI-PRO-Plugin which grabs the JSON-data, builds a facet and shows the selected data. See here for an example.

To build that you need a data-source (JSON-API), the JCI-PRO-Plugin, jQuery-Libraries (maybe part of your WordPress-template or loadable via JCI) and twig-Software für the facet and the results.

See here how this can be done.

PRO: MVG-API Stationdetails

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

back to adress-search
servingLines:
  • U1: UBAHN to Mangfallplatz
  • U7: UBAHN to Neuperlach Zentrum
  • 153: BUS to Odeonsplatz U via Hochschule

current time: 22:53:57
departures:
-632 Min 12:22 153 Odeonsplatz U via Hochschule
-632 Min 12:22 U1 Mangfallplatz Gleis 2
-631 Min 12:23 U7 Olympia-Einkaufszentrum Gleis 1
-629 Min 12:25 153 Trappentreustraße
-627 Min 12:27 U7 Sendlinger Tor Gleis 2
-626 Min 12:28 U1 Olympia-Einkaufszentrum Gleis 1
-622 Min 12:32 153 Odeonsplatz U via Hochschule
-622 Min 12:32 U1 Mangfallplatz Gleis 2
-621 Min 12:33 U7 Olympia-Einkaufszentrum Gleis 1
-619 Min 12:35 153 Trappentreustraße
-617 Min 12:37 U7 Sendlinger Tor Gleis 2
-616 Min 12:38 U1 Olympia-Einkaufszentrum Gleis 1

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>

PRO: MVG-API (Münchner Verkehrsverbund) – Adresssuche

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:


12 Treffer:
Examples: "Volksbad" also finds "Volksbank" | Sushi in Munich | FC Bayern

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>

PRO: Quote of the day

This pages demonstrates how to get JSON with a “quote of the day”, show the quote and store it in a Custom Post Page.

  1. Data-Source:
    API: https://quotes.rest/ and https://quotes.rest/qod
    Local stored JSON: http://api.json-content-importer.com/extra/json/Quote_of_the_day.json
  2. Create a new JCI-Template:
  • Name of template: quote-of-the day
  • URL: https://quotes.rest/qod
  • Curloptions (otherwise you get XML):
CURLOPT_HTTPHEADER=accept:application/json##content-type: application/json

twig-template:

{% set  nowtime = "now"| date("U")  %}
{% set dateofquote = contents.quotes.0.date | date("d.m.Y") %}
{% set dateofquotetime = contents.quotes.0.date | date("U") %}
{% set author = contents.quotes.0.author %}
{% set quote= (contents.quotes.0.quote | slice(0,10)) ~ '... (we use only the first 10 chars of the quote, see more at <a href=" https://theysaidso.com/" target="_blank">https://theysaidso.com/</a>)' %}
{% set id = contents.quotes.0.id %}
{% set cont = '<center><strong>Quote of '~dateofquote~' by '~author~':</strong><br>'~quote~'</center>' %}

{% set cont = cont ~ '<hr><a href="/pro-quote-of-the-day/">see how this page was generated out of JSON</a>' %}

{{cont}}

<hr>
{% set slug = 'cptquoteoftheday' %}
{% set taxonomyslug = 'quoteofthedayauthors' %}

is there any stored-quote of the day {{dateofquote}}?<br>
{% set cpids = wp_get_cp_by_cpf_keyvalue(slug , "date", dateofquotetime , FALSE) %}

<!--{{cpids  | dump }}-->

{% if cpids %}
yes there is already one: nothing to do

{% set  rescpf = wp_insert_custom_field_keyvalue(cpids.0, 'latestupdate', nowtime, FALSE) %}

{% else %}
create a new cpt:<br>
{% set titel = dateofquote ~': '~author ~ '- ' ~ nowtime %}
{% set pageslug=  'name-'~author %}
{% set postStatusUsed= 'publish' %}
{% set newpageid = wp_new_custom_post(slug, titel, pageslug, cont, "", dateofquote, postStatusUsed, 1, FALSE) %} 
newpageid : {{newpageid }}<br>
{% set  rescpf = wp_insert_custom_field_keyvalue(newpageid , 'date', dateofquotetime, FALSE) %}
{% set  rescpf = wp_insert_custom_field_keyvalue(newpageid , 'author', author, FALSE) %}
{% set  rescpf = wp_insert_custom_field_keyvalue(newpageid , 'quote', quote, FALSE) %}
{% set tax = wp_insert_taxonomy(newpageid, taxonomyslug, author, FALSE) %}
{% endif %}

3. Set up a Custom Post Type with custom Post Fields
You might use a Plugin like “Custom Post Type UI” for a new Custom Post Type with slug “cptexample”.
And ACF for Custom Post Fields to set CPFs with the slugs “quote”, “date” and “author”.
The slugs for the CPT and the CPFs are used in the twig-template!

4. In Action:

Quote of 30.01.2022 by Paul Brown:
When you w... (we use only the first 10 chars of the quote, see more at https://theysaidso.com/)

see how this page was generated out of JSON
is there any stored-quote of the day 30.01.2022?
yes there is already one: nothing to do