{"id":73058,"date":"2026-05-17T03:01:00","date_gmt":"2026-05-16T17:01:00","guid":{"rendered":"https:\/\/www.rjmprogramming.com.au\/ITblog\/?p=73058"},"modified":"2026-05-16T16:43:14","modified_gmt":"2026-05-16T06:43:14","slug":"clairvoyance-game-sharing-scores-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/clairvoyance-game-sharing-scores-tutorial\/","title":{"rendered":"Clairvoyance Game Sharing Scores Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.html\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Clairvoyance Game Sharing Scores Tutorial\" src=\"\/Games\/Clairvoyance\/clairvoyance_game_sharing_score.jpg\" title=\"Clairvoyance Game Sharing Scores Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Clairvoyance Game Sharing Scores Tutorial<\/p><\/div>\n<p>Onto the day before yesterday&#8217;s <font size=1>(yes, another two day<sup>er!<\/sup>)<\/font> <a title='Clairvoyance Game Invitations Tutorial' href='#cgit'>Clairvoyance Game Invitations Tutorial<\/a> primarily we have a checkbox part regarding &#8230;<\/p>\n<ul>\n<li>Be Told Where You Went Wrong &#8230; guessing within our two player Clairvoyance Game &#8230; easy peasy &#8230; but &#8230;<\/li>\n<li>Share Your Score &#8230; was really difficult &#8230; go figure &#8230;<\/li>\n<\/ul>\n<p> &#8230; though the latter did ask a lot regarding timing and the sleep patterns of the PHP interlocutor &#8230; <a target=\"_blank\" title='?' href='https:\/\/www.google.com\/search?gs_ssp=eJzj4tLP1TdIycmpqCgxYPTiKU_MTlUoLVDISk1LAwByAgif&#038;q=wake+up+jeff&#038;rlz=1C5OZZY_en&#038;oq=wake+up&#038;gs_lcrp=EgZjaHJvbWUqBwgHEC4YgAQyDAgAEEUYORixAxiABDIKCAEQLhixAxiABDIZCAIQLhivARjHARiABBiOBRiYBRicBRieBTIWCAMQLhivARjHARiABBiYBRicBRieBTIHCAQQABiABDIHCAUQABiABDIHCAYQABiABDIHCAcQLhiABDIHCAgQABiABDIHCAkQABiPAtIBCDY3NzJqMGo0qAIAsAIB&#038;sourceid=chrome&#038;ie=UTF-8' rel=\"noopener\">?<\/a><\/p>\n<p>Let&#8217;s just &#8220;move on&#8221; &#8230; shall we?!<\/p>\n<p>Also on the agenda was some colour coding &#8230; and who doesn&#8217;t like a bit of colour coding!  We purloined CSS into play, with &#8220;the kind of kludgy \/ kind of cute <sup>(well, you had to be there)<\/sup>&#8221; introduction of a title attribute to the status wording element and then apply that CSS &#8230;<\/p>\n<p><code><br \/>\n&lt;style&gt;<br \/>\n  #tdstatus[title^='Awaiting Other '] {<br \/>\n    border: 3px solid red;<br \/>\n  }<br \/>\n  <br \/>\n  #tdstatus[title^='Awaiting a '] {<br \/>\n    border: 3px solid rgb(127,0,0);<br \/>\n  }<br \/>\n  <br \/> <br \/>\n  #tdstatus[title^='Awaiting Guess '] {<br \/>\n    border: 3px solid orange;<br \/>\n  }<br \/>\n  <br \/>\n  #tdstatus[title^='Select the '] {<br \/>\n    border: 6px solid lightgreen;<br \/>\n  }<br \/>\n  <br \/>\n  #tdstatus[title^='Select a '] {<br \/>\n    border: 6px solid green;<br \/>\n  }<br \/>\n  <br \/>\n  $tdstatus { padding: 5 5 5 5; }<br \/>\n&lt;\/style&gt;<br \/>\n<\/code><\/p>\n<p>We often find it the way, when it comes to colour coding, we borrow from &#8220;the traffic light creed&#8221; regarding the colours used, where a reddish colour means &#8220;hang on&#8221; and a greenish colour is an invitation to the user.  One could also think of &#8220;beeps&#8221; or &#8220;notifications&#8221; here, but not with us here, as of yet.<\/p>\n<p>And so &#8220;day four&#8221; and &#8220;day five&#8221; saw &#8230;<\/p>\n<ul>\n<li><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.html--GETME\" rel=\"noopener\">a changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.html--GETME\" rel=\"noopener\">third draft<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.html\" rel=\"noopener\">Clairvoyance Game<\/a> helped out by &#8230;<\/li>\n<li><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.php--GETME\" rel=\"noopener\">a changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.php--GETME\" rel=\"noopener\">PHP third draft interlocutor<\/a><\/li>\n<\/ul>\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\/clairvoyance-game-sharing-scores-tutorial\/' rel=\"noopener\">Clairvoyance Game Sharing Scores Tutorial<\/a>.<\/p-->\n<hr>\n<p id='cgit'>Previous relevant <a target=\"_blank\" title='Clairvoyance Game Invitations Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/clairvoyance-game-invitations-tutorial\/' rel=\"noopener\">Clairvoyance Game Invitations Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.html\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Clairvoyance Game Invitations Tutorial\" src=\"\/Games\/Clairvoyance\/clairvoyance_game.gif\" title=\"Clairvoyance Game Invitations Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Clairvoyance Game Invitations Tutorial<\/p><\/div>\n<p>In yesterday&#8217;s <a title='Clairvoyance Game Tutorial' href='#cgt'>Clairvoyance Game Tutorial<\/a>, with our Clairvoyance Game, really a game for two, downplayed invitations to the end of the blog posting blurb.  But really, invitations are the &#8220;be all and end all&#8221; for a two player game shared over the Internet and just using a &#8220;PHP and HTML\/Javascript&#8221; level of sophistication.<\/p>\n<p>And, of course, two days later <font size=1>(when we think it should have only been &#8220;one day later&#8221;)<\/font>, it might be me, but making this work for email or SMS invitations was not trivial, partly because &#8230;<\/p>\n<ul>\n<li>we launched into this &#8220;phase two public invitational sharing&#8221; on a false premise &#8230; our &#8220;phase one window.open and window.opener&#8221; Javascript logics were flawed <font size=1>(further into the logic than the first foray, shall we say)<\/font> &#8230; bad news &#8230; we reckon one out of two days &#8220;getting there&#8221; would have to be put down to the lack of testing on day one &#8230; whereas &#8230;<\/li>\n<li>our thought that &#8220;phase two&#8221; is <i>just<\/i> phase one window.open and window.opener transfers to <i>PHP writes Javascript<\/i> equivalents was &#8220;more or less&#8221; true, but we all know &#8220;programming life&#8221; throws up unexpected roadblocks<\/li>\n<\/ul>\n<p> &#8230; and that is the excuse today, which we are sticking to <font size=1>&#8230; so there, ngaaahhhh!<\/font><\/p>\n<p>This calls into play the importance, often, of &#8220;project planning&#8221;, and the compartmentalizing of testing, including really tight unit testing, especially if your software plan has so much dependency in &#8220;day two&#8221; on the &#8220;day one&#8221; quality.  As far as that goes, in our defence, regarding a networking web application, that this Clairvoyance Game &#8220;more or less is&#8221; <font size=1>(though yesterday&#8217;s work simplistically pared that down so that we never needed more than our local MAMP Apache\/PHP web server involved)<\/font> sometimes you find it is hard to recognize &#8220;units&#8221; within the big picture.<\/p>\n<p>And so &#8220;day two&#8221; and &#8220;day three&#8221; were all about &#8220;online invitation&#8221; logic for email or SMS invitations in &#8230;<\/p>\n<ul>\n<li><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.html-GETME\" rel=\"noopener\">a changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.html-GETME\" rel=\"noopener\">second draft<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.html\" rel=\"noopener\">Clairvoyance Game<\/a> helped out by &#8230;<\/li>\n<li><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.php-GETME\" rel=\"noopener\">a changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.php-GETME\" rel=\"noopener\">PHP second draft interlocutor<\/a><\/li>\n<\/ul>\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\/clairvoyance-game-invitations-tutorial\/' rel=\"noopener\">Clairvoyance Game Invitations Tutorial<\/a>.<\/p-->\n<hr>\n<p id='cgt'>Previous relevant <a target=\"_blank\" title='Clairvoyance Game Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/clairvoyance-game-tutorial\/' rel=\"noopener\">Clairvoyance 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\/Games\/Clairvoyance\/clairvoyance_game.html\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Clairvoyance Game Tutorial\" src=\"\/Games\/Clairvoyance\/clairvoyance_game.jpg\" title=\"Clairvoyance Game Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Clairvoyance Game Tutorial<\/p><\/div>\n<p>Are you sixth sensical?  Can you read tea leaves?  If it&#8217;s one out of two, that will do.<\/p>\n<p>We&#8217;re starting down the road to a new &#8230;<\/p>\n<blockquote><p>\nClairvoyance Game\n<\/p><\/blockquote>\n<p> &#8230; today, that on today&#8217;s first draft, as a design for two players &#8230;<\/p>\n<ul>\n<li>starts you playing yourself, or a nearby other player willing to share windows on your one common web browser incarnation &#8230;<\/li>\n<li>kind of ludicrous on this day one but the building blocks are there, they being &#8230;\n<ol>\n<li>HTML and Javascript parent &#8230; talking to &#8230;<\/li>\n<li>PHP interlocutor<\/li>\n<\/ol>\n<p> &#8230; which we&#8217;re going to extend, on day two, simulating what a window.open and window.opener (just on client) can do, just with a few more calls, and sleep<sup>ing<\/sup>\n<\/ul>\n<p>Two players take it in turns &#8230;<\/p>\n<ol>\n<li>selecting a <a target=\"_blank\" title='Zener card information from Wikipedia' href='https:\/\/en.wikipedia.org\/wiki\/Zener_cards' rel=\"noopener\">Zener Card<\/a> the other player is asked to guess<\/li>\n<li>other player trying to guess that <a target=\"_blank\" title='Zener card information from Wikipedia' href='https:\/\/en.wikipedia.org\/wiki\/Zener_cards' rel=\"noopener\">Zener Card<\/a> selected<\/li>\n<\/ol>\n<p> &#8230; to score, or not, in this <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.html_GETME\" rel=\"noopener\">first draft<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.html\" rel=\"noopener\">Clairvoyance Game<\/a> helped out by <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/Games\/Clairvoyance\/clairvoyance_game.php_GETME\" rel=\"noopener\">PHP first draft interlocutor<\/a>.<\/p>\n<p>In days to come, we think we&#8217;ll also be coding for email or SMS invitations to play, as well.  This will be old news to some of you telepathic genii.<\/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='#d73047' onclick='var dv=document.getElementById(\"d73047\"); 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='d73047' 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='#d73053' onclick='var dv=document.getElementById(\"d73053\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/email\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d73053' 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='#d73058' onclick='var dv=document.getElementById(\"d73058\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/checkbox\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d73058' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Onto the day before yesterday&#8217;s (yes, another two dayer!) Clairvoyance Game Invitations Tutorial primarily we have a checkbox part regarding &#8230; Be Told Where You Went Wrong &#8230; guessing within our two player Clairvoyance Game &#8230; easy peasy &#8230; but &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/clairvoyance-game-sharing-scores-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":[202,5506,5505,1604,224,3374,281,318,380,428,5510,476,477,576,625,652,1807,932,952,3908,997,999,5511,2319,1133,1137,1159,1167,5504,1253,5512,5508,1319,5507,1337,1404,1411,5509,1433,3010],"class_list":["post-73058","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-games","category-tutorials","tag-checkbox","tag-clairvoyancy","tag-clairvoyant","tag-collaboration","tag-colour","tag-colour-coding","tag-css","tag-design","tag-email","tag-files","tag-flat-files","tag-game","tag-games-2","tag-html","tag-invitation","tag-javascript","tag-link","tag-php","tag-player","tag-players","tag-programming","tag-project","tag-project-planning","tag-score","tag-share","tag-sharing","tag-sms","tag-software-design","tag-telepathic","tag-testing","tag-traffic-lights","tag-turns","tag-tutorial","tag-two-players","tag-unit-testing","tag-web-browser","tag-web-server","tag-web-server-flat-files","tag-window-open","tag-window-opener"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/73058"}],"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=73058"}],"version-history":[{"count":3,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/73058\/revisions"}],"predecessor-version":[{"id":73062,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/73058\/revisions\/73062"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=73058"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=73058"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=73058"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}