From 6ed6e6c8875c91da3bfbb4e9b3b34293fa25a328 Mon Sep 17 00:00:00 2001
From: Aleksandr Statciuk <github@oiya.xyz>
Date: Sat, 15 Jan 2022 03:05:54 +0300
Subject: [PATCH] Update app.js

---
 .gh-pages/api/countries.json | 1102 ++++++++++++++++++++++++++++++++++
 .gh-pages/app.js             |   31 +-
 .gh-pages/index.html         |   27 +-
 3 files changed, 1147 insertions(+), 13 deletions(-)
 create mode 100644 .gh-pages/api/countries.json

diff --git a/.gh-pages/api/countries.json b/.gh-pages/api/countries.json
new file mode 100644
index 00000000..bc0e0a6b
--- /dev/null
+++ b/.gh-pages/api/countries.json
@@ -0,0 +1,1102 @@
+{
+  "AF": {
+    "flag": "🇦🇫",
+    "name": "Afghanistan",
+    "code": "AF"
+  },
+  "AL": {
+    "flag": "🇦🇱",
+    "name": "Albania",
+    "code": "AL"
+  },
+  "DZ": {
+    "flag": "🇩🇿",
+    "name": "Algeria",
+    "code": "DZ"
+  },
+  "AS": {
+    "flag": "🇦🇸",
+    "name": "American Samoa",
+    "code": "AS"
+  },
+  "AD": {
+    "flag": "🇦🇩",
+    "name": "Andorra",
+    "code": "AD"
+  },
+  "AO": {
+    "flag": "🇦🇴",
+    "name": "Angola",
+    "code": "AO"
+  },
+  "AG": {
+    "flag": "🇦🇬",
+    "name": "Antigua & Barbuda",
+    "code": "AG"
+  },
+  "AR": {
+    "flag": "🇦🇷",
+    "name": "Argentina",
+    "code": "AR"
+  },
+  "AM": {
+    "flag": "🇦🇲",
+    "name": "Armenia",
+    "code": "AM"
+  },
+  "AW": {
+    "flag": "🇦🇼",
+    "name": "Aruba",
+    "code": "AW"
+  },
+  "AU": {
+    "flag": "🇦🇺",
+    "name": "Australia",
+    "code": "AU"
+  },
+  "AT": {
+    "flag": "🇦🇹",
+    "name": "Austria",
+    "code": "AT"
+  },
+  "AZ": {
+    "flag": "🇦🇿",
+    "name": "Azerbaijan",
+    "code": "AZ"
+  },
+  "BS": {
+    "flag": "🇧🇸",
+    "name": "Bahamas",
+    "code": "BS"
+  },
+  "BH": {
+    "flag": "🇧🇭",
+    "name": "Bahrain",
+    "code": "BH"
+  },
+  "BD": {
+    "flag": "🇧🇩",
+    "name": "Bangladesh",
+    "code": "BD"
+  },
+  "BB": {
+    "flag": "🇧🇧",
+    "name": "Barbados",
+    "code": "BB"
+  },
+  "BY": {
+    "flag": "🇧🇾",
+    "name": "Belarus",
+    "code": "BY"
+  },
+  "BE": {
+    "flag": "🇧🇪",
+    "name": "Belgium",
+    "code": "BE"
+  },
+  "BJ": {
+    "flag": "🇧🇯",
+    "name": "Benin",
+    "code": "BJ"
+  },
+  "BT": {
+    "flag": "🇧🇹",
+    "name": "Bhutan",
+    "code": "BT"
+  },
+  "BO": {
+    "flag": "🇧🇴",
+    "name": "Bolivia",
+    "code": "BO"
+  },
+  "BA": {
+    "flag": "🇧🇦",
+    "name": "Bosnia",
+    "code": "BA"
+  },
+  "BW": {
+    "flag": "🇧🇼",
+    "name": "Botswana",
+    "code": "BW"
+  },
+  "BR": {
+    "flag": "🇧🇷",
+    "name": "Brazil",
+    "code": "BR"
+  },
+  "BN": {
+    "flag": "🇧🇳",
+    "name": "Brunei",
+    "code": "BN"
+  },
+  "BG": {
+    "flag": "🇧🇬",
+    "name": "Bulgaria",
+    "code": "BG"
+  },
+  "BF": {
+    "flag": "🇧🇫",
+    "name": "Burkina Faso",
+    "code": "BF"
+  },
+  "BI": {
+    "flag": "🇧🇮",
+    "name": "Burundi",
+    "code": "BI"
+  },
+  "KH": {
+    "flag": "🇰🇭",
+    "name": "Cambodia",
+    "code": "KH"
+  },
+  "CM": {
+    "flag": "🇨🇲",
+    "name": "Cameroon",
+    "code": "CM"
+  },
+  "CA": {
+    "flag": "🇨🇦",
+    "name": "Canada",
+    "code": "CA"
+  },
+  "CV": {
+    "flag": "🇨🇻",
+    "name": "Cape Verde",
+    "code": "CV"
+  },
+  "CF": {
+    "flag": "🇨🇫",
+    "name": "Central African Republic",
+    "code": "CF"
+  },
+  "TD": {
+    "flag": "🇹🇩",
+    "name": "Chad",
+    "code": "TD"
+  },
+  "CL": {
+    "flag": "🇨🇱",
+    "name": "Chile",
+    "code": "CL"
+  },
+  "CN": {
+    "flag": "🇨🇳",
+    "name": "China",
+    "code": "CN"
+  },
+  "CO": {
+    "flag": "🇨🇴",
+    "name": "Colombia",
+    "code": "CO"
+  },
+  "KM": {
+    "flag": "🇰🇲",
+    "name": "Comoros",
+    "code": "KM"
+  },
+  "CG": {
+    "flag": "🇨🇬",
+    "name": "Congo - Brazzaville",
+    "code": "CG"
+  },
+  "CD": {
+    "flag": "🇨🇩",
+    "name": "Congo - Kinshasa",
+    "code": "CD"
+  },
+  "CK": {
+    "flag": "🇨🇰",
+    "name": "Cook Islands",
+    "code": "CK"
+  },
+  "CR": {
+    "flag": "🇨🇷",
+    "name": "Costa Rica",
+    "code": "CR"
+  },
+  "HR": {
+    "flag": "🇭🇷",
+    "name": "Croatia",
+    "code": "HR"
+  },
+  "CU": {
+    "flag": "🇨🇺",
+    "name": "Cuba",
+    "code": "CU"
+  },
+  "CW": {
+    "flag": "🇨🇼",
+    "name": "Curaçao",
+    "code": "CW"
+  },
+  "CY": {
+    "flag": "🇨🇾",
+    "name": "Cyprus",
+    "code": "CY"
+  },
+  "CZ": {
+    "flag": "🇨🇿",
+    "name": "Czechia",
+    "code": "CZ"
+  },
+  "CI": {
+    "flag": "🇨🇮",
+    "name": "Côte d’Ivoire",
+    "code": "CI"
+  },
+  "DK": {
+    "flag": "🇩🇰",
+    "name": "Denmark",
+    "code": "DK"
+  },
+  "DJ": {
+    "flag": "🇩🇯",
+    "name": "Djibouti",
+    "code": "DJ"
+  },
+  "DO": {
+    "flag": "🇩🇴",
+    "name": "Dominican Republic",
+    "code": "DO"
+  },
+  "EC": {
+    "flag": "🇪🇨",
+    "name": "Ecuador",
+    "code": "EC"
+  },
+  "EG": {
+    "flag": "🇪🇬",
+    "name": "Egypt",
+    "code": "EG"
+  },
+  "SV": {
+    "flag": "🇸🇻",
+    "name": "El Salvador",
+    "code": "SV"
+  },
+  "GQ": {
+    "flag": "🇬🇶",
+    "name": "Equatorial Guinea",
+    "code": "GQ"
+  },
+  "ER": {
+    "flag": "🇪🇷",
+    "name": "Eritrea",
+    "code": "ER"
+  },
+  "EE": {
+    "flag": "🇪🇪",
+    "name": "Estonia",
+    "code": "EE"
+  },
+  "SZ": {
+    "flag": "🇸🇿",
+    "name": "Eswatini",
+    "code": "SZ"
+  },
+  "ET": {
+    "flag": "🇪🇹",
+    "name": "Ethiopia",
+    "code": "ET"
+  },
+  "FO": {
+    "flag": "🇫🇴",
+    "name": "Faroe Islands",
+    "code": "FO"
+  },
+  "FJ": {
+    "flag": "🇫🇯",
+    "name": "Fiji",
+    "code": "FJ"
+  },
+  "FI": {
+    "flag": "🇫🇮",
+    "name": "Finland",
+    "code": "FI"
+  },
+  "FR": {
+    "flag": "🇫🇷",
+    "name": "France",
+    "code": "FR"
+  },
+  "GF": {
+    "flag": "🇬🇫",
+    "name": "French Guiana",
+    "code": "GF"
+  },
+  "PF": {
+    "flag": "🇵🇫",
+    "name": "French Polynesia",
+    "code": "PF"
+  },
+  "TF": {
+    "flag": "🇹🇫",
+    "name": "French Southern Territories",
+    "code": "TF"
+  },
+  "GA": {
+    "flag": "🇬🇦",
+    "name": "Gabon",
+    "code": "GA"
+  },
+  "GM": {
+    "flag": "🇬🇲",
+    "name": "Gambia",
+    "code": "GM"
+  },
+  "GE": {
+    "flag": "🇬🇪",
+    "name": "Georgia",
+    "code": "GE"
+  },
+  "DE": {
+    "flag": "🇩🇪",
+    "name": "Germany",
+    "code": "DE"
+  },
+  "GH": {
+    "flag": "🇬🇭",
+    "name": "Ghana",
+    "code": "GH"
+  },
+  "GR": {
+    "flag": "🇬🇷",
+    "name": "Greece",
+    "code": "GR"
+  },
+  "GL": {
+    "flag": "🇬🇱",
+    "name": "Greenland",
+    "code": "GL"
+  },
+  "GP": {
+    "flag": "🇬🇵",
+    "name": "Guadeloupe",
+    "code": "GP"
+  },
+  "GU": {
+    "flag": "🇬🇺",
+    "name": "Guam",
+    "code": "GU"
+  },
+  "GT": {
+    "flag": "🇬🇹",
+    "name": "Guatemala",
+    "code": "GT"
+  },
+  "GN": {
+    "flag": "🇬🇳",
+    "name": "Guinea",
+    "code": "GN"
+  },
+  "GW": {
+    "flag": "🇬🇼",
+    "name": "Guinea-Bissau",
+    "code": "GW"
+  },
+  "HT": {
+    "flag": "🇭🇹",
+    "name": "Haiti",
+    "code": "HT"
+  },
+  "HN": {
+    "flag": "🇭🇳",
+    "name": "Honduras",
+    "code": "HN"
+  },
+  "HK": {
+    "flag": "🇭🇰",
+    "name": "Hong Kong",
+    "code": "HK"
+  },
+  "HU": {
+    "flag": "🇭🇺",
+    "name": "Hungary",
+    "code": "HU"
+  },
+  "IS": {
+    "flag": "🇮🇸",
+    "name": "Iceland",
+    "code": "IS"
+  },
+  "IN": {
+    "flag": "🇮🇳",
+    "name": "India",
+    "code": "IN"
+  },
+  "ID": {
+    "flag": "🇮🇩",
+    "name": "Indonesia",
+    "code": "ID"
+  },
+  "IR": {
+    "flag": "🇮🇷",
+    "name": "Iran",
+    "code": "IR"
+  },
+  "IQ": {
+    "flag": "🇮🇶",
+    "name": "Iraq",
+    "code": "IQ"
+  },
+  "IE": {
+    "flag": "🇮🇪",
+    "name": "Ireland",
+    "code": "IE"
+  },
+  "IL": {
+    "flag": "🇮🇱",
+    "name": "Israel",
+    "code": "IL"
+  },
+  "IT": {
+    "flag": "🇮🇹",
+    "name": "Italy",
+    "code": "IT"
+  },
+  "JM": {
+    "flag": "🇯🇲",
+    "name": "Jamaica",
+    "code": "JM"
+  },
+  "JP": {
+    "flag": "🇯🇵",
+    "name": "Japan",
+    "code": "JP"
+  },
+  "JO": {
+    "flag": "🇯🇴",
+    "name": "Jordan",
+    "code": "JO"
+  },
+  "KZ": {
+    "flag": "🇰🇿",
+    "name": "Kazakhstan",
+    "code": "KZ"
+  },
+  "KE": {
+    "flag": "🇰🇪",
+    "name": "Kenya",
+    "code": "KE"
+  },
+  "KI": {
+    "flag": "🇰🇮",
+    "name": "Kiribati",
+    "code": "KI"
+  },
+  "XK": {
+    "flag": "🇽🇰",
+    "name": "Kosovo",
+    "code": "XK"
+  },
+  "KW": {
+    "flag": "🇰🇼",
+    "name": "Kuwait",
+    "code": "KW"
+  },
+  "KG": {
+    "flag": "🇰🇬",
+    "name": "Kyrgyzstan",
+    "code": "KG"
+  },
+  "LA": {
+    "flag": "🇱🇦",
+    "name": "Laos",
+    "code": "LA"
+  },
+  "LV": {
+    "flag": "🇱🇻",
+    "name": "Latvia",
+    "code": "LV"
+  },
+  "LB": {
+    "flag": "🇱🇧",
+    "name": "Lebanon",
+    "code": "LB"
+  },
+  "LS": {
+    "flag": "🇱🇸",
+    "name": "Lesotho",
+    "code": "LS"
+  },
+  "LR": {
+    "flag": "🇱🇷",
+    "name": "Liberia",
+    "code": "LR"
+  },
+  "LY": {
+    "flag": "🇱🇾",
+    "name": "Libya",
+    "code": "LY"
+  },
+  "LI": {
+    "flag": "🇱🇮",
+    "name": "Liechtenstein",
+    "code": "LI"
+  },
+  "LT": {
+    "flag": "🇱🇹",
+    "name": "Lithuania",
+    "code": "LT"
+  },
+  "LU": {
+    "flag": "🇱🇺",
+    "name": "Luxembourg",
+    "code": "LU"
+  },
+  "MO": {
+    "flag": "🇲🇴",
+    "name": "Macao",
+    "code": "MO"
+  },
+  "MG": {
+    "flag": "🇲🇬",
+    "name": "Madagascar",
+    "code": "MG"
+  },
+  "MW": {
+    "flag": "🇲🇼",
+    "name": "Malawi",
+    "code": "MW"
+  },
+  "MY": {
+    "flag": "🇲🇾",
+    "name": "Malaysia",
+    "code": "MY"
+  },
+  "MV": {
+    "flag": "🇲🇻",
+    "name": "Maldives",
+    "code": "MV"
+  },
+  "ML": {
+    "flag": "🇲🇱",
+    "name": "Mali",
+    "code": "ML"
+  },
+  "MT": {
+    "flag": "🇲🇹",
+    "name": "Malta",
+    "code": "MT"
+  },
+  "MH": {
+    "flag": "🇲🇭",
+    "name": "Marshall Islands",
+    "code": "MH"
+  },
+  "MQ": {
+    "flag": "🇲🇶",
+    "name": "Martinique",
+    "code": "MQ"
+  },
+  "MR": {
+    "flag": "🇲🇷",
+    "name": "Mauritania",
+    "code": "MR"
+  },
+  "MU": {
+    "flag": "🇲🇺",
+    "name": "Mauritius",
+    "code": "MU"
+  },
+  "YT": {
+    "flag": "🇾🇹",
+    "name": "Mayotte",
+    "code": "YT"
+  },
+  "MX": {
+    "flag": "🇲🇽",
+    "name": "Mexico",
+    "code": "MX"
+  },
+  "FM": {
+    "flag": "🇫🇲",
+    "name": "Micronesia",
+    "code": "FM"
+  },
+  "MD": {
+    "flag": "🇲🇩",
+    "name": "Moldova",
+    "code": "MD"
+  },
+  "MC": {
+    "flag": "🇲🇨",
+    "name": "Monaco",
+    "code": "MC"
+  },
+  "MN": {
+    "flag": "🇲🇳",
+    "name": "Mongolia",
+    "code": "MN"
+  },
+  "ME": {
+    "flag": "🇲🇪",
+    "name": "Montenegro",
+    "code": "ME"
+  },
+  "MA": {
+    "flag": "🇲🇦",
+    "name": "Morocco",
+    "code": "MA"
+  },
+  "MZ": {
+    "flag": "🇲🇿",
+    "name": "Mozambique",
+    "code": "MZ"
+  },
+  "MM": {
+    "flag": "🇲🇲",
+    "name": "Myanmar",
+    "code": "MM"
+  },
+  "NA": {
+    "flag": "🇳🇦",
+    "name": "Namibia",
+    "code": "NA"
+  },
+  "NR": {
+    "flag": "🇳🇷",
+    "name": "Nauru",
+    "code": "NR"
+  },
+  "NP": {
+    "flag": "🇳🇵",
+    "name": "Nepal",
+    "code": "NP"
+  },
+  "NL": {
+    "flag": "🇳🇱",
+    "name": "Netherlands",
+    "code": "NL"
+  },
+  "NC": {
+    "flag": "🇳🇨",
+    "name": "New Caledonia",
+    "code": "NC"
+  },
+  "NZ": {
+    "flag": "🇳🇿",
+    "name": "New Zealand",
+    "code": "NZ"
+  },
+  "NI": {
+    "flag": "🇳🇮",
+    "name": "Nicaragua",
+    "code": "NI"
+  },
+  "NE": {
+    "flag": "🇳🇪",
+    "name": "Niger",
+    "code": "NE"
+  },
+  "NG": {
+    "flag": "🇳🇬",
+    "name": "Nigeria",
+    "code": "NG"
+  },
+  "NU": {
+    "flag": "🇳🇺",
+    "name": "Niue",
+    "code": "NU"
+  },
+  "NF": {
+    "flag": "🇳🇫",
+    "name": "Norfolk Island",
+    "code": "NF"
+  },
+  "KP": {
+    "flag": "🇰🇵",
+    "name": "North Korea",
+    "code": "KP"
+  },
+  "MK": {
+    "flag": "🇲🇰",
+    "name": "North Macedonia",
+    "code": "MK"
+  },
+  "MP": {
+    "flag": "🇲🇵",
+    "name": "Northern Mariana Islands",
+    "code": "MP"
+  },
+  "NO": {
+    "flag": "🇳🇴",
+    "name": "Norway",
+    "code": "NO"
+  },
+  "OM": {
+    "flag": "🇴🇲",
+    "name": "Oman",
+    "code": "OM"
+  },
+  "PK": {
+    "flag": "🇵🇰",
+    "name": "Pakistan",
+    "code": "PK"
+  },
+  "PW": {
+    "flag": "🇵🇼",
+    "name": "Palau",
+    "code": "PW"
+  },
+  "PS": {
+    "flag": "🇵🇸",
+    "name": "Palestine",
+    "code": "PS"
+  },
+  "PA": {
+    "flag": "🇵🇦",
+    "name": "Panama",
+    "code": "PA"
+  },
+  "PG": {
+    "flag": "🇵🇬",
+    "name": "Papua New Guinea",
+    "code": "PG"
+  },
+  "PY": {
+    "flag": "🇵🇾",
+    "name": "Paraguay",
+    "code": "PY"
+  },
+  "PE": {
+    "flag": "🇵🇪",
+    "name": "Peru",
+    "code": "PE"
+  },
+  "PH": {
+    "flag": "🇵🇭",
+    "name": "Philippines",
+    "code": "PH"
+  },
+  "PN": {
+    "flag": "🇵🇳",
+    "name": "Pitcairn Islands",
+    "code": "PN"
+  },
+  "PL": {
+    "flag": "🇵🇱",
+    "name": "Poland",
+    "code": "PL"
+  },
+  "PT": {
+    "flag": "🇵🇹",
+    "name": "Portugal",
+    "code": "PT"
+  },
+  "PR": {
+    "flag": "🇵🇷",
+    "name": "Puerto Rico",
+    "code": "PR"
+  },
+  "QA": {
+    "flag": "🇶🇦",
+    "name": "Qatar",
+    "code": "QA"
+  },
+  "RO": {
+    "flag": "🇷🇴",
+    "name": "Romania",
+    "code": "RO"
+  },
+  "RU": {
+    "flag": "🇷🇺",
+    "name": "Russia",
+    "code": "RU"
+  },
+  "RW": {
+    "flag": "🇷🇼",
+    "name": "Rwanda",
+    "code": "RW"
+  },
+  "RE": {
+    "flag": "🇷🇪",
+    "name": "Réunion",
+    "code": "RE"
+  },
+  "SX": {
+    "flag": "🇸🇽",
+    "name": "Sint Maarten",
+    "code": "SX"
+  },
+  "WS": {
+    "flag": "🇼🇸",
+    "name": "Samoa",
+    "code": "WS"
+  },
+  "SM": {
+    "flag": "🇸🇲",
+    "name": "San Marino",
+    "code": "SM"
+  },
+  "SA": {
+    "flag": "🇸🇦",
+    "name": "Saudi Arabia",
+    "code": "SA"
+  },
+  "SN": {
+    "flag": "🇸🇳",
+    "name": "Senegal",
+    "code": "SN"
+  },
+  "RS": {
+    "flag": "🇷🇸",
+    "name": "Serbia",
+    "code": "RS"
+  },
+  "SC": {
+    "flag": "🇸🇨",
+    "name": "Seychelles",
+    "code": "SC"
+  },
+  "SL": {
+    "flag": "🇸🇱",
+    "name": "Sierra Leone",
+    "code": "SL"
+  },
+  "SG": {
+    "flag": "🇸🇬",
+    "name": "Singapore",
+    "code": "SG"
+  },
+  "SK": {
+    "flag": "🇸🇰",
+    "name": "Slovakia",
+    "code": "SK"
+  },
+  "SI": {
+    "flag": "🇸🇮",
+    "name": "Slovenia",
+    "code": "SI"
+  },
+  "SB": {
+    "flag": "🇸🇧",
+    "name": "Solomon Islands",
+    "code": "SB"
+  },
+  "SO": {
+    "flag": "🇸🇴",
+    "name": "Somalia",
+    "code": "SO"
+  },
+  "ZA": {
+    "flag": "🇿🇦",
+    "name": "South Africa",
+    "code": "ZA"
+  },
+  "KR": {
+    "flag": "🇰🇷",
+    "name": "South Korea",
+    "code": "KR"
+  },
+  "SS": {
+    "flag": "🇸🇸",
+    "name": "South Sudan",
+    "code": "SS"
+  },
+  "ES": {
+    "flag": "🇪🇸",
+    "name": "Spain",
+    "code": "ES"
+  },
+  "LK": {
+    "flag": "🇱🇰",
+    "name": "Sri Lanka",
+    "code": "LK"
+  },
+  "BL": {
+    "flag": "🇧🇱",
+    "name": "St. Barthélemy",
+    "code": "BL"
+  },
+  "SH": {
+    "flag": "🇸🇭",
+    "name": "St. Helena",
+    "code": "SH"
+  },
+  "MF": {
+    "flag": "🇲🇫",
+    "name": "St. Martin",
+    "code": "MF"
+  },
+  "SD": {
+    "flag": "🇸🇩",
+    "name": "Sudan",
+    "code": "SD"
+  },
+  "SR": {
+    "flag": "🇸🇷",
+    "name": "Suriname",
+    "code": "SR"
+  },
+  "SE": {
+    "flag": "🇸🇪",
+    "name": "Sweden",
+    "code": "SE"
+  },
+  "CH": {
+    "flag": "🇨🇭",
+    "name": "Switzerland",
+    "code": "CH"
+  },
+  "SY": {
+    "flag": "🇸🇾",
+    "name": "Syria",
+    "code": "SY"
+  },
+  "ST": {
+    "flag": "🇸🇹",
+    "name": "São Tomé & Príncipe",
+    "code": "ST"
+  },
+  "TW": {
+    "flag": "🇹🇼",
+    "name": "Taiwan",
+    "code": "TW"
+  },
+  "TJ": {
+    "flag": "🇹🇯",
+    "name": "Tajikistan",
+    "code": "TJ"
+  },
+  "TZ": {
+    "flag": "🇹🇿",
+    "name": "Tanzania",
+    "code": "TZ"
+  },
+  "TH": {
+    "flag": "🇹🇭",
+    "name": "Thailand",
+    "code": "TH"
+  },
+  "TL": {
+    "flag": "🇹🇱",
+    "name": "Timor-Leste",
+    "code": "TL"
+  },
+  "TG": {
+    "flag": "🇹🇬",
+    "name": "Togo",
+    "code": "TG"
+  },
+  "TK": {
+    "flag": "🇹🇰",
+    "name": "Tokelau",
+    "code": "TK"
+  },
+  "TO": {
+    "flag": "🇹🇴",
+    "name": "Tonga",
+    "code": "TO"
+  },
+  "TT": {
+    "flag": "🇹🇹",
+    "name": "Trinidad & Tobago",
+    "code": "TT"
+  },
+  "TN": {
+    "flag": "🇹🇳",
+    "name": "Tunisia",
+    "code": "TN"
+  },
+  "TR": {
+    "flag": "🇹🇷",
+    "name": "Turkey",
+    "code": "TR"
+  },
+  "TM": {
+    "flag": "🇹🇲",
+    "name": "Turkmenistan",
+    "code": "TM"
+  },
+  "TV": {
+    "flag": "🇹🇻",
+    "name": "Tuvalu",
+    "code": "TV"
+  },
+  "VI": {
+    "flag": "🇻🇮",
+    "name": "U.S. Virgin Islands",
+    "code": "VI"
+  },
+  "UG": {
+    "flag": "🇺🇬",
+    "name": "Uganda",
+    "code": "UG"
+  },
+  "UA": {
+    "flag": "🇺🇦",
+    "name": "Ukraine",
+    "code": "UA"
+  },
+  "AE": {
+    "flag": "🇦🇪",
+    "name": "United Arab Emirates",
+    "code": "AE"
+  },
+  "UK": {
+    "flag": "🇬🇧",
+    "name": "United Kingdom",
+    "code": "UK"
+  },
+  "US": {
+    "flag": "🇺🇸",
+    "name": "United States",
+    "code": "US"
+  },
+  "UY": {
+    "flag": "🇺🇾",
+    "name": "Uruguay",
+    "code": "UY"
+  },
+  "UZ": {
+    "flag": "🇺🇿",
+    "name": "Uzbekistan",
+    "code": "UZ"
+  },
+  "VU": {
+    "flag": "🇻🇺",
+    "name": "Vanuatu",
+    "code": "VU"
+  },
+  "VA": {
+    "flag": "🇻🇦",
+    "name": "Vatican City",
+    "code": "VA"
+  },
+  "VE": {
+    "flag": "🇻🇪",
+    "name": "Venezuela",
+    "code": "VE"
+  },
+  "VN": {
+    "flag": "🇻🇳",
+    "name": "Vietnam",
+    "code": "VN"
+  },
+  "WF": {
+    "flag": "🇼🇫",
+    "name": "Wallis & Futuna",
+    "code": "WF"
+  },
+  "EH": {
+    "flag": "🇪🇭",
+    "name": "Western Sahara",
+    "code": "EH"
+  },
+  "YE": {
+    "flag": "🇾🇪",
+    "name": "Yemen",
+    "code": "YE"
+  },
+  "ZM": {
+    "flag": "🇿🇲",
+    "name": "Zambia",
+    "code": "ZM"
+  },
+  "ZW": {
+    "flag": "🇿🇼",
+    "name": "Zimbabwe",
+    "code": "ZW"
+  }
+}
diff --git a/.gh-pages/app.js b/.gh-pages/app.js
index 8a75da97..89bb20e0 100644
--- a/.gh-pages/app.js
+++ b/.gh-pages/app.js
@@ -10,10 +10,39 @@ document.addEventListener('alpine:init', () => {
     },
 
     async init() {
-      this.items = await fetch('items.json')
+      const countries = await fetch('api/countries.json')
         .then(response => response.json())
         .catch(console.log)
 
+      const channels = await fetch('api/channels.json')
+        .then(response => response.json())
+        .catch(console.log)
+
+      let items = {}
+      for (let channel of channels) {
+        if (!items[channel.country]) {
+          const country = countries[channel.country]
+
+          items[channel.country] = {
+            flag: country.flag,
+            name: country.name,
+            expanded: false,
+            channels: []
+          }
+        }
+
+        channel.hash = `${channel.id}_${channel.name}`.toLowerCase()
+
+        items[channel.country].channels.push(channel)
+      }
+
+      items = Object.values(items).sort((a, b) => {
+        if (a.name > b.name) return 1
+        if (a.name < b.name) return -1
+        return 0
+      })
+
+      this.items = items
       this.isLoading = false
     }
   }))
