Javascript, HTML, CSS Code
<!DOCTYPE html> <html> <head> <script type="text/javascript"> window.addEventListener('error', function(event) { var message = JSON.parse(JSON.stringify(event.message)); var source = event.filename; var lineno = event.lineno; var colno = event.colno; var error = event.error; window.parent.postMessage({ type: 'iframeError', details: { message: message, source: source, lineno: lineno, colno: colno, error: error ? error.stack : '' } }, '*'); }); window.addEventListener('unhandledrejection', function(event) { window.parent.postMessage({ type: 'iframePromiseRejection', details: { reason: event.reason } }, '*'); }); </script> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>Flag Information</title> <meta name="description" content="Flag Information"> <meta name="keywords" content="flag, information"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <!-- Built-In Functions for Apps --> <script type="text/javascript"> var localStoragePrefix = "ct-169358686580245"; var lastSave = 0; // save to localstorage function saveLocal(data) { if (Date.now() - lastSave < 1000) { return; } // save to cookie let cookie = localStoragePrefix + "=" + JSON.stringify(data) + "; path=" + window.location.pathname + "'; SameSite=Strict"; cookie += "; expires=" + new Date(Date.now() + 1000 * 60 * 60 * 24 * 365 * 1000).toUTCString(); document.cookie = cookie; lastSave = Date.now(); } // load from localstorage function loadLocal() { var cookiePrefix = localStoragePrefix + "="; var cookieStart = document.cookie.indexOf(cookiePrefix); if (cookieStart > -1) { let cookieEnd = document.cookie.indexOf(";", cookieStart); if (cookieEnd == -1) { cookieEnd = document.cookie.length; } var cookieData = document.cookie.substring(cookieStart + cookiePrefix.length, cookieEnd); return JSON.parse(cookieData); } } </script> <script type="text/javascript"> // App Javascript Goes Here function getFlagInfo(country) { var info = {}; switch (country) { case "Albania": info.established = "November 28, 1912"; info.channels = "Digitalb, RTSH"; info.capital = "Tirana"; info.population = "2,845,955"; info.area = "28,748 square kilometers"; break; case "Afghanistan": info.established = "August 19, 1919"; info.channels = "Ariana Television Network, Lemar TV"; info.capital = "Kabul"; info.population = "38,928,346"; info.area = "652,230 square kilometers"; break; case "Belarus": info.established = "December 25, 1991"; info.channels = "ONT, STV"; info.capital = "Minsk"; info.population = "9,449,323"; info.area = "207,600 square kilometers"; break; case "Bulgaria": info.established = "September 22, 1908"; info.channels = "BNT, Nova Television"; info.capital = "Sofia"; info.population = "6,951,482"; info.area = "110,994 square kilometers"; break; case "Greece": info.established = "March 25, 1821"; info.channels = "ERT, ANT1"; info.capital = "Athens"; info.population = "10,423,054"; info.area = "131,957 square kilometers"; break; case "Iran": info.established = "April 1, 1979"; info.channels = "IRIB, Manoto"; info.capital = "Tehran"; info.population = "83,992,949"; info.area = "1,648,195 square kilometers"; break; case "Israel": info.established = "May 14, 1948"; info.channels = "Kan 11, Channel 12"; info.capital = "Jerusalem"; info.population = "9,053,300"; info.area = "20,770 square kilometers"; break; case "Russia": info.established = "December 25, 1991"; info.channels = "Channel One, Russia-1"; info.capital = "Moscow"; info.population = "144,373,535"; info.area = "17,098,242 square kilometers"; break; case "Ukraine": info.established = "August 24, 1991"; info.channels = "UA: Pershyi, Novyi Kanal"; info.capital = "Kyiv"; info.population = "43,733,762"; info.area = "603,628 square kilometers"; break; case "Wales": info.established = "Not applicable"; info.channels = "BBC One Wales, S4C"; info.capital = "Cardiff"; info.population = "3,152,879"; info.area = "20,779 square kilometers"; break; default: break; } return info; } function displayFlagInfo() { var country = document.getElementById("country").value; var flagInfo = getFlagInfo(country); var html = ` <h2>${country}</h2> <p><strong>Established:</strong> ${flagInfo.established}</p> <p><strong>Channels:</strong> ${flagInfo.channels}</p> <p><strong>Capital:</strong> ${flagInfo.capital}</p> <p><strong>Population:</strong> ${flagInfo.population}</p> <p><strong>Area:</strong> ${flagInfo.area}</p> `; document.getElementById("flag-info").innerHTML = html; } </script> <style> /* App CSS Goes Here */ body { font-family: 'Arial', sans-serif; background-color: #f8f9fa; } .container { max-width: 600px; margin: 0 auto; padding: 20px; background-color: #fff; border-radius: 5px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); } h1 { text-align: center; margin-bottom: 30px; } label { font-weight: bold; display: block; margin-bottom: 10px; } select { width: 100%; padding: 10px; font-size: 16px; border-radius: 5px; border: 1px solid #ccc; margin-bottom: 20px; } button { background-color: #007bff; color: #fff; border: none; padding: 10px 20px; font-size: 16px; border-radius: 5px; cursor: pointer; } button:hover { background-color: #0056b3; } #flag-info { margin-top: 30px; } p { margin-bottom: 10px; } </style> <link rel="canonical" href="https://calculator.tools/prompt/5451/"> <meta charset="utf-8"> </head> <body> <div id="main-container" class="container"> <h1>Flag Information</h1> <label for="country">Choose a country:</label> <select id="country"> <option value="Albania">Albania</option> <option value="Afghanistan">Afghanistan</option> <option value="Belarus">Belarus</option> <option value="Bulgaria">Bulgaria</option> <option value="Greece">Greece</option> <option value="Iran">Iran</option> <option value="Israel">Israel</option> <option value="Russia">Russia</option> <option value="Ukraine">Ukraine</option> <option value="Wales">Wales</option> </select> <button onclick="displayFlagInfo()">Get Flag Information</button> <div id="flag-info"></div> </div> <script type="text/javascript"> // App Javascript Goes Here </script> <style> /* App CSS Goes Here */ </style> <script type="text/javascript"> var localStoragePrefix = "ct-{{ cachebreaker }}"; var lastSave = 0; function saveLocal(data) { if (Date.now() - lastSave < 1000) { return; } let cookie = localStoragePrefix + "=" + JSON.stringify(data) + "; path=" + window.location.pathname + "'; SameSite=Strict"; cookie += "; expires=" + new Date(Date.now() + 1000 * 60 * 60 * 24 * 365 * 1000).toUTCString(); document.cookie = cookie; lastSave = Date.now(); } function loadLocal() { var cookiePrefix = localStoragePrefix + "="; var cookieStart = document.cookie.indexOf(cookiePrefix); if (cookieStart > -1) { let cookieEnd = document.cookie.indexOf(";", cookieStart); if (cookieEnd == -1) { cookieEnd = document.cookie.length; } var cookieData = document.cookie.substring(cookieStart + cookiePrefix.length, cookieEnd); return JSON.parse(cookieData); } } </script> <script type="text/javascript"> window.addEventListener('load', function() { var observer = new MutationObserver(function() { window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); observer.observe(document.body, {attributes: true, childList: true, subtree: true}); window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); </script> </body> </html>
Flag Information
Calculator Tools