{"id":57794,"date":"2022-12-17T03:01:49","date_gmt":"2022-12-16T17:01:49","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=57794"},"modified":"2022-12-17T08:48:28","modified_gmt":"2022-12-16T22:48:28","slug":"phphtmljavascript-sudoku-game-chat-names-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/phphtmljavascript-sudoku-game-chat-names-tutorial\/","title":{"rendered":"PHP\/HTML\/Javascript Sudoku Game Chat Names Tutorial"},"content":{"rendered":"
\"PHP\/HTML\/Javascript<\/a>

PHP\/HTML\/Javascript Sudoku Game Chat Names Tutorial<\/p><\/div>\n

Am sure there are a lot of users out there who’d prefer being referred to by their name<\/i> rather than some form of number<\/i> in their online activities. But we don’t want to be nosy and have an optional<\/i> paradigm going with assigning names<\/i> to our online Sudoku<\/a> game players, else the default and fall through option is to refer to our players via a number<\/i> basis, based on their IP address and web browser brand.<\/p>\n

Involving names<\/i> onto the chat typing “smarts” of yesterday’s PHP\/HTML\/Javascript Sudoku Game Chat Typing Tutorial<\/a>, today, involves some PHP writing out some new Javascript arrays and functions …<\/p>\n

<?php echo ”
\n
\n var yourname='';
\n var mapfrom=[];
\n var mapto=[];
\n var mapft='';
\n

\n function domaps() {
\n if (mapfrom.length > 0) {
\n for (var ii=0; ii<mapfrom.length; ii++) {
\n document.getElementById('sudokui').placeholder=document.getElementById('sudokui').placeholder.replace('(' + mapfrom[ii] + ' ', '(' + mapto[ii] + ' ').replace(' ' + mapfrom[ii] + ' ', ' ' + mapto[ii] + ' ');
\n }
\n }
\n }
\n

\n function mapfromto(ifrom, ito) {
\n if (mapft.indexOf(' ' + ifrom + ' ' + ito + ' ') == -1) {
\n if (mapft.indexOf(' ' + ifrom + ' ') != -1) {
\n for (var ik=0; ik<mapfrom.length; ik++) {
\n if (mapfrom[ik] == ifrom) { mapto[ik] = ito; }
\n }
\n } else {
\n mapfrom.push(ifrom);
\n mapto.push(ito);
\n }
\n mapft+=' ' + ifrom + ' ' + ito + ' ';
\n }
\n }
\n

\n function pargyn() {
\n return yourname;
\n }
\n<\/code>
\n“; ?><\/p>\n

… teaming with a new HTML iframe element …<\/p>\n

<?php echo ”
\n
\n<iframe id=xnotif src=\".\/index.php?noaction=y\" style=\"display:none;\"><\/iframe>
\n<\/code>
\n“; ?><\/p>\n

… and “kicked off” as far as (Javascript) usage goes, when the Sudoku numbers have been finalized<\/font> …<\/p>\n

<?php echo ”
\n
\n var prevvs='-1';
\n
\n function aftervn() {
\n if (prevvs != document.getElementById('vsarrs').value) {
\n thenums='';
\n var esels=document.getElementsByTagName('select');
\n for (var ejj=0; ejj<esels.length; ejj++) {
\n if (('' + esels[ejj].id) != 'smode') {
\n thenums+=retcn(esels[ejj].getAttribute('data-answer'));
\n }
\n }
\n prevvs=document.getElementById('vsarrs').value;
\n document.getElementById('xnotif').src='.\/index.php?vsarrs=' + encodeURIComponent(prevvs) + '&namecheck=y&myname=' + encodeURIComponent(yourname) + '&ipme=\" . urlencode($weare) . \"' + '&thegame=' + (thenums.substring(0,81)) + '&rnd=' + Math.floor(Math.random() * 198765643);
\n }
\n domaps();
\n }
\n

\n function xn() {
\n if (1 == 1) {
\n thenums='';
\n var esels=document.getElementsByTagName('select');
\n for (var ejj=0; ejj<esels.length; ejj++) {
\n if (('' + esels[ejj].id) != 'smode') {
\n thenums+=retcn(esels[ejj].getAttribute('data-answer'));
\n }
\n }
\n prevvs=document.getElementById('vsarrs').value;
\n document.getElementById('xnotif').src='.\/index.php?vsarrs=' + encodeURIComponent(prevvs) + '&namecheck=y&myname=' + encodeURIComponent(yourname) + '&ipme=\" . urlencode($weare) . \"' + '&thegame=' + (thenums.substring(0,81)) + '&rnd=' + Math.floor(Math.random() * 198765643);
\n setInterval(aftervn, 3000);
\n }
\n }<\/font>
\n
\n function tacheck() {
\n var esels=document.getElementsByTagName('select');
\n var onechar=' ', twochar=' ';
\n thenums='';
\n for (var ejj=0; ejj<esels.length; ejj++) {
\n if (('' + esels[ejj].id) != 'smode') {
\n thenums+=retcn(esels[ejj].getAttribute('data-answer'));
\n }
\n }
\n if (eval('' + thenums.length) < 81) {
\n thenums='';
\n setTimeout(tacheck, 3000);
\n } else if (ioffis != 0) {
\n xn();<\/font>
\n for (var iejj=0; iejj<esels.length; iejj++) {
\n if (('' + esels[iejj].id) != 'smode') {
\n twochar=esels[iejj].getAttribute('data-answer');
\n onechar=String.fromCharCode(eval(Math.abs(ioffis) + twochar.charCodeAt(0)));
\n \/\/alert(esels[iejj].getAttribute('data-answer') + ' vs twochar=' + twochar + ' vs onechar=' + onechar + ' ioffis=' + ioffis + ' twochar.charCodeAt(0)=' + twochar.charCodeAt(0));
\n esels[iejj].setAttribute('data-answer', onechar);
\n }
\n }
\n ioffis=Math.abs(ioffis);
\n }
\n }
\n

\n setTimeout(tacheck, 3000);
\n<\/code>
\n“; ?><\/p>\n

… and those iframe “src” attribute changes bring on re-<\/font>calls of (the same PHP data source’s)<\/font> …<\/p>\n

<?php
\n
\nif (isset($_GET['thegame']) && isset($_GET['namecheck'])) {
\n $doaloop=true;
\n $renamebits='';
\n $vsarrs=\"-1\";
\n if (isset($_GET['vsarrs'])) { $vsarrs='' . str_replace('+',' ',urldecode($_GET['vsarrs'])); }
\n $thatset='' . str_replace('+',' ',urldecode($_GET['thegame']));
\n $thisset='' . str_replace('(','9',str_replace('*','8',str_replace('&','7',str_replace('^','6',str_replace('$','4',str_replace('#','3',str_replace('@','2',str_replace('!','1',str_replace('1','(',str_replace('2','*',str_replace('3','&',str_replace('4','^',str_replace('6','$',str_replace('7','#',str_replace('8','@',str_replace('9','!',str_replace('+',' ',urldecode($_GET['thegame']))))))))))))))))));
\n while ($doaloop) {
\n $allcontentw=file_get_contents(dirname(__FILE__) . DIRECTORY_SEPARATOR . 'index.php');
\n if (strpos($allcontentw, '\/' . '*') !== false && strpos($allcontentw, '*' . '\/') === false) {
\n $allcontentw.=\"\\n\" . '*' . '\/' . \"\\n\" . '?' . '>';
\n }
\n $relr=explode((';' . $thisset . ';'), $allcontentw);
\n if (('' . sizeof($relr)) == '0' || ('' . sizeof($relr)) == '1') {
\n $relr=explode((';' . $thatset . ';'), $allcontentw);
\n }
\n \/\/file_put_contents('x.x', '' . sizeof($relr) . ' for ;' . $thisset . \";\\n\" . $allcontentw);
\n if (('' . sizeof($relr)) != ('' . $vsarrs)) {
\n $vsarrs='' . sizeof($relr);
\n $doaloop=false;
\n for ($iwr=1; $iwr<sizeof($relr); $iwr++) {
\n $lfld=str_replace('+',' ',urldecode(explode(\"\\n\", $relr[$iwr])[0]));
\n if (strpos($lfld, ':') !== false) {
\n $renamebits.=\" parent.mapfromto('\" . explode(';',$relr[-1 + $iwr])[-1 + sizeof(explode(';',$relr[-1 + $iwr]))] . \"','\" . explode(':', $lfld)[0] . \"'); \";
\n }
\n }
\n if ($renamebits != '') { $renamebit.=' parent.domaps(); '; }
\n echo '<html><body onload=\" parent.document.getElementById(' . \"'vsarrs'\" . ').value=' . \"'\" . $vsarrs . \"'\" . '; ' . $renamebits . ' \"><\/body><\/html>';
\n } else {
\n sleep(5);
\n }
\n }
\n exit;
\n }
\n <\/code>
\n?><\/p>\n

Notice how, sometimes above (and elsewhere), looking at a scenario from within the iframe “child”‘s point of view, we can call “parent” Javascript, for example<\/font> …<\/p>\n

\n \/\/$aswell.=’ parent.document.getElementById(‘ . “‘sudokui'” . ‘).placeholder=parent.document.getElementById(‘ . “‘sudokui'” . ‘).placeholder.replace(‘ . “‘(others typing)’,'(bit before a colon is your name)'” . ‘); ‘;
\n $aswell.=’ parent.document.getElementById(‘ . “‘sudokui'” . ‘).placeholder=parent.document.getElementById(‘ . “‘sudokui'” . ‘).placeholder.replace(‘ . “\/\\([^\\)]*\\)\/g,'(bit before a colon is ‘ + ((parent.pargyn().length > 0) ? parent.pargyn() + ‘)’ : ‘your name)’)<\/font>” . ‘); ‘;\n<\/p><\/blockquote>\n

… and …<\/p>\n

\n if ((” . sizeof($relr)) != (” . $vsarrs)) {
\n $vsarrs=” . sizeof($relr);
\n $doaloop=false;
\n for ($iwr=1; $iwr<sizeof($relr); $iwr++) {
\n $lfld=str_replace(‘+’,’ ‘,urldecode(explode(“\\n”, $relr[$iwr])[0]));
\n if (strpos($lfld, ‘:’) !== false) {
\n $renamebits.=” parent.mapfromto(‘” . explode(‘;’,$relr[-1 + $iwr])[-1 + sizeof(explode(‘;’,$relr[-1 + $iwr]))] . “‘,'” . explode(‘:’, $lfld)[0] . “‘);<\/font> “;
\n }
\n }
\n if ($renamebits != ”) { $renamebit.=’ parent.domaps();<\/font> ‘; }
\n echo ‘<html><body onload=” parent.document.getElementById(‘ . “‘vsarrs'” . ‘).value=’ . “‘” . $vsarrs . “‘” . ‘; ‘ . $renamebits . ‘ “><\/body><\/html>’;
\n } else {
\n sleep(5);
\n }\n<\/p><\/blockquote>\n

Also notice with the changed collaboration and sharing logic for<\/a> index.php<\/a> PHP Sudoku game<\/a> that you should feel free to try and collaborate with<\/font> below<\/a>, as well, how we have decoupled the PHP from the (need for the) original HTML (to exist), meaning just having the one PHP code source will run your Sudoku game<\/a>.<\/p>\n

\n

\n

Previous relevant PHP\/HTML\/Javascript Sudoku Game Chat Typing Tutorial<\/a> is shown below.<\/p>\n

\"PHP\/HTML\/Javascript<\/a>

PHP\/HTML\/Javascript Sudoku Game Chat Typing Tutorial<\/p><\/div>\n

We’ve seen chat websites and SMS messaging types of apps that indicate to users in communication with each other when another user is typing, so that they have a chance to wait for that correspondence before sending their own next piece of correspondence. And so, onto yesterday’s PHP\/HTML\/Javascript Sudoku Game Collaboration Notifications Tutorial<\/a>‘s chat functionality we wanted to try to code for this functionality.<\/p>\n

What events on the chat textbox can help?<\/p>\n