{"id":56532,"date":"2022-08-02T03:01:49","date_gmt":"2022-08-01T17:01:49","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=56532"},"modified":"2022-07-31T20:35:22","modified_gmt":"2022-07-31T10:35:22","slug":"svg-network-clock-minimize-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/svg-network-clock-minimize-tutorial\/","title":{"rendered":"SVG Network Clock Minimize Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/svg_clock.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"SVG Network Clock Minimize Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/svg_clock_minimize.jpg\" title=\"SVG Network Clock Minimize Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">SVG Network Clock Minimize Tutorial<\/p><\/div>\n<p>Today&#8217;s blog posting&#8217;s underlying SVG Network Clock web application (<font size=1>we last talked about with <a target=_blank title='Colour Wheel Size and Spoke Colour Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/colour-wheel-size-and-spoke-colour-tutorial'>Colour Wheel Size and Spoke Colour Tutorial&#8217;>Colour Wheel Size and Spoke Colour Tutorial<\/a><\/font>) shares a couple of commonalities with yesterday&#8217;s <a title='MAMP Timekeeping Web Application Visibility Tutorial' href='#mamptwavt'>MAMP Timekeeping Web Application Visibility Tutorial<\/a>, those being &#8230;<\/p>\n<ul>\n<li>the date and time concepts &#8230;<\/li>\n<li>the use of <a target=_blank title='Page Visibility API' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Page_Visibility_API'>Page Visibility API<\/a> ideas<\/li>\n<\/ul>\n<p> &#8230; those <a target=_blank title='Page Visibility API' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Page_Visibility_API'>Page Visibility API<\/a> ideas you might equate to &#8220;minimize&#8221; concepts, that originated when GUIs were left to deal with how to present the representation of an application when it is no longer front and center in front of the user as an opened up window.  We&#8217;d &#8220;minimize&#8221; back down to the desktop icon or toolbar view of the application.  Web browsers can have tabs for this equivalent purpose, and we can improve the usefulness of a web application that can still be useful when &#8220;minimized&#8221; out of the top viewing tab.  Date and time themed web applications can be your more obvious candidate for usefulness here.  Just present a form of &#8220;digital clock readout&#8221; and your web applications like our SVG Network Clock can still be a source of information, even when &#8220;minimized&#8221;.  We think that is an improvement?!<\/p>\n<p>As you might have noticed with the last application of <a target=_blank title='Page Visibility API' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Page_Visibility_API'>Page Visibility API<\/a> &#8220;smarts&#8221;, this API is not hard to use, but for the first time we can remember, making changes just to <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/svg_clock.html----------GETME\" title=\"svg_clock.html\">the changed<\/a> HTML supervisor <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/svg_clock.html----------GETME\" title=\"svg_clock.html\">svg_clock.html<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/svg_clock.html\" title=\"Click picture\">SVG Network Clock supervisor HTML and Javascript<\/a>, and only changed to see in a new <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/svg_clock.js_GETME\" title=\"svg_clock.js\">external Javascript svg_clock.js helper<\/a>, we saved coding time by being able to &#8230;<\/p>\n<ul>\n<li>scrutinize the DOM &#8230;<\/li>\n<li>within an &#8220;object&#8221; HTML element&#8217;s &#8230;<\/li>\n<li>SVG &#8230; <font color=blue>featuring in<\/font> some new Javascript with its own <font color=purple>Page Visibility API reference<\/font> &#8230;<br \/>\n<code><br \/>\nfunction huhcont() {<br \/>\n  var dtidea='';<br \/>\n  var dotwis=['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];<br \/>\n       if (document.title != origdtis || ishd == ishd.toUpperCase()) { setTimeout(huhcont, 1000); }<br \/>\n       ishd == ishd.toLowerCase();<br \/>\n       if (document.getElementById('myclock') && <font color=purple>('' + document.visibilityState) == 'hidden'<\/font>) {<br \/>\n       if (<font color=blue>document.getElementById('myclock').contentDocument.<a target=_blank title='Document.documentElement information' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Document\/documentElement'>documentElement<\/a>.outerHTML<\/font>.indexOf(' id=\"sclock\"') != -1) {<br \/>\n         console.log('predtidea');<br \/>\n         dtidea=document.getElementById('myclock').contentDocument.documentElement.outerHTML.split(' id=\"sclock\"')[1].split('&lt;')[0].split('&gt;')[1].trim();<br \/>\n         console.log('dtidea=' + dtidea + ' ... ' + document.URL);<br \/>\n         if (dtidea != '') {<br \/>\n           document.title=dtidea;<br \/>\n         } else if (document.URL.indexOf('timezone=') != -1) {<br \/>\n           document.title=('' + new Date().toLocaleString(\"en-US\", {timeZone: (location.search.split('timezone=')[1] ? decodeURIComponent(location.search.split('timezone=')[1].split('&')[0]) : \"\")}) + ' ' + (location.search.split('timezone=')[1] ? decodeURIComponent(location.search.split('timezone=')[1].split('&')[0]) : \"\") + ' ' + (location.search.split('emflag=')[1] ? decodeURIComponent(location.search.split('emflag=')[1].split('&')[0]) : \"\"));<br \/>\n         } else {<br \/>\n           document.title=new Date().toLocaleString(\"en-US\", {timeZone: \"GMT\"});<br \/>\n         }<br \/>\n       } else {<br \/>\n         console.log('Why?');<br \/>\n       }<br \/>\n       }<br \/>\n}<br \/>\n<\/code><br \/>\n &#8230; where we&#8217;d like to thank <a target=_blank title='Useful link' href='https:\/\/stackoverflow.com\/questions\/28531681\/retrieve-svg-dom-in-object-element-as-text'>this useful link<\/a>, thanks, for the heads up\n<\/li>\n<\/ul>\n<p>Interesting, huh?!<\/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\/svg-network-clock-minimize-tutorial\/'>SVG Network Clock Minimize Tutorial<\/a>.<\/p>\n\n\n\n\n\n<hr>\n\n\n\n\n\n<p id='mamptwavt'>Previous relevant <a target=_blank title='MAMP Timekeeping Web Application Visibility Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mamp-timekeeping-web-application-visibility-tutorial\/'>MAMP Timekeeping Web Application Visibility Tutorial<\/a> is shown below.<\/p>\n\n\n\n[caption id=\"\" align=\"alignnone\" width=\"220\" caption=\"MAMP Timekeeping Web Application Visibility Tutorial\"]<a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"MAMP Timekeeping Web Application Desktop Application Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer_visibility.jpg\" title=\"MAMP Timekeeping Web Application Visibility Tutorial\"  style=\"float:left;\"   \/><\/a>[\/caption]\n\n\n\n<p>Today we're <a target=_blank title='?' href='https:\/\/www.youtube.com\/watch?v=dBN86y30Ufc'>on the road again<\/a>, roadtesting the <a target=_blank title='Page Visibility API' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Page_Visibility_API'>Page Visibility API<\/a> in relation to the Quarter Hour Timer web application of <a title='MAMP Timekeeping Web Application Desktop Application Tutorial' href='#mamptwadat'>MAMP Timekeeping Web Application Desktop Application Tutorial<\/a>.  It's a great improvement on \"window.focus()\" ideas that are so flaky by nature.  In <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html-------------GETME\">the amended HTML and Javascript<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html-------------GETME\">quarter_hour_timer.html<\/a> (we still ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>'s $_SERVER['DOCUMENT_ROOT'] \"HTMLCSS\" subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Web Application<\/a> supervisor code <font color=blue>we feature the Page Visibility's \"document.visibilityState\" attribute, within a setInterval timer<\/font> ...<\/p>\n\n\n\n<code>\n var ishd='prerender';\n<br \/>\n function lookforfifteen() {\n   var d1 = new Date();\n   if (document.URL.indexOf('localhost') != -1 && d1.toUTCString().replace(':15:',':00:').replace(':30:',':00:').replace(':45:',':00:').replace(':07 ',':08 ').replace(':09 ',':08 ').indexOf(':00:08 ') != -1) {\n   forceissue(); \/\/ document.getElementById('xxxxlocit').src=document.URL.replace('.html','.php').replace('.htm','.php').split('?')[0] + '?rand=' + Math.floor(Math.random() * 1987656432);\n   setTimeout(lookforfifteen, 5000);\n   } else {\n   setTimeout(lookforfifteen, 1000);\n   }\n   <font color=blue>var ayd='';\n   if (document.getElementById('audioyes')) {\n     if (('' + document.getElementById('audioyes').style.display).toLowerCase().indexOf('none') == 0) { \n       ayd=' '; \n       if (document.getElementById('svoicecode')) {\n        if (document.getElementById('svoicecode').value.indexOf(' ') != -1) {\n          ayd=' -v ' + document.getElementById('svoicecode').value.split(' ')[eval(-1 + document.getElementById('svoicecode').value.split(' ').length)];\n          \/\/document.title=ayd;\n        }\n       }\n     }\n   }\n   if (ishd != ('' + document.visibilityState)) {\n     if (('' + document.visibilityState) == 'hidden') {\n       ishd=('' + document.visibilityState);\n       \/\/document.title='IshD=' + ishd;\n       if (document.getElementById('isaysuff') && lportbit.trim() != '') {\n        if ((document.getElementById('isaysuff').value.trim() + ayd) != '') {\n          if (ayd != '') {\n          document.getElementById('seeya').src=document.URL.split('?')[0].split('#')[0].replace('quarter_hour_timer','macos_say_record').replace('\/HTMLCSS\/','\/').replace('.html','.php').replace('.htm','.php') + \"?rand=\" + Math.floor(Math.random() * 19876756) + \"&docronwork=\" + encodeURIComponent('say ' + ayd.split('-o ')[0] + ' See you later then.  Guess we will just beaver on by ourselves here at the quarter hour timer.');\n          document.getElementById('seeyan').src=document.URL.split('?')[0].split('#')[0].replace('quarter_hour_timer','notifications_ideas').replace('\/HTMLCSS\/','\/').replace('.html','.php').replace('.htm','.php') + \"?rand=\" + Math.floor(Math.random() * 19876756) + \"&scheduledblurb=\" + encodeURIComponent('See you later then.  Guess we will just beaver on by ourselves here at the quarter hour timer.');\n          } else {\n          document.getElementById('seeya').src=document.URL.split('?')[0].split('#')[0].replace('quarter_hour_timer','macos_say_record').replace('\/HTMLCSS\/','\/').replace('.html','.php').replace('.htm','.php') + \"?rand=\" + Math.floor(Math.random() * 19876756) + \"&docronwork=\" + encodeURIComponent('say ' + document.getElementById('isaysuff').value.split('-o ')[0] + ' See you later then.  Guess we will just beaver on by ourselves here at the quarter hour timer.');\n          document.getElementById('seeyan').src=document.URL.split('?')[0].split('#')[0].replace('quarter_hour_timer','notifications_ideas').replace('\/HTMLCSS\/','\/').replace('.html','.php').replace('.htm','.php') + \"?rand=\" + Math.floor(Math.random() * 19876756) + \"&scheduledblurb=\" + encodeURIComponent('See you later then.  Guess we will just beaver on by ourselves here at the quarter hour timer.');\n          }\n        }\n       }\n     } else if (('' + document.visibilityState) == 'visible' && ishd != 'prerender') {\n       ishd=('' + document.visibilityState);\n       \/\/document.title='IsHd=' + ishd;\n       if (document.getElementById('isaysuff') && lportbit.trim() != '') {\n        if (document.getElementById('isaysuff').value.trim() != '') {\n         if (ayd != '') {\n         document.getElementById('seeya').src=document.URL.split('?')[0].split('#')[0].replace('quarter_hour_timer','macos_say_record').replace('\/HTMLCSS\/','\/').replace('.html','.php').replace('.htm','.php') + \"?rand=\" + Math.floor(Math.random() * 19876756) + \"&docronwork=\" + encodeURIComponent('say ' + ayd.split('-o ')[0] + ' Welcome back to the wonderful world of the quarter hour timer.');\n         document.getElementById('seeyan').src=document.URL.split('?')[0].split('#')[0].replace('quarter_hour_timer','notifications_ideas').replace('\/HTMLCSS\/','\/').replace('.html','.php').replace('.htm','.php') + \"?rand=\" + Math.floor(Math.random() * 19876756) + \"&scheduledblurb=\" + encodeURIComponent('Welcome back to the wonderful world of the quarter hour timer.');\n         } else {\n         document.getElementById('seeya').src=document.URL.split('?')[0].split('#')[0].replace('quarter_hour_timer','macos_say_record').replace('\/HTMLCSS\/','\/').replace('.html','.php').replace('.htm','.php') + \"?rand=\" + Math.floor(Math.random() * 19876756) + \"&docronwork=\" + encodeURIComponent('say ' + document.getElementById('isaysuff').value.split('-o ')[0] + ' Welcome back to the wonderful world of the quarter hour timer.');\n         document.getElementById('seeyan').src=document.URL.split('?')[0].split('#')[0].replace('quarter_hour_timer','notifications_ideas').replace('\/HTMLCSS\/','\/').replace('.html','.php').replace('.htm','.php') + \"?rand=\" + Math.floor(Math.random() * 19876756) + \"&scheduledblurb=\" + encodeURIComponent('Welcome back to the wonderful world of the quarter hour timer.');\n         }\n        }\n       }\n     } else {\n       ishd=('' + document.visibilityState);\n       \/\/document.title='Ishd=' + ishd;\n     }\n   }<\/font>\n }\n<\/code>\n\n\n\n<p> ... to emphasise any \"audio broadcasting\" and\/or \"notifications\" ideas in the Quarter Hour Timer best suited to macOS MAMP scenarios.<\/p>\n\n \n\n<!--p>You can also see this play out at WordPress 4.1.1's <a target=_blank  href='\/\/www.rjmprogramming.com.au\/ITblog\/new-mamp-timekeeping-web-application-desktop-application-tutorial\/'>New MAMP Timekeeping Web Application Visibility Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mamptwadat'>Previous relevant <a target=_blank title='MAMP Timekeeping Web Application Desktop Application Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mamp-timekeeping-web-application-desktop-application-tutorial\/'>MAMP Timekeeping Web Application Desktop Application Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"MAMP Timekeeping Web Application Desktop Application Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer_textareatext.jpg\" title=\"MAMP Timekeeping Web Application Desktop Application Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">MAMP Timekeeping Web Application Desktop Application Tutorial<\/p><\/div>\n<p>We figured that an improvement on the progress with our Timekeeping web application of the recent <a title='MAMP Timekeeping Web Application Audio Broadcast Tutorial' href='#mamptwaabt'>MAMP Timekeeping Web Application Audio Broadcast Tutorial<\/a> would be to mention what macOS or Mac OS X <i>Desktop Application<\/i> is topmost when the screenshot is taken.  When thinking about solutions for this, there was not much time before thinking turned to &#8230;<\/p>\n<ul>\n<li><a target=_blank title='AppleScript information from Apple' href='https:\/\/developer.apple.com\/library\/archive\/documentation\/AppleScript\/Conceptual\/AppleScriptLangGuide\/introduction\/ASLR_intro.html'>Apple Script<\/a>, which has its GUI Apple &#8220;look&#8221; &#8230; but also &#8230;<\/li>\n<li>Apple Script PHP <a target=_blank title='PHP shell_exec() method information' href='http:\/\/php.net\/manual\/en\/function.shell-exec.php'>shell_exec<\/a> and (macOS Terminal) command line accessible <a target=_blank title='osascript macOS information' href='https:\/\/ss64.com\/osx\/osascript.html'>osascript<\/a> command line &#8220;look&#8221; too<\/li>\n<\/ul>\n<p> &#8230; and excellent resources such as <a target=_blank title='Excellent link, thanks' href='https:\/\/stackoverflow.com\/questions\/5292204\/macosx-get-foremost-window-title'>this excellent one<\/a> to read that made us realize a PHP <font color=blue>codeline<\/font> such as &#8230;<\/p>\n<p>&lt;?php<br \/>\n<code><br \/>\n    $tma=\"\";<br \/>\n    if (!file_exists($_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . 'script.jxa')) {<br \/>\n      \/\/ Thanks to https:\/\/stackoverflow.com\/questions\/5292204\/macosx-get-foremost-window-title<br \/>\n      $scris=\"var seApp     = Application(\\\"System Events\\\");<br \/>\nvar oProcess  = seApp.processes.whose({frontmost: true})[0];<br \/>\nvar appName   = oProcess.displayedName();<br \/>\n<br \/>\nvar url;<br \/>\nvar title;<br \/>\n<br \/>\nswitch(appName) {<br \/>\n  case \\\"Safari\\\":<br \/>\n    url = Application(appName).documents[0].url();<br \/>\n    title = Application(appName).documents[0].name();<br \/>\n    break;<br \/>\n  case \\\"Opera\\\":<br \/>\n    url = Application(appName).windows[0].activeTab().url();<br \/>\n    title = Application(appName).windows[0].activeTab().name();<br \/>\n    break;<br \/>\n  case \\\"Google Chrome\\\":<br \/>\n    url = Application(appName).windows[0].activeTab().url();<br \/>\n    title = Application(appName).windows[0].activeTab().name();<br \/>\n    break;<br \/>\n  case \\\"Google Chrome Canary\\\", \\\"Chromium\\\":<br \/>\n    url = Application(appName).windows[0].activeTab().url();<br \/>\n    title = Application(appName).windows[0].activeTab().name();<br \/>\n    break;<br \/>\n  default:<br \/>\n    title = oProcess.<br \/>\n      windows().<br \/>\n      find(w => w.attributes.byName(\\\"AXMain\\\").value() === true).<br \/>\n      attributes.<br \/>\n      byName(\\\"AXTitle\\\").<br \/>\n      value()<br \/>\n}<br \/>\n<br \/>\nJSON.stringify({<br \/>\n  appname: appName,<br \/>\n  url: url,<br \/>\n  title: title<br \/>\n});\";<br \/>\n      file_put_contents($_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . 'script.jxa', $scris);<br \/>\n    }<br \/>\n    <font color=blue>$tma=shell_exec('osascript -l JavaScript ' . $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . 'script.jxa');<\/font><br \/>\n<\/code><br \/>\n?&gt;<\/p>\n<p> &#8230; can glean such useful JSON results such as &#8230;<\/p>\n<p><code><br \/>\n{\"appname\":\"Safari\",\"url\":\"http:\/\/localhost:8888\/HTMLCSS\/quarter_hour_timer.php?tz=Australia%2FSydney&qs=e&audiosave=%20-v%20Victoria%20%20-o%20out.aiff%20%20Screenshot%20%20at%20Monday%20July%2025%202022%2021%2030%20AEST\",\"title\":\"\u200elocalhost:8888\/HTMLCSS\/quarter_hour_timer.php?tz=Australia%2FSydney&qs=e&audiosave=%20-v%20Victoria%20%20-o%20out.aiff%20%20Screenshot%20%20at%20Monday%20July%2025%202022%2021%2030%20AEST\"}<br \/>\n <\/code><\/p>\n<p> &#8230; well, it almost makes us speechless!<\/p>\n<p>This change affected &#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\/HTMLCSS\/quarter_hour_timer.html------------GETME\">the changed HTML and Javascript<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html------------GETME\">quarter_hour_timer.html<\/a> (we still ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Web Application<\/a> supervisor<\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php----------GETME\">the changed PHP<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php----------GETME\">quarter_hour_timer.php<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) &#8220;screencapture&#8221; command line usage<\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/macos_say_record.js-----GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/macos_say_record.js-----GETME\">macos_say_record.js<\/a> external Javascript<\/li>\n<\/ul>\n<p> &#8230; and we hope you try it for 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\/mamp-timekeeping-web-application-desktop-application-tutorial\/'>MAMP Timekeeping Web Application Desktop Application Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mamptwaabt'>Previous relevant <a target=_blank title='MAMP Timekeeping Web Application Audio Broadcast Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mamp-timekeeping-web-application-audio-broadcast-tutorial\/'>MAMP Timekeeping Web Application Audio Broadcast Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"MAMP Timekeeping Web Application Audio Broadcast Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer_broadcast.jpg\" title=\"MAMP Timekeeping Web Application Audio Broadcast Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">MAMP Timekeeping Web Application Audio Broadcast Tutorial<\/p><\/div>\n<p>We thought what could be a benefit to the Timekeeping web application of the recent <a title='MAMP Timekeeping Web Application Web Share Personalization Tutorial' href='#mamptwawspt'>MAMP Timekeeping Web Application Web Share Personalization Tutorial<\/a> would be to &#8230;<\/p>\n<ul>\n<li>offer an optional audio broadcasting piece of functionality &#8230; presented via a new &#128226; (&amp;#128226;) emoji button, that might accompany &#8230;<\/li>\n<li>notifications<\/li>\n<\/ul>\n<p> &#8230; when a screenshot is taken.  As good as notifications are, it could be that the user is beavering away with their head down at work as the screenshot is taken, but welcome the audio queue that a Timekeeping screenshot has been taken.   As well as that, with this new audio broadcasting, the *.aiff audio files created are available to share via email or SMS using the Web Share API interfacing code.  This involved changes to &#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\/HTMLCSS\/quarter_hour_timer.html-----------GETME\">the changed HTML and Javascript<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html-----------GETME\">quarter_hour_timer.html<\/a> (we still ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Web Application<\/a> supervisor<\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php----------GETME\">the changed PHP<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php----------GETME\">quarter_hour_timer.php<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) &#8220;screencapture&#8221; command line usage<\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/macos_say_record.js----GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/macos_say_record.js----GETME\">macos_say_record.js<\/a> external Javascript<\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/macos_say_record.php------------------------GETME\">the changed PHP<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/macos_say_record.php------------------------GETME\">macos_say_record.php<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/macos_say_record.php\">Say Text to Audio Supervision<\/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\/new-mamp-timekeeping-web-application-audio-broadcast-tutorial\/'>MAMP Timekeeping Web Application Audio Broadcast Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mamptwawspt'>Previous relevant <a target=_blank title='MAMP Timekeeping Web Application Web Share Personalization Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mamp-timekeeping-web-application-web-share-personalization-tutorial\/'>MAMP Timekeeping Web Application Web Share Personalization Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"MAMP Timekeeping Web Application Web Share Personalization Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/qht_wsa_more.jpg\" title=\"MAMP Timekeeping Web Application Web Share Personalization Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">MAMP Timekeeping Web Application Web Share Personalization Tutorial<\/p><\/div>\n<p>Your words, helped out by some computer derived detail data, can help personalize your work using the Quarter Hour Timekeeping web application of yesterday&#8217;s <a title='MAMP Timekeeping Web Application Web Share API Tutorial' href='#mamptwawsapit'>MAMP Timekeeping Web Application Web Share API Tutorial<\/a> which, at least with the Safari browser (and a whole lot of other macOS conditions), now integrates with the <a target=_blank title='Web Share API' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Navigator\/share'>Web Share API<\/a> to attach images to prepared emails with a &#8220;body blurb&#8221;.  It is that prepared &#8220;body blurb&#8221; we are trying to refine, today, should the user attach any of those Timekeeper screenshot files created via macOS <a target=_blank title='say command information from Apple' href='https:\/\/ss64.com\/osx\/screencapture.html'>screencapture<\/a> command.<\/p>\n<p>This is because these screenshot file names, by our convention, are of the format &#8230;<\/p>\n<p><code><br \/>\nscreen-yyyymmdd-hhmi.jpg<br \/>\n<\/code><\/p>\n<p> &#8230; within the macOS <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] folder <font size=1>(though the path to the file is unavailable to <a target=_blank title='Great link' href='http:\/\/www.html5rocks.com\/en\/tutorials\/file\/dndfiles\/'>File API<\/a> File object programmers)<\/font>.<\/p>\n<p>That, teamed with the fact that individual user comments linked to any one quarter hour screenshot image has an ID attribute of the form &#8230;<\/p>\n<p><code><br \/>\ntatd_yyyymmdd_hhmi<br \/>\n<\/code><\/p>\n<p> &#8230; and you have <font color=blue>modified<\/font> Javascript helping the user to tailor better personalized and detail email or SMS communications using <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/macos_say_record.js----GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/macos_say_record.js----GETME\">macos_say_record.js<\/a> external Javascript via &#8230;<\/p>\n<p><code><br \/>\n<font color=blue>var wsadate=new Date();<br \/>\nvar lfd=String.fromCharCode(10);<br \/>\n<br \/>\nfunction getwsadate(dd, mm, yyyy, hh, mi) {<br \/>\n   wsadate=new Date(yyyy, eval(-1 + eval('' + mm)), dd, hh, mi, 0, 0);<br \/>\n   var outdstr=wsadate.toDateString() + ' ' + wsadate.toTimeString();<br \/>\n   outdstr=outdstr.replace('Sun ', 'Sunday ').replace('Mon ', 'Monday ').replace('Tue ', 'Tuesday ').replace('Wed ', 'Wednesday ').replace('Thu ', 'Thursday ').replace('Fri ', 'Friday ').replace('Sat ', 'Saturday ');<br \/>\n   outdstr=outdstr.replace(':00 ', ' ').replace(' Jan ', ' January ').replace(' Feb ', ' February ').replace(' Mar ', ' March ').replace(' Apr ', ' April ').replace(' Jun ', ' June ').replace(' Jul ', ' July ').replace(' Aug ', ' August ').replace(' Sep ', ' September ').replace(' Oct ', ' October ').replace(' Nov ', ' November ').replace(' Dec ', ' December ');<br \/>\n   \/\/console.log('tatd_' + yyyy + mm + dd + '_' + hh + mi);<br \/>\n   if (document.getElementById('tatd_' + yyyy + mm + dd + '_' + hh + mi)) {<br \/>\n   \/\/console.log('yes tatd_' + yyyy + mm + dd + '_' + hh + mi);<br \/>\n    if (document.getElementById('tatd_' + yyyy + mm + dd + '_' + hh + mi).value.trim() != '') {<br \/>\n     outdstr+=' ' + String.fromCharCode(10) + '\"' + document.getElementById('tatd_' + yyyy + mm + dd + '_' + hh + mi).value + '\"';<br \/>\n    } else if (document.getElementById('tatd_' + yyyy + mm + dd + '_' + hh + mi).innerHTML.trim() != '') {<br \/>\n     outdstr+=' ' + String.fromCharCode(10) + '\"' + document.getElementById('tatd_' + yyyy + mm + dd + '_' + hh + mi).innerHTML + '\"';<br \/>\n    }<br \/>\n   }<br \/>\n   lfd='';<br \/>\n   return outdstr + String.fromCharCode(10);<br \/>\n}<\/font><br \/>\n<br \/>\nasync function atclick() {<br \/>\n  const files = document.getElementById('files').files;<br \/>\n  <font color=blue>var moressi='', ifl=0, lessssi='';<\/font><br \/>\n<br \/>\n  if (files.length === 0) {<br \/>\n    shareurl();<br \/>\n    document.getElementById('output').textContent = 'No files selected.';<br \/>\n    return;<br \/>\n  <font color=blue>} else {<br \/>\n    for (ifl=0; ifl&lt;files.length; ifl++) {<br \/>\n      if (('' + files[ifl].name).indexOf('screen-') != -1) {<br \/>\n        if (('' + files[ifl].name).split('screen-')[1].split('-')[0].length == 8) {<br \/>\n          if (('' + files[ifl].name).split('screen-')[1].split('-')[1].split('.')[0].length == 4) {<br \/>\n            moressi+=lfd + ' on ' + getwsadate(('' + files[ifl].name).split('screen-')[1].split('-')[0].slice(-2), ('' + files[ifl].name).split('screen-')[1].split('-')[0].slice(-4).substring(0,2), ('' + files[ifl].name).split('screen-')[1].split('-')[0].substring(0,4), ('' + files[ifl].name).split('screen-')[1].split('-')[1].split('.')[0].substring(0,2), ('' + files[ifl].name).split('screen-')[1].split('-')[1].split('.')[0].slice(-2));<br \/>\n          }<br \/>\n        }<br \/>\n      }<br \/>\n    }<\/font><br \/>\n  }<br \/>\n<br \/>\n  <font color=blue>lessssi=moressi;<br \/>\n  while (lessssi.indexOf(String.fromCharCode(10)) != -1) {<br \/>\n    lessssi=lessssi.replace(String.fromCharCode(10), ' ');<br \/>\n  }<\/font><br \/>\n<br \/>\n  \/\/ feature detecting navigator.canShare() also implies<br \/>\n  \/\/ the same for the navigator.share()<br \/>\n  if (!navigator.canShare) {<br \/>\n    \/\/if (document.URL.indexOf('localhost') != -1) { alert('Can not share'); }<br \/>\n    document.getElementById('output').textContent = `Your browser doesn't support the Web Share API.`;<br \/>\n    return;<br \/>\n  \/\/} else {<br \/>\n     \/\/if (document.URL.indexOf('localhost') != -1) { alert('Can Share'); }<br \/>\n  }<br \/>\n<br \/>\n  if (navigator.canShare({ files })) {<br \/>\n    try {<br \/>\n     console.log('Can share');<br \/>\n      await navigator.share({<br \/>\n        files,<br \/>\n        title: 'Timekeeping screenshots<font color=blue>' + lessssi + '<\/font> or media or documents',<br \/>\n        text: 'Timekeeping screenshots<font color=blue>' + moressi + '<\/font> perhaps?!  Take a look at media or documents below' + String.fromCharCode(10) + String.fromCharCode(10)<br \/>\n      });<br \/>\n      document.getElementById('output').textContent = 'Shared!';<br \/>\n    } catch (error) {<br \/>\n      document.getElementById('output').textContent = `Error: ${error.message}`;<br \/>\n    }<br \/>\n  } else {<br \/>\n    \/\/if (document.URL.indexOf('localhost') != -1) { alert('Cannot share'); }<br \/>\n    document.getElementById('output').textContent = `Your system doesn't support sharing these files.`;<br \/>\n  }<br \/>\n  <font color=blue>lfd=String.fromCharCode(10);<\/font><br \/>\n}<br \/>\n<\/code> <\/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\/mamp-timekeeping-web-application-web-share-personalization-tutorial\/'>MAMP Timekeeping Web Application Web Share Personalization Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mamptwawsapit'>Previous relevant <a target=_blank title='MAMP Timekeeping Web Application Web Share API Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mamp-timekeeping-web-application-web-share-api-tutorial\/'>MAMP Timekeeping Web Application Web Share API Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"MAMP Timekeeping Web Application Web Share API Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/qht_wsa.jpg\" title=\"MAMP Timekeeping Web Application Web Share API Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">MAMP Timekeeping Web Application Web Share API Tutorial<\/p><\/div>\n<p>Adding onto yesterday&#8217;s <a title='MAMP Timekeeping Web Application Audio Commentary Tutorial' href='#mamptwaact'>MAMP Timekeeping Web Application Audio Commentary Tutorial<\/a> &#8230;<\/p>\n<ul>\n<li>Timekeeping Web Application newish Text to Audio (via macOS say via MAMP &#8220;Intranet feel&#8221;) &#8230; today, we have &#8230;<\/li>\n<li>Timekeeping Web Application new Web Share API (public domain Document Root external Javascript Web Share API) Javascript logic<\/li>\n<\/ul>\n<p>This got us decoupling what can become &#8230;<\/p>\n<ul>\n<li>an external Javascript <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/web_share_api_test.js_GETME\" title=\"web_share_api_test.js\">web_share_api_test.js<\/a> that becomes dual purpose &#8230; from &#8230; reducing &#8230;<\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/web_share_api_test.html--GETME \">the changed HTML and Javascript<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/web_share_api_test.html--GETME\">web_share_api_test.html<\/a> <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/web_share_api_test.html\">Web Share API supervisor<\/a> down to size &#8230;<br \/>\n<code><br \/>\n&lt;script type='text\/javascript' src='\/web_share_api_test.js' defer&gt;&lt;\/script&gt;<br \/>\n<\/code><br \/>\n &#8230; and helps out &#8230;<\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html----------GETME\">the changed HTML and Javascript<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html----------GETME\">quarter_hour_timer.html<\/a> (we still ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Web Application<\/a> supervisor &#8230;<br \/>\n<code><br \/>\n&lt;script type='text\/javascript' src='\/\/www.rjmprogramming.com.au\/web_share_api_test.js?populate=as_necessary' defer&gt;&lt;\/script&gt;<br \/>\n<\/code><br \/>\n &#8230; nicely<\/li>\n<\/ul>\n<p> &#8230; but as we&#8217;ve warned before you may need all these for total success for the Timekeeping Quarter Hour Timer web application (that can screenshot, can create notification when screenshot taken, and have audio commentary, and share screenshot image(s) or Timekeeper URL) &#8230;<\/p>\n<ul>\n<li>macOS or Mac OS X underlying operating system &#8230;<\/li>\n<li>Safari web browser (supports <a target=_blank title='Web Share API' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Navigator\/share'>Web Share API<\/a>) address bar <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html<\/a> should get you to &#8230;<\/li>\n<li><a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a> Apache\/PHP\/MySql local web server installed and activated &#8230;<\/li>\n<li>downloads to MAMP environment as talked about in blog posts so that local web server version of URL above is totally functional<\/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\/mamp-timekeeping-web-application-web-share-api-tutorial\/'>MAMP Timekeeping Web Application Web Share API Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mamptwaact'>Previous relevant <a target=_blank title='MAMP Timekeeping Web Application Audio Commentary Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mamp-timekeeping-web-application-audio-commentary-tutorial\/'>MAMP Timekeeping Web Application Audio Commentary Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"MAMP Timekeeping Web Application Audio Commentary Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/macos_say_record_template_within_array.jpg\" title=\"MAMP Timekeeping Web Application Audio Commentary Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">MAMP Timekeeping Web Application Audio Commentary Tutorial<\/p><\/div>\n<p>The recent <a title='MAMP Timekeeping Web Application PHP Notifications Tutorial' href='#mamptwaphpnt'>MAMP Timekeeping Web Application PHP Notifications Tutorial<\/a>&#8216;s <i>Timekeeping via Screenshots<\/i> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html---------GETME\">changed HTML and Javascript<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html---------GETME\">quarter_hour_timer.html<\/a>  (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Web Application<\/a> supervisor is another very suitable candidate for interfacing to our recent <i>Webpage Audio Commentary<\/i> functionality.  Both &#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\/HTMLCSS\/quarter_hour_timer.php---------GETME\">the changed PHP<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php---------GETME\">quarter_hour_timer.php<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) &#8220;screencapture&#8221; command line usage<\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/macos_say_record.php-----------------------GETME\">the changed PHP<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/macos_say_record.php-----------------------GETME\">macos_say_record.php<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/macos_say_record.php\">Say Text to Audio Supervision<\/a><\/li>\n<\/ul>\n<p> &#8230; share an &#8230;<\/p>\n<ul>\n<li>underlying macOS or Mac OS X operating system dependence &#8230;<\/li>\n<li>underlying local web server such as MAMP &#8230;<\/li>\n<li>downloaded into that local web server Document Root folder PHP code<\/li>\n<\/ul>\n<p> &#8230; set of interest points for full and useful functionality, because of two macOS or Mac OS X commands, respectively &#8230;<\/p>\n<ul>\n<li><a target=_blank title='say command information from Apple' href='https:\/\/ss64.com\/osx\/screencapture.html'>screencapture<\/a><\/li>\n<li><a target=_blank title='say command information from Apple' href='https:\/\/ss64.com\/osx\/say.html'>say<\/a><\/li>\n<\/ul>\n<p>We add <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/macos_say_record.js---GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/macos_say_record.js---GETME\">macos_say_record.js<\/a> external Javascript call into the supervisory HTML and Javascript &lt;head&gt;&lt;\/head&gt; webpage section via &#8230;<\/p>\n<p><code><br \/>\n&lt;script type='text\/javascript' src='\/\/www.rjmprogramming.com.au\/macos_say_record.js<font color=blue>?ongoing=<\/font>1721156687576' defer&gt;&lt;\/script&gt;<br \/>\n<\/code><\/p>\n<p> &#8230; sitting up at the Document Root of your public domain, that <font color=blue>&#8220;?ongoing=&#8221;<\/font> based $_GET[&#8216;ongoing&#8217;] argument deliberate, effectively asking the code to look out for &#8220;on the fly&#8221; HTML elements created within an execution run of the webpage.<\/p>\n<p>We add some &#8220;smarts&#8221; to those <a target=_blank href='https:\/\/www.w3schools.com\/tags\/att_global_data.asp' title='Global data attributes information from W3schools'>global data attribute<\/a> usage we talked about at <a target=_blank title='Webpage macOS Say Audio Commentary Access Count Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/webpage-macos-say-audio-commentary-access-count-tutorial'>Webpage macOS Say Audio Commentary Access Count Tutorial<\/a>, allowing some &#8220;date extraction&#8221; templating via the supervisory HTML and Javascript array declaration <font color=blue>as per<\/font> &#8230;<\/p>\n<p><code><br \/>\n&lt;script type='text\/javascript'&gt;<br \/>\n  var commentary_array=['textarea', 'You can enter comments about this screenshot here <font color=blue>%value%outerHTML%@yyyymmdd%hhmm%<\/font>.', 'img', 'Timekeeper screenshot here <font color=blue>%id%@yyyymmdd%hhmm%<\/font>.'];<br \/>\n&lt;\/script&gt;<br \/>\n<\/code><\/p>\n<p> &#8230; where the first field describes an HTML element attribute to first look at, the optional second is a stand by attribute, followed by &#8220;date extraction&#8221; fields to match with numerical data found so as to substitute <font color=blue>the blue parts<\/font> with a &#8220;date and timestamp&#8221; string.<\/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\/mamp-timekeeping-web-application-php-notifications-tutorial\/'>MAMP Timekeeping Web Application Audio Commentary Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mamptwaphpnt'>Previous relevant <a target=_blank title='MAMP Timekeeping Web Application PHP Notifications Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mamp-timekeeping-web-application-php-notifications-tutorial\/'>MAMP Timekeeping Web Application PHP Notifications Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"MAMP Timekeeping Web Application PHP Notifications Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/notifications_qht.jpg\" title=\"MAMP Timekeeping Web Application PHP Notifications Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">MAMP Timekeeping Web Application PHP Notifications Tutorial<\/p><\/div>\n<p>Today we&#8217;re revisiting the macOS (or Mac OS X) or Windows timekeeping web application of 2016&#8217;s <a title='Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics Tutorial' href='#mosmamptwaphpcat'>Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics Tutorial<\/a>.  Why?  Well, given our recent work with <a target=_blank title='Notifications API' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Notifications_API\/Using_the_Notifications_API'>Notifications API<\/a> based web applications you can read about at <a target=_blank title='Notification API Hidden Popup Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/notification-api-hidden-popup-tutorial'>Notification API Hidden Popup Tutorial<\/a>, the timekeeping one is a great candidate for functionality improvement here, it being a web application that &#8230;<\/p>\n<ul>\n<li>can work behind the scenes &#8230;<\/li>\n<li>not necessarily frontmost &#8230; but benefitting from any &#8230;<\/li>\n<li>notification reminders separate from web activities and webpage focus issues can help tell the user when they might want to turn back attention to the timekeeping screenshot recording<\/li>\n<\/ul>\n<p>This needs PHP to work and it needs real access via PHP <a target=_blank title='PHP exec() method information' href='http:\/\/php.net\/manual\/en\/function.exec.php'>exec<\/a> function to underlying operating system commands.  When this happens, we still try to offer a public RJM Programming interface but this interface is far less useful if you have not downloaded to your local Apache\/PHP\/MySql local web server (such as a <a target=_blank title='MAMP' href='http:\/\/www.mamp.info'>MAMP<\/a> one) as per &#8230;<\/p>\n<ol>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php---------GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php---------GETME\">quarter_hour_timer.php<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) &#8220;screencapture&#8221; command line usage<\/li>\n<li>the unchanged (from tutorial below, supervisory HTML and Javascript) <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html--------GETME\">quarter_hour_timer.html<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a><\/li>\n<li><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/notifications_ideas.php-----GETME\">the &#8220;how we got there&#8221; PHP<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/notifications_ideas.php-----GETME\">notifications_ideas.php<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] subfolder) <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/notifications_ideas.php\">Notification API functionality PHP web application<\/a><\/li>\n<\/ol>\n<p> &#8230; in what we like to call an &#8220;Intranet feeling&#8221; scenario.<\/p>\n<p>Up at the public RJM Programming domain, as far as the Notification API functionality supervisor webpage goes, <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/notifications_ideas.html----GETME\">the changed HTML and Javascript<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/notifications_ideas.html----GETME\">notifications_ideas.html<\/a> <a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/notifications_ideas.html\">Notification API functionality HTML and Javascript web application<\/a> is worth trying.<\/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\/mamp-timekeeping-web-application-php-notifications-tutorial\/'>MAMP Timekeeping Web Application PHP Notifications Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mosmamptwaphpcat'>Previous relevant <a target=_blank title='Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-calendar-aesthetics-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics 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\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/timekeeping_aesthetics.jpg\" title=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics Tutorial<\/p><\/div>\n<p>To finish up our revisit to the Timekeeping web application of the recent <a title='Mac OS MAMP Timekeeping Web Application PHP Calendar Iframe Tutorial' href='#mosmamptwaphpcit'>Mac OS MAMP Timekeeping Web Application PHP Calendar Iframe Tutorial<\/a> we &#8230;<\/p>\n<ul>\n<li>make some styling calendar <font color=blue>tweaks<\/font> &#8230;<br \/>\n<code><br \/>\n&lt;style&gt;<br \/>\n  td { vertical-align: top; }<br \/>\n  #divmc { background-color: #ffffff; }<br \/>\n  p:not(:empty) { border: 1px dotted red; }<br \/>\n  <font color=blue>td { text-align: center; vertical-align: top;  }<br \/>\n  th { background-color: cyan;  }<br \/>\n  #thyear { background-color: pink;  }<br \/>\n  div { word-wrap: break-word; }<br \/>\n  .adaNOte { border: 3px solid pink; border-radius: 7px; }<br \/>\n  a.adate { border:2px solid transparent; background-color:lightgreen; border-radius:50px; }<\/font><br \/>\n&lt;\/style&gt;<br \/>\n<\/code>\n<\/li>\n<li>settle for mobile platforms never being able to screenshot, on this round of looking, and <font color=blue>redirecting to the &#8220;Monthly Chronicler&#8221; web application (of (the unchanged) <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/monthly_chronicler.html---GETME\">monthly_chronicler.html<\/a> we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder)<\/font> &#8230;<br \/>\n<code><br \/>\n&lt;script&gt;<br \/>\nif (navigator.userAgent.match(\/Android|BlackBerry|iPhone|iPod|iPad|Opera Mini|IEMobile\/i)) {<br \/>\n  document.write(\"&lt;scri\" + \"pt&gt; <font color=blue>location.href='.\/monthly_chronicler.html';<\/font> &lt;\/scr\" + \"ipt&gt; &lt;style&gt; a.adate { border:1px solid green; background-color:#f0f0f0; border-radius:50px; } &lt;\/style&gt; &lt;table id=mtable style=display:none;width:95%;&gt;&lt;tr&gt;&lt;th&gt;&lt;input style=width:450px; placeholder='' id=iask type=text value=''&gt;&lt;\/input&gt;&lt;&lt;\/th&gt;&lt;th&gt;&lt;input onclick=\\\" document.getElementById('mtable').style.display='none'; document.getElementById('mybod').style.opacity='1.0'; postask(document.getElementById('iask'));\\\" type=button value=OK&gt;&lt;\/input&gt;&lt;\/th&gt;&lt;th&gt;&lt;input onclick=\\\"document.getElementById('iask').value=''; document.getElementById('mtable').style.display='none';  document.getElementById('mybod').style.opacity='1.0'; \\\" type=button value=Cancel&gt;&lt;\/input&gt;&lt;\/th&gt;&lt;\/tr&gt;&lt;\/table&gt;\");<br \/>\n}<br \/>\n&lt;\/script&gt;<br \/>\n<\/code><br \/>\n &#8230; dumbing down, but working more reliably, using &#8220;Javascript writes Javascript&#8221; methodology<\/li>\n<\/ul>\n<p>Again, feel free to try <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html--------GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html--------GETME\">quarter_hour_timer.html<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) &#8220;screencapture&#8221; command line usage, is helped out by a <font color=brown><a style=color:brown;font-color:brown; target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php--------GETME\">&#8220;mobile platform check&#8221; changed<\/a><\/font> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php--------GETME\">quarter_hour_timer.php<\/a> PHP (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) for you to try out on your MAMP macOS environment, or all showing up at an RJM Programming public domain webpage, in an iframe element, visible now.<\/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\/mac-os-mamp-timekeeping-web-application-php-calendar-iframe-tutorial\/'>New Mac OS MAMP Timekeeping Web Application PHP Calendar Iframe Tutorial<\/a> ...<\/p>\n\n\n\n\n\n<hr>\n\n\n\n\n\n<p id='mosmamptwaphpcit'>Previous relevant <a target=_blank title='Mac OS MAMP Timekeeping Web Application PHP Calendar Iframe Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-calendar-iframe-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar Iframe Tutorial<\/a> is shown below.<\/p>\n\n\n\n[caption id=\"\" align=\"alignnone\" width=\"220\" caption=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Iframe Tutorial\"]<a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Iframe Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/timekeeping_iframe_window_open.jpg\" title=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Iframe Tutorial\"  style=\"float:left;\"   \/><\/a>[\/caption]\n\n\n\n<p>Today we clarify our Timekeeping web application for those users who have followed through, downloading the HTML and PHP to their local web server (we're recommending MAMP) client computer, adding to the Windows client work of yesterday's <a title='Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial' href='#mosmamptwaphpcwt'>Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial<\/a>.<\/p>\n\n\n\n\n\n<p>In order to do this, not only do we window.open a new window for that local web server Timekeeping web application incarnation, but it is also made to appear within the parent RJM Programming domain incarnation in the form of an HTML iframe element.  Nothing new here, it's just that that iframe has been hidden from view up until today, and today <font color=blue>we open it up and tweak its look a little<\/font> ...<\/p>\n\n\n\n<code>\n function windowopen(theone, thetwo) {\n   if (!navigator.userAgent.match(\/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile\/i)) {\n   var asu=('&' + document.URL.replace(document.URL.split('?')[0],'').replace('?','')).replace(\/^\\&$\/g,'');  \n   wowowo=window.open('HTTP:\/\/localhost' + lportbit + '\/HTMLCSS\/quarter_hour_timer.html?imgname=' + imgn + asu,'xxlocit');\n  <font color=blue> document.getElementById('xxlocit').style.display='block';\n   document.getElementById('xxlocit').style.width='100%';\n   document.getElementById('xxlocit').style.height='900px';<\/font>\n   thatone=theone;\n   thattwo=thetwo;\n   setTimeout(postwo, 4000);\n   }\n }\n<br \/>\n <font color=blue>function bthen() {\n   document.getElementById('myh1').style.display='none';\n   document.getElementById('myh3').style.display='none';\n   document.body.style.backgroundColor='lightblue';\n   if (inIframe()) { getOS(''); modus=OSName + ' Client ';  if (document.getElementById('qhspan')) {  if (document.getElementById('qhspan').innerHTML.indexOf(modus) == -1) { document.getElementById('qhspan').innerHTML=modus + document.getElementById('qhspan').innerHTML; } }\n  if (document.getElementById('htwoeight')) {  if (document.getElementById('htwoeight').innerHTML.indexOf(modus) == -1) { document.getElementById('htwoeight').innerHTML=modus + document.getElementById('htwoeight').innerHTML; } }\n  if (document.getElementById('theight')) {  if (document.getElementById('theight').innerHTML.indexOf(modus) == -1) { document.getElementById('theight').innerHTML=modus + document.getElementById('theight').innerHTML; } }  \n   }\n }<\/font>\n<br \/>\nif ((location.search.split('imgname=')[1] ? (decodeURIComponent(location.search.split('imgname=')[1]).split('&')[0]) : '')) {\n   if (!navigator.userAgent.match(\/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile\/i)) {\n   <font color=blue>setTimeout(bthen, 2000);<\/font>\n  var asu=((document.URL.replace(document.URL.split('?')[0],'')).replace('?','').replace('&','?') + '?');  \n  asu=('?' + asu.split('?')[1]).replace(\/^\\?$\/g,''); \n  var topl='_blank'; \/\/'_self';\n  if (inIframe()) { topl='_blank';  }\n  if (document.URL.indexOf('localhost') != -1) { wwwooo=window.open(document.URL.split('?')[0] + asu,topl);  window.opener.document.body.onclick=function() { wwwooo.focus(); } }\n  }\n}\n<\/code>\n\n\n\n<p>It's worth keeping the two incarnations because window.localStorage calendar functionality still works up at the RJM Programming public domain incarnation, whereas with a local web server (perhaps MAMP) incarnation, you could get some screen shot integrations to improve the Timekeeping reporting \"smarts\".<\/p>\n\n\n\n\n\n<p>Feel free to try <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html-------GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html-------GETME\">quarter_hour_timer.html<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>'s $_SERVER['DOCUMENT_ROOT'] \"HTMLCSS\" subfolder) <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) \"screencapture\" command line usage, is helped out by a <font color=brown><a style=color:brown;font-color:brown; target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php-----GETME\">\"mobile platform check\" changed<\/a><\/font> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php-----GETME\">quarter_hour_timer.php<\/a> PHP (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>'s $_SERVER['DOCUMENT_ROOT'] \"HTMLCSS\" subfolder) for you to try out on your MAMP macOS environment, or all showing up at an RJM Programming public domain webpage, in an iframe element, visible now.<\/p>\n\n\n\n<!--p>You can also see this play out at WordPress 4.1.1's <a target=_blank  href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-calendar-iframe-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mosmamptwaphpcwt'>Previous relevant <a target=_blank title='Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-calendar-windows-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar Windows 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\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/timekeeping_windows.jpg\" title=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial<\/p><\/div>\n<p>Did you notice that the &#8220;Timekeeping&#8221; PHP did not have to change for yesterday&#8217;s <a title='Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial' href='#mosmamptwaphpccit'>Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial<\/a>?<\/p>\n<p>But the PHP is <font color=brown><a style=color:brown;font-color:brown; target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php-----GETME\">the change agent for Windows (client) integration<\/a><\/font> called <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php-----GETME\">quarter_hour_timer.php<\/a> today &#8230;<\/p>\n<p>&lt;?php<br \/>\n<code><br \/>\n\/\/ blah top<br \/>\n<font color=brown>$lportbit=\":8888\";<br \/>\n<br \/>\n$user_agent = $_SERVER[\"HTTP_USER_AGENT\"];<br \/>\nfunction getOS() { \/\/ thanks to https:\/\/www.daniweb.com\/programming\/web-development\/threads\/495588\/getting-users-os-info-out-of-server-http-user-agent<br \/>\n    global $user_agent, $lportbit;<br \/>\n    $os_platform    =   \"win Unknown OS Platform\";<br \/>\n    $os_array       =   array(<br \/>\n                            '\/windows nt 10\/i'     =&gt;  'Windows 10',<br \/>\n                            '\/windows nt 6.3\/i'     =&gt;  'Windows 8.1',<br \/>\n                            '\/windows nt 6.2\/i'     =&gt;  'Windows 8',<br \/>\n                            '\/windows nt 6.1\/i'     =&gt;  'Windows 7',<br \/>\n                            '\/windows nt 6.0\/i'     =&gt;  'Windows Vista',<br \/>\n                            '\/windows nt 5.2\/i'     =&gt;  'Windows Server 2003\/XP x64',<br \/>\n                            '\/windows nt 5.1\/i'     =&gt;  'Windows XP',<br \/>\n                            '\/windows xp\/i'         =&gt;  'Windows XP',<br \/>\n                            '\/windows nt 5.0\/i'     =&gt;  'Windows 2000',<br \/>\n                            '\/windows me\/i'         =&gt;  'Windows ME',<br \/>\n                            '\/win98\/i'              =&gt;  'Windows 98',<br \/>\n                            '\/win95\/i'              =&gt;  'Windows 95',<br \/>\n                            '\/win16\/i'              =&gt;  'Windows 3.11',<br \/>\n                            '\/macintosh|mac os x\/i' =&gt;  'Mac OS X',<br \/>\n                            '\/mac_powerpc\/i'        =&gt;  'Mac OS 9',<br \/>\n                            '\/linux\/i'              =&gt;  'Linux',<br \/>\n                            '\/ubuntu\/i'             =&gt;  'Ubuntu',<br \/>\n                            '\/iphone\/i'             =&gt;  'iPhone',<br \/>\n                            '\/ipod\/i'               =&gt;  'iPod',<br \/>\n                            '\/ipad\/i'               =&gt;  'iPad',<br \/>\n                            '\/android\/i'            =&gt;  'Android',<br \/>\n                            '\/blackberry\/i'         =&gt;  'BlackBerry',<br \/>\n                            '\/webos\/i'              =&gt;  'Mobile'<br \/>\n                        );<br \/>\n<br \/>\n    foreach ($os_array as $regex =&gt; $value) {<br \/>\n<br \/>\n        if (preg_match($regex, $user_agent)) {<br \/>\n            $os_platform    =   $value;<br \/>\n        }<br \/>\n<br \/>\n    }<br \/>\n<br \/>\n    return $os_platform;<br \/>\n}<br \/>\n<br \/>\n$callornot=\"call \";<br \/>\n$precmds=\"\";<br \/>\n$impreexe=\"screenCapture\"; \/\/\"import\";<br \/>\n$switches=\"\"; \/\/\" -window root \";<br \/>\nif (substr(strtoupper(getOS()),0,3) === 'WIN') {<br \/>\n  $lportbit=\"\";<br \/>\n  if (file_exists($_SERVER['DOCUMENT_ROOT'] . \"\\\\\" . $impreexe . \".exe\")) {<br \/>\n  $precmds=$_SERVER['DOCUMENT_ROOT'] . \"\\\\\";<br \/>\n  } else {<br \/>\n  foreach (glob(\"C:\\\\Users\\\\*\\\\\" . $impreexe . \".exe\") as $infl) {<br \/>\n  $precmds=explode($impreexe . \".exe\", $infl)[0];<br \/>\n  }<br \/>\n  }<br \/>\n} <\/font><br \/>\n\/\/ blah blah some other PHP functions<br \/>\n<br \/>\n if (isset($_GET['yourta'])) {<br \/>\n \/\/ calendar work<br \/>\n } else if (isset($_GET['myta'])) {<br \/>\n \/\/ embed image metadata<br \/>\n } else if (isset($_POST['myta'])) {<br \/>\n \/\/ parse image metadata<br \/>\n } else <font color=brown>if ($lportbit != \"\")<\/font> {<br \/>\n exec(\"\/usr\/sbin\/screencapture -Cd -tjpg \" . $_SERVER['DOCUMENT_ROOT'] . \"\/screen-`date +\\\"%Y%m%d-%H%M\\\"`.jpg\");<br \/>\n } <font color=brown>else {<br \/>\n if (isset($_GET['tz'])) {<br \/>\n   $tzis=str_replace('+','_',urldecode($_GET['tz']));<br \/>\n   if (strpos($tzis, \"\/\") !== false) { date_default_timezone_set($tzis);   }<br \/>\n }<br \/>\n $dateis = date('Ymd-Hi');<br \/>\n if (file_exists($_SERVER['DOCUMENT_ROOT'] . \"\\\\screenCapture.jpg\")) {<br \/>\n exec('copy ' . '\"' . $_SERVER['DOCUMENT_ROOT'] . \"\\\\screenCapture.jpg\" . '\" \"' . $_SERVER['DOCUMENT_ROOT'] . \"\\\\screen-\" . $dateis . '.jpg\"');<br \/>\n \/\/ exec('erase ' . '\"' . $_SERVER['DOCUMENT_ROOT'] . \"\\\\screenCapture.jpg\" . '\"');<br \/>\n} else {<br \/>\n exec($callornot . '\"' . $precmds . $impreexe . '.exe\" ' . $switches . ' \"' . $_SERVER['DOCUMENT_ROOT'] . \"\\\\screen-\" . $dateis . '.jpg\"');<br \/>\n }<br \/>\n }<\/font><br \/>\n exit;<br \/>\n<\/code><br \/>\n?&gt;<\/p>\n<p> &#8230; which you may glean has a Windows &#8220;fallback&#8221; position (with that &#8220;copy&#8221; codeline).  Why?  Well, we found a .Net framework &#8220;exe creation via bat&#8221; using <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/ScreenCapture.bat_GETME\" title=\"ScreenCapture.bat\">ScreenCapture.bat<\/a> (thanks to <a target=_blank href='https:\/\/github.com\/npocmaka\/batch.scripts\/blob\/master\/hybrids\/.net\/c\/screenCapture.bat'>this useful link<\/a>) created black screen shots.  Probably a privilege thing or PHP exec thing, but we&#8217;ve opted for the workaround, which is just &#8220;Windows talk&#8221; &#8230;<\/p>\n<ul>\n<li>write Windows batch <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/scapcontinuous.bat_GETME\" title=\"scapcontinuous.bat\">scapcontinuous.bat<\/a> as a continuous fifteen minute user of the .Net Framework (ScreenCapture.exe) derived from above<\/li>\n<li>set up a task via &#8220;Task Schedular&#8221; (please ignore the warts &#8216;n all &#8220;garden path&#8221; schtask ideas in the video below) that has an action &#8220;C:\\MAMP\\htdocs\\scapcontinuous.bat&#8221; and starts when the Windows user logs in and takes (successful) screen shots at 14 and 29 and 44 and 59 minutes (in the hour) times<\/li>\n<\/ul>\n<p>Take a more detailed look at &#8220;warts &#8216;n all&#8221; crab progression towards the Windows (client) solution, below &#8230;<\/p>\n<p><video style=width:90%; type=video\/mp4 controls><source type=video\/mp4 src=\"\/\/www.rjmprogramming.com.au\/HTMLCSS\/timekeeping_windows.mov\"><\/source><\/video><\/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\/mac-os-mamp-timekeeping-web-application-php-calendar-windows-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mosmamptwaphpccit'>Previous relevant <a target=_blank title='Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-calendar-ical-integration-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration 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\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/timekeeping_ical.jpg\" title=\"Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial<\/p><\/div>\n<p>Yesterday&#8217;s <a title='Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorial' href='#mosmamptwaphpcct'>Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorial<\/a>&#8216;s &#8220;Calendar Past&#8221; improvements don&#8217;t have to be the end of the story regarding &#8220;calendar timings&#8221;.  There is an <a target=_blank title='Apple' href='https:\/\/apple.com'>Apple<\/a> <a target=_blank title='iCal info from Wikipedia' href='https:\/\/en.wikipedia.org\/wiki\/Calendar_(Apple)'>iCal<\/a> standard interfacing format that can drive calendar integrations with many well known online Calendar applications.<\/p>\n<p>You may recall us talking about this with <a target=_blank href='https:\/\/www.rjmprogramming.com.au\/ITblog\/calendar-location-services-integration-tutorial\/' title='Calendar Location Services Integration Tutorial'>Calendar Location Services Integration Tutorial<\/a> and we tweak <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/ics_attachment.php----GETME\" title=\"ics_attachment.php\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ics_attachment.php----GETME\" title=\"ics_attachment.php\">ics_attachment.php<\/a>  (which we&#8217;d ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;PHP&#8221; subfolder) and its <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ics_attachment.php\" title=\"Web application standalone\">standalone ical creator<\/a> to better integrate with <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html------GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html------GETME\">quarter_hour_timer.html<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) &#8220;screencapture&#8221; command line usage.<\/p>\n<p>This bit of functionality works (interfacing) both with MAMP and with the public RJM Programming domain incarnation of the Timekeeping web application, so that could be interesting.  It can interface via &#8230;<\/p>\n<p><select size=5 id=yics><option value=if>Future Calendar Entries via Iframe<\/option><option value=nw>Future Calendar Entries via Popup<\/option><option value=''>No Future Calendar Entries<\/option><option value=allif>All Calendar Entries via Iframe<\/option><option value=allnw>All Calendar Entries via Popup<\/option><\/select><\/p>\n<p> &#8230; modes of use.  In action, should you create an iCal file this way, the web application will download the resultant .ics file into your Downloads folder and to interface into your default online Calendar application double click that Downloads folder file to complete the Calendar integration &#8230;<\/p>\n<p><code><br \/>\n     function icalpostit(tl, tg) {<br \/>\n  var today = new Date();<br \/>\n  var dd = today.getDate();<br \/>\n  var mm = today.getMonth()+1; \/\/January is 0!<br \/>\n  var yyyy = today.getFullYear();<br \/>\n  var hh = today.getHours();<br \/>\n  var minm = today.getMinutes(); \/\/January is 0!<br \/>\n   \/\/if (icalavailable) { alert('is ' + ('' + yyyy + ('00' + mm).slice(-2) + ('00' + dd).slice(-2) ) + ' &gt;= ' + tl.substring(1)); }<br \/>\n   if ((document.getElementById('yics').value.indexOf('all') != -1 || tl.substring(1) &gt;= ('' + yyyy + ('00' + mm).slice(-2) + ('00' + dd).slice(-2) )) && icalavailable && document.getElementById('yics').value != '') {<br \/>\n   if (document.getElementById('yics').value.indexOf('nw') != -1) {<br \/>\n   icald=tl.substring(1) + ':' + ('00' + hh).slice(-2) + ('00' + minm).slice(-2) + '59';<br \/>\n   icalg=tg;<br \/>\n   if (icalwo != null) { icalwo.close(); icalwo=null;  }<br \/>\n   icalwo=window.open('..\/PHP\/ics_attachment.php','_blank','top=100,left=100,width=740,height=800');<br \/>\n   if (1 == 1) {<br \/>\n   setTimeout(icalw, 3000);<br \/>\n   } else {<br \/>\n   icalwo.document.getElementById('datestart').value=icald;<br \/>\n   icalwo.document.getElementById('dateend').value=icald;<br \/>\n   icalwo.document.getElementById('eventwords').value=icalg.replace(\/\\&lt;br\\&gt;\/g, String.fromCharCode(10)).replace(\/\\&lt;Br\\&gt;\/g, String.fromCharCode(10)).replace(\/\\&lt;BR\\&gt;\/g, String.fromCharCode(10));<br \/>\n   if (document.URL.indexOf('localhost') != -1) {<br \/>\n   var jcald=icalg.replace(\/\\&lt;br\\&gt;\/g, String.fromCharCode(10)).replace(\/\\&lt;Br\\&gt;\/g, String.fromCharCode(10)).replace(\/\\&lt;BR\\&gt;\/g, String.fromCharCode(10)).replace(\/\\&nbsp\\;&gt;\/g, ' ');<br \/>\n   while (jcald.indexOf(String.fromCharCode(10)) != -1) {  jcald=jcald.replace(String.fromCharCode(10),'  ');  }<br \/>\n   icalwo.document.getElementById('title').value=jcald;<br \/>\n   } else {<br \/>\n   icalwo.document.getElementById('title').value='Calendar event at ' + icald;<br \/>\n   }<br \/>\n   icalwo.document.getElementById('description').value='Calendar event at ' + icald;<br \/>\n   icalwo.document.getElementById('address').value=document.URL.split('?')[0].split('#')[0];<br \/>\n   icalwo.document.getElementById('mmdatestart').value=icald.substring(4,6);<br \/>\n   icalwo.document.getElementById('mmdateend').value=icald.substring(4,6);<br \/>\n   icalwo.document.getElementById('dddatestart').value=icald.substring(6,8);<br \/>\n   icalwo.document.getElementById('dddateend').value=icald.substring(6,8);<br \/>\n   icalwo.document.getElementById('ssdatestart').value='59';<br \/>\n   icalwo.document.getElementById('ssdateend').value='59';<br \/>\n   icalwo.document.getElementById('yyyydatestart').value=icald.substring(0,4);<br \/>\n   icalwo.document.getElementById('yyyydateend').value=icald.substring(0,4);<br \/>\n       if ( ('' + today.getTimezoneOffset()).replace('null','').replace('undefined','') != '' ) {<br \/>\n       \/\/alert(('' + eval(eval('' + qd.getTimezoneOffset()) \/ 60.0)).replace('.00','').replace('.0',''));<br \/>\n       icalwo.document.getElementById('tz').value=('' + eval(eval('' + today.getTimezoneOffset()) \/ 60.0)).replace('.00','').replace('.0','');<br \/>\n       }<br \/>\n      \/\/icalwo.document.getElementById('pform').onsubmit=function() { window.opener.document.getElementById('icalstatus').innerHTML=' '; return true;  };<br \/>\n<br \/>\n   }<br \/>\n   } else if (document.getElementById('yics').value.indexOf('if') != -1) {<br \/>\n   icald=tl.substring(1) + ':' + ('00' + hh).slice(-2) + ('00' + minm).slice(-2) + '59';<br \/>\n   icalg=tg;<br \/>\n   document.getElementById('divics').style.display='block';<br \/>\n   document.getElementById('divics').style.width='100%';<br \/>\n   document.getElementById('divics').style.height='800px';<br \/>\n   document.getElementById('icslocit').style.display='block';<br \/>\n   document.getElementById('icslocit').style.width='100%';<br \/>\n   document.getElementById('icslocit').style.height='800px';<br \/>\n   document.getElementById('icslocit').src='..\/PHP\/ics_attachment.php?rand=' + Math.floor(Math.random() * 19876564);<br \/>\n   } else {<br \/>\n   var xzhr = new XMLHttpRequest();<br \/>\n   var xform=new FormData();<br \/>\n   xform.append('icald',tl.substring(1) + ':' + ('00' + hh).slice(-2) + ('00' + minm).slice(-2) + '59');<br \/>\n   xform.append('icalc',tg);<br \/>\n   xzhr.open('post','.\/quarter_hour_timer.php',true);<br \/>\n   xzhr.send(xform);<br \/>\n   }<br \/>\n   }<br \/>\n     }<br \/>\n<\/code><\/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\/mac-os-mamp-timekeeping-web-application-php-calendar-ical-integration-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mosmamptwaphpcct'>Previous relevant <a target=_blank title='Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-calendar-contenteditable-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable 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\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/timekeeping_contenteditable.gif\" title=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorial<\/p><\/div>\n<p>We&#8217;ve spoken quite a bit in the past about the joys of involving the &#8220;<a target=_blank title='Global contenteditable attribute information from W3schools' href='https:\/\/www.w3schools.com\/tags\/att_global_contenteditable.asp'>contenteditable<\/a><font size=1>=true<\/font>&#8221; attribute for HTML elements that have an &#8220;innerHTML&#8221; (ie. they have a formalized end tag arrangement eg. div, span, p, td, th etcetera) and with today&#8217;s work which extends that started with yesterday&#8217;s <a title='Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial' href='#mosmamptwaphpcpt'>Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial<\/a> it is the turn of a set of &#8220;p&#8221; elements it helps out today.<\/p>\n<p>The scenario is that yesterday&#8217;s work did not allow for &#8220;orphaned screenshots&#8221; of the past be allowed to be brought back into play to &#8220;annotate them&#8221; and in so doing &#8220;give them a home&#8221;.  This led us to &#8230;<\/p>\n<ul>\n<li>allow for a new &#8220;Infill Earlier Days All Screenshots&#8221; button augment <font color=blue>yesterday<\/font>&#8216;s &#8220;<font color=blue>Infill Earlier Days<\/font> Just Annotated Screenshots&#8221; button &#8230;<\/li>\n<li>the pressing of that new &#8220;Infill Earlier Days All Screenshots&#8221; button causes all screenshot 15 minute entries relevant to the current year be displayed in the calendar &#8230; but then it occurred to us users might want to &#8220;annotate them&#8221; &#8230; but how? &#8230;<\/li>\n<li>in the PHP we <font color=blue>introduced code<\/font> &#8230;<br \/>\n&lt;?php<br \/>\n<code><br \/>\nif (isset($_GET['yourta'])) {<br \/>\n $dru=\"http:\/\/\" . $_SERVER['SERVER_NAME'] . \"\" . str_replace(\"~\",\"\",str_replace(\":443~\",\"\",str_replace(\":80~\",\"\",(\":\" . $_SERVER['SERVER_PORT'] . \"~\")))) . \"\/\";<br \/>\n <font color=blue>$cet=\"\";<br \/>\n if (strlen($_GET['yourta']) != 0) { $cet=\" contenteditable=true onblur=repostit(this); onfocus=wopen(event,false); \"; }<\/font><br \/>\n \/\/ blah blah blah<br \/>\n $ccpre=\"<p<font color=blue>\" . $cet . \"<\/font> onclick=this.innerHTML+=String.fromCharCode(60)+String.fromCharCode(98)+String.fromCharCode(114)+String.fromCharCode(62); style=background-color:orange;background-repeat:no-repeat;background-size:contain;background-image:linear-gradient(rgba(255,255,255,0.3),rgba(255,255,255,0.3)),URL(\" . $dru . str_replace('_','-',str_replace('itd_','screen-',$myf)) . \".jpg\" . \"); onmouseover=wopen(event,true); onmouseout=wopen(event,false);  title=\" . substr(str_replace('td','p',$cali),-4,2) . \":\" . substr(str_replace('td','p',$cali),-2,2) . \"++ id=\" . str_replace('td','p',$cali) . \">\";<br \/>\n \/\/ blah blah blah<br \/>\n}<br \/>\n<\/code><br \/>\n?&gt;<br \/>\n &#8230; to, when an &#8220;orphaned&#8221; screen shot image is happened upon, allows &#8230;\n<\/li>\n<li><a target=_blank title='Global contenteditable attribute information from W3schools' href='https:\/\/www.w3schools.com\/tags\/att_global_contenteditable.asp'>contenteditable<\/a><font size=1>=true<\/font> &#8220;does its stuff&#8221; turning might might have been a pretty unintelligent HTML element into a &#8220;textarea&#8221; type collector of user input, and then that onblur event logic&#8217;s &#8220;midair feeling&#8221; <a target=_blank title='Ajax information from Wikipedia ... thanks' href='http:\/\/en.wikipedia.org\/wiki\/Ajax_%28programming%29'>Ajax<\/a>\/<a target=_blank title='FormData object information' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/FormData'>FormData<\/a> &#8220;recursive feeling&#8221; methodology &#8230;<br \/>\n<code><br \/>\n     function repostit(ih) {<br \/>\n     var ihis=(ih.innerText || ih.contentWindow || ih.contentDocument);<br \/>\n     var pathpart=ih.id;<br \/>\n     if (ihis != '') {<br \/>\n   var xzhr = new XMLHttpRequest();<br \/>\n   var xform=new FormData();<br \/>\n   xform.append('myta',ihis);<br \/>\n   xform.append(pathpart.split('.')[0].replace('ip_','screen-').replace('_','-'),'');<br \/>\n   xzhr.open('post','.\/quarter_hour_timer.php',true);<br \/>\n   xzhr.send(xform);<br \/>\n     }<br \/>\n     }<br \/>\n<\/code><br \/>\n &#8230; which can cement that (newly user entered) annotation into future permanency in the &#8220;Yearly Report Calendar&#8221; section\n<\/li>\n<\/ul>\n<p> &#8230; of <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html------GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html------GETME\">quarter_hour_timer.html<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) &#8220;screencapture&#8221; command line usage, is helped out by a <font color=brown><a style=color:brown;font-color:brown; target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php----GETME\">contenteditable=true changed<\/a><\/font> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php----GETME\">quarter_hour_timer.php<\/a> PHP (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) for you to try out on your MAMP macOS environment.<\/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\/mac-os-mamp-timekeeping-web-application-php-calendar-contenteditable-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mosmamptwaphpcpt'>Previous relevant <a target=_blank title='Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-calendar-past-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar Past 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\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/timekeeping_previous.jpg\" title=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial<\/p><\/div>\n<p>If you&#8217;ve been using the Timekeeping web application as of yesterday&#8217;s <a title='Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial' href='#mosmamptwaphpct'>Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial<\/a> you would have noticed a very &#8230;<\/p>\n<ul>\n<li>first person<\/li>\n<li>present tense<\/li>\n<\/ul>\n<p> &#8230; feel to it all.  Today, we improve on the latter &#8220;restrictiveness&#8221; issue, within yesterday&#8217;s &#8220;Yearly Report Calendar&#8221; new functionality, by looking back into the current calendar year&#8217;s &#8220;past&#8221; with respect to the date of using the web application, whether that be &#8230;<\/p>\n<ul>\n<li>screen captures from days in the current calendar year&#8217;s &#8220;past&#8221;<\/li>\n<li>text entries made and remembered (in window.<a target=_blank title='window.localStorage information from W3schools' href='https:\/\/www.w3schools.com\/jsref\/prop_win_localstorage.asp'>localStorage<\/a>) in the current calendar year&#8217;s &#8220;past&#8221;<\/li>\n<\/ul>\n<p> &#8230; to infill and flesh out that &#8220;Yearly Report Calendar&#8221; better.  This involved bringing over a lot of (the unchanged) <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/monthly_chronicler.html---GETME\">monthly_chronicler.html<\/a>&#8216;s Javascript logic into <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html-----GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html-----GETME\">quarter_hour_timer.html<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) &#8220;screencapture&#8221; command line usage, is helped out by a <font color=brown><a style=color:brown;font-color:brown; target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php---GETME\">calendar&#8217;s past integrationally changed<\/a><\/font> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php---GETME\">quarter_hour_timer.php<\/a> PHP (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) for you to try out on your MAMP macOS environment.<\/p>\n<p>&lt;?php<br \/>\n<code><br \/>\n\/\/ quarter_hour_timer.php<br \/>\n\/\/ RJM Programming<br \/>\n\/\/ December, 2021<br \/>\n<br \/>\n<font color=brown>if (isset($_GET['yourta'])) {<br \/>\n $dru=\"HTTP:\/\/\" . $_SERVER['SERVER_NAME'] . \"\" . str_replace(\"~\",\"\",str_replace(\":443~\",\"\",str_replace(\":80~\",\"\",(\":\" . $_SERVER['SERVER_PORT'] . \"~\")))) . \"\/\";<br \/>\n $contis=str_replace('+',' ',urldecode($_GET['yourta']));<br \/>\n \/\/file_put_contents('xx.xx', $contis);<br \/>\n $htmlis='';<br \/>\n $myf='';<br \/>\n $backi='';<br \/>\n $cali='';<br \/>\n $taback='';<br \/>\n $bcontis=\"'\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"\\r\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $contis)))) . \"'\";<br \/>\n if (substr(($bcontis . '   '),0,3) == \"' + \") {  $bcontis=$bcontis.substr(3); }<br \/>\n if (substr(('   ' . $bcontis),-3,3) == \" + '\") {  $bcontis=$bcontis.substr(0,(-3 + strlen($bcontis))); }<br \/>\n foreach ($_GET as $name=&gt;$val) {<br \/>\n   if ($name != 'yourta') { \/\/ && $val == '') {<br \/>\n   \/\/echo $name;<br \/>\n     $orig=$name;<br \/>\n     $myf=$name;<br \/>\n     for ($imh=12; $imh&gt;=1; $imh--) {<br \/>\n     for ($idd=31; $idd&gt;=1; $idd--) {<br \/>\n     \/\/file_put_contents('xz.xz',$orig . ' Is ' . substr('00' . $imh,-2,2) . substr('00' . $idd,-2,2) . ' less than ' . $val);<br \/>\n     if (substr('00' . $imh,-2,2) . substr('00' . $idd,-2,2) &lt; $val) {<br \/>\n     for ($ihh=0; $ihh&lt;=23; $ihh++) {<br \/>\n     for ($imm=0; $imm&lt;=45; $imm+=15) {<br \/>\n     \/\/if ($ihh != 0 || $imm != 0) {<br \/>\n       $myf=str_replace(\"0101_\", substr('00' . $imh,-2,2) . substr('00' . $idd,-2,2) . \"_\",$orig);<br \/>\n       $myf=str_replace(\"_0000\", \"_\" . substr('00' . $ihh,-2,2) . substr('00' . $imm,-2,2),$myf);<br \/>\n     \/\/}<br \/>\n     $taback=str_replace('-','_',str_replace('itd','tatd',$myf));<br \/>\n     $backi=str_replace('-','_',str_replace('screen-','itd_',$myf));<br \/>\n     $cali=str_replace('-','',str_replace('screen-','td',$myf));<br \/>\n     $idcali=explode('-',explode('_',str_replace('screen-','td',str_replace('itd_','td',$myf)))[0])[0];<br \/>\n<br \/>\n\/\/ Thanks to https:\/\/doc.bccnsoft.com\/docs\/php-docs-7-en\/function.iptcembed.html<br \/>\n<br \/>\n\/\/ Path to jpeg file<br \/>\n$path = $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . str_replace('_','-',str_replace('itd_','screen-',$myf)) . '.jpg';<br \/>\n\/\/file_put_contents('x.x',$path);<br \/>\nif (file_exists($path)) {<br \/>\n$capt = \"\";  \/\/ Thanks to https:\/\/www.php.net\/manual\/en\/function.iptcparse.php<br \/>\n$size = getimagesize( $path, $info );<br \/>\nif (isset($info[\"APP13\"])) {<br \/>\n\/\/file_put_contents('xx.xx',$path);<br \/>\n    if ($iptc = iptcparse( $info[\"APP13\"] ) ) {<br \/>\n\/\/file_put_contents('xxx.xxx',$path);<br \/>\n        $capt = str_replace( \"\\000\", \"\", $iptc[\"2#120\"][0] );<br \/>\n\/\/file_put_contents('xxxx.xxxx',$capt);<br \/>\n    }<br \/>\n}<br \/>\n $bcontis=\"\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"\\r\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $capt)))) . \"\";<br \/>\n $ccpre=\"&lt;p onclick=this.innerHTML+=String.fromCharCode(60)+String.fromCharCode(98)+String.fromCharCode(114)+String.fromCharCode(62); style=background-color:orange;background-repeat:no-repeat;background-size:contain;background-image:linear-gradient(rgba(255,255,255,0.3),rgba(255,255,255,0.3)),URL(\" . $dru . str_replace('_','-',str_replace('itd_','screen-',$myf)) . \".jpg\" . \"); onmouseover=wopen(event,true); onmouseout=wopen(event,false);  title=\" . substr(str_replace('td','p',$cali),-4,2) . \":\" . substr(str_replace('td','p',$cali),-2,2) . \"++ id=\" . str_replace('td','p',$cali) . \"&gt;\";<br \/>\n $ccpost=\"&lt;\/p&gt;\";<br \/>\n $ccontis=\"&lt;br&gt;&lt;p style='background-color:orange; title='\" . str_replace('td','p',$cali) . \"' id=\" . str_replace('td','p',$cali) . \"&gt;\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"&lt;br&gt;\", str_replace(\"\\r\\n\", \"&lt;br&gt;\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $capt)))) . \"&lt;\/p&gt;\";<br \/>\n\/\/file_put_contents('xxxxx.xxxxx',$bcontis);<br \/>\n\/\/file_put_contents('xxxxxx.xxxxxx',$taback . ' ... ' . $backi);<br \/>\n\/\/file_put_contents('xxxxxxx.xxxxxxx',\"parent.document.getElementById('\" . $backi . \"').title='\" . $bcontis . \"';  parent.document.getElementById('\" . $taback . \"').value='\" . $bcontis . \"'; \");<br \/>\n<br \/>\n   }<br \/>\n <br \/>\n if ($bcontis != \"''\" && $bcontis != \"\") {<br \/>\n   if ($htmlis == '') {<br \/>\n    $htmlis=\"&lt;html&gt;&lt;head&gt;&lt;script type=text\/javascript&gt; var imois=null, iwo=null; function wopen(event,overvsout) { if (!overvsout) { if (imois == event.target) { imois=null; } return;  } imois=event.target; setTimeout(postwopen, 2000); } function postwopen() { var pois=imois; if (pois.outerHTML.indexOf('URL(') != -1) { window.open(pois.outerHTML.split('URL(')[1].split(')')[0].replace(String.fromCharCode(34),'').replace(String.fromCharCode(34),''),'_blank','top=50,left=50,width=600,height=600');    }  }&lt;\/script&gt;&lt;\/head&gt;&lt;body onload=\\\" var huhg='';  if (parent.document.getElementById('\" . $idcali . \"')) { huhg='\" . $ccpre . $bcontis . $ccpost . \"';  while (huhg.indexOf(String.fromCharCode(10)) != -1) { huhg=huhg.replace(String.fromCharCode(10),'&lt;br&gt;');  } parent.document.getElementById('\" . $idcali . \"').innerHTML+=huhg; }  \\\"&gt;&lt;\/body&gt;&lt;\/html&gt;\";<br \/>\n   } else if (strpos($htmlis, $bcontis) === false) {<br \/>\n    $htmlis=str_replace(\"+=huhg; }\", \"+=huhg; huhg='\" . $ccpre . $bcontis . $ccpost . \"';  while (huhg.indexOf(String.fromCharCode(10)) != -1) { huhg=huhg.replace(String.fromCharCode(10),'&lt;br&gt;');  } parent.document.getElementById('\" . $idcali . \"').innerHTML+=huhg; }\", $htmlis);<br \/>\n   }<br \/>\n }<br \/>\n <br \/>\n }<br \/>\n }<br \/>\n <br \/>\n if ($htmlis != \"\") { echo $htmlis;  }<br \/>\n  <br \/>\n }<br \/>\n }<br \/>\n }<br \/>\n }<br \/>\n }<br \/>\n }<\/font><br \/>\n \/\/ blah else if blah else if blah<br \/>\n<\/code><br \/>\n?&gt;<\/p>\n<p> &#8230; which you may notice implements a &#8220;long hover&#8221; <a target=_blank href='http:\/\/www.w3schools.com\/jsref\/met_win_open.asp' title='window.open information from w3schools'>window.open<\/a> scenario (using non-mobile platforms) for screenshot images on the calendar by combining the use of &#8230;<\/p>\n<ul>\n<li>global variables &#8230;<br \/>\n<code><br \/>\nvar imois=null;<br \/>\nvar iwo=null;<br \/>\n<\/code>\n<\/li>\n<li>onmouseover event logic &#8230;<br \/>\n<table>\n<tr>\n<th>Call<\/th>\n<\/tr>\n<tr>\n<td> onmouseover=wopen(event,true); <\/td>\n<\/tr>\n<\/table>\n<\/li>\n<li>setTimeout delays &#8230;<br \/>\n<table>\n<tr>\n<th>Called<\/th>\n<\/tr>\n<tr>\n<td>\n<code><br \/>\n  function wopen(event,overvsout) {<br \/>\n    if (!overvsout) {<br \/>\n      if (imois == event.target) {<br \/>\n        imois=null;<br \/>\n      }<br \/>\n      return;<br \/>\n    }<br \/>\n    imois=event.target;<br \/>\n    setTimeout(postwopen, 2000);<br \/>\n  }<br \/>\n<br \/> <br \/>\n  function postwopen() { \/\/pois) {<br \/>\n  if (imois) {<br \/>\n  var pois=imois;<br \/>\n  if (pois.outerHTML.indexOf('URL(') != -1) {<br \/>\n  if (iwo) { iwo.close(); iwo=null; }<br \/>\n  iwo = window.open(pois.outerHTML.split('URL(')[1].split(')')[0].replace(String.fromCharCode(34), '').replace(String.fromCharCode(34), ''), '_blank', 'top=50,left=50,width=600,height=600');<br \/>\n  }<br \/>\n  }<br \/>\n  }<br \/>\n<\/code><\/td>\n<\/tr>\n<\/table>\n<\/li>\n<li>onmouseout event logic &#8230;<br \/>\n<table>\n<tr>\n<th>Call<\/th>\n<\/tr>\n<tr>\n<td> onmouseout=wopen(event,false); <\/td>\n<\/tr>\n<\/table>\n<\/li>\n<\/ul>\n<p> &#8230; so that this logic is not responsible for clobbering the default &#8220;hover&#8221; shows of the &#8220;p&#8221; element &#8220;title&#8221; attribute with the onmouseover event for non-mobile platforms.<\/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\/mac-os-mamp-timekeeping-web-application-php-calendar-past-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mosmamptwaphpct'>Previous relevant <a target=_blank title='Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-calendar-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar 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\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/timekeeper_calendar.gif\" title=\"Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial<\/p><\/div>\n<p>Okay then, yesterday&#8217;s <a title='Mac OS MAMP Timekeeping Web Application PHP Image Metadata Tutorial' href='#mosmamptwaphpimt'>Mac OS MAMP Timekeeping Web Application PHP Image Metadata Tutorial<\/a> &#8220;image metadata smarts&#8221; puts us in a position to get onto the &#8220;bells and whistles&#8221; side of our Timekeeping (macOS and Mac OS X only at this stage) web application.  We channel the calendar display talents of <a target=_blank href='https:\/\/www.rjmprogramming.com.au\/ITblog\/monthly-chronicler-localstorage-tutorial\/' title='Monthly Chronicler LocalStorage Tutorial'>Monthly Chronicler LocalStorage Tutorial<\/a> in thought and act (its web application is opened in an iframe &#8230; hence our need to ask you to download <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/monthly_chronicler.html---GETME\">monthly_chronicler.html<\/a> to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) to offer a new (<a target=_blank href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/reveal\" title='WordPress reveal posts'>&#8220;reveal&#8221;<\/a>) piece of <a target=_blank title='HTML details tag information from w3schools' href='https:\/\/www.w3schools.com\/tags\/tag_details.asp'>details<\/a>\/<a target=_blank title='HTML summary tag information from w3schools' href='https:\/\/www.w3schools.com\/tags\/tag_details.asp'>summary<\/a> hosted <font color=blue>&#8220;Yearly Report Calendar&#8221;<\/font> functionality.<\/p>\n<p>&lt;?php<br \/>\n<code><br \/>\n\/\/ quarter_hour_timer.php<br \/>\n\/\/ RJM Programming<br \/>\n\/\/ December, 2021<br \/>\n<br \/>\n\/\/ iptc_make_tag() function by Thies C. Arntzen<br \/>\nfunction iptc_make_tag($rec, $data, $value) {<br \/>\n    $length = strlen($value);<br \/>\n    $retval = chr(0x1C) . chr($rec) . chr($data);<br \/>\n<br \/>\n    if($length &lt; 0x8000)<br \/>\n    {<br \/>\n        $retval .= chr($length &gt;&gt; 8) .  chr($length & 0xFF);<br \/>\n    }<br \/>\n    else<br \/>\n    {<br \/>\n        $retval .= chr(0x80) .<br \/>\n                   chr(0x04) .<br \/>\n                   chr(($length &gt;&gt; 24) & 0xFF) .<br \/>\n                   chr(($length &gt;&gt; 16) & 0xFF) .<br \/>\n                   chr(($length &gt;&gt; 8) & 0xFF) .<br \/>\n                   chr($length & 0xFF);<br \/>\n    }<br \/>\n<br \/>\n    return $retval . $value;<br \/>\n}<br \/>\n<br \/>\nif (isset($_GET['myta'])) {<br \/>\n <font color=blue>$dru=\"HTTP:\/\/\" . $_SERVER['SERVER_NAME'] . \"\" . str_replace(\"~\",\"\",str_replace(\":443~\",\"\",str_replace(\":80~\",\"\",(\":\" . $_SERVER['SERVER_PORT'] . \"~\")))) . \"\/\";<\/font><br \/>\n $contis=str_replace('+',' ',urldecode($_GET['myta']));<br \/>\n \/\/file_put_contents('xx.xx', $contis);<br \/>\n $myf='';<br \/>\n $backi='';<br \/>\n <font color=blue>$cali='';<\/font><br \/>\n $taback='';<br \/>\n $bcontis=\"'\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"\\r\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $contis)))) . \"'\";<br \/>\n if (substr(($bcontis . '   '),0,3) == \"' + \") {  $bcontis=$bcontis.substr(3); }<br \/>\n if (substr(('   ' . $bcontis),-3,3) == \" + '\") {  $bcontis=$bcontis.substr(0,(-3 + strlen($bcontis))); }<br \/>\n foreach ($_GET as $name=&gt;$val) {<br \/>\n   if ($name != 'myta' && $val == '') {<br \/>\n   \/\/echo $name;<br \/>\n     $myf=$name;<br \/>\n     $taback=str_replace('-','_',str_replace('itd','tatd',$myf));<br \/>\n     $backi=str_replace('-','_',str_replace('screen-','itd_',$myf));<br \/>\n     <font color=blue>$cali=str_replace('-','',str_replace('screen-','td',$myf));<br \/>\n     $idcali=explode('-',explode('_',str_replace('screen-','td',str_replace('itd_','td',$myf)))[0])[0];<\/font><br \/>\n<br \/>\n\/\/ Thanks to https:\/\/doc.bccnsoft.com\/docs\/php-docs-7-en\/function.iptcembed.html<br \/>\n<br \/>\n\/\/ Path to jpeg file<br \/>\n$path = $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . str_replace('_','-',str_replace('itd_','screen-',$myf)) . '.jpg';<br \/>\n\/\/file_put_contents('x.x',$path);<br \/>\n<br \/>\n$capt = \"\";  \/\/ Thanks to https:\/\/www.php.net\/manual\/en\/function.iptcparse.php<br \/>\n$size = getimagesize( $path, $info );<br \/>\nif (isset($info[\"APP13\"])) {<br \/>\n\/\/file_put_contents('xx.xx',$path);<br \/>\n    if ($iptc = iptcparse( $info[\"APP13\"] ) ) {<br \/>\n\/\/file_put_contents('xxx.xxx',$path);<br \/>\n        $capt = str_replace( \"\\000\", \"\", $iptc[\"2#120\"][0] );<br \/>\n\/\/file_put_contents('xxxx.xxxx',$capt);<br \/>\n    }<br \/>\n}<br \/>\n $bcontis=\"\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"\\r\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $capt)))) . \"\";<br \/>\n <font color=blue>$ccpre=\"&lt;p onclick=this.innerHTML+=String.fromCharCode(60)+String.fromCharCode(98)+String.fromCharCode(114)+String.fromCharCode(62); style=background-color:orange;background-size:contain;background-image:linear-gradient(rgba(255,255,255,0.3),rgba(255,255,255,0.3)),URL(\" . $dru . str_replace('_','-',str_replace('itd_','screen-',$myf)) . \".jpg\" . \"); title=\" . substr(str_replace('td','p',$cali),-4,2) . \":\" . substr(str_replace('td','p',$cali),-2,2) . \"++ id=\" . str_replace('td','p',$cali) . \"&gt;\";<br \/>\n $ccpost=\"&lt;\/p&gt;\";<br \/>\n $ccontis=\"&lt;br&gt;&lt;p style='background-color:orange; title='\" . str_replace('td','p',$cali) . \"' id=\" . str_replace('td','p',$cali) . \"&gt;\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"&lt;br&gt;\", str_replace(\"\\r\\n\", \"&lt;br&gt;\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $capt)))) . \"&lt;\/p&gt;\";<\/font><br \/>\n\/\/file_put_contents('xxxxx.xxxxx',$bcontis);<br \/>\n\/\/file_put_contents('xxxxxx.xxxxxx',$taback . ' ... ' . $backi);<br \/>\n\/\/file_put_contents('xxxxxxx.xxxxxxx',\"parent.document.getElementById('\" . $backi . \"').title='\" . $bcontis . \"';  parent.document.getElementById('\" . $taback . \"').value='\" . $bcontis . \"'; \");<br \/>\n<br \/>\n   }<br \/>\n if ($bcontis != \"''\") { echo \"&lt;html&gt;&lt;body onload=\\\" parent.document.getElementById('\" . $backi . \"').title='\" . $bcontis . \"';  parent.document.getElementById('\" . $taback . \"').value='\" . $bcontis . \"';   <font color=blue>if (parent.document.getElementById('\" . $idcali . \"')) { var huhg='\" . $ccpre . \"' + parent.document.getElementById('\" . $taback . \"').value + '\" . $ccpost . \"';  while (huhg.indexOf(String.fromCharCode(10)) != -1) { huhg=huhg.replace(String.fromCharCode(10),'&lt;br&gt;');  } parent.document.getElementById('\" . $idcali . \"').innerHTML+=huhg; }<\/font>  \\\"&gt;&lt;\/body&gt;&lt;\/html&gt;\"; }<br \/>\n }<br \/>\n } else if (isset($_POST['myta'])) {<br \/>\n <font color=blue>$dru=\"HTTP:\/\/\" . $_SERVER['SERVER_NAME'] . \"\" . str_replace(\"~\",\"\",str_replace(\":443~\",\"\",str_replace(\":80~\",\"\",(\":\" . $_SERVER['SERVER_PORT'] . \"~\")))) . \"\/\";<\/font><br \/>\n $contis=str_replace('+',' ',urldecode($_POST['myta']));<br \/>\n \/\/file_put_contents('xx.xx', $contis);<br \/>\n $myf='';<br \/>\n $backi='';<br \/>\n <font color=blue>$cali='';<\/font><br \/>\n $bcontis=\"'\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"\\r\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $contis)))) . \"'\";<br \/>\n<br \/> <br \/>\n <font color=blue>$ccpre=\"&lt;p onclick=this.innerHTML+=String.fromCharCode(60)+String.fromCharCode(98)+String.fromCharCode(114)+String.fromCharCode(62); style=background-color:orange;background-size:contain;background-image:linear-gradient(rgba(255,255,255,0.3),rgba(255,255,255,0.3)),URL(\" . $dru . str_replace('_','-',str_replace('itd_','screen-',$myf)) . \".jpg\" . \"); title=\" . substr(str_replace('td','p',$cali),-4,2) . \":\" . substr(str_replace('td','p',$cali),-2,2) . \"++ id=\" . str_replace('td','p',$cali) . \"&gt;\";<br \/>\n $ccpost=\"&lt;\/p&gt;\";<br \/>\n $ccontis=\"&lt;br&gt;&lt;p style='background-color:orange; title='\" . str_replace('td','p',$cali) . \"' id=\" . str_replace('td','p',$cali) . \"&gt;\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"&lt;br&gt;\", str_replace(\"\\r\\n\", \"&lt;br&gt;\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $capt)))) . \"&lt;\/p&gt;\";<\/font><br \/>\n<br \/>\n if (substr(($bcontis . '   '),0,3) == \"' + \") {  $bcontis=$bcontis.substr(3); }<br \/>\n if (substr(('   ' . $bcontis),-3,3) == \" + '\") {  $bcontis=$bcontis.substr(0,(-3 + strlen($bcontis))); }<br \/>\n foreach ($_POST as $name=&gt;$val) {<br \/>\n   if ($name != 'myta') {<br \/>\n     $myf=$name;<br \/>\n     $backi=str_replace('-','_',str_replace('screen-','itd_',$myf));<br \/>\n     <font color=blue>$taback=str_replace('tatd','tatd_',substr(str_replace('-','',str_replace('_','',str_replace('itd','tatd',str_replace('screen','tatd',$myf)))),0,12)) . '_' . substr(str_replace('-','',str_replace('_','',str_replace('itd','tatd',str_replace('screen','tatd',$myf)))),-4,4);<br \/>\n     $pback=str_replace('tatd','ip',$taback);<br \/>\n     $cali=str_replace('-','',str_replace('screen-','td',$myf));<br \/>\n     $idcali=explode('-',explode('_',str_replace('screen-','td',str_replace('itd_','td',$myf)))[0])[0];<\/font><br \/>\n<br \/>\n\/\/ Thanks to https:\/\/doc.bccnsoft.com\/docs\/php-docs-7-en\/function.iptcembed.html<br \/>\n<br \/>\n\/\/ Path to jpeg file<br \/>\n$path = $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . $myf . '.jpg';<br \/>\n<br \/>\n\/\/file_put_contents('x.x', $path);<br \/>\n<br \/>\n\/\/ Set the IPTC tags<br \/>\n$iptc = array(<br \/>\n    '2#120' =&gt; $contis,<br \/>\n    '2#116' =&gt; 'Copyright 2021, RJM Programming'<br \/>\n);<br \/>\n<br \/>\n\/\/ Convert the IPTC tags into binary code<br \/>\n$data = '';<br \/>\n<br \/>\nforeach($iptc as $tag =&gt; $string) {<br \/>\n    $tag = substr($tag, 2);<br \/>\n    $data .= iptc_make_tag(2, $tag, $string);<br \/>\n}<br \/>\n<br \/>\n\/\/ Embed the IPTC data<br \/>\n$content = iptcembed($data, $path);<br \/>\n<br \/>\n\/\/ Write the new image data out to the file.<br \/>\n$fp = fopen($path, \"wb\");<br \/>\nfwrite($fp, $content);<br \/>\nfclose($fp);<br \/>\n<br \/>\n   }<br \/>\n echo \"&lt;html&gt;&lt;body onload=\\\" parent.document.getElementById('\" . $backi . \"').title=\" . $bcontis . \";  <font color=blue> if (parent.document.getElementById('\" . $idcali . \"')) { var huhg='\" . $ccpre . \"' + parent.document.getElementById('\" . $taback . \"').value + '\" . $ccpost . \"';  if (parent.document.getElementById('\" . $pback . \"')) { huhg=parent.document.getElementById('\" . $taback . \"').value; }  while (huhg.indexOf(String.fromCharCode(10)) != -1) { huhg=huhg.replace(String.fromCharCode(10),'&lt;br&gt;');  }    if (parent.document.getElementById('\" . $pback . \"')) {  parent.document.getElementById('\" . $pback . \"').innerHTML=huhg; } else { parent.document.getElementById('\" . $idcali . \"').innerHTML+=huhg; }<\/font> }  \\\"&gt;&lt;\/body&gt;&lt;\/html&gt;\";<br \/>\n }<br \/>\n } else {<br \/>\n exec(\"\/usr\/sbin\/screencapture -Cd -tjpg \/Applications\/MAMP\/htdocs\/screen-`date +\\\"%Y%m%d-%H%M\\\"`.jpg\");<br \/>\n }<br \/>\n exit;<br \/>\n<\/code><br \/>\n?&gt;<\/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\/quarter_hour_timer.html----GETME\">our changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html----GETME\">quarter_hour_timer.html<\/a> (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) &#8220;screencapture&#8221; command line usage, is helped out by a <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php--GETME\">calendar integrationally changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php--GETME\">quarter_hour_timer.php<\/a> PHP (we ask you to download to <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>&#8216;s $_SERVER[&#8216;DOCUMENT_ROOT&#8217;] &#8220;HTMLCSS&#8221; subfolder) for you to try out on your MAMP macOS environment.<\/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\/mac-os-mamp-timekeeping-web-application-php-calendar-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mosmamptwaphpimt'>Previous relevant <a target=_blank title='Mac OS MAMP Timekeeping Web Application PHP Image Metadata Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-image-metadata-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Image Metadata 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\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS MAMP Timekeeping Web Application PHP Image Metadata Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/screencapture_php_iptc.gif\" title=\"Mac OS MAMP Timekeeping Web Application PHP Image Metadata Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">Mac OS MAMP Timekeeping Web Application PHP Image Metadata Tutorial<\/p><\/div>\n<p>In our opinion, what would make the day before yesterday&#8217;s <a title='Mac OS MAMP Timekeeping Web Application PHP Intranet Tutorial' href='#mosmamptwaphpit'>Mac OS MAMP Timekeeping Web Application PHP Intranet Tutorial<\/a> &#8220;Timekeeping Web Application&#8221; <i>cooler<\/i> would be to add to the intelligence of the screen capture images, ahead of other data related improvements to come.<\/p>\n<p>We&#8217;ve spoken in the past about <a target=_blank title='Exif information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/Exif'>Exif<\/a> in that respect but PHP has Iptc image metadata functions we can call on &#8230;<\/p>\n<ul>\n<li><a target=_blank href='https:\/\/www.php.net\/manual\/en\/function.iptcembed.php'>iptcembed<\/a> to embed new metadata into an existant image from those associated &#8220;caption&#8221; textarea elements we offer<\/li>\n<li><a target=_blank href='https:\/\/www.php.net\/manual\/en\/function.iptcparse.php'>iptcparse<\/a> to extract old metadata from an existant image into those associated &#8220;caption&#8221; textarea elements we offer<\/li>\n<\/ul>\n<p>This metadata can be like a database source we use moving forward on this project, meaning the one image data entity can suffice for both visual and textual usage purposes.<\/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\/quarter_hour_timer.html---GETME\">our changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html---GETME\">quarter_hour_timer.html<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">Timekeeping Web Application<\/a> suited to macOS (or Mac OS X) &#8220;screencapture&#8221; command line usage, is helped out by a <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php-GETME\">much more usefully changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php-GETME\">quarter_hour_timer.php<\/a> PHP &#8230;<\/p>\n<p>&lt;?php<br \/>\n<code><br \/>\n\/\/ quarter_hour_timer.php<br \/>\n\/\/ RJM Programming<br \/>\n\/\/ December, 2021<br \/>\n<br \/>\n\/\/ iptc_make_tag() function by Thies C. Arntzen<br \/>\nfunction iptc_make_tag($rec, $data, $value) {<br \/>\n    $length = strlen($value);<br \/>\n    $retval = chr(0x1C) . chr($rec) . chr($data);<br \/>\n<br \/>\n    if($length &lt; 0x8000)<br \/>\n    {<br \/>\n        $retval .= chr($length &gt;&gt; 8) .  chr($length & 0xFF);<br \/>\n    }<br \/>\n    else<br \/>\n    {<br \/>\n        $retval .= chr(0x80) .<br \/>\n                   chr(0x04) .<br \/>\n                   chr(($length &gt;&gt; 24) & 0xFF) .<br \/>\n                   chr(($length &gt;&gt; 16) & 0xFF) .<br \/>\n                   chr(($length &gt;&gt; 8) & 0xFF) .<br \/>\n                   chr($length & 0xFF);<br \/>\n    }<br \/>\n<br \/>\n    return $retval . $value;<br \/>\n}<br \/>\n<br \/>\nif (isset($_GET['myta'])) {<br \/>\n $contis=str_replace('+',' ',urldecode($_GET['myta']));<br \/>\n \/\/file_put_contents('xx.xx', $contis);<br \/>\n $myf='';<br \/>\n $backi='';<br \/>\n $taback='';<br \/>\n $bcontis=\"'\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"\\r\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $contis)))) . \"'\";<br \/>\n if (substr(($bcontis . '   '),0,3) == \"' + \") {  $bcontis=$bcontis.substr(3); }<br \/>\n if (substr(('   ' . $bcontis),-3,3) == \" + '\") {  $bcontis=$bcontis.substr(0,(-3 + strlen($bcontis))); }<br \/>\n foreach ($_GET as $name=&gt;$val) {<br \/>\n   if ($name != 'myta' && $val == '') {<br \/>\n   \/\/echo $name;<br \/>\n     $myf=$name;<br \/>\n     $taback=str_replace('-','_',str_replace('itd','tatd',$myf));<br \/>\n     $backi=str_replace('-','_',str_replace('screen-','itd_',$myf));<br \/>\n<br \/>\n\/\/ Thanks to https:\/\/doc.bccnsoft.com\/docs\/php-docs-7-en\/function.iptcembed.html<br \/>\n<br \/>\n\/\/ Path to jpeg file<br \/>\n$path = $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . str_replace('_','-',str_replace('itd_','screen-',$myf)) . '.jpg';<br \/>\n\/\/file_put_contents('x.x',$path);<br \/>\n<br \/>\n$capt = \"\";  \/\/ Thanks to https:\/\/www.php.net\/manual\/en\/function.iptcparse.php<br \/>\n$size = getimagesize( $path, $info );<br \/>\nif (isset($info[\"APP13\"])) {<br \/>\n\/\/file_put_contents('xx.xx',$path);<br \/>\n    if ($iptc = iptcparse( $info[\"APP13\"] ) ) {<br \/>\n\/\/file_put_contents('xxx.xxx',$path);<br \/>\n        $capt = str_replace( \"\\000\", \"\", $iptc[\"2#120\"][0] );<br \/>\n\/\/file_put_contents('xxxx.xxxx',$capt);<br \/>\n    }<br \/>\n}<br \/>\n $bcontis=\"\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"\\r\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $capt)))) . \"\";<br \/>\n\/\/file_put_contents('xxxxx.xxxxx',$bcontis);<br \/>\n\/\/file_put_contents('xxxxxx.xxxxxx',$taback . ' ... ' . $backi);<br \/>\n\/\/file_put_contents('xxxxxxx.xxxxxxx',\"parent.document.getElementById('\" . $backi . \"').title='\" . $bcontis . \"';  parent.document.getElementById('\" . $taback . \"').value='\" . $bcontis . \"'; \");<br \/>\n<br \/>\n   }<br \/>\n if ($bcontis != \"''\") { echo \"&lt;html&gt;&lt;body onload=\\\" parent.document.getElementById('\" . $backi . \"').title='\" . $bcontis . \"';  parent.document.getElementById('\" . $taback . \"').value='\" . $bcontis . \"'; \\\"&gt;&lt;p&gt;parent.document.getElementById('\" . $backi . \"').title='\" . $bcontis . \"';  parent.document.getElementById('\" . $taback . \"').value='\" . $bcontis . \"';&lt;\/p&gt;&lt;\/body&gt;&lt;\/html&gt;\"; }<br \/>\n }<br \/>\n } else if (isset($_POST['myta'])) {<br \/>\n $contis=str_replace('+',' ',urldecode($_POST['myta']));<br \/>\n \/\/file_put_contents('xx.xx', $contis);<br \/>\n $myf='';<br \/>\n $backi='';<br \/>\n $bcontis=\"'\" . str_replace(chr(34), \"' + String.fromCharCode(34) + '\", str_replace(\"\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"\\r\\n\", \"' + String.fromCharCode(10) + '\", str_replace(\"'\", \"' + String.fromCharCode(39) + '\", $contis)))) . \"'\";<br \/>\n if (substr(($bcontis . '   '),0,3) == \"' + \") {  $bcontis=$bcontis.substr(3); }<br \/>\n if (substr(('   ' . $bcontis),-3,3) == \" + '\") {  $bcontis=$bcontis.substr(0,(-3 + strlen($bcontis))); }<br \/>\n foreach ($_POST as $name=&gt;$val) {<br \/>\n   if ($name != 'myta') {<br \/>\n     $myf=$name;<br \/>\n     $backi=str_replace('-','_',str_replace('screen-','itd_',$myf));<br \/>\n<br \/>\n\/\/ Thanks to https:\/\/doc.bccnsoft.com\/docs\/php-docs-7-en\/function.iptcembed.html<br \/>\n<br \/>\n\/\/ Path to jpeg file<br \/>\n$path = $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . $myf . '.jpg';<br \/>\n<br \/>\n\/\/file_put_contents('x.x', $path);<br \/>\n<br \/>\n\/\/ Set the IPTC tags<br \/>\n$iptc = array(<br \/>\n    '2#120' =&gt; $contis,<br \/>\n    '2#116' =&gt; 'Copyright 2021, RJM Programming'<br \/>\n);<br \/>\n<br \/>\n\/\/ Convert the IPTC tags into binary code<br \/>\n$data = '';<br \/>\n<br \/>\nforeach($iptc as $tag =&gt; $string) {<br \/>\n    $tag = substr($tag, 2);<br \/>\n    $data .= iptc_make_tag(2, $tag, $string);<br \/>\n}<br \/>\n<br \/>\n\/\/ Embed the IPTC data<br \/>\n$content = iptcembed($data, $path);<br \/>\n<br \/>\n\/\/ Write the new image data out to the file.<br \/>\n$fp = fopen($path, \"wb\");<br \/>\nfwrite($fp, $content);<br \/>\nfclose($fp);<br \/>\n<br \/>\n   }<br \/>\n echo \"&lt;html&gt;&lt;body onload=\\\" parent.document.getElementById('\" . $backi . \"').title=\" . $bcontis . \"; \\\"&gt;&lt;\/body&gt;&lt;\/html&gt;\";<br \/>\n }<br \/>\n } else {<br \/>\n exec(\"\/usr\/sbin\/screencapture -Cd -tjpg \/Applications\/MAMP\/htdocs\/screen-`date +\\\"%Y%m%d-%H%M\\\"`.jpg\");<br \/>\n }<br \/>\n exit;<\/code><br \/>\n?&gt;<\/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\/new-mac-os-mamp-timekeeping-web-application-php-intranet-tutorial\/'>New Mac OS MAMP Timekeeping Web Application PHP Intranet Tutorial<\/a> ...<\/p>\n\n\n\n\n\n<hr>\n\n\n\n\n\n<p id='mosmamptwaphpit'>Previous relevant <a target=_blank title='Mac OS MAMP Timekeeping Web Application PHP Intranet Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-intranet-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Intranet Tutorial<\/a> is shown below.<\/p>\n\n\n\n[caption id=\"\" align=\"alignnone\" width=\"220\" caption=\"Mac OS MAMP Timekeeping Web Application PHP Intranet Tutorial\"]<a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS MAMP Timekeeping Web Application PHP Intranet Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer_php_intranet.gif\" title=\"Mac OS MAMP Timekeeping Web Application PHP Intranet Tutorial\"  style=\"float:left;\"   \/><\/a>[\/caption]\n\n\n\n<p>It's \"Intranet\" time again, this time the integration just \"client side\" based, and with a previously client only <a title='Mac OS X MAMP Timekeeping Web Application Email Tutorial' href='#mosxmamptwaet'>Mac OS X MAMP Timekeeping Web Application Email Tutorial<\/a> web application's ...<\/p>\n\n\n\n\n\n<blockquote cite='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-x-mamp-timekeeping-web-application-email-tutorial\/' style='background-color:#f0f0f0;'>\n\n\n<ul>\n\n\n<li><i>Mac OS X<\/i> operating system +<\/li>\n\n\n\n\n<li>Existance of [\/usr\/sbin\/]<a target=_blank title='screencapture command information from Apple' href='https:\/\/developer.apple.com\/legacy\/library\/documentation\/Darwin\/Reference\/ManPages\/man1\/screencapture.1.html'><i>screencapture<\/i><\/a> +<\/li>\n\n\n\n\n<li><a target=_blank title='crontab information from computerhope ... thanks' href='http:\/\/www.computerhope.com\/jargon\/c\/cron.htm'><i>crontab<\/i><\/a> active and editable via <i>crontab -e<\/i> +<\/li>\n\n\n\n\n<li>One of ...\n\n\n<ol>\n\n\n<li><a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'><i>MAMP<\/i><\/a> installed to, in our case, <i>\/Applications\/MAMP\/htdocs\/<\/i> (as is mentioned in the relevant <i>crontab<\/i> background task that snapshots the user's screen every quarter hour) that maps to the MAMP web application URL <i>http:\/\/localhost:8888\/<\/i> ... or ...<\/li>\n\n\n\n\n<li><i>crontab<\/i> directory mention that corresponds to a URL call of our web application like for our Google Chrome example (where the <i>directory<\/i> below, used, could be a place of your choosing (that matches what is in your <i>crontab<\/i> task entry)) ...\n<code>\nfile:\/\/<i>\/Applications\/MAMP\/htdocs\/<\/i><font color=blue>HTMLCSS\/<\/font>quarter_hour_timer.html?localplace=\n<\/code>\n... or just, via the web browser's File -&gt; Open File menu ...\n<code>\nfile:\/\/<i>\/Applications\/MAMP\/htdocs\/<\/i><font color=blue>HTMLCSS\/<\/font>quarter_hour_timer.html\n<\/code>\n<img decoding=\"async\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.gif\"><\/img>\n<\/li>\n\n\n<\/ol>\n\n\n<\/li>\n\n\n<\/ul>\n\n\n<\/blockquote>\n\n\n\n\n\n<p> ... today we're <font color=blue>changing that into<\/font> ...<\/p>\n\n\n\n\n\n<ul>\n\n\n<li><i><font color=blue>mac OS or<\/font> Mac OS X<\/i> operating system +<\/li>\n\n\n\n\n<li>Existance of [\/usr\/sbin\/]<a target=_blank title='screencapture command information from Apple' href='https:\/\/developer.apple.com\/legacy\/library\/documentation\/Darwin\/Reference\/ManPages\/man1\/screencapture.1.html'><i>screencapture<\/i><\/a> +<\/li>\n\n\n\n\n<li><a target=_blank title='crontab information from computerhope ... thanks' href='http:\/\/www.computerhope.com\/jargon\/c\/cron.htm'><i>crontab<\/i><\/a> <font color=blue>(no longer relied upon)<\/font> active and editable via <i>crontab -e<\/i>  <font color=blue>(replaced by inline calling of new <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.php_GETME\">quarter_hour_timer.php<\/a> (which, as well as HTML below, should be downloaded to your MAMP's $_SERVER['DOCUMENT_ROOT'] \"HTMLCSS\" folder)<\/font>) ...\n<code>\n&lt;?php\n\/\/ quarter_hour_timer.php\n\/\/ RJM Programming\n\/\/ December, 2021\n exec(\"\/usr\/sbin\/screencapture -Cd -tjpg \/Applications\/MAMP\/htdocs\/screen-`date +\\\"%Y%m%d-%H%M\\\"`.jpg\");\n exit;\n?&gt;\n<\/code>\n<\/font> +<\/li>\n\n\n\n\n<li>One of ...\n\n\n<ol>\n\n\n<li><a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'><i>MAMP<\/i><\/a> installed to, in our case, <i>\/Applications\/MAMP\/htdocs\/<\/i> <strike style=color:blue;>(as is mentioned in the relevant <i>crontab<\/i> background task that snapshots the user's screen every quarter hour)<\/strike> that maps to the MAMP web application URL <i>http:\/\/localhost:8888\/<\/i> <font color=blue>(that incarnation called \"Intranet style\" from the public RJM Programming domain URL for <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html--GETME\">quarter_hour_timer.html<\/a> <font color=blue>(and should be downloaded to your MAMP's $_SERVER['DOCUMENT_ROOT'] \"HTMLCSS\" folder)<\/font> which changed to cater for today's rearrangements in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html--GETME\">this way<\/a>)<\/font> ... or ...<\/li>\n\n\n\n\n<li><strike style=color:blue;><i>crontab<\/i><\/strike> <font color=blue>PHP<\/font> directory mention that corresponds to a URL call of our web application like for our Google Chrome example (where the <i>directory<\/i> below, used, could be a place of your choosing (that matches what is in your <i>crontab<\/i> task entry)) ...\n<code>\nfile:\/\/<i>\/Applications\/MAMP\/htdocs\/<\/i><font color=blue>HTMLCSS\/<\/font>quarter_hour_timer.html?localplace=\n<\/code>\n... or just, via the web browser's File -&gt; Open File menu ...\n<code>\nfile:\/\/<i>\/Applications\/MAMP\/htdocs\/<\/i><font color=blue>HTMLCSS\/<\/font>quarter_hour_timer.html\n<\/code>\n<img decoding=\"async\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer_php_intranet.gif\"><\/img>\n<\/li>\n\n\n<\/ol>\n\n\n<\/li>\n\n\n<\/ul>\n\n\n\n\n\n<p> ... for your \"Intranet makeover\"!  Today's work in that vein shows a (Javascript) client only approach ...<\/p>\n\n\n  \n<code>\n var lportbit=getOS(':8888');\n var imgn='imgm' + Math.floor(Math.random() * 1987656453) + '.gif';\n var tryit='HTTP:\/\/localhost' + lportbit + '\/' + imgn; \n var thatone='', thattwo='';\n var wowowo=null;\n<br \/>\n function getOS(inlp) {\n var OSName = \"Win Unknown\";\n if (window.navigator.userAgent.indexOf(\"Windows NT 11.0\")!= -1) OSName=\"Windows 11\";\n if (window.navigator.userAgent.indexOf(\"Windows NT 10.0\")!= -1) OSName=\"Windows 10\";\n if (window.navigator.userAgent.indexOf(\"Windows NT 6.3\") != -1) OSName=\"Windows 8.1\";\n if (window.navigator.userAgent.indexOf(\"Windows NT 6.2\") != -1) OSName=\"Windows 8\";\n if (window.navigator.userAgent.indexOf(\"Windows NT 6.1\") != -1) OSName=\"Windows 7\";\n if (window.navigator.userAgent.indexOf(\"Windows NT 6.0\") != -1) OSName=\"Windows Vista\";\n if (window.navigator.userAgent.indexOf(\"Windows NT 5.1\") != -1) OSName=\"Windows XP\";\n if (window.navigator.userAgent.indexOf(\"Windows NT 5.0\") != -1) OSName=\"Windows 2000\";\n if (window.navigator.userAgent.indexOf(\"Mac\")            != -1) OSName=\"Mac\/iOS\";\n if (window.navigator.userAgent.indexOf(\"X11\")            != -1) OSName=\"UNIX\";\n if (window.navigator.userAgent.indexOf(\"Linux\")          != -1) OSName=\"Linux\";\n if (OSName.substring(0,3).toLowerCase() == 'win') { inlp='';  }\n return inlp;\n }\n <br \/> \n function calledlater() {\n            if (tryit != '') {\n            if (!inIframe() && document.URL.indexOf('https:') == 0 && document.URL.indexOf('localhost') == -1 && navigator.userAgent.toLowerCase().indexOf('safari\/') &gt; -1) {\n              location.href=document.URL.replace('https:','http:');\n            }\n            }\n }\n<br \/>\n function windowopen(theone, thetwo) {\n   var asu=('&' + document.URL.replace(document.URL.split('?')[0],'').replace('?','')).replace(\/^\\&$\/g,'');  \n   wowowo=window.open('HTTP:\/\/localhost' + lportbit + '\/HTMLCSS\/quarter_hour_timer.html?imgname=' + imgn + asu,'xxlocit');\n   thatone=theone;\n   thattwo=thetwo;\n   setTimeout(postwo, 4000);\n }\n<br \/> \n function postwo() {\n   if (tryit.trim() == tryit) {\n     return null;\n   } \n   wowo=window.open(thatone, thattwo);\n }\n<br \/> \n function inIframe () {  \/\/ thanks to https:\/\/stackoverflow.com\/questions\/326069\/how-to-identify-if-a-webpage-is-being-loaded-inside-an-iframe-or-directly-into-t\n    try {\n        return window.self !== window.top;\n    } catch (e) {\n        return true;\n    }\n }\n<br \/>  \n function mamptry() { \n   if (!inIframe()) { if (document.URL.indexOf('httJUNKp:') == 0) { wowo=window.open('HTTP:\/localhost' + lportbit + '\/HTMLCSS\/quarter_hour_timer.html','mamptry'); document.getElementById('mamptry').style.display='block'; } else if (document.URL.indexOf('localhost') == -1) { windowopen('HTTP:\/localhost' + lportbit + '\/HTMLCSS\/quarter_hour_timer.html','blank');  } }\n }\n<br \/>\nif ((location.search.split('imgname=')[1] ? (decodeURIComponent(location.search.split('imgname=')[1]).split('&')[0]) : '')) {\n  var asu=((document.URL.replace(document.URL.split('?')[0],'')).replace('?','').replace('&','?') + '?');  \n  asu=('?' + asu.split('?')[1]).replace(\/^\\?$\/g,''); \n  if (document.URL.indexOf('localhost') != -1) { window.open(document.URL.split('?')[0] + asu,'_blank'); }\n}\n<br \/>\n function forceissue() {\n   var d1 = new Date();\n   if (document.URL.indexOf('localhost') != -1 && d1.toUTCString().replace(':15:',':00:').replace(':30:',':00:').replace(':45:',':00:').replace(':07 ',':08 ').replace(':09 ',':08 ').indexOf(':00:08 ') != -1) {\n   document.getElementById('xxxxlocit').src=document.URL.replace('.html','.php').replace('.htm','.php').split('?')[0] + '?rand=' + Math.floor(Math.random() * 1987656432);\n   } else {\n   document.getElementById('xxxxlocit').src=document.URL.replace('.html','.php').replace('.htm','.php').split('?')[0] + '?rand=' + Math.floor(Math.random() * 1987656432);\n   normok=false;\n   fillinmywork();\n   }\n }\n<br \/>\n function lookforfifteen() {\n   var d1 = new Date();\n   if (document.URL.indexOf('localhost') != -1 && d1.toUTCString().replace(':15:',':00:').replace(':30:',':00:').replace(':45:',':00:').replace(':07 ',':08 ').replace(':09 ',':08 ').indexOf(':00:08 ') != -1) {\n   forceissue(); \/\/ document.getElementById('xxxxlocit').src=document.URL.replace('.html','.php').replace('.htm','.php').split('?')[0] + '?rand=' + Math.floor(Math.random() * 1987656432);\n   setTimeout(lookforfifteen, 5000);\n   } else {\n   setTimeout(lookforfifteen, 1000);\n   }\n }\n<br \/> \n setTimeout(calledlater, 2000);\n setTimeout(lookforfifteen, 1000);\n<\/code>\n\n\n<!--p>You can also see this play out at WordPress 4.1.1's <a target=_blank  href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-mamp-timekeeping-web-application-php-intranet-tutorial\/'>Mac OS MAMP Timekeeping Web Application PHP Intranet Tutorial<\/a>.<\/p-->\n<hr>\n<p id='mosxmamptwaet'>Previous relevant <a target=_blank title='Mac OS X MAMP Timekeeping Web Application Email Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-x-mamp-timekeeping-web-application-email-tutorial\/'>Mac OS X MAMP Timekeeping Web Application Email 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\/quarter_hour_timer.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS X MAMP Timekeeping Web Application Email Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer_email.jpg\" title=\"Mac OS X MAMP Timekeeping Web Application Email Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">Mac OS X MAMP Timekeeping Web Application Email Tutorial<\/p><\/div>\n<p>The practicalities of yesterday&#8217;s (<a title='Mac OS X MAMP Timekeeping Web Application Primer Tutorial' href='#moxmtwapt'>Mac OS X MAMP Timekeeping Web Application Primer Tutorial<\/a>) timekeeping Mac OS X Web Application, left as they are, would leave you with a somewhat useful web application whose use is only <i>for the here and now<\/i>, but what if you want it to be more accountable?  Well, that is when we, here, at RJM Programming, like to use that tried and trusted <a target=_blank title='Email information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/Email'><i>email<\/i><\/a> form of communication.<\/p>\n<p>Today&#8217;s email methods spurn the use of server-side intervention, at least for now.  So what is available to us as tools, if we don&#8217;t include Ajax nor jQuery in that list?  Well, we have, to our minds &#8230;<\/p>\n<ul>\n<li><a target=_blank title='Mailto link information from w3schools' href='http:\/\/www.w3schools.com\/tags\/tryit.asp?filename=tryhtml_link_mailto'>mailto<\/a> links (get us to the email client) +<\/li>\n<li>the body section of that email can have a clipboard image <i>pasted<\/i> into it, for which we can utilize HTML5 <a target=_blank title='HTML Canvas element information from w3schools' href='http:\/\/www.w3schools.com\/tags\/ref_canvas.asp'>canvas<\/a> element&#8217;s <a target=_blank title='HTML5 canvas element toDataURL method information' href='https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/HTMLCanvasElement\/toDataURL'>toDataURL<\/a>() method, teamed up with a <a target=_blank href='http:\/\/www.w3schools.com\/jsref\/met_win_open.asp' title='window.open information from w3schools'><i>window.open<\/i><\/a> popup window of the <i>toDataURL<\/i> image data, which can be <i>selected<\/i> and <i>copied<\/i>, optionally, by the user themselves, should they wish this to make their email more self explanatory<br \/>\n<img decoding=\"async\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer_email.gif\" title='The workings of email creation'><\/img>\n<\/li>\n<\/ul>\n<p>We last discussed this thinking with <a target=_blank title='Canvas Annotation Email Attachment Clipboard Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/canvas-annotation-email-attachment-clipboard-tutorial\/'>Canvas Annotation Email Attachment Clipboard Tutorial<\/a>.<\/p>\n<p>We rely on the <a target=_blank title='crontab information from computerhope ... thanks' href='http:\/\/www.computerhope.com\/jargon\/c\/cron.htm'><i>crontab<\/i><\/a> functionality, being as there is no server-side help, to create the image file, whose contents eventually go to make up the contents that can be selected and copied and pasted by the user into the body section of the email (and sent off to whosoever they feel like sending it too, as you have the full power of the email client available to you with the interaction you have with an actual email client program).<\/p>\n<p>Here is the HTML and Javascript <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html-GETME\">quarter_hour_timer.html<\/a> which changed to cater for today&#8217;s email functionality in <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html-GETME\">this way<\/a>, and, as per the <b><i>Stop Press<\/i><\/b> from yesterday, we&#8217;ll also have a <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\" title='Click picture'>live run<\/a> link here today.<\/p>\n<hr>\n<p id='moxmtwapt'>Previous relevant <a target=_blank title='Mac OS X MAMP Timekeeping Web Application Primer Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-x-mamp-timekeeping-web-application-primer-tutorial\/'>Mac OS X MAMP Timekeeping Web Application 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\/quarter_hour_timer.jpg\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS X MAMP Timekeeping Web Application Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.jpg\" title=\"Mac OS X MAMP Timekeeping Web Application Primer Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">Mac OS X MAMP Timekeeping Web Application Primer Tutorial<\/p><\/div>\n<p>Sometimes when you program, especially for administrative type functionality, there are useful programs to write, that are able to become web applications, but in a limited set of platforms.  So it is today with our timekeeping web application that relies on &#8230;<\/p>\n<ul>\n<li><i>Mac OS X<\/i> operating system +<\/li>\n<li>Existance of [\/usr\/sbin\/]<a target=_blank title='screencapture command information from Apple' href='https:\/\/developer.apple.com\/legacy\/library\/documentation\/Darwin\/Reference\/ManPages\/man1\/screencapture.1.html'><i>screencapture<\/i><\/a> +<\/li>\n<li><a target=_blank title='crontab information from computerhope ... thanks' href='http:\/\/www.computerhope.com\/jargon\/c\/cron.htm'><i>crontab<\/i><\/a> active and editable via <i>crontab -e<\/i> +<\/li>\n<li>One of &#8230;\n<ol>\n<li><a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'><i>MAMP<\/i><\/a> installed to, in our case, <i>\/Applications\/MAMP\/htdocs\/<\/i> (as is mentioned in the relevant <i>crontab<\/i> background task that snapshots the user&#8217;s screen every quarter hour) that maps to the MAMP web application URL <i>http:\/\/localhost:8888\/<\/i> &#8230; or &#8230;<\/li>\n<li><i>crontab<\/i> directory mention that corresponds to a URL call of our web application like for our Google Chrome example (where the <i>directory<\/i> below, used, could be a place of your choosing (that matches what is in your <i>crontab<\/i> task entry)) &#8230;<br \/>\n<code><br \/>\nfile:\/\/<i>\/Applications\/MAMP\/htdocs\/<\/i>quarter_hour_timer.html?localplace=<br \/>\n<\/code><br \/>\n&#8230; or just, via the web browser&#8217;s File -&gt; Open File menu &#8230;<br \/>\n<code><br \/>\nfile:\/\/<i>\/Applications\/MAMP\/htdocs\/<\/i>quarter_hour_timer.html<br \/>\n<\/code><br \/>\n<img decoding=\"async\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.gif\"><\/img>\n<\/li>\n<\/ol>\n<\/li>\n<\/ul>\n<p> &#8230; pretty restrictive, huh? &#8230; but pretty useful for our quarter hour timekeeping purposes today.<\/p>\n<p>We want to have a web application that is running at the user&#8217;s discretion, and when first fired up, looks for outputs from <i>crontab<\/i> tasks above &#8230;<\/p>\n<p><code><br \/>\n0,15,30,45 * * * * \/usr\/sbin\/screencapture -Cd -tjpg <i>\/Applications\/MAMP\/htdocs\/<\/i>screen-`date +\"\\%Y\\%m\\%d-\\%H\\%M\"`.jpg<br \/>\n<\/code><\/p>\n<p> &#8230; for the current day in question and if existant show &#8230;<\/p>\n<ol>\n<li>a date and time stamp +<\/li>\n<li>the snapshot of what you were doing at the quarter hour, that is clickable to make bigger for more in depth viewing +<\/li>\n<li>an HTML textarea element in which you can optionally type in more specifics about that quarter hour<\/li>\n<\/ol>\n<p>So, as much as we like to think of Mac OS X Terminal application&#8217;s <a target=_blank title='Berkeley Software Distribution information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/Berkeley_Software_Distribution'>BSD<\/a> (a unix derivative) operating system, as being a lot like Linux, there are some commands and usage that &#8230;<\/p>\n<ul>\n<li>adds Mac OS X specific command line functionality to a Linux or unix base set of functionality, like for today&#8217;s <a target=_blank title='screencapture command information from Apple' href='https:\/\/developer.apple.com\/legacy\/library\/documentation\/Darwin\/Reference\/ManPages\/man1\/screencapture.1.html'><i>screencapture<\/i><\/a> command &#8230; and we&#8217;ve included another such example, below, with the command <a target=_blank title='say command information from Apple' href='https:\/\/developer.apple.com\/legacy\/library\/documentation\/Darwin\/Reference\/ManPages\/man1\/say.1.html'><i>say<\/i><\/a> featuring in <a title='Mac OS X Text to English Speech Primer Tutorial' href='#moxttspt'>Mac OS X Text to English Speech Primer Tutorial<\/a> as shown below<\/li>\n<li>changes switches on Linux or unix commands<\/li>\n<li>won&#8217;t have some Linux or unix commands that other platforms do<\/li>\n<\/ul>\n<p>In the great tradition of <i>behoving<\/i> &#8230; we <i>behove<\/i> &#8230; we <i>behove<\/i> thee <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html_GETME\">quarter_hour_timer.html<\/a> if you like, my liege.  On this occasion you&#8217;ll have gleaned that there is no <i>live run<\/i> link, because the RJM Programming web server is not Mac OS X &#8230; so command line <a target=_blank title='screencapture command information from Apple' href='https:\/\/developer.apple.com\/legacy\/library\/documentation\/Darwin\/Reference\/ManPages\/man1\/screencapture.1.html'><i>screencapture<\/i><\/a> has no meaning for a CentOS web server&#8217;s operating system command line.  You&#8217;ll see in the code that rather than use <a target=_blank title='\"Client Pre-emptive Iframe\" at this blog' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/?s=client-pre-emptive-iframe'>&#8220;Client Pre-emptive Iframe&#8221;<\/a> concepts to check for existence of <i>crontab<\/i> screen capture images, we, instead use the <a target=_blank title='Javascript onerror event information from w3schools' href='http:\/\/www.w3schools.com\/jsref\/event_onerror.asp'><i>onerror<\/i><\/a> event for HTML <a target=_blank title='HTML img tag information from w3schools' href='http:\/\/www.w3schools.com\/tags\/tag_img.asp'>img<\/a> elements to check for non-existance.<\/p>\n<p><b><i>Stop Press<\/i><\/b><\/p>\n<p>Just noticed that, perhaps, after all, a <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/quarter_hour_timer.html\">live run<\/a> from the RJM Programming website can make sense if you have a Mac OS X laptop, for instance, that is running that suggested <i>crontab<\/i> entry as explained in tutorial above.  That type of live run managed to latch on to our local <i>crontab<\/i> screencaptures on my MacBook Pro.<\/p>\n<hr>\n<p id='moxttspt'>Previous relevant <a target=_blank title='Mac OS X Text to English Speech Primer Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/mac-os-x-text-to-english-speech-primer-tutorial\/'>Mac OS X Text to English Speech 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\/PHP\/audio_video.html?clickit=submitmb\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Mac OS X Text to English Speech Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/say.jpg\" title=\"Mac OS X Text to English Speech Primer Tutorial\"  style=\"float:left;\"   \/><\/a><p class=\"wp-caption-text\">Mac OS X Text to English Speech Primer Tutorial<\/p><\/div>\n<p>We&#8217;ve got a few new ideas today &#8230;<\/p>\n<ol>\n<li>Text to English Speech via Mac OS X&#8217;s command line <a target=_blank title='say command information from Apple' href='https:\/\/developer.apple.com\/legacy\/library\/documentation\/Darwin\/Reference\/ManPages\/man1\/say.1.html'><i>say<\/i><\/a> command used by PHP via <a target=_blank title='PHP exec() method information' href='http:\/\/php.net\/manual\/en\/function.exec.php'><i>exec<\/i><\/a> to make <a target=_blank title='say.php' href='http:\/\/www.rjmprogramming.com.au\/PHP\/say.php_GETME'>say.php<\/a> (which is useful as a download to a Mac OS X laptop using <a target=_blank title='MAMP for Apache\/PHP\/MySql on Mac OS X local web server' href='http:\/\/www.mamp.info'>MAMP<\/a>) which, today, does not have a live run because the web server of domain <i>rjmprogramming.com.au<\/i> is a CentOS Linux server &#8230; Linux equivalent of Mac OS X&#8217;s <i>say<\/i>? &#8230; read <a target=_blank title='Useful link' href='https:\/\/github.com\/usc-isi-i2\/festival-text-to-speech-service\/blob\/master\/README.md'>here<\/a><\/li>\n<li>Trying to present this brought up the usual movie production problem with <a target=_blank title='iMovie for Mac information from Apple' href='http:\/\/www.apple.com\/au\/mac\/imovie\/'>iMovie<\/a> overlaying the audio on top of the video (though you may want to try, and you could start reading with <a target=_blank title='Semi useful link' href='http:\/\/video.stackexchange.com\/questions\/2579\/can-you-link-an-audio-track-to-a-video-track-in-imovie'>this link<\/a>) versus <a target=_blank title='QuickTime information from Apple' href='https:\/\/support.apple.com\/downloads\/quicktime'>QuickTime Player<\/a> talent to catch both audio and video tracks (and that we ended up using), but not of the &#8220;screen goings on&#8221;, alas versus <a target=_blank title='MPlayer OSX Extended information' href='http:\/\/mplayerosx.ch\/'>MPlayer OSX Extended<\/a> which can play separately but not two tracks on top and doesn&#8217;t do any reconstituting &#8230; so &#8230;<\/li>\n<li>Improved on our inhouse Video\/Audio synchronizing efforts by allowing <a target=_blank title='audio_video.html' href='http:\/\/www.rjmprogramming.com.au\/PHP\/audio_video.html---GETME'>audio_video.html<\/a> supervisor (changed in <a target=_blank title='audio_video.html' href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/audio_video.html---GETME'>this way<\/a>) be able to be called to press one of its preconceived synchronization buttons <i>onload<\/i> which we do with (the newly added) <a target=_blank title='Macbeth Act 1 Scene 1' href='http:\/\/www.rjmprogramming.com.au\/PHP\/audio_video.html?clickit=submitmb'>Macbeth Act 1 Scene 1<\/a> &#8230; in a small <a target=_blank title='Birthday of Shakespeare' href='http:\/\/www.shakespeare.org.uk\/visit-the-houses\/whats-on.html\/birthday-celebrations.html'>celebration<\/a> of the Bard &#8230; who, am thinking (in that Falstaff way), would have got a huge chuckle out of &#8220;anonymous&#8221; instead of &#8220;anon&#8221; during the Three Witches scene &#8230; we <i>had<\/i> to do something to say Happy Birthday<\/li>\n<\/ol>\n<p>Along the way we tried filming the MacBook Pro with the iPad to a <a target=_blank title='YouTube' href='http:\/\/youtube.com'>YouTube<\/a> &#8230;<\/p>\n<p><iframe loading=\"lazy\" width=\"420\" height=\"315\" src=\"https:\/\/www.youtube.com\/embed\/9-Hvlz8g1Mg\" frameborder=\"0\" allowfullscreen><\/iframe><\/p>\n<p> &#8230; but weren&#8217;t happy with the audio quality, alas (too\/two).<\/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='#d21904' onclick='var dv=document.getElementById(\"d21904\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/text-to-speech\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d21904' 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='#d22942' onclick='var dv=document.getElementById(\"d22942\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/time\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d22942' 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='#d22960' onclick='var dv=document.getElementById(\"d22960\"); 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='d22960' 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='#d54161' onclick='var dv=document.getElementById(\"d54161\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/intranet\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d54161' 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='#d54183' onclick='var dv=document.getElementById(\"d54183\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/iptc\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d54183' 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='#d54189' onclick='var dv=document.getElementById(\"d54189\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/calendar\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d54189' 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='#d54197' onclick='var dv=document.getElementById(\"d54197\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/localStorage\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d54197' 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='#d54220' onclick='var dv=document.getElementById(\"d54220\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/contenteditable\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d54220' 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='#d54228' onclick='var dv=document.getElementById(\"d54228\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/download\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d54228' 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='#d54235' onclick='var dv=document.getElementById(\"d54235\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/windows\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d54235' 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='#d54243' onclick='var dv=document.getElementById(\"d54243\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/iframe\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d54243' 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='#d54269' onclick='var dv=document.getElementById(\"d54269\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/aesthetics\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d54269' 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='#d56423' onclick='var dv=document.getElementById(\"d56423\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/intranet\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d56423' 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='#d56464' onclick='var dv=document.getElementById(\"d56464\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/audio\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d56464' 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='#d56475' onclick='var dv=document.getElementById(\"d56475\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/share\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d56475' 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='#d56483' onclick='var dv=document.getElementById(\"d56483\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/personalization\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d56483' 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='#d56488' onclick='var dv=document.getElementById(\"d56488\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/broadcast\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d56488' 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='#d56496' onclick='var dv=document.getElementById(\"d56496\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/applescript\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d56496' 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='#d56522' onclick='var dv=document.getElementById(\"d56522\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/visibility\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d56522' 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='#d56532' onclick='var dv=document.getElementById(\"d56532\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/clock\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d56532' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Today&#8217;s blog posting&#8217;s underlying SVG Network Clock web application (we last talked about with Colour Wheel Size and Spoke Colour Tutorial&#8217;>Colour Wheel Size and Spoke Colour Tutorial) shares a couple of commonalities with yesterday&#8217;s MAMP Timekeeping Web Application Visibility Tutorial, &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/svg-network-clock-minimize-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,17,37],"tags":[88,1933,301,302,4045,354,409,448,549,576,3798,652,3217,4044,932,997,1226,2001,1279,1319,1404],"class_list":["post-56532","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-gui","category-tutorials","tag-api","tag-clock","tag-date","tag-datetime","tag-documentelement","tag-dom","tag-external-javascript","tag-focus","tag-gui","tag-html","tag-information","tag-javascript","tag-minimize","tag-page-visibility-api","tag-php","tag-programming","tag-svg","tag-tab","tag-time","tag-tutorial","tag-web-browser"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/56532"}],"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=56532"}],"version-history":[{"count":7,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/56532\/revisions"}],"predecessor-version":[{"id":56539,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/56532\/revisions\/56539"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=56532"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=56532"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=56532"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}