Language Switcher<\/title>\n <style>\n * {\n box-sizing: border-box;\n }\n \n html, body {\n margin: 0;\n padding: 0;\n overflow-x: hidden;\n }\n \n .language-switcher-container {\n width: 100%;\n margin: 0 auto;\n font-family: Arial, sans-serif;\n }\n \n .language-buttons {\n text-align: center;\n margin-bottom: 20px;\n display: inline-flex;\n background: #f5f5f5;\n padding: 4px;\n border-radius: 30px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.08);\n position: relative;\n left: 50%;\n transform: translateX(-50%);\n }\n \n .lang-btn {\n padding: 8px 20px;\n margin: 0;\n border: none;\n background-color: transparent;\n color: #666;\n font-size: 14px;\n font-weight: 600;\n cursor: pointer;\n border-radius: 30px;\n transition: all 0.3s ease;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n position: relative;\n z-index: 1;\n }\n \n .flag-icon {\n font-size: 20px;\n transition: transform 0.3s ease;\n }\n \n .lang-btn:hover .flag-icon {\n transform: scale(1.2);\n }\n \n .lang-btn:hover {\n color: #333;\n }\n \n .lang-btn.active {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: #fff;\n box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);\n }\n \n .lang-btn.active .flag-icon {\n transform: scale(1.1);\n }\n \n .form-container {\n display: none;\n width: 100%;\n opacity: 0;\n transition: opacity 0.3s ease;\n }\n \n .form-container.active {\n display: block;\n animation: fadeIn 0.4s ease forwards;\n }\n \n @keyframes fadeIn {\n from {\n opacity: 0;\n transform: translateY(10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n \n .form-container iframe {\n width: 100%;\n min-height: 500px;\n display: block;\n margin: 0 auto;\n border: none;\n overflow: hidden;\n }\n \n .success-message {\n display: none;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n padding: 20px;\n border-radius: 10px;\n text-align: center;\n margin-bottom: 20px;\n font-size: 16px;\n font-weight: 600;\n animation: slideDown 0.5s ease forwards;\n box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);\n }\n \n .success-message.show {\n display: block;\n }\n \n .success-icon {\n font-size: 32px;\n margin-bottom: 10px;\n }\n \n @keyframes slideDown {\n from {\n opacity: 0;\n transform: translateY(-20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n \n .closed-message {\n display: none;\n background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);\n color: white;\n padding: 30px;\n border-radius: 10px;\n text-align: center;\n margin-bottom: 20px;\n font-size: 18px;\n font-weight: 600;\n box-shadow: 0 4px 15px rgba(255, 107, 107, 0.3);\n }\n \n .closed-message.show {\n display: block;\n }\n \n .closed-icon {\n font-size: 40px;\n margin-bottom: 15px;\n }\n \n .countdown {\n font-size: 14px;\n margin-top: 10px;\n opacity: 0.9;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"language-switcher-container\">\n <div class=\"success-message\" id=\"successMessage\">\n <div class=\"success-icon\">\u2705<\/div>\n <div>Thank you! Your form has been submitted successfully.<\/div>\n <\/div>\n \n <div class=\"closed-message\" id=\"closedMessage\">\n <div class=\"closed-icon\">\ud83d\udd12<\/div>\n <div>Survey Closed<\/div>\n <div class=\"countdown\" id=\"countdownText\">This survey has ended on January 31, 2026<\/div>\n <\/div>\n \n <div class=\"language-buttons\">\n <button class=\"lang-btn active\" onclick=\"switchLanguage('en')\">\n <span class=\"flag-icon\">\ud83c\uddec\ud83c\udde7<\/span>\n <span>English<\/span>\n <\/button>\n <button class=\"lang-btn\" onclick=\"switchLanguage('id')\">\n <span class=\"flag-icon\">\ud83c\uddee\ud83c\udde9<\/span>\n <span>Indonesia<\/span>\n <\/button>\n <\/div>\n \n <div id=\"form-en\" class=\"form-container active\">\n <iframe src=\"https:\/\/docs.google.com\/forms\/d\/e\/1FAIpQLSe5OsCKquZgV4_VuJ-Um9ngFzqChuhdK9P4u5fbtfPuSEv-Ng\/viewform?embedded=true\" height=\"3408\" frameborder=\"0\" marginheight=\"0\" marginwidth=\"0\" scrolling=\"no\">Loading\u2026<\/iframe>\n <\/div>\n \n <div id=\"form-id\" class=\"form-container\">\n <iframe src=\"https:\/\/docs.google.com\/forms\/d\/e\/1FAIpQLScnnSiLPir0ZkC37Kol-IetuIZEyw7LL73l5eKJTRjWqMbcZA\/viewform?embedded=true\" height=\"3370\" frameborder=\"0\" marginheight=\"0\" marginwidth=\"0\" scrolling=\"no\">Loading\u2026<\/iframe>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Set survey close date to January 31, 2026\n const SURVEY_CLOSE_DATE = new Date('2026-01-31T23:59:59').getTime();\n \n function checkSurveyClosed() {\n const now = new Date().getTime();\n const isClosed = now > SURVEY_CLOSE_DATE;\n \n if (isClosed) {\n \/\/ Survey is closed\n document.getElementById('closedMessage').classList.add('show');\n document.querySelector('.language-buttons').style.display = 'none';\n document.querySelectorAll('.form-container').forEach(form => {\n form.style.display = 'none';\n });\n } else {\n \/\/ Survey is still open - show countdown\n updateCountdown();\n }\n }\n \n function updateCountdown() {\n const now = new Date().getTime();\n const distance = SURVEY_CLOSE_DATE - now;\n \n if (distance > 0) {\n const days = Math.floor(distance \/ (1000 * 60 * 60 * 24));\n const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) \/ (1000 * 60 * 60));\n const minutes = Math.floor((distance % (1000 * 60 * 60)) \/ (1000 * 60));\n \n const countdownText = `Survey closes in: ${days}d ${hours}h ${minutes}m`;\n document.getElementById('countdownText').textContent = countdownText;\n }\n }\n \n function switchLanguage(lang) {\n \/\/ Hide all forms\n document.querySelectorAll('.form-container').forEach(form => {\n form.classList.remove('active');\n });\n \n \/\/ Remove active class from all buttons\n document.querySelectorAll('.lang-btn').forEach(btn => {\n btn.classList.remove('active');\n });\n \n \/\/ Show selected form\n if (lang === 'en') {\n document.getElementById('form-en').classList.add('active');\n document.querySelectorAll('.lang-btn')[0].classList.add('active');\n } else if (lang === 'id') {\n document.getElementById('form-id').classList.add('active');\n document.querySelectorAll('.lang-btn')[1].classList.add('active');\n }\n \n \/\/ Hide success message when switching language\n document.getElementById('successMessage').classList.remove('show');\n }\n \n \/\/ Monitor iframe for form submission\n function monitorFormSubmission() {\n const iframes = document.querySelectorAll('iframe');\n \n iframes.forEach(iframe => {\n iframe.addEventListener('load', function() {\n try {\n \/\/ Check if form was submitted by looking for confirmation message\n const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;\n \n \/\/ Listen for changes in iframe\n const observer = new MutationObserver(function(mutations) {\n const bodyText = iframeDoc.body.innerText.toLowerCase();\n \n \/\/ Check for common success messages\n if (bodyText.includes('thank you') || \n bodyText.includes('terima kasih') ||\n bodyText.includes('your response has been recorded') ||\n bodyText.includes('respons anda telah dicatat')) {\n \n showSuccessMessage();\n }\n });\n \n observer.observe(iframeDoc.body, {\n childList: true,\n subtree: true,\n characterData: true\n });\n } catch (e) {\n \/\/ Cross-origin restriction - use alternative method\n checkFormSubmissionAlternative();\n }\n });\n });\n }\n \n function checkFormSubmissionAlternative() {\n \/\/ Check every 2 seconds if URL changed (indicates form submission)\n let lastUrl = window.location.href;\n \n setInterval(function() {\n if (window.location.href !== lastUrl) {\n lastUrl = window.location.href;\n showSuccessMessage();\n }\n }, 2000);\n }\n \n function showSuccessMessage() {\n const successMsg = document.getElementById('successMessage');\n successMsg.classList.add('show');\n \n \/\/ Scroll to top\n window.scrollTo({\n top: 0,\n behavior: 'smooth'\n });\n \n \/\/ Hide message after 5 seconds\n setTimeout(function() {\n successMsg.classList.remove('show');\n }, 5000);\n }\n \n \/\/ Start monitoring when page loads\n window.addEventListener('load', function() {\n checkSurveyClosed();\n monitorFormSubmission();\n \n \/\/ Update countdown every minute\n setInterval(updateCountdown, 60000);\n });\n <\/script>\n<\/body>\n<\/html>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Language Switcher \u2705 Thank you! Your form has been submitted successfully. \ud83d\udd12 Survey Closed This survey has ended on January 31, 2026 \ud83c\uddec\ud83c\udde7 English \ud83c\uddee\ud83c\udde9 Indonesia Loading\u2026 Loading\u2026<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/pages\/7"}],"collection":[{"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=7"}],"version-history":[{"count":90,"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":238,"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions\/238"}],"wp:attachment":[{"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=7"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t

\n\t\t\t\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\n\n\n \n \n Language Switcher<\/title>\n <style>\n * {\n box-sizing: border-box;\n }\n \n html, body {\n margin: 0;\n padding: 0;\n overflow-x: hidden;\n }\n \n .language-switcher-container {\n width: 100%;\n margin: 0 auto;\n font-family: Arial, sans-serif;\n }\n \n .language-buttons {\n text-align: center;\n margin-bottom: 20px;\n display: inline-flex;\n background: #f5f5f5;\n padding: 4px;\n border-radius: 30px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.08);\n position: relative;\n left: 50%;\n transform: translateX(-50%);\n }\n \n .lang-btn {\n padding: 8px 20px;\n margin: 0;\n border: none;\n background-color: transparent;\n color: #666;\n font-size: 14px;\n font-weight: 600;\n cursor: pointer;\n border-radius: 30px;\n transition: all 0.3s ease;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n position: relative;\n z-index: 1;\n }\n \n .flag-icon {\n font-size: 20px;\n transition: transform 0.3s ease;\n }\n \n .lang-btn:hover .flag-icon {\n transform: scale(1.2);\n }\n \n .lang-btn:hover {\n color: #333;\n }\n \n .lang-btn.active {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: #fff;\n box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);\n }\n \n .lang-btn.active .flag-icon {\n transform: scale(1.1);\n }\n \n .form-container {\n display: none;\n width: 100%;\n opacity: 0;\n transition: opacity 0.3s ease;\n }\n \n .form-container.active {\n display: block;\n animation: fadeIn 0.4s ease forwards;\n }\n \n @keyframes fadeIn {\n from {\n opacity: 0;\n transform: translateY(10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n \n .form-container iframe {\n width: 100%;\n min-height: 500px;\n display: block;\n margin: 0 auto;\n border: none;\n overflow: hidden;\n }\n \n .success-message {\n display: none;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n padding: 20px;\n border-radius: 10px;\n text-align: center;\n margin-bottom: 20px;\n font-size: 16px;\n font-weight: 600;\n animation: slideDown 0.5s ease forwards;\n box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);\n }\n \n .success-message.show {\n display: block;\n }\n \n .success-icon {\n font-size: 32px;\n margin-bottom: 10px;\n }\n \n @keyframes slideDown {\n from {\n opacity: 0;\n transform: translateY(-20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n \n .closed-message {\n display: none;\n background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);\n color: white;\n padding: 30px;\n border-radius: 10px;\n text-align: center;\n margin-bottom: 20px;\n font-size: 18px;\n font-weight: 600;\n box-shadow: 0 4px 15px rgba(255, 107, 107, 0.3);\n }\n \n .closed-message.show {\n display: block;\n }\n \n .closed-icon {\n font-size: 40px;\n margin-bottom: 15px;\n }\n \n .countdown {\n font-size: 14px;\n margin-top: 10px;\n opacity: 0.9;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"language-switcher-container\">\n <div class=\"success-message\" id=\"successMessage\">\n <div class=\"success-icon\">\u2705<\/div>\n <div>Thank you! Your form has been submitted successfully.<\/div>\n <\/div>\n \n <div class=\"closed-message\" id=\"closedMessage\">\n <div class=\"closed-icon\">\ud83d\udd12<\/div>\n <div>Survey Closed<\/div>\n <div class=\"countdown\" id=\"countdownText\">This survey has ended on January 31, 2026<\/div>\n <\/div>\n \n <div class=\"language-buttons\">\n <button class=\"lang-btn active\" onclick=\"switchLanguage('en')\">\n <span class=\"flag-icon\">\ud83c\uddec\ud83c\udde7<\/span>\n <span>English<\/span>\n <\/button>\n <button class=\"lang-btn\" onclick=\"switchLanguage('id')\">\n <span class=\"flag-icon\">\ud83c\uddee\ud83c\udde9<\/span>\n <span>Indonesia<\/span>\n <\/button>\n <\/div>\n \n <div id=\"form-en\" class=\"form-container active\">\n <iframe src=\"https:\/\/docs.google.com\/forms\/d\/e\/1FAIpQLSe5OsCKquZgV4_VuJ-Um9ngFzqChuhdK9P4u5fbtfPuSEv-Ng\/viewform?embedded=true\" height=\"3408\" frameborder=\"0\" marginheight=\"0\" marginwidth=\"0\" scrolling=\"no\">Loading\u2026<\/iframe>\n <\/div>\n \n <div id=\"form-id\" class=\"form-container\">\n <iframe src=\"https:\/\/docs.google.com\/forms\/d\/e\/1FAIpQLScnnSiLPir0ZkC37Kol-IetuIZEyw7LL73l5eKJTRjWqMbcZA\/viewform?embedded=true\" height=\"3370\" frameborder=\"0\" marginheight=\"0\" marginwidth=\"0\" scrolling=\"no\">Loading\u2026<\/iframe>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Set survey close date to January 31, 2026\n const SURVEY_CLOSE_DATE = new Date('2026-01-31T23:59:59').getTime();\n \n function checkSurveyClosed() {\n const now = new Date().getTime();\n const isClosed = now > SURVEY_CLOSE_DATE;\n \n if (isClosed) {\n \/\/ Survey is closed\n document.getElementById('closedMessage').classList.add('show');\n document.querySelector('.language-buttons').style.display = 'none';\n document.querySelectorAll('.form-container').forEach(form => {\n form.style.display = 'none';\n });\n } else {\n \/\/ Survey is still open - show countdown\n updateCountdown();\n }\n }\n \n function updateCountdown() {\n const now = new Date().getTime();\n const distance = SURVEY_CLOSE_DATE - now;\n \n if (distance > 0) {\n const days = Math.floor(distance \/ (1000 * 60 * 60 * 24));\n const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) \/ (1000 * 60 * 60));\n const minutes = Math.floor((distance % (1000 * 60 * 60)) \/ (1000 * 60));\n \n const countdownText = `Survey closes in: ${days}d ${hours}h ${minutes}m`;\n document.getElementById('countdownText').textContent = countdownText;\n }\n }\n \n function switchLanguage(lang) {\n \/\/ Hide all forms\n document.querySelectorAll('.form-container').forEach(form => {\n form.classList.remove('active');\n });\n \n \/\/ Remove active class from all buttons\n document.querySelectorAll('.lang-btn').forEach(btn => {\n btn.classList.remove('active');\n });\n \n \/\/ Show selected form\n if (lang === 'en') {\n document.getElementById('form-en').classList.add('active');\n document.querySelectorAll('.lang-btn')[0].classList.add('active');\n } else if (lang === 'id') {\n document.getElementById('form-id').classList.add('active');\n document.querySelectorAll('.lang-btn')[1].classList.add('active');\n }\n \n \/\/ Hide success message when switching language\n document.getElementById('successMessage').classList.remove('show');\n }\n \n \/\/ Monitor iframe for form submission\n function monitorFormSubmission() {\n const iframes = document.querySelectorAll('iframe');\n \n iframes.forEach(iframe => {\n iframe.addEventListener('load', function() {\n try {\n \/\/ Check if form was submitted by looking for confirmation message\n const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;\n \n \/\/ Listen for changes in iframe\n const observer = new MutationObserver(function(mutations) {\n const bodyText = iframeDoc.body.innerText.toLowerCase();\n \n \/\/ Check for common success messages\n if (bodyText.includes('thank you') || \n bodyText.includes('terima kasih') ||\n bodyText.includes('your response has been recorded') ||\n bodyText.includes('respons anda telah dicatat')) {\n \n showSuccessMessage();\n }\n });\n \n observer.observe(iframeDoc.body, {\n childList: true,\n subtree: true,\n characterData: true\n });\n } catch (e) {\n \/\/ Cross-origin restriction - use alternative method\n checkFormSubmissionAlternative();\n }\n });\n });\n }\n \n function checkFormSubmissionAlternative() {\n \/\/ Check every 2 seconds if URL changed (indicates form submission)\n let lastUrl = window.location.href;\n \n setInterval(function() {\n if (window.location.href !== lastUrl) {\n lastUrl = window.location.href;\n showSuccessMessage();\n }\n }, 2000);\n }\n \n function showSuccessMessage() {\n const successMsg = document.getElementById('successMessage');\n successMsg.classList.add('show');\n \n \/\/ Scroll to top\n window.scrollTo({\n top: 0,\n behavior: 'smooth'\n });\n \n \/\/ Hide message after 5 seconds\n setTimeout(function() {\n successMsg.classList.remove('show');\n }, 5000);\n }\n \n \/\/ Start monitoring when page loads\n window.addEventListener('load', function() {\n checkSurveyClosed();\n monitorFormSubmission();\n \n \/\/ Update countdown every minute\n setInterval(updateCountdown, 60000);\n });\n <\/script>\n<\/body>\n<\/html>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Language Switcher \u2705 Thank you! Your form has been submitted successfully. \ud83d\udd12 Survey Closed This survey has ended on January 31, 2026 \ud83c\uddec\ud83c\udde7 English \ud83c\uddee\ud83c\udde9 Indonesia Loading\u2026 Loading\u2026<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/pages\/7"}],"collection":[{"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=7"}],"version-history":[{"count":90,"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":238,"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions\/238"}],"wp:attachment":[{"href":"https:\/\/csurvey.bozzetto.co.id\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=7"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}