{"id":64209,"date":"2024-07-13T03:01:00","date_gmt":"2024-07-12T17:01:00","guid":{"rendered":"https:\/\/65.254.95.247\/ITblog\/?p=64209"},"modified":"2024-07-17T12:59:45","modified_gmt":"2024-07-17T02:59:45","slug":"other-side-of-the-world-reworked-lookups-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/other-side-of-the-world-reworked-lookups-tutorial\/","title":{"rendered":"Other Side of the World Reworked Lookups Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.htm\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Other Side of the World Reworked Lookups Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world_lookups.jpg\" title=\"Other Side of the World Reworked Lookups Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Other Side of the World Reworked Lookups Tutorial<\/p><\/div>\n<p>The way the &#8220;Other Side of the World&#8221; web application from <a title='Other Side of the World Reworked Dropdowns Tutorial' href='#oswrdt'>Other Side of the World Reworked Dropdowns Tutorial<\/a> arranged its &#8230;<\/p>\n<ul>\n<li>autocomplete &#8230; Javascript logic &#8230; was via a &#8230;<\/li>\n<li>free Weather API &#8230; called <a target=\"_blank\" title='Weather Underground' href='https:\/\/www.wunderground.com\/' rel=\"noopener\">Weather Underground<\/a> API &#8230; but, today, we redesign &#8230; to start using &#8230;<\/li>\n<li>inhouse geographical lookups<\/li>\n<\/ul>\n<p> &#8230; and with today&#8217;s start on this new arrangement, we use, <a target=\"_blank\" title=\"?\" href='https:\/\/www.youtube.com\/watch?v=e9_7GcQeiqw&#038;t=2m37s' rel=\"noopener\">again<\/a> &#8230;<\/p>\n<ul>\n<li>timezone data &#8230; PHP derived &#8230; from which we can glean &#8230;<\/li>\n<li>data items &#8230;\n<ol>\n<li>timezone name &#8230; containing the place name &#8230;<\/li>\n<li>latitude and longitude geographicals<\/li>\n<li>ISO-3166 2 letter country codes<\/li>\n<\/ol>\n<p> &#8230; from which we can derive a country name, via the 2 letter code<\/li>\n<\/ul>\n<p> &#8230; starting out just with an &#8220;onblur&#8221; textbox element response today, with this draft of changes &#8230;<\/p>\n<p><code><br \/>\nvar ourtzlist=\"<option value=\\\"Europe\/Amsterdam\\\" data-geo=\\\"52.36666,4.9,CEST,NL,+1\\\">Europe\/Amsterdam<\/option>... blah de blah ...\";<br \/>\nvar icc=['AF','Afghanistan',<br \/>\n'AX','Aland Islands',<br \/>\n'AL','Albania',<br \/>\n'DZ','Algeria',<br \/>\n'AS','American Samoa',<br \/>\n'AD','Andorra',<br \/>\n ... blah de blah ...<br \/>\n];<br \/>\n<br \/>\nfunction oosel(seloo) {<br \/>\n   thatiso=('' + seloo.options[seloo.selectedIndex].getAttribute('data-iso')).replace(\/^null\/g,'').replace(\/^undefined\/g,'');<br \/>\n   thatcountry=nearfind(thatiso);<br \/>\n   if (thatcountry == '') {<br \/>\n     document.getElementById('place').setAttribute('data-iso', thatiso);<br \/>\n     document.getElementById('place').setAttribute('data-country', thatcountry);<br \/>\n     document.getElementById('place').title=thatcountry;<br \/>\n        document.getElementById('sfrom').title=thatcountry;<br \/>\n        document.getElementById('sto').title=thatcountry;<br \/>\n   } else {<br \/>\n     document.getElementById('place').setAttribute('data-iso', thatiso);<br \/>\n     document.getElementById('place').setAttribute('data-country', thatcountry);<br \/>\n     document.getElementById('place').title=thatcountry;<br \/>\n        document.getElementById('sfrom').title=thatcountry;<br \/>\n        document.getElementById('sto').title=thatcountry;<br \/>\n   }<br \/>\n   return seloo;<br \/>\n}<br \/>\n<br \/>\nfunction nearfind(isoidea) {<br \/>\n    if (isoidea == '') { return \"\"; }<br \/>\n    for (var imm=0; imm&lt;icc.length; imm+=2) {<br \/>\n       if (isoidea.toLowerCase().replace(\/\\_\/g,' ') == icc[imm].toLowerCase().replace(\/\\_\/g,' ')) {<br \/>\n         return icc[eval(1 + imm)].replace(\"'\", \"`\");<br \/>\n       }<br \/>\n    }<br \/>\n    return \"\";<br \/>\n}<br \/>\n<br \/>\nfunction newafters(evttargetvalue, thisiso, thiscountry) {<br \/>\n        var ivsll=1;<br \/>\n        var sofarnear=';', sofarnearother=';', nearcountry='', nearothercountry='', neariso='', nearotheriso='';<br \/>\n        var inlat=eval('' + document.getElementById('latitude').value), fone=true, distnear=-200.0, distother=-200.0, nearplace='', nearotherplace='', nearlat=-200.0, nearlong=-200.0, nearotherlat=-200.0, nearotherlong=-200.0;<br \/>\n        var inlong=eval('' + document.getElementById('longitude').value);<br \/>\n        var inlatoe=eval(-inlat), inlongoe=(eval(inlong) &lt; 0.0 ? eval(180.000000 + (inlong)) : eval(inlong - 180.0));<br \/>\n        var vsll=ourtzlist.split(' data-geo=\"');<br \/>\n <br \/> <br \/>\n        if (thiscountry != '') {<br \/>\n        \/\/alert(thiscountry);<br \/>\n               document.getElementById('sfrom').innerHTML=document.getElementById('sfrom').innerHTML.split('&lt;\/option&gt;')[0].split(' to ')[0] + ' to ' + evttargetvalue.replace(\/\\_\/g,' ') + ', ' + thiscountry + ' ...&lt;\/option&gt;';<br \/>\n               document.getElementById('sto').innerHTML=document.getElementById('sto').innerHTML.split('&lt;\/option&gt;')[0].split(' World to ')[0] + ' World to ' + evttargetvalue.replace(\/\\_\/g,' ') + ', ' + thiscountry + ' ...&lt;\/option&gt;';<br \/>\n        } else {<br \/>\n               document.getElementById('sfrom').innerHTML=document.getElementById('sfrom').innerHTML.split('&lt;\/option&gt;')[0].split(' to ')[0] + ' to ' + evttargetvalue.replace(\/\\_\/g,' ') + ' ...&lt;\/option&gt;';<br \/>\n               document.getElementById('sto').innerHTML=document.getElementById('sto').innerHTML.split('&lt;\/option&gt;')[0].split(' World to ')[0] + ' World to ' + evttargetvalue.replace(\/\\_\/g,' ') + ' ...&lt;\/option&gt;';<br \/>\n        }<br \/>\n        document.body.style.cursor='progress';<br \/>\n        document.getElementById('place').style.cursor='progress';<br \/>\n        for (var iii=0; iii&lt;5; iii++) {<br \/>\n    \/\/alert('here ' + iii);<br \/>\n        for (ivsll=1; ivsll&lt;vsll.length; ivsll++) {<br \/>\n          if (vsll[ivsll].split('&gt;')[1].split('&lt;')[0].indexOf('\/') != -1 && vsll[ivsll].split('&gt;')[1].split('&lt;')[0].indexOf('\/' + evttargetvalue.replace(\/\\ \/g,'_') + '') == -1) {<br \/>\n             if (fone) {<br \/>\n               fone=false;<br \/>\n               nearplace=vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/')[eval(-1 + vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/').length)].replace(\/\\_\/g, ' ');<br \/>\n               nearotherplace=vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/')[eval(-1 + vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/').length)].replace(\/\\_\/g, ' ');<br \/>\n               nearlat=eval(vsll[ivsll].split(',')[0]);<br \/>\n               nearotherlat=eval(vsll[ivsll].split(',')[0]);<br \/>\n               nearlong=eval(vsll[ivsll].split(',')[1]);<br \/>\n               neariso=(vsll[ivsll].split(',')[3]);<br \/>\n               nearotherlong=eval(vsll[ivsll].split(',')[1]);<br \/>\n               nearotheriso=(vsll[ivsll].split(',')[3]);<br \/>\n               distnear=eval(Math.abs(nearlat - inlat) + Math.abs(nearlong - inlong));<br \/>\n               distother=eval(Math.abs(nearotherlat - inlatoe) + Math.abs(nearotherlong - inlongoe));<br \/>\n               \/\/alert(distnear);<br \/>\n             } else {<br \/>\n               if (sofarnear.indexOf(';' + vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/')[eval(-1 + vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/').length)].replace(\/\\_\/g, ' ') + ';') == -1 && distnear &gt; eval(Math.abs(eval(vsll[ivsll].split(',')[0]) - inlat) + Math.abs(eval(vsll[ivsll].split(',')[1]) - inlong))) {<br \/>\n               nearplace=vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/')[eval(-1 + vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/').length)].replace(\/\\_\/g, ' ');<br \/>\n               nearlat=eval(vsll[ivsll].split(',')[0]);<br \/>\n               nearlong=eval(vsll[ivsll].split(',')[1]);<br \/>\n               neariso=(vsll[ivsll].split(',')[3]);<br \/>\n               distnear=eval(Math.abs(nearlat - inlat) + Math.abs(nearlong - inlong));<br \/>\n               }<br \/>\n               if (sofarnearother.indexOf(';' + vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/')[eval(-1 + vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/').length)].replace(\/\\_\/g, ' ') + ';') == -1 && distother &gt; eval(Math.abs(eval(vsll[ivsll].split(',')[0]) - inlatoe) + Math.abs(eval(vsll[ivsll].split(',')[1]) - inlongoe))) {<br \/>\n               nearotherplace=vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/')[eval(-1 + vsll[ivsll].split('&gt;')[1].split('&lt;')[0].split('\/').length)].replace(\/\\_\/g, ' ');<br \/>\n               nearotherlat=eval(vsll[ivsll].split(',')[0]);<br \/>\n               nearotherlong=eval(vsll[ivsll].split(',')[1]);<br \/>\n               nearotheriso=(vsll[ivsll].split(',')[3]);<br \/>\n               distother=eval(Math.abs(nearotherlat - inlatoe) + Math.abs(nearotherlong - inlongoe));<br \/>\n               }<br \/>\n             }<br \/>\n          }<br \/>\n        }<br \/>\n        nearcountry=nearfind(neariso);<br \/>\n        nearothercountry=nearfind(nearotheriso);<br \/>\n        document.getElementById('sfrom').innerHTML+='&lt;option title=\"' + nearcountry + '\" data-iso=\"' + neariso + '\" data-cname=\"' + nearcountry + '\" value=\"' + nearlat + ',' + nearlong + '\"&gt;' + nearplace + '&lt;\/option&gt;';<br \/>\n        document.getElementById('sto').innerHTML+='&lt;option title=\"' + nearothercountry + '\" data-iso=\"' + nearotheriso + '\" data-cname=\"' + nearothercountry + '\" value=\"' + nearotherlat + ',' + nearotherlong + '\"&gt;' + nearotherplace + '&lt;\/option&gt;';<br \/>\n        sofarnear+=nearplace.replace(\/\\_\/g,' ') + ';';<br \/>\n        sofarnearother+=nearotherplace.replace(\/\\_\/g,' ') + ';';<br \/>\n        \/\/alert('iii=' + iii + ' and sofarnearother=' + sofarnearother);<br \/>\n        fone=true;<br \/>\n        distnear=-200.0;<br \/>\n        distother=-200.0;<br \/>\n        nearplace='';<br \/>\n        nearotherplace='';<br \/>\n        nearcountry='';<br \/>\n        nearothercountry='';<br \/>\n        neariso='';<br \/>\n        nearotheriso='';<br \/>\n        nearlat=-200.0;<br \/>\n        nearlong=-200.0;<br \/>\n        nearotherlat=-200.0;<br \/>\n        nearotherlong=-200.0;<br \/>\n        }<br \/>\n        \/\/alert(document.getElementById('sto').innerHTML);<br \/>\n        document.getElementById('place').style.cursor='pointer';<br \/>\n        document.body.style.cursor='pointer';<br \/>\n<br \/> <br \/>\n        document.getElementById('place').value=evttargetvalue.replace(\/\\_\/g,' ');<br \/>\n}<br \/>\n<br \/>\nfunction newway(evt) {<br \/>\n  var thisiso='', thiscountry='';<br \/>\n  if (evt.target.value.trim() != '' && eval('' + evt.target.value.length) &gt; 1) {<br \/>\n     if (eval('' + ourtzlist.toLowerCase().split('\/' + evt.target.value.replace(\/\\ \/g,'_').toLowerCase()).length) == 3) {<br \/>\n        \/\/alert(evt.target.value + ourtzlist.toLowerCase().split('\/' + evt.target.value.toLowerCase())[1].split('\"')[0]);<br \/>\n        evt.target.value=ourtzlist.substring(eval(1 + ourtzlist.toLowerCase().split('\/' + evt.target.value.replace(\/\\ \/g,'_').toLowerCase())[0].length)).split('\"')[0].replace(\/\\_\/g,' ');<br \/>\n        \/\/alert(evt.target.value);<br \/>\n        document.getElementById('latitude').value=ourtzlist.toLowerCase().split('\/' + evt.target.value.replace(\/\\ \/g,'_').toLowerCase())[1].split('\"')[2].split(',')[0];<br \/>\n        document.getElementById('longitude').value=ourtzlist.toLowerCase().split('\/' + evt.target.value.replace(\/\\ \/g,'_').toLowerCase())[1].split('\"')[2].split(',')[1];<br \/>\n        thisiso=ourtzlist.toUpperCase().split('\/' + evt.target.value.replace(\/\\ \/g,'_').toUpperCase())[1].split('\"')[2].split(',')[3];<br \/>\n        thiscountry=nearfind(thisiso);<br \/>\n        document.getElementById('place').title=thiscountry;<br \/>\n        document.getElementById('sfrom').title=thiscountry;<br \/>\n        document.getElementById('sto').title=thiscountry;<br \/>\n        document.getElementById('place').setAttribute('data-iso',thisiso);<br \/>\n        document.getElementById('place').setAttribute('data-country',thiscountry);<br \/>\n        newafters(evt.target.value.replace(\/\\ \/g,'_'), thisiso, thiscountry);<br \/>\n<br \/>\n\/\/         distfrom[eval(-1 + jplace)]=Math.floor(great_circle_distance(inlat, inlong, ylat[eval(-1 + jplace)], xlong[eval(-1 + jplace)]));<br \/>\n\/\/         distto[eval(-1 + jplace)]=Math.floor(great_circle_distance(inlatoe, inlongoe, ylat[eval(-1 + jplace)], xlong[eval(-1 + jplace)]));<br \/>\n<br \/>\n    \/\/var placebits=cols[0].split('\/'), aname='';<br \/>\n    \/\/for (var ival=eval(-1 + placebits.length); ival&gt;=0; ival--) {<br \/>\n    \/\/  if (aname == '') {<br \/>\n    \/\/    aname=placebits[ival];<br \/>\n    \/\/  } else {<br \/>\n    \/\/    aname+=', ' + placebits[ival];<br \/>\n    \/\/  }<br \/>\n    \/\/}<br \/>\n    document.getElementById('place').value=evt.target.value.replace(\/\\_\/g,' '); \/\/noslash(sio.options[sio.selectedIndex].text); \/\/aname;<br \/>\n    if (1 == 3) {<br \/>\n    totalmore();<br \/>\n    wthere=true;<br \/>\n    showit(null);<br \/>\n    newtpz();<br \/>\n    wthere=false;<br \/>\n    }<br \/>\n    document.getElementById('mysb').click();<br \/>\n     }<br \/>\n  }<br \/>\n}<br \/>\n<\/code> <\/p>\n<p>And so, yet again, <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.html------------GETME' title='other_side_of_the_world.html------------GETME' rel=\"noopener\">a changed<\/a> <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.html------------GETME' title='other_side_of_the_world.html------------GETME' rel=\"noopener\">other_side_of_the_world.htm<\/a>&#8216;s <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.htm\" title=\"Click picture\" rel=\"noopener\">live run<\/a> is there for you to try yourself.<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/other-side-of-the-world-reworked-lookups-tutorial\/' rel=\"noopener\">Other Side of the World Reworked Lookups Tutorial<\/a>.<\/p-->\n<hr>\n<p id='oswrdt'>Previous relevant <a target=\"_blank\" title='Other Side of the World Reworked Dropdowns Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/other-side-of-the-world-reworked-dropdowns-tutorial\/' rel=\"noopener\">Other Side of the World Reworked Dropdowns Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.htm\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Other Side of the World Reworked Dropdowns Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/\/HTMLCSS\/other_side_of_the_world_dropdowns.jpg\" title=\"Other Side of the World Reworked Dropdowns Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Other Side of the World Reworked Dropdowns Tutorial<\/p><\/div>\n<p>Continuing on from <a title='Other Side of the World Reworked Logic Tutorial' href='#oswrlt'>Other Side of the World Reworked Logic Tutorial<\/a>&#8216;s first rearrangements at the lack of access to a weather (and its associated placename) API database we turn to that top dropdown (ie. HTML select element), with its &#8230;<\/p>\n<ul>\n<li>hour of day (ie. pointing at a timezone)<\/li>\n<li>country<\/li>\n<\/ul>\n<p> &#8230; options, and try to make it easier for the user to populate those latitude and longitude fields, then on to other map and video information, data flows.<\/p>\n<p>These changes, amongst other things, calls on HTML iframe <font color=blue>onload usage<\/font> &#8230;<\/p>\n<p><code><br \/>\n&lt;iframe <font color=blue>onload=\"gountil(this);\"<\/font> id=\"irandoms\" src=\"\/\/www.rjmprogramming.com.au\/PHP\/tz_places.php\" title=\"Randoms\" style=\"display:none;\"&gt;&lt;\/iframe&gt;<br \/>\n<\/code><\/p>\n<p> &#8230; and associated Javascript &#8230;<\/p>\n<p><code><br \/>\n function srandoms() {<br \/>\n   if (lokf == lastlokf.trim() && lokf != '') {<br \/>\n     document.getElementById('irandoms').src=document.getElementById('irandoms').src.split('?')[0] + '?rand=' + Math.floor(Math.random() * 198765432);<br \/>\n   }<br \/>\n }<br \/>\n <br \/>\n function gountil(iois) {<br \/>\n   if (iois != null) {<br \/>\n     aconto = (iois.contentWindow || iois.contentDocument);<br \/>\n     if (aconto != null) {<br \/>\n      if (aconto.document) { aconto = aconto.document; }<br \/>\n      if (aconto.body != null) {<br \/>\n       if (lokf != '') {<br \/>\n         if (aconto.body.innerHTML.indexOf(lokf) == -1) {<br \/>\n           setTimeout(srandoms, 5000); \/\/iois.src=iois.src.split('?')[0] + '?rand=' + Math.floor(Math.random() * 198765432);<br \/>\n         } else if (aconto.body.innerHTML.indexOf(': ') != -1) {<br \/>\n           document.getElementById('place').value=decodeURIComponent(aconto.body.innerHTML.split(lokf)[1].split(': ')[0].split('&')[0]).trim().split(',')[0]; \/\/      .split('max-width')[1].split('&lt;\/td&gt;')[0].replace(\/\\&nbsp\\;\/g,' ').replace(\/\\:\/g,' ').trim().split(' ')[eval(-1 + aconto.body.innerHTML.split('max-width')[1].split('&lt;\/td&gt;')[0].replace(\/\\&nbsp\\;\/g,' ').replace(\/\\:\/g,' ').trim().split(' ').length)].split(',')[0];<br \/>\n           totalmore();<br \/>\n           ourprewbit();<br \/>\n           setTimeout(sfromit, 4000);<br \/>\n         }<br \/>\n       }<br \/>\n      }<br \/>\n     }<br \/>\n   }<br \/>\n }<br \/>\n<\/code><\/p>\n<p> &#8230; and associated emoji country flag (via ISO 2 character country code, off the dropdown) Javascript logic &#8230;<\/p>\n<p><code><br \/>\nvar lokf='', lastlokf='';<br \/>\n<br \/>\nif (!String.fromCodePoint) {   \/\/ thanks to <a target=\"_blank\" title=\"Thanks\" href='http:\/\/xahlee.info\/js\/js_unicode_code_point.html' rel=\"noopener\">http:\/\/xahlee.info\/js\/js_unicode_code_point.html<\/a><br \/>\n\/\/ ES6 Unicode Shims 0.1 , \u00a9 2012 Steven Levithan , MIT License<br \/>\n    String.fromCodePoint = function fromCodePoint () {<br \/>\n        var chars = [], point, offset, units, i;<br \/>\n        for (i = 0; i &lt; arguments.length; ++i) {<br \/>\n            point = arguments[i];<br \/>\n            offset = point - 0x10000;<br \/>\n            units = point &gt; 0xFFFF ? [0xD800 + (offset &gt;&gt; 10), 0xDC00 + (offset & 0x3FF)] : [point];<br \/>\n            chars.push(String.fromCharCode.apply(null, units));<br \/>\n        }<br \/>\n        return chars.join(\"\");<br \/>\n    }<br \/>\n}<br \/>\n<br \/>\nfunction worflag(thiscc) {<br \/>\n      var ccchar=\"\", ccsuff=\"\";<br \/>\n      var lri=\"ABCDEFGHIJKLMNOPQRSTUVWXYZ\";<br \/>\n      var dri=[\"127462\",\"127463\",\"127464\",\"127465\",\"127466\",\"127467\",\"127468\",\"127469\",\"127470\",\"127471\",\"127472\",\"127473\",\"127474\",\"127475\",\"127476\",\"127477\",\"127478\",\"127479\",\"127480\",\"127481\",\"127482\",\"127483\",\"127484\",\"127485\",\"127486\",\"127487\"];<br \/>\n      for (var iccsuff=0; iccsuff&lt;thiscc.length; iccsuff++) {<br \/>\n        ccchar=thiscc.substring(iccsuff, eval(1 + eval('' + iccsuff))).toUpperCase();<br \/>\n        ccsuff+=String.fromCodePoint(eval('' + dri[eval('' + lri.indexOf(ccchar))])); \/\/'&#' + dri[eval('' + lri.indexOf(ccchar))] + ';';<br \/>\n      }<br \/>\n      return ccsuff;<br \/>\n}<br \/>\n<\/code><\/p>\n<p>And so, again, <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.html-GETME' title='other_side_of_the_world.html-----------GETME' rel=\"noopener\">a changed<\/a> <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.html-----------GETME' title='other_side_of_the_world.html-----------GETME' rel=\"noopener\">other_side_of_the_world.htm<\/a>&#8216;s <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.htm\" title=\"Click picture\" rel=\"noopener\">live run<\/a> calls on <a target=\"_blank\" title='autocomplete.htm' href='http:\/\/www.rjmprogramming.com.au\/weather\/autocomplete.html-----GETME' rel=\"noopener\">autocomplete.htm<\/a> (which supervises Wunderground API data calling) changed in <a target=\"_blank\" title='autocomplete.htm' href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/weather\/autocomplete.html-----GETME' rel=\"noopener\">this way<\/a> to offer that alternative means to an end, with dropdown logic improvements.<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/other-side-of-the-world-reworked-dropdowns-tutorial\/' rel=\"noopener\">Other Side of the World Reworked Dropdowns Tutorial<\/a>.<\/p-->\n<hr>\n<p id='oswrlt'>Previous relevant <a target=\"_blank\" title='Other Side of the World Reworked Logic Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/other-side-of-the-world-reworked-logic-tutorial\/' rel=\"noopener\">Other Side of the World Reworked Logic Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.htm\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Other Side of the World Reworked Logic Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/\/HTMLCSS\/other_side_of_the_world_no_wunderground.jpg\" title=\"Other Side of the World Reworked Logic Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Other Side of the World Reworked Logic Tutorial<\/p><\/div>\n<p>You may recall in the recent <a target=\"_blank\" href='https:\/\/www.rjmprogramming.com.au\/ITblog\/audio-and-video-creator-via-media-browsing-image-background-email-tutorial\/' title='Audio and Video Creator via Media Browsing Image Background Email Tutorial' rel=\"noopener\">Audio and Video Creator via Media Browsing Image Background Email Tutorial<\/a> how we had a link &#8230;<\/p>\n<blockquote cite='https:\/\/www.rjmprogramming.com.au\/ITblog\/audio-and-video-creator-via-media-browsing-image-background-email-tutorial\/'><p>\n<a target=\"_blank\" title='?' href='https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.htm' rel=\"noopener\">on the other side of the wooooooorrrrrlllllddd<\/a>\n<\/p><\/blockquote>\n<p> &#8230; which got us to our &#8220;Other Side of the World&#8221; web application.  Well, some of the workings of that web application function best when the <a target=\"_blank\" title='Weather Underground' href='http:\/\/www.wunderground.com' rel=\"noopener\">Weather Underground<\/a> weather API&#8217;s autocomplete functionality is working.  Alas, it is not <font size=1>(with us any more)<\/font> &#8230; prescient, indeed, after the recent <a target=\"_blank\" href='https:\/\/www.rjmprogramming.com.au\/ITblog\/html-map-element-svg-context-google-search-tutorial\/' title='HTML Map Element SVG Context Google Search Tutorial' rel=\"noopener\">HTML Map Element SVG Context Google Search Tutorial<\/a>&#8216;s &#8230;<\/p>\n<blockquote cite='https:\/\/www.rjmprogramming.com.au\/ITblog\/html-map-element-svg-context-google-search-tutorial\/'><p>\nWhen including URLs away from the domain (ie. \u201cthird party\u201d) on which your webpage resides then you are at risk, over time, when it comes to using URLs optionally involving arguments delimited by ? (first) and (subsequent) &#038; (what we call the \u201cGET\u201d arguments) optionally delimited by # before a hashtag that used to work, but may stop working into the future.\n<\/p><\/blockquote>\n<p>We cannot replace the data lost regarding Weather and Placename lists from this, but we can thank <a target=\"_blank\" title='Wikipedia, thanks' href='https:\/\/wikipedia.org' rel=\"noopener\">Wikipedia<\/a>, yet again, to help us link a single Placename with a single Geographical (Latitude, Longitude) geodata set that can match to those two HTML input elements for latitude and longitude, to improve the situation.<\/p>\n<p>And so <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.html-GETME' title='other_side_of_the_world.html----------GETME' rel=\"noopener\">a changed<\/a> <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.html----------GETME' title='other_side_of_the_world.html----------GETME' rel=\"noopener\">other_side_of_the_world.htm<\/a>&#8216;s <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/other_side_of_the_world.htm\" title=\"Click picture\" rel=\"noopener\">live run<\/a> calls on <a target=\"_blank\" title='autocomplete.htm' href='http:\/\/www.rjmprogramming.com.au\/weather\/autocomplete.html----GETME' rel=\"noopener\">autocomplete.htm<\/a> (which supervises Wunderground API data calling) changed in <a target=\"_blank\" title='autocomplete.htm' href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/weather\/autocomplete.html----GETME' rel=\"noopener\">this way<\/a> to offer that alternative means to an end.<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d52567' onclick='var dv=document.getElementById(\"d52567\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/geodata\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d52567' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d52576' onclick='var dv=document.getElementById(\"d52576\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/dropdown\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d52576' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d64209' onclick='var dv=document.getElementById(\"d64209\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/timezone\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d64209' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>The way the &#8220;Other Side of the World&#8221; web application from Other Side of the World Reworked Dropdowns Tutorial arranged its &#8230; autocomplete &#8230; Javascript logic &#8230; was via a &#8230; free Weather API &#8230; called Weather Underground API &#8230; &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/other-side-of-the-world-reworked-lookups-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,14,1,37],"tags":[88,1695,218,2081,2247,367,3663,385,3192,2242,480,481,576,587,2395,3266,4642,652,684,719,3862,4831,2134,2918,997,1866,1693,1319,1431,2811,3662],"class_list":["post-64209","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-uncategorised","category-tutorials","tag-api","tag-autocompletion","tag-code","tag-country","tag-country-code","tag-dropdown","tag-dropdowns","tag-emoji","tag-emoji-flag","tag-flag","tag-geodata","tag-geographicals","tag-html","tag-iframe","tag-iso","tag-iso-code","tag-iso-3166","tag-javascript","tag-latitude","tag-longitude","tag-lookup","tag-lookups","tag-place","tag-placename","tag-programming","tag-select","tag-timezone","tag-tutorial","tag-wikipedia","tag-world","tag-wunderground"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/64209"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=64209"}],"version-history":[{"count":1,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/64209\/revisions"}],"predecessor-version":[{"id":64210,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/64209\/revisions\/64210"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=64209"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=64209"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=64209"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}