diff --git a/.gh-pages/index.html b/.gh-pages/index.html
index 4ef79faa..1d28b8b0 100644
--- a/.gh-pages/index.html
+++ b/.gh-pages/index.html
@@ -60,18 +60,19 @@
               <div class="level-item">Loading...</div>
             </div>
 
-            <template x-for="country in items">
+            <template x-for="item in items">
               <div
                 class="card mb-3 is-shadowless"
                 style="border: 1px solid #dbdbdb"
                 x-data="{
                   count: 0,
                   get countryChannels() {
-                    if (!_query) return country.channels
+                    if (!_query) return item.channels
+                    const normQuery = _query.toLowerCase()
 
-                    return country.channels.filter(c => {
-                      return c.hash.includes(_query)
-                    })
+                    return item.channels.filter(c => {
+                      return c.hash.includes(normQuery)
+                    }) || []
                   }
                 }"
                 x-show="countryChannels.length > 0"
@@ -81,14 +82,14 @@
               >
                 <div
                   class="card-header is-shadowless is-clickable"
-                  @click="country.expanded = !country.expanded"
+                  @click="item.expanded = !item.expanded"
                 >
-                  <span class="card-header-title" x-text="`${country.flag} ${country.name}`"></span>
+                  <span class="card-header-title" x-text="`${item.flag} ${item.name}`"></span>
                   <button class="card-header-icon" aria-label="more options">
                     <span class="icon">
                       <svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512">
                         <path
