            <script>
                const contacts = JSON.parse(contactsJSON);
                const states = JSON.parse(statesTerms);
                const responsibilityAreas = JSON.parse(responsibilityTerms);

                (function( $ ) {
                    'use strict';
                    $(function() {

                        // Triggers when a user selects a state
                        $(document).on('change', 'select.bs_cp-select-state', function () {
                            $('.bs_contact-page-main-wrapper .bs_area-select-wrapper').hide();
                            cleanShowBox();
                            resetResponsibilitySelect();

                            const stateId = $(this).val();
                            const stateName = states.filter(value => {
                               if (value.id === parseInt(stateId)) return value;
                            }).pop().name;
                            let contactIndexes = getContactIndexesByStateId(stateId);

                            // Only 6 specific states (depends on the 'states' taxonomy)
                            if (contactIndexes.length > 0) {
                                contactIndexes.forEach(function (contactIndex, index) {
                                    if (contacts[contactIndex]['header'].length > 0) {
                                        $('div.bs_cp-showbox').append('<h4>' + contacts[contactIndex]['header'] + '</h4>');
                                    } else {
                                        $('div.bs_cp-showbox').append('<h4>Ansprechpartnerin für ' + stateName + '</h4>');
                                    }

                                    showContact(contactIndex);
                                });

                                // Other states
                            } else {
                                $('.bs_contact-page-main-wrapper .bs_area-select-wrapper').css('display', 'flex');
                            }
                        });

                        // Triggers when an user selects area of responsibility
                        $(document).on('change', 'select.bs_cp-select-responsibility', function () {
                            cleanShowBox();

                            const responsibilityAreaId = parseInt($(this).val());
                            let contactIndexes = getContactIndexesByResponsibiltyAreaId(responsibilityAreaId);

                            if (contactIndexes.length > 0) {
                                let lastHeader;
                                contactIndexes.forEach(function (contactIndex, index) {
                                    if (contacts[contactIndex]['header'].length > 0 && lastHeader != '<h4>' + contacts[contactIndex]['header'] + '</h4>') {
                                        $('div.bs_cp-showbox').append('<h4>' + contacts[contactIndex]['header'] + '</h4>');
                                        lastHeader = '<h4>' + contacts[contactIndex]['header'] + '</h4>';
                                    } else if (lastHeader != '<h4>Außerhalb von NRW: ZfTI - Bundestransfer-Team mit den Ansprechpersonen</h4>') {
                                        $('div.bs_cp-showbox').append('<h4>Außerhalb von NRW: ZfTI - Bundestransfer-Team mit den Ansprechpersonen</h4>');
                                        lastHeader = '<h4>Außerhalb von NRW: ZfTI - Bundestransfer-Team mit den Ansprechpersonen</h4>';
                                    }

                                    showContact(contactIndex);
                                });
                            }
                        });

                        function showContact(contactIndex) {
                            let contactHtml = "<div class='bs_contact-block'>";

                            if ( contacts[contactIndex]['name'] )
                                contactHtml += "<div class='bs_cp-html-block'>" + b64DecodeUnicode(contacts[contactIndex]['html_block']) + "</div>";

                            if ( contacts[contactIndex]['name'] )
                                contactHtml += "<p>Name: " + contacts[contactIndex]['name'] + "</p>";

                            if ( contacts[contactIndex]['title'] )
                                contactHtml += "<p>" + contacts[contactIndex]['title'] + "</p>";

                            if ( contacts[contactIndex]['phone'] )
                                contactHtml += "<p>Telefon: " + contacts[contactIndex]['phone'] + "</p>";

                            if ( contacts[contactIndex]['email'] )
                                contactHtml += "<p>E-Mail: <a href='mailto:" + contacts[contactIndex]['email'] + "'>" + contacts[contactIndex]['email'] + "</a></p>"

                            if ( contacts[contactIndex]['custom_notes'] )
                                contactHtml += "<p>" + contacts[contactIndex]['custom_notes'] + "</p>";

                            contactHtml += "</div>";

                            $('div.bs_cp-showbox').append(contactHtml);
                        }

                        function cleanShowBox() {
                            $('div.bs_cp-showbox').html('');
                        }

                        function resetResponsibilitySelect() {
                            $('select.bs_cp-select-responsibility').val('default').change();
                        }

                        function getContactIndexesByStateId(stateId) {
                            let contactIndexes = [];
                            contacts.forEach(function(contactPersonArray, contactPersonIndex) {
                                if (contactPersonArray['state'].includes(stateId)) {
                                    contactIndexes.push(contactPersonIndex);
                                }
                            });
                            return contactIndexes;
                        }

                        function getContactIndexesByResponsibiltyAreaId(responsibiltyAreaId) {
                            let contactIndexes = [];
                            contacts.forEach(function(contactPersonArray, contactPersonIndex) {
                                contactPersonArray['responsibility'].forEach(function(contactPersonResponsibilityAreas, index) {
                                    if (contactPersonResponsibilityAreas.includes(responsibiltyAreaId)) {
                                        contactIndexes.push(contactPersonIndex);
                                    }
                                });
                            });
                            return contactIndexes;
                        }

                        function b64DecodeUnicode(str) {
                            // Going backwards: from bytestream, to percent-encoding, to original string.
                            return decodeURIComponent(atob(str).split('').map(function(c) {
                                return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
                            }).join(''));
                        }
                    });
                })( jQuery );
            </script>
        <div class='bs_contact-page-main-wrapper'><p class='bs_contact-page-main-header'>Wir freuen uns, dass Sie mit uns Kontakt zu den Programmen Griffbereit und/oder Rucksack KiTa aufnehmen wollen. Bitte wählen Sie aus folgenden Auswahlmöglichkeiten, damit wir Ihnen die zuständige Ansprechperson anzeigen können:</p><div class='bs_contact-page-inner-wrapper'><div class='bs_contact-page-selects-wrapper'><div class='bs_state-select-wrapper'><label>Bitte wählen Sie das Bundesland:</label><select class='bs_cp-select-state' name='bs_cp-state'><option disabled selected value='default'>- Bundesland -</option><option value='137'>Baden-Württemberg</option><option value='138'>Bayern</option><option value='139'>Berlin</option><option value='140'>Brandenburg</option><option value='141'>Bremen</option><option value='142'>Hamburg</option><option value='143'>Hessen</option><option value='154'>Mecklenburg-Vorpommern</option><option value='145'>Niedersachsen</option><option value='146'>Nordrhein-Westfalen</option><option value='147'>Rheinland-Pfalz</option><option value='148'>Saarland</option><option value='149'>Sachsen</option><option value='150'>Sachsen-Anhalt</option><option value='151'>Schleswig-Holstein</option><option value='152'>Thüringen</option></select></div><div class='bs_area-select-wrapper'><label>Bitte wählen Sie den Bereich:</label><select class='bs_cp-select-responsibility' name='bs_cp-responsibility'><option selected value='default'>- Arbeitsbereich -</option><option value='159'>Beratung und Schulung</option><option value='157'>Daten- und Qualitätssicherung</option><option value='156'>Kommunikation</option></select></div></div><div class='bs_cp-showbox'></div></div></div>{"id":4275,"date":"2021-07-26T10:31:39","date_gmt":"2021-07-26T08:31:39","guid":{"rendered":"https:\/\/www.griffbereit-rucksack.de\/?page_id=4275"},"modified":"2022-12-01T12:44:32","modified_gmt":"2022-12-01T11:44:32","slug":"contact-page","status":"publish","type":"page","link":"https:\/\/www.griffbereit-rucksack.de\/it\/contact-page\/","title":{"rendered":"Ci contatti"},"content":{"rendered":"","protected":false},"excerpt":{"rendered":"<div class=\"entry-summary\">\n<div class=\"link-more\"><a href=\"https:\/\/www.griffbereit-rucksack.de\/it\/contact-page\/\" class=\"more-link\">Continua a leggere<span class=\"screen-reader-text\"> &ldquo;Kontakt&rdquo;<\/span>...<\/a><\/div>\n<\/div>\n<div class=\"link-more\"><a href=\"https:\/\/www.griffbereit-rucksack.de\/it\/contact-page\/\" class=\"more-link\">Continua a leggere<span class=\"screen-reader-text\"> &ldquo;Kontakt&rdquo;<\/span>...<\/a><\/div>","protected":false},"author":5,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-4275","page","type-page","status-publish","hentry","entry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.griffbereit-rucksack.de\/it\/wp-json\/wp\/v2\/pages\/4275","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.griffbereit-rucksack.de\/it\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.griffbereit-rucksack.de\/it\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.griffbereit-rucksack.de\/it\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.griffbereit-rucksack.de\/it\/wp-json\/wp\/v2\/comments?post=4275"}],"version-history":[{"count":0,"href":"https:\/\/www.griffbereit-rucksack.de\/it\/wp-json\/wp\/v2\/pages\/4275\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.griffbereit-rucksack.de\/it\/wp-json\/wp\/v2\/media?parent=4275"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}