{"id":37099,"date":"2018-03-30T03:01:23","date_gmt":"2018-03-29T17:01:23","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=37099"},"modified":"2018-03-29T12:18:29","modified_gmt":"2018-03-29T02:18:29","slug":"five-hundred-card-game-flow-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/five-hundred-card-game-flow-tutorial\/","title":{"rendered":"Five Hundred Card Game Flow Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html?carddealnum=10&#038;numplayers=4&#038;modeofdisplay=20\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Five Hundred Card Game Flow Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/five_hundred_popup.jpg\" title=\"Five Hundred Card Game Flow Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Five Hundred Card Game Flow Tutorial<\/p><\/div>\n<p>Sometimes web applications need that &#8220;modal&#8221; quality that the Javascript popup boxes, specifically our use of the <a target=_blank title='Javascript alert window information from w3schools' href='http:\/\/www.w3schools.com\/jsref\/met_win_alert.asp'><i>window.alert([information])<\/i><\/a> Javascript popup window for the Five Hundred Card Game.  The reason is that given the Javascript client side&#8217;s lack of a true sleep (or wait) type of functionality, we need our web application designed for playing on &#8230;<\/p>\n<ul>\n<li>one computer device &#8230; but potentially involving &#8230;<\/li>\n<li>up to 9 players accessing that one computer device<\/li>\n<\/ul>\n<p> &#8230; and yet allowing for each player not to see the other player&#8217;s cards, ideally.  The <i>window.alert([information])<\/i> has served as that &#8220;valve&#8221; in the web application to make this possible, with the web application halting everything else it was doing (the definition of a &#8220;modal&#8221; window) to wait for the player to click the OK button, and we&#8217;re presupposing that player is the one being addressed by the <i>window.alert([information])<\/i>&#8216;s assignation.<\/p>\n<p>But &#8230; and didn&#8217;t you know there&#8217;d not be an &#8220;howevvvvvvvvvvveeeerrrr&#8221;?! &#8230; these <i>window.alert([information])<\/i> popups can sure be distracting to the &#8220;flow&#8221; of the web application.  So today, to add onto the progress made with yesterday&#8217;s <a title='Five Hundred Card Game Bidding Tutorial' href='#fhcgbt'>Five Hundred Card Game Bidding Tutorial<\/a> we are going to go exploring some &#8230;<\/p>\n<p><code><br \/>\ntimed <i>window.alert([information])<\/i> window ideas, that self close (rather than the player having to close them)<br \/>\n<\/code><\/p>\n<p>Surfing the &#8220;net&#8221; on this, we got to this <a target=_blank title='Very useful link, thanks' href='https:\/\/stackoverflow.com\/questions\/1962861\/javascript-alert-box-with-timer\/1962870'>very useful link<\/a>, thanks, full of ideas on this matter, and one that we liked involving a &#8230;<\/p>\n<ul>\n<li>&#8220;preWindow=window.open()&#8221; then <a target=_blank title='Javascript setTimeout method information from w3schools' href='http:\/\/www.w3schools.com\/jsref\/met_win_settimeout.asp'>setTimeout<\/a> preWindow.close() scenario &#8230; soon got us realising &#8230;<\/li>\n<li>HTML div element can &#8220;house&#8221; what was previously the <i>window.alert([information])<\/i> window message then setTimeout make that div element innerHTML be blank<\/li>\n<\/ul>\n<p> &#8230; both timed <i>window.alert([information])<\/i> window idea alternatives, teamed up with two other concepts &#8230;<\/p>\n<ol>\n<li>a (now user selectable) delay time &#8230; and &#8230;<\/li>\n<li>what to perform after that delay time (via Javascript <a target=_blank href='http:\/\/www.w3schools.com\/jsref\/jsref_eval.asp' title='Javascript eval'>eval<\/a>()) &#8230; and get slotted in at same time as &#8230;\n<ul>\n<li>preWindow.close() &#8230; or &#8230;<\/li>\n<li>make that div element innerHTML be blank<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n<p> &#8230; creates the &#8220;makings&#8221; of a new inhouse <b>&#8220;ouralert([msg],[whatToDoAtEnd_afterUserDefinedDelay])&#8221;<\/b> Javascript function (designed to replace any existing use of &#8220;window.alert([msg]) and the context of what immediately followed it&#8221;, as below &#8230;<\/p>\n<p><code><br \/>\nvar temp='', tcmd='', preWindow=null, leftposition='200px';<br \/>\nvar modeofdisplay=location.search.split('modeofdisplay=')[1] ? decodeURIComponent(location.search.split('modeofdisplay=')[1].split('&')[0]) : '';<br \/>\nvar tout=5000, altmod='';<br \/>\n<br \/>\nfunction preview() { \/\/ thanks to Stephen Mayes Date: 25\/07\/2016 time:8:32 am<br \/>\n                            preWindow= open(\"\", \"preWindow\",\"status=no,toolbar=no,menubar=yes,width=350,height=180,left=\"+leftposition+\",top=300\");<br \/>\n                            preWindow.document.open();<br \/>\n                            preWindow.document.write(temp);<br \/>\n                            preWindow.document.close();<br \/>\n                    setTimeout(function(){ eval(tcmd); preWindow.close(); },tout);<br \/>\n}<br \/>\n<br \/>\nfunction previewdlg() {<br \/>\n                            document.getElementById('dialog').innerHTML=temp;<br \/>\n                    setTimeout(function(){ eval(tcmd); document.getElementById('dialog').innerHTML=''; },tout);<br \/>\n}<br \/>\n<br \/><b><br \/>\nfunction ouralert(ourtemp, ourcmd) {<br \/>\n      if (altmod.indexOf('preview') == 0) {<br \/>\n      temp=ourtemp;<br \/>\n      tcmd=ourcmd;<br \/>\n      eval(altmod + \"();\");<br \/>\n      } else if (modeofdisplay.indexOf('preview') == 0) {<br \/>\n      temp=ourtemp;<br \/>\n      tcmd=ourcmd;<br \/>\n      eval(modeofdisplay + \"();\");<br \/>\n      } else if (modeofdisplay.indexOf('+') != -1) {<br \/>\n      temp=ourtemp;<br \/>\n      tcmd=ourcmd;<br \/>\n      tout=eval(1000 * modeofdisplay.replace('+',''));<br \/>\n      altmod='preview';<br \/>\n      eval(altmod + \"();\");<br \/>\n      } else if (modeofdisplay != '') {<br \/>\n      temp=ourtemp;<br \/>\n      tcmd=ourcmd;<br \/>\n      tout=eval(1000 * modeofdisplay.replace('+',''));<br \/>\n      altmod='previewdlg';<br \/>\n      eval(altmod + \"();\");<br \/>\n      } else {<br \/>\n      alert(ourtemp);<br \/>\n      if (ourcmd != '') eval(ourcmd);<br \/>\n      }<br \/>\n}<\/b><br \/>\n<\/code><\/p>\n<p> &#8230; that gets used by the player interfacing HTML select (dropdown) element, and that &#8220;potential message hosting HTML div element&#8221; as per &#8230;<\/p>\n<p><code><br \/>\n&lt;select onchange='changemod(this.value);' id=mod&gt;&lt;option value=''&gt;that players click between views&lt;\/option&gt;&lt;option value='5'&gt;that players have 5 seconds to swap among&lt;\/option&gt;&lt;option value='10'&gt;that players have 10 seconds to swap among&lt;\/option&gt;&lt;option value='15'&gt;that players have 15 seconds to swap among&lt;\/option&gt;&lt;option value='20'&gt;that players have 20 seconds to swap among&lt;\/option&gt;&lt;option value='+5'&gt;that players have 5 seconds to swap among via popup window&lt;\/option&gt;&lt;option value='+10'&gt;that players have 10 seconds to swap among vis popup window&lt;\/option&gt;&lt;option value='+15'&gt;that players have 15 seconds to swap among via popup window&lt;\/option&gt;&lt;option value='+20'&gt;that players have 20 seconds to swap among via popup window&lt;\/option&gt;&lt;\/select&gt;<br \/>\n&lt;div id=dialog style='font-weight:bold;'&gt;&lt;\/div&gt;<br \/>\n<\/code><\/p>\n<p> &#8230; to make all this more flexible for some users.<\/p>\n<p>Feel free to try this <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html?carddealnum=10&#038;numplayers=4&#038;modeofdisplay=20\" title=\"Click picture\">Five Hundred Card Game live run with HTML div prompting<\/a> to see what we mean.  It involved HTML and Javascript and CSS in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html----GETME\" title=\"a_card_game.html\">a_card_game.html<\/a> with these <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html----GETME\" title=\"a_card_game.html\">code changes<\/a>, today.<\/p>\n<hr>\n<p id='fhcgbt'>Previous relevant <a target=_blank title='Five Hundred Card Game Bidding Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/five-hundred-card-game-bidding-tutorial\/'>Five Hundred Card Game Bidding 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\/a_card_game.html?carddealnum=10&#038;numplayers=4\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Five Hundred Card Game Bidding Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/five_hundred.jpg\" title=\"Five Hundred Card Game Bidding Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Five Hundred Card Game Bidding Tutorial<\/p><\/div>\n<p>We&#8217;re introducing another Card Game into the mix of the Draw Poker and Pontoon functionality from the <a title='Draw Poker Card Game Bidding Tutorial' href='#dpcgbt'>Draw Poker Card Game Bidding Tutorial<\/a> of a couple of days back.<\/p>\n<p>That card game is Five Hundred, and if you know this game, then you&#8217;ll know it is best done &#8230;<\/p>\n<ul>\n<li>with 4 players<\/li>\n<li>diagonally opposite on a table form 2 teams, and we give that look today<\/li>\n<li>the bidding at the start of the game where each player gets ten cards is a guess of how many tricks (4 cards) a team can win from 6 to 10 in spades, clubs, diamonds, hearts, no trumps and misere (not winning any)<\/li>\n<\/ul>\n<p>There is also that &#8220;minus&#8221; and &#8220;add&#8221; idea in that whoever wins the bidding can swap 3 bad cards for whatever is in the &#8220;kitty&#8221; (the Heap of three cards left after dealing to the 4 players).<\/p>\n<p>We need the middle table cell to be much more active for this game, alternatively having dropdowns for bidding and card images during the execution of the card playing to determine who wins the tricks.  Why is it called &#8220;Five Hundred&#8221;?  Well, you score more for the more daring bids, and your team tries to get to +500 &#8230; yes, you can go out the door on -500 in some incarnations of the game.  Here, we just let you play on as long as you like.<\/p>\n<p>So this <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html?carddealnum=10&#038;numplayers=4\" title=\"Click picture\">Five Hundred Card Game live run<\/a> can show you what we mean.  It involved HTML and Javascript and CSS in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html---GETME\" title=\"a_card_game.html\">a_card_game.html<\/a> with these <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html---GETME\" title=\"a_card_game.html\">code changes<\/a>.<\/p>\n<hr>\n<p id='dpcgbt'>Previous relevant <a target=_blank title='Draw Poker Card Game Bidding Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/draw-poker-card-game-bidding-tutorial\/'>Draw Poker Card Game Bidding 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\/a_card_game.html?carddealnum=5\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Draw Poker Card Game Bidding Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.png\" title=\"Draw Poker Card Game Bidding Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Draw Poker Card Game Bidding Tutorial<\/p><\/div>\n<p>Yesterday&#8217;s <a title='Pontoon Card Game Bidding Tutorial' href='#pcgbt'>Pontoon Card Game Bidding Tutorial<\/a> added a &#8220;bidding&#8221; functionality part to our Pontoon Card Game web application, and set us to thinking of introducing another card game into the mix that capitalises on the potential synergies with Pontoon, and this web application &#8230;<\/p>\n<ul>\n<li>card game that benefits from a bidding component<\/li>\n<li>card game that can be played by between 2 and 9 players via a Pack and Heap<\/li>\n<\/ul>\n<p> &#8230; and thinking about this, we thought the card game Draw Poker fitted the bill quite well, but thought that what would need attention was &#8230;<\/p>\n<ul>\n<li>rather than &#8220;add&#8221; a Card to a Player hand, in Draw Poker, we would need to allow for rejection (&#8220;minus&#8221;) of a clicked Card (but to us this is partially a &#8220;synergy&#8221; in that the Add button is just turned into a Minus button)<\/li>\n<li>for Draw Poker, the scoring can no longer be the cumulative matter that it is for Pontoon, but one that takes place when each Player clicks their &#8220;Finished&#8221; button, which we&#8217;ll define in a Player <i>Class<\/i> GetTotalScore method<\/li>\n<\/ul>\n<p> &#8230; and the mechanism to differentiate which Card Game is used can happen via more &#8220;option&#8221; elements within that HTML select (dropdown) element, the <i>onchange<\/i> event for which reloads the website with a different URL containing (for a 3 Player Draw Poker game) ?carddealnum=5&amp;numplayers=3 or containing  (for a 6 Player Pontoon game) ?carddealnum=2&amp;numplayers=6 analyzed up the top of the Javascript as per &#8230;<\/p>\n<p><code><br \/>\nvar carddealnum=location.search.split('carddealnum=')[1] ? eval(location.search.split('carddealnum=')[1].split('&')[0]) : 2;<br \/>\nvar numplayers=location.search.split('numplayers=')[1] ? eval(location.search.split('numplayers=')[1].split('&')[0]) : 2;<br \/>\n<\/code><\/p>\n<p> &#8230; and checked for via &#8220;if&#8221; logic as per the snippet below from within the Heap <i>Class<\/i> Redeal method &#8230;<\/p>\n<p><code><br \/>\n      if (carddealnum == 5) { \/\/ Draw Poker<br \/>\n      document.getElementById('mydiv' + eval(1 + startat)).innerHTML+='&lt;img onclick=\"this.style.border=' + \"'\" + '2px solid red' + \"'; intr(\" + eval(1 + startat) + ');\" style=visibility:hidden; id=i_' + eval(1 + startat) + '_' + Math.floor(Math.random() * 123456) + ' src=' + apack.GetNameImageUrl(this.cardpile[iu].GetName()) + '&gt;&lt;\/img&gt;';<br \/>\n      } else { \/\/ Pontoon<br \/>\n      document.getElementById('mydiv' + eval(1 + startat)).innerHTML+='&lt;img style=visibility:hidden; id=i_' + eval(1 + startat) + '_' + Math.floor(Math.random() * 123456) + ' src=' + apack.GetNameImageUrl(this.cardpile[iu].GetName()) + '&gt;&lt;\/img&gt;';<br \/>\n      }<br \/>\n<\/code><\/p>\n<p>Overall, the &#8220;synergies&#8221; win again, at least in our thoughts.<\/p>\n<p>Today&#8217;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html--GETME\" title=\"a_card_game.html\">a_card_game.html<\/a>&#8216;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html--GETME\" title=\"a_card_game.html\">code changes<\/a> can be tested via this <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html\" title=\"Click picture\">live run<\/a> link, where Draw Poker and Pontoon Card Games share the same codeset.<\/p>\n<hr>\n<p id='pcgbt'>Previous relevant <a target=_blank title='Pontoon Card Game Bidding Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/pontoon-card-game-bidding-tutorial\/'>Pontoon Card Game Bidding 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\/a_card_game.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Pontoon Card Game Bidding Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.gif\" title=\"Pontoon Card Game Bidding Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Pontoon Card Game Bidding Tutorial<\/p><\/div>\n<p>Today we are adding an optional bidding functionality part to the &#8220;Pontoon Card Game&#8221; web application started with yesterday&#8217;s <a title='Pontoon Card Game Primer Tutorial' href='#pcgpt'>Pontoon Card Game Primer Tutorial<\/a>.<\/p>\n<p>The concept of a &#8220;bid&#8221; in a card game can be thought of as either &#8230;<\/p>\n<ul>\n<li>&#8220;bid&#8221; in the sense of a &#8220;verb&#8221; which represents a &#8220;method&#8221; of a &#8220;Player&#8221; object (like we leave as the default way in today&#8217;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html-GETME\" title=\"a_card_game.html\">a_card_game.html<\/a>&#8216;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html-GETME\" title=\"a_card_game.html\">code changes<\/a>) &#8230; or &#8230;<\/li>\n<li>&#8220;bid&#8221; in the sense of a &#8220;noun&#8221; new <i>Class<\/i> Bid instantiated for each bid made by a Player<\/li>\n<\/ul>\n<p> &#8230; in addition to new <i>Class<\/i> Pot as an optionally instantiated substitute for a default Score (not a <i>Class<\/i>) increment value of 1.<\/p>\n<p>And the test for the line of thinking above can be an <a target=_blank title='Javascript instanceof information, thanks' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/instanceof'><i><b>&#8220;instanceof&#8221;<\/b><\/i><\/a> code block, within the <i>(new bits of)<\/i> Player <i>Class<\/i> SetScore method like &#8230;<\/p>\n<p><code><br \/>\n  this.SetScore = function(addthis) {<br \/>\n<i>    if (addthis != 0) {<br \/>\n     var found=false;<br \/>\n     if (pots[0] == null) {<br \/>\n      try {<br \/>\n       <b>eval(\"found=(bids[0] instanceof Bid);\");<\/b><br \/>\n      } catch(eee) {<br \/>\n       found=false;<br \/>\n      }<br \/>\n      if (found) {<br \/>\n       addthis=bids[0].CalculateTotal(pots[0]);<br \/>\n      }<br \/>\n     } else {<br \/>\n      addthis=pots[0].GetTotal();<br \/>\n     }<br \/>\n    }<\/i><br \/>\n    this.score+=addthis;<br \/>\n  };<br \/>\n<\/code><\/p>\n<p> &#8230; which is called in this way &#8230;<\/p>\n<p><code><br \/>\n for (var ii=0; ii&lt;numplayers; ii++) {<br \/>\n   if (theplayers[ii].GetCardTotal() == winningscore) {<br \/>\n     if (theplayers[ii].AmBidder() == true || !pots[0]) {<br \/>\n     huh+=huhd + ' ' + theplayers[ii].GetFullname();<br \/>\n     huhd=',';<br \/>\n     theplayers[ii].SetScore(1);<br \/>\n     } else {<br \/>\n     huh+=huhd + ' ' + theplayers[ii].GetFullname() + \" (except that you did not join the bidding)\";<br \/>\n     huhd=',';<br \/>\n     theplayers[ii].SetScore(0);<br \/>\n     }<br \/>\n   }<br \/>\n }<br \/>\n<\/code><\/p>\n<p> &#8230; so that players not bidding when others do, don&#8217;t benefit.  Hence, the art of bluffing is introduced into the game for the players (up to 9 as of today).<\/p>\n<p>In this way, instantiation can be an &#8220;optional&#8221; concept, the &#8220;instanceof&#8221; operator working towards its &#8220;optional&#8221; integration into Javascript code, for an &#8220;optional&#8221; bit of functionality.<\/p>\n<p>To see what we mean, try today&#8217;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html\" title=\"Click picture\">live run<\/a> Pontoon Card Game.<\/p>\n<hr>\n<p id='pcgpt'>Previous relevant <a target=_blank title='Pontoon Card Game Primer Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/pontoon-card-game-primer-tutorial\/'>Pontoon Card Game 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\/a_card_game.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Pontoon Card Game Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.jpg\" title=\"Pontoon Card Game Primer Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Pontoon Card Game Primer Tutorial<\/p><\/div>\n<p>Today&#8217;s Pontoon (sometimes known as Blackjack) Card Game web application has no &#8220;instanceof&#8221; operator usage as yesterday&#8217;s <a title='Javascript instanceof Food Emoji Guessing Game Tutorial' href='#jfeggt'>Javascript instanceof Food Emoji Guessing Game Tutorial<\/a> did, but the Object Oriented Programming (or <a target=_blank title='OOP information from Wikipedia ... thanks' href='http:\/\/en.wikipedia.org\/wiki\/Object-oriented_programming'>OOP<\/a>) connections with the Javascript is very strong today, so it continues that OOP theme, that you can see a progression of thinking on with the blog posting thread below.<\/p>\n<p>We have lots of &#8220;Nouns&#8221; representing &#8220;Class&#8221; blueprints in today&#8217;s HTML and Javascript <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html_GETME\" title=\"a_card_game.html\">a_card_game.html<\/a> code &#8230;<\/p>\n<ul>\n<li>Player<\/li>\n<li>Heap<\/li>\n<li>Pack<\/li>\n<li>Card<\/li>\n<li>Subclasses of Card that inherit for each of the 52 Card types<\/li>\n<\/ul>\n<p>You will see looking at the code that they interact with each other a lot, as we people (and objects) do in our lives, because &#8220;people and things&#8221; interact.<\/p>\n<p>There are a couple of reasons to organize code with those &#8220;Subclass&#8221; <i>Card<\/i> classes.  We think by doing this we can start with some Pontoon Card Game code and develop methods of a more generic nature to suit other card games into the future.  If you don&#8217;t start with &#8220;specific&#8221; (sometimes over the top) <i>Class<\/i> definitions early on, that genericization (or &#8220;tool&#8221; making) becomes a lot harder later.  It also opens the door to &#8220;instanceof&#8221; application on some of those future card game execution logics.<\/p>\n<p>You can see how it all works with today&#8217;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/a_card_game.html\" title=\"Click picture\">&#8220;first draft&#8221; live run<\/a> Pontoon Card Game.<\/p>\n<hr>\n<p id='jfeggt'>Previous relevant <a target=_blank title='Javascript instanceof Food Emoji Guessing Game Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/javascript-instanceof-food-emoji-guessing-game-tutorial\/'>Javascript instanceof Food Emoji Guessing Game 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\/food_oops.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Javascript instanceof Food Emoji Guessing Game Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/food_oops.jpg\" title=\"Javascript instanceof Food Emoji Guessing Game Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Javascript instanceof Food Emoji Guessing Game Tutorial<\/p><\/div>\n<p>There are a few salient points behind today&#8217;s &#8220;Food Emoji Guessing Game&#8221; augmenting yesterday&#8217;s <a title='Javascript instanceof Object Oriented Programming Tutorial' href='#joopt'>Javascript instanceof Object Oriented Programming Tutorial<\/a> attempt to make &#8220;instanceof&#8221; a part of your life.  <font size=1>Like, why aren&#8217;t you taking &#8220;instanceof&#8221; to the zoo today?  After all, the beach outing yesterday was a huge success, I hear?!<\/font>  They are &#8230;<\/p>\n<ul>\n<li>use of <i>inheritance<\/i> ideas in Object Oriented Programming (or <a target=_blank title='OOP information from Wikipedia ... thanks' href='http:\/\/en.wikipedia.org\/wiki\/Object-oriented_programming'>OOP<\/a>) <font size=1>&#8230; is always a useful idea to get your head around<\/font><\/li>\n<li>the use of &#8220;instanceof&#8221; operator to make a <b>game decision<\/b><\/li>\n<li>nesting an &#8220;instanceof&#8221; operator test <i><b>within Javascript <a target=_blank href='http:\/\/www.w3schools.com\/jsref\/jsref_eval.asp' title='Javascript eval'>eval<\/a><\/b><\/i><\/li>\n<li><b><font color=blue>(global) arrays of Objects<\/font><\/b> can be that moving feast for &#8220;instanceof&#8221; testing<\/li>\n<li>use of Emoji food content via &#8220;class&#8221; (this time in relation to) CSS syntax like &#8230;<br \/>\n<code><br \/>\n&lt;style&gt;<br \/>\n.f1:before { content: '\\01f371 bento box' }<br \/>\n.f2:before { content: '\\01f358 rice cracker' }<br \/>\n.f3:before { content: '\\01f359 rice ball' }<br \/>\n.f4:before { content: '\\01f35a cooked rice' }<br \/>\n.f5:before { content: '\\01f35b curry rice' }<br \/>\n.f6:before { content: '\\01f35c steaming bowl' }<br \/>\n.f7:before { content: '\\01f35d spaghetti' }<br \/>\n.f8:before { content: '\\01f360 roasted sweet potato' }<br \/>\n.f9:before { content: '\\01f362 oden' }<br \/>\n.f10:before { content: '\\01f363 sushi' }<br \/>\n.f11:before { content: '\\01f364 fried shrimp' }<br \/>\n.f12:before { content: '\\01f365 fish cake with swirl' }<br \/>\n.f13:before { content: '\\01f361 dango' }<br \/>\n.f14:before { content: '\\01F366 soft ice cream' }<br \/>\n.f15:before { content: '\\01F367 shaved ice' }<br \/>\n.f16:before { content: '\\01F368 ice cream' }<br \/>\n.f17:before { content: '\\01F369 doughnut' }<br \/>\n.f18:before { content: '\\01F36A cookie' }<br \/>\n.f19:before { content: '\\01F382 birthday cake' }<br \/>\n.f0:before { content: '\\01F370 shortcake' }<br \/>\n&lt;\/style&gt;<br \/>\n<\/code>\n<\/li>\n<\/ul>\n<p>And we find it is no coincidence, to us, that this discussion has a &#8220;game&#8221; web application concept behind it.  Games, to us, have concepts, directly associable with (the) &#8220;Nouns&#8221; (of life), and so suit OOP concepts.  This is interesting to us, because the purpose fits the style, whereas with other web applications, we more often, in all honesty, when angsting over how to do it, think of the &#8220;Verbs&#8221; or action points, immediately.  That could just be me, but it could be that this thought process could be an indicator of how you should style, at least the Javascript, of your client side Javascript code, associated with a web application you are working on.  Rest assured, though, that whatever you decide, this decision is just a &#8220;programming lifestyle&#8221; decision.  Don&#8217;t let anyone insist that one or other of OOP (Nouns) versus Function based (Verbs) Javascript methods has to be used for any given solution you decide upon for a web application job.  Just like with mobile phones, you have to know that programming started without OOP, as telephony did without mobile phones.  Just be happy programming, is my advice, for what its worth <font size=1>129 bitcoin last time I looked<\/font>.<\/p>\n<p>So Classes can inherit.  This means you can, as we do with today&#8217;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/food_oops.html_GETME\" title=\"food_oops.html\">food_oops.html<\/a>&#8216;s Javascript code, we have an action (and data member) packed &#8220;parent&#8221; Class (called Food today) that you might want to consider <i>Subclasses<\/i> (with names like Shortcake or BentoBox) inherit from in the Javascript (very OOPy) code snippet below &#8230;<\/p>\n<p><code><br \/>\nfunction Food(name) {<br \/>\n  this.name = name;<br \/>\n  this.Show = function(cla, pnum) {<br \/>\n    if (cla == '') cla='f1';<br \/>\n    var ss=document.getElementsByTagName('span');<br \/>\n    if (eval(ss.length % 2) == 0) {<br \/>\n    foodsel=this.name;<br \/>\n    document.getElementById('mydiv' + pnum).innerHTML='&lt;span style=\"display:none;border:1px solid red;\" id=s' + ss.length + ' class=' + cla + '&gt;&lt;\/span&gt;&lt;br&gt;' + document.getElementById('mydiv' + pnum).innerHTML;<br \/>\n    document.getElementById('tinstructions').innerHTML=document.getElementById('dname' + eval(3 - eval('' + pnum))).innerHTML + ', have a go at guessing what food ' + document.getElementById('dname' + pnum).innerHTML + ' chose.';<br \/>\n    document.getElementById('opt' + eval(3 - eval('' + pnum))).innerHTML='Please select food ' + document.getElementById('dname' + pnum).innerHTML + ' chose below ...';<br \/>\n    } else {<br \/>\n    var tscore=eval(document.getElementById('score' + pnum).innerHTML.split('Score: ')[1].split('\/')[0]);<br \/>\n    var tgoes=eval(document.getElementById('score' + pnum).innerHTML.split('Score: ')[1].split('\/')[1]);<br \/>\n    tgoes++;<br \/>\n    var found=false;<br \/>\n    try {<br \/>\n      <i><b>eval(<\/i>\"found=(<font color=blue>morsel[\" + eval(pnum % 2) + \"]<\/font> instanceof \" + retclass(this.name) + \");\"<i>)<\/i>;<\/b><br \/>\n    } catch (eee) {<br \/>\n      found=false;<br \/>\n    }<br \/>\n    if (found) { \/\/ if (this.name == foodsel) {<br \/>\n      tscore+=classes.length;<br \/>\n      document.getElementById('tinstructions').innerHTML='Well done, ' + document.getElementById('dname' + pnum).innerHTML + '. Who wants to select next?';<br \/>\n    } else {<br \/>\n      tscore=tscore;<br \/>\n      document.getElementById('tinstructions').innerHTML='Bad luck, ' + document.getElementById('dname' + pnum).innerHTML + '. Who wants to select next?';<br \/>\n    }<br \/>\n    document.getElementById('score' + pnum).innerHTML='Score: ' + tscore + '\/' + tgoes;<br \/>\n    foodsel='';<br \/>\n    document.getElementById('s' + eval(-1 + ss.length)).style.display='inline';<br \/>\n    document.getElementById('mydiv' + pnum).innerHTML='&lt;span id=s' + ss.length + ' class=' + cla + '&gt;&lt;\/span&gt;&lt;br&gt;' + document.getElementById('mydiv' + pnum).innerHTML;<br \/>\n    document.getElementById('opt1').innerHTML='Please select your food below ...';<br \/>\n    document.getElementById('opt2').innerHTML='Please select your food below ...';<br \/>\n    }<br \/>\n  };<br \/>\n}<br \/>\n<br \/>\nfunction Shortcake(name) {<br \/>\n  Food.<a target=_blank title='Javascript call information from W3schools' href='https:\/\/www.w3schools.com\/js\/js_function_call.asp'>call<\/a>(this, name);<br \/>\n}<br \/>\n<br \/>\nfunction BentoBox(name) {<br \/>\n  Food.call(this, name);<br \/>\n}<br \/>\n<\/code><\/p>\n<p>How does <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/food_oops.html\" title=\"Click picture\">today&#8217;s game<\/a> work?  Two players line up on an equal footing.  One chooses a food of interest, as the other player closes their eyes.  Then that other player can open their eyes and try to guess the food type (not shown <font size=1>&#8230; doh!<\/font>), that if they guess correctly, will score them 20 points (for 20 different food types), else no score for that guess.  Any player can assume either of these two roles in the game, first in, best dressed.<\/p>\n<hr>\n<p id='joopt'>Previous relevant <a target=_blank title='Javascript instanceof Object Oriented Programming Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/javascript-instanceof-object-oriented-programming-tutorial\/'>Javascript instanceof Object Oriented Programming 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\/js_instanceof.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Javascript instanceof Object Oriented Programming Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/js_instanceof.jpg\" title=\"Javascript instanceof Object Oriented Programming Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Javascript instanceof Object Oriented Programming Tutorial<\/p><\/div>\n<p>To understand the Javascript <a target=_blank title='Javascript instanceof information, thanks' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/instanceof'>instanceof<\/a> operator is to &#8220;get&#8221; a whole lot of what Object Oriented Programming (or <a target=_blank title='OOP information from Wikipedia ... thanks' href='http:\/\/en.wikipedia.org\/wiki\/Object-oriented_programming'>OOP<\/a>) is about.<\/p>\n<p>You&#8217;ve got your concept of a <i>Class<\/i> which is like a &#8220;blueprint&#8221; for describing the characteristics (data members) and methods of an <i>Object<\/i> (and you can think of an <i>Object<\/i> as quite often like the &#8220;Nouns&#8221; of life).<\/p>\n<p>Using that &#8220;blueprint&#8221; <i>Class<\/i> during a web application, using client side Javascript you might use the <b>&#8220;new&#8221;<\/b> keyword like below, and illustrated in that <a target=_blank title='Javascript instanceof information, thanks' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/instanceof'>instanceof<\/a> link above &#8230;<\/p>\n<blockquote cite='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/instanceof'><p>\nfunction Car(make, model, year) {<br \/>\n  this.make = make;<br \/>\n  this.model = model;<br \/>\n  this.year = year;<br \/>\n}<br \/>\nvar auto = <b>new<\/b> Car(&#8216;Honda&#8217;, &#8216;Accord&#8217;, 1998);<br \/>\n<br \/>\nconsole.log(auto <i>instanceof<\/i> Car);<br \/>\n\/\/ expected output: true<br \/>\n<br \/>\nconsole.log(auto <i>instanceof<\/i> Object);<br \/>\n\/\/ expected output: true\n<\/p><\/blockquote>\n<p> &#8230; you are &#8220;instantiating&#8221; the <i>Class<\/i> &#8220;Car&#8221; to the var<font size=1>iable<\/font> &#8220;auto&#8221; above.  That &#8230;<\/p>\n<p><code><br \/>\nfunction Car(make, model, year) {<br \/>\n  this.make = make;<br \/>\n  this.model = model;<br \/>\n  this.year = year;<br \/>\n}<br \/>\n<\/code><\/p>\n<p> &#8230; above is called a &#8220;constructor&#8221; and it can contain more than the &#8220;data members&#8221; it shows above.  It can also define &#8220;methods&#8221;.<\/p>\n<p>Here&#8217;s the good thing about Object Oriented Programming (or OOP) like this.  It begs questions.<\/p>\n<p>What velocity is the <i>Car<\/i> moving?  In the &#8220;blueprint&#8221; <i>Car<\/i> class you would define a &#8220;method&#8221; you might call &#8220;CalculateVelocity&#8221; and then to call that method you might go &#8230;<\/p>\n<p><code><br \/>\nvar car_velocity=auto.CalculateVelocity(distance, time);  \/\/ where v = d \/ t<br \/>\n<\/code><\/p>\n<p>So the Javascript <a target=_blank title='Javascript instanceof information, thanks' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/instanceof'>instanceof<\/a> operator can be thought of as &#8230;<\/p>\n<blockquote cite='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/instanceof'><p>\nThe instanceof operator tests whether the prototype property of a constructor appears anywhere in the prototype chain of an object.\n<\/p><\/blockquote>\n<p>And we have found, if you are at the situation, dynamically executing client side Javascript, and are unsure, Javascript try\/catch code like &#8230;<\/p>\n<p><code><br \/>\ntry {<br \/>\n  alert(auto <i>instanceof<\/i> Car);<br \/>\n} catch (eee) {<br \/>\n  alert('false');<br \/>\n}<br \/>\n<\/code><\/p>\n<p> &#8230; might help you out.<\/p>\n<p>Today&#8217;s web application usage of the Javascript <a target=_blank title='Javascript instanceof information, thanks' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/instanceof'>instanceof<\/a> operator uses good old <i><a target=_blank title='Javascript DOM document.write method information from w3schools' href='http:\/\/www.w3schools.com\/jsref\/met_doc_write.asp'>document.write<\/a>(<a target=_blank title='Javascript prompt window information from w3schools' href='http:\/\/www.w3schools.com\/jsref\/met_win_prompt.asp'>prompt<\/a>([wording],[default]));<\/i> for that &#8220;in mid air&#8221; prompting feeling to a web application.  It is sort of like a game for two players that goes like this &#8230;<\/p>\n<ol>\n<li>Players navigate to <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/js_instanceof.html_GETME\" title=\"js_instanceof.html\">js_instanceof.html<\/a>&#8216;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/js_instanceof.html\" title=\"Click picture\">live run<\/a> link<\/li>\n<li>A Javascript prompt window appears and both players can read it but before it is answered, the guessing player should turn away while the other player defines an OOP Class and instantiation example, and then clicks the OK button<\/li>\n<li>At this point the guesser can come back, and try to get inside the other player&#8217;s head, answering and fixing an OOP scenario where any question marks (?) planted there by the web application need to be filled in properly by the guesser in order to receive &#8220;smirking rights&#8221; (no scores today), by clicking the OK Javascript prompt window next presented.<\/li>\n<li>Whether correct or not, the &#8230;<br \/>\n<code><br \/>\n(instantiatedvariablename <i>instanceof<\/i> Classname) = true<br \/>\n<\/code><br \/>\n&#8230; is presented as a conclusion to this round of the game.<\/li>\n<li>The web application restarts, and the players may want to swap roles.<\/li>\n<\/ol>\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='#d36985' onclick='var dv=document.getElementById(\"d36985\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/object\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d36985' 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='#d36999' onclick='var dv=document.getElementById(\"d36999\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/game\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d36999' 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='#d37025' onclick='var dv=document.getElementById(\"d37025\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/cards\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d37025' 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='#d37034' onclick='var dv=document.getElementById(\"d37034\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/javascript\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d37034' 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='#d37046' onclick='var dv=document.getElementById(\"d37046\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/synergy\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d37046' 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='#d37083' onclick='var dv=document.getElementById(\"d37083\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/table\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d37083' 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='#d37099' onclick='var dv=document.getElementById(\"d37099\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/alert\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d37099' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Sometimes web applications need that &#8220;modal&#8221; quality that the Javascript popup boxes, specifically our use of the window.alert([information]) Javascript popup window for the Five Hundred Card Game. The reason is that given the Javascript client side&#8217;s lack of a true &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/five-hundred-card-game-flow-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,28,37],"tags":[2516,187,210,281,2513,2380,1914,342,2515,367,399,476,477,576,2514,652,1830,2080,2512,875,2511,967,997,1866,1126,2504,1238,1319],"class_list":["post-37099","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-games","category-oop","category-tutorials","tag-alert","tag-cards","tag-class","tag-css","tag-data-member","tag-delay","tag-dialog","tag-div","tag-draw-poker","tag-dropdown","tag-eval","tag-game","tag-games-2","tag-html","tag-instanceof","tag-javascript","tag-method","tag-modal","tag-object-object-oriented-programming","tag-oop","tag-pontoon","tag-popup","tag-programming","tag-select","tag-settimeout","tag-synergy","tag-table","tag-tutorial"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/37099"}],"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=37099"}],"version-history":[{"count":6,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/37099\/revisions"}],"predecessor-version":[{"id":37110,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/37099\/revisions\/37110"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=37099"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=37099"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=37099"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}