-                          x-show="!country.expanded"
+                          x-show="!item.expanded"
                           fill="none"
                           stroke="currentColor"
                           stroke-linecap="round"
@@ -97,7 +98,7 @@
                           d="M112 184l144 144 144-144"
                         />
                         <path
-                          x-show="country.expanded"
+                          x-show="item.expanded"
                           fill="none"
                           stroke="currentColor"
                           stroke-linecap="round"
@@ -109,7 +110,7 @@
                     </span>
                   </button>
                 </div>
-                <div class="card-content" x-show="country.expanded || (count > 0 && _query.length)">
+                <div class="card-content" x-show="item.expanded || (count > 0 && _query.length)">
                   <div class="table-container">
                     <table class="table" style="min-width: 100%">
                       <thead>
@@ -132,10 +133,12 @@
                               />
                             </td>
                             <td class="is-vcentered" nowrap>
-                              <div x-text="channel.display_name"></div>
+                              <template x-for="name in channel.name">
+                                <p x-text="name"></p>
+                              </template>
                             </td>
                             <td class="is-vcentered" nowrap>
-                              <code x-text="channel.tvg_id"></code>
+                              <code x-text="channel.id"></code>
                             </td>
                             <td class="is-vcentered">
                               <template x-for="guide in channel.guides">