{"id":61484,"date":"2023-11-08T03:01:55","date_gmt":"2023-11-07T17:01:55","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=61484"},"modified":"2023-11-07T17:36:34","modified_gmt":"2023-11-07T07:36:34","slug":"nimh-game-url-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/nimh-game-url-tutorial\/","title":{"rendered":"Nimh Game URL Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Nimh\/\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Nimh Game URL Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/Games\/Nimh\/nimh_url_better.jpg\" title=\"Nimh Game URL Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Nimh Game URL Tutorial<\/p><\/div>\n<p>Were you readers when we presented <a title='User Interactive Entry Dynamically Controlled Javascript Primer Tutorial' href='#uiedcjpt'>User Interactive Entry Dynamically Controlled Javascript Primer Tutorial<\/a> and said &#8230;<\/p>\n<blockquote cite='\/\/www.rjmprogramming.com.au\/ITblog\/user-interactive-entry-dynamically-controlled-javascript-primer-tutorial\/'>\n<p>As time goes on, more and more we see the benefits of URLs that start with &#8220;\/&#8221; (but not HTTP:\/\/ nor HTTPS:\/\/ absolute URL designations), especially when it comes to pointing at a &#8220;tool&#8221; (eg. external Javascript).  It has<br \/>\n the benefits of &#8230;<\/p>\n<p><\/p>\n<ul>\n<li>is programmer controlled, so they can place the tool in Document Root folder (in the case of an Apache web server) &#8230; and, in so doing &#8230;<\/li>\n<li>it&#8217;s irrelevant where the &#8220;parent&#8221; (calling) web application is placed &#8230; and &#8230;<\/li>\n<li>mixed content issues are avoided by not using an absolute URL, though it kind of, is!<\/li>\n<\/ul>\n<\/blockquote>\n<p>?<\/p>\n<p>Well, we applied these new ideas to our Nimh game PHP and HTML code to improve it, a few examples following &#8230;<\/p>\n<p>&lt;?php<br \/>\n<code><br \/>\n\/\/ Used to be<br \/>\n      $gobod3 = $drt.\"nimh.php\".$qmk.\"isess=\".substr($_GET['isess'],0,4).\"&iam=\".andsms(who_am_i(\"\"));<br \/>\n      $gobod = \" onclick='window.location = \".'\"'.$drt.\"nimh.php\".$qmk.\"isess=\".substr($_GET['isess'],0,4).\"&iam=\".andsms(who_am_i(\"\")).'\";'.\"'\";<br \/>\n      $gobodhome = \" onclick='window.location = \".'\"'.$drt.\"nimh.php\".$qmk.\"isess=\".substr($_GET['isess'],0,4).\"&iam=\".andsms(who_am_i(\"\")).'\";'.\"'\";<br \/>\n\/\/ ... now becoming ...<br \/>\n       $gobod3 = \"\/Games\/Nimh\/nimh.php\".$qmk.\"isess=\".substr($_GET['isess'],0,4).\"&iam=\".andsms(who_am_i(\"\"));<br \/>\n       $gobod = \" onclick='window.location = \".\"'\/Games\/Nimh\/nimh.php\".$qmk.\"isess=\".substr($_GET['isess'],0,4).\"&iam=\".andsms(who_am_i(\"\")).'\";'.\"'\";<br \/>\n       $gobodhome = \" onclick='window.location = \".\"'\/Games\/Nimh\/nimh.php\".$qmk.\"isess=\".substr($_GET['isess'],0,4).\"&iam=\".andsms(who_am_i(\"\")).'\";'.\"'\";<br \/>\n<\/code><br \/>\n?&gt;<\/p>\n<p> &#8230; and we figure <font size=1>(and you can try for yourself using the iframe below using <i>src<\/i> attribute <i>\/Games\/Nimh<\/i> as an example of application)<\/font> &#8230;<\/p>\n<p><iframe src='\/Games\/Nimh' style=width:100%;height:900px;><\/iframe><\/p>\n<p> &#8230; or use <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Nimh\/\">an absolute URL link<\/a> working equally well.<\/p>\n<p>While we were at it we also revisited <a target=_blank href=\"\/Games\/Battleshipsandcruisers\/\">Battleships and Cruisers<\/a> using <i>\/Games\/Battleshipsandcruisers<\/i> link.<\/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\/nimh-game-url-tutorial\/'>Nimh Game URL Tutorial<\/a>.<\/p-->\n<hr>\n<p id='uiedcjpt'>Previous relevant <a target=_blank title='User Interactive Entry Dynamically Controlled Javascript Primer Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/user-interactive-entry-dynamically-controlled-javascript-primer-tutorial\/'>User Interactive Entry Dynamically Controlled Javascript Primer 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\/rjmgoogleimages.htm\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"User Interactive Entry Dynamically Controlled Javascript Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/change_js.jpg\" title=\"User Interactive Entry Dynamically Controlled Javascript Primer Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">User Interactive Entry Dynamically Controlled Javascript Primer Tutorial<\/p><\/div>\n<p>We&#8217;re combining the work of two different recent tutorials, today, in our efforts to code for an external Javascript tool to allow a web application, just via the calling of this external Javascript, clientside functionality whereby the user can dynamically change (effectively <i>override<\/i>) Javascript code well after the document.body onload event&#8217;s passing &#8230;<\/p>\n<ol>\n<li>yesterday&#8217;s <a target=_blank href='https:\/\/www.rjmprogramming.com.au\/ITblog\/html-form-use-of-disabled-input-elements-tutorial\/' title='HTML Form Use of Disabled Input Elements Tutorial'>HTML Form Use of Disabled Input Elements Tutorial<\/a>&#8216;s establishment of a methodology to <i>override<\/i> Javascript functions dynamically via user interactive entry<\/li>\n<li>the recent <a target=_blank href='https:\/\/www.rjmprogramming.com.au\/ITblog\/blog-kaleidoscopic-view-detail-tutorial\/' title='Blog Kaleidoscopic View Detail Tutorial'>Blog Kaleidoscopic View Detail Tutorial<\/a>&#8216;s web application, as a candidate &#8220;parent&#8221; calling our &#8220;tool&#8221; via &#8230;<br \/>\n<code><br \/>\n&lt;script type=text\/javascript src='\/fix_javascript_later.js?leftpos=60%25&toppos=30%25'&gt;&lt;\/script&gt;<br \/>\n<\/code>\n<\/li>\n<\/ol>\n<p> &#8230; via &#8220;tool&#8221; external Javascript <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/fix_javascript_later.js_GETME\">fix_javascript_later.js<\/a> (proof of concept, first draft) code, so far, which looks like &#8230;<\/p>\n<p><code><br \/>\n\/\/ fix_javascript_later.js<br \/>\n\/\/ RJM Programming<br \/>\n\/\/ June, 2023<br \/>\n<br \/>\n  var inithih='';<br \/>\n  var fncodes=[], fncodenames=[''];<br \/>\n  var fixoo=null, fixooih='', visword='hidden', vist=0, lasttvn=0;<br \/>\n  var leftpos='calc(50% - 100px)', toppos='calc(50% - 100px)';<br \/>\n  <br \/>\n  var lposx=(document.URL + document.head.innerHTML).split('left' + 'pos=');<br \/>\n  var tposx=(document.URL + document.head.innerHTML).split('top' + 'pos=');<br \/>\n  <br \/>\n  if (eval('' + lposx.length) &gt; 1) {  leftpos=decodeURIComponent(lposx[1].split('&')[0].split(\"'\")[0].split('\"')[0]);   }<br \/>\n  if (eval('' + tposx.length) &gt; 1) {  toppos=decodeURIComponent(tposx[1].split('&')[0].split(\"'\")[0].split('\"')[0]);   }<br \/>\n  <br \/>\n  function resetc() {<br \/>\n    vist=0;<br \/>\n    visword='hidden';<br \/>\n    document.getElementById('dbnmt').style.visibility='visible';<br \/>\n    document.getElementById('mypgr').value='' + vist;<br \/>\n  }<br \/>\n  <br \/>\n  function postscourjs(tvn) {<br \/>\n    resetc();<br \/>\n    lasttvn=eval('' + tvn);<br \/>\n    if (eval('' + tvn) &lt; 0) {<br \/>\n    document.getElementById('djta').innerHTML='&lt;textarea style=background-color:pink; onresize=resetc(); onchange=resetc(); onfocus=resetc(); onclick=resetc(); onblur=fix_the_js(this); id=jta&gt;async function ' + fncodes[eval(('' + tvn).replace('-',''))].split('&lt;\/script&gt;')[0] + '&lt;\/textarea&gt;';<br \/>\n    \/\/alert('async function ' + fncodes[eval(('' + tvn).replace('-',''))]);<br \/>\n    } else {<br \/>\n    document.getElementById('djta').innerHTML='&lt;textarea style=background-color:pink; onresize=resetc(); onchange=resetc(); onfocus=resetc(); onclick=resetc(); onblur=fix_the_js(this); id=jta&gt;function ' + fncodes[eval(('' + tvn).replace('-',''))].split('&lt;\/script&gt;')[0] + '&lt;\/textarea&gt;';<br \/>\n    \/\/alert('function ' + fncodes[eval(('' + tvn).replace('-',''))]);<br \/>\n    }<br \/>\n  }<br \/>\n<br \/>\n  function scourjs() {<br \/>\n    var ibn=0;<br \/>\n    if (inithih == '') {<br \/>\n       inithih=document.head.innerHTML;<br \/>\n       fncodes=inithih.split('function ');<br \/>\n       for (ibn=1; ibn&lt;fncodes.length; ibn++) {<br \/>\n         if ((fncodes[eval(-1 + ibn)].trim() + '~~').indexOf('async~~') != -1) {<br \/>\n         fncodenames.push('async ' + fncodes[ibn].split('(')[0].trim());<br \/>\n         } else {<br \/>\n         fncodenames.push(fncodes[ibn].split('(')[0].trim());<br \/>\n         }<br \/>\n       }<br \/>\n       if (eval('' + fncodes.length) &gt; 1) {<br \/>\n         fixooih='&lt;div title=\"Double click to resurrect.\" ondblclick=\"putback();\" id=dbnmt style=\"position:absolute;z-index:123;opacity:0.5;left:' + leftpos + ';top:' + toppos + ';border:5px dashed green;\"&gt;&lt;h3&gt;Optionally change Javascript ...&lt;\/h3&gt;&lt;br&gt;&lt;br&gt;&lt;progress id=mypgr min=0 max=15 value=0&gt;&lt;\/progress&gt;&lt;br&gt;&lt;br&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;button id=bnmt onclick=bnmt(); style=background-color:orange;&gt;No More Thanks&lt;\/button&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;select style=background-color:yellow; onresize=resetc(); id=jcsel onchange=postscourjs(this.value);&gt;&lt;option value=\"\"&gt;Javascript function definitions ...&lt;\/option&gt;&lt;\/select&gt;&lt;br&gt;&lt;br&gt;&lt;div id=djta&gt;&lt;textarea style=background-color:pink; onresize=resetc(); onchange=resetc(); onfocus=resetc(); onclick=resetc(); onblur=fix_the_js(this); id=jta&gt;&lt;\/textarea&gt;&lt;\/div&gt;&lt;\/div&gt;';<br \/>\n         for (ibn=1; ibn&lt;fncodes.length; ibn++) {<br \/>\n           if (fncodenames[ibn].trim() != fncodenames[ibn]) {<br \/>\n           fixooih=fixooih.replace('&lt;\/select&gt;', '&lt;option value=\"-' + ibn + '\"&gt;async function ' + fncodes[ibn].split(')')[0] + ')&lt;\/option&gt;&lt;\/select&gt;');<br \/>\n           } else {<br \/>\n           fixooih=fixooih.replace('&lt;\/select&gt;', '&lt;option value=' + ibn + '&gt;function ' + fncodes[ibn].split(')')[0] + ')&lt;\/option&gt;&lt;\/select&gt;');<br \/>\n           }<br \/>\n         }<br \/>\n         document.body.innerHTML+=fixooih;<br \/>\n         fixooih=fixooih.replace('0.5','1.0');<br \/>\n         setTimeout(vistog, 1000);<br \/>\n       } else {<br \/>\n         inithih='';<br \/>\n       }<br \/>\n    }<br \/>\n  }<br \/>\n  <br \/>\n  function putback() {<br \/>\n   vist=0;<br \/>\n   document.getElementById('dbnmt').innerHTML=fixooih;<br \/>\n   document.getElementById('dbnmt').style.zIndex=123;<br \/>\n   visword='hidden';<br \/>\n   setTimeout(vistog, 1000);<br \/>\n  }<br \/>\n  <br \/>\n  function vistog() {<br \/>\n    if (document.getElementById('mypgr')) {<br \/>\n    setTimeout(vistog, 1000);<br \/>\n    vist++;<br \/>\n    document.getElementById('mypgr').value='' + vist;<br \/>\n    if (vist &gt;= 15) {<br \/>\n      if (visword == 'hidden') {<br \/>\n        visword='visible';<br \/>\n      } else {<br \/>\n        visword='hidden';<br \/>\n      }<br \/>\n      document.getElementById('dbnmt').style.visibility=visword;<br \/>\n      vist=0;<br \/>\n    }<br \/>\n    }<br \/>\n  }<br \/>\n  <br \/>\n  function bnmt() {<br \/>\n    document.getElementById('dbnmt').innerHTML='';<br \/>\n    \/\/document.getElementById('dbnmt').style.zIndex=-786;<br \/>\n  }<br \/>\n      <br \/>\n  function fix_the_js(ota) {<br \/>\n      var tag = document.createElement('script');<br \/>\n      tag.innerHTML = ota.value;<br \/>\n      fncodes[lasttvn]=ota.value;<br \/>\n      var firstScriptTag = document.getElementsByTagName('script')[eval(-1 + document.getElementsByTagName('script').length)];<br \/>\n      firstScriptTag.insertAdjacentElement(\"afterend\", tag);<br \/>\n  }<br \/>\n<br \/>\n  setTimeout(scourjs, 5000);<br \/>\n<\/code><\/p>\n<p> &#8230; and you can see in action with <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/rjmgoogleimages.html---GETME\">the tweaked<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/rjmgoogleimages.html---GETME\" title=\"rjmgoogleimages.htm\">rjmgoogleimages.htm<\/a>&#8216;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/rjmgoogleimages.htm\" title=\"Click picture\">adjusted web application<\/a>.<\/p>\n<p>As time goes on, more and more we see the benefits of URLs that start with &#8220;\/&#8221; (but not HTTP:\/\/ nor HTTPS:\/\/ absolute URL designations), especially when it comes to pointing at a &#8220;tool&#8221; (eg. external Javascript).  It has<br \/>\n the benefits of &#8230;<\/p>\n<ul>\n<li>is programmer controlled, so they can place the tool in Document Root folder (in the case of an Apache web server) &#8230; and, in so doing &#8230;<\/li>\n<li>it&#8217;s irrelevant where the &#8220;parent&#8221; (calling) web application is placed &#8230; and &#8230;<\/li>\n<li>mixed content issues are avoided by not using an absolute URL, though it kind of, is!<\/li>\n<\/ul>\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='#d59878' onclick='var dv=document.getElementById(\"d59878\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/override\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59878' 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='#d61484' onclick='var dv=document.getElementById(\"d61484\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/url\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d61484' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Were you readers when we presented User Interactive Entry Dynamically Controlled Javascript Primer Tutorial and said &#8230; As time goes on, more and more we see the benefits of URLs that start with &#8220;\/&#8221; (but not HTTP:\/\/ nor HTTPS:\/\/ absolute &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/nimh-game-url-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,15,37],"tags":[52,4549,476,576,4548,3225,932,997,1045,1319,1345],"class_list":["post-61484","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-games","category-tutorials","tag-absolute-url","tag-battleships-and-cruisers","tag-game","tag-html","tag-hybrid","tag-nimh","tag-php","tag-programming","tag-relative-url","tag-tutorial","tag-url"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/61484"}],"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=61484"}],"version-history":[{"count":7,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/61484\/revisions"}],"predecessor-version":[{"id":61496,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/61484\/revisions\/61496"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=61484"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=61484"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=61484"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}