WordPress Blog Web Share API Sharing Tutorial
โœ‚๐Ÿƒ๐Ÿพโ€โ™€๏ธ๐Ÿƒ๐Ÿผโ€โ™‚๏ธ
๐Ÿ“–

WordPress Blog Web Share API Sharing Tutorial

WordPress Blog Web Share API Sharing Tutorial

It was pretty exciting discovering a bit about the Web Share API we first talked about with MAMP Timekeeping Web Application Web Share API Tutorial some time ago now. It has two modus operandi talents โ€ฆ

  • sharing links in many communication choices, such as, on this macOS MacBook Air (out of the box) โ€ฆ
    1. Mail
    2. Messages
    3. AirDrop
    4. Notes
    5. Reminders
  • sharing documents as attachments in many communication choices, such as, on this macOS MacBook Air (out of the box) โ€ฆ
    1. Mail
    2. Messages
    3. AirDrop
    4. Notes
    5. Reminders

Alas, this Web Share API, across the browsers and platforms, is only reliable about the first modus operandi above, for which we add to this WordPress Blogโ€™s functionality via, in the TwentyTen Themeโ€™s header.php โ€ฆ

Calling the Web Share API
<?php


echo "<script type=text/javascript src=/web_share_api_test.js?populate=as_necessary9876&rand=" . rand(0,786756) . " defer>/script>";


?>
New emoji button ๐Ÿ‘ฅ (&#128101;) up the top for URL link sharing via the Web Share API
<?php echo โ€


function mlater() {

if (onlok) {

if (1 == 1 || navigator.userAgent.match(/Android|BlackBerry|iPhone|iPod|Opera Mini|IEMobile/i)) {

if (dbihis == '') { dbihis=document.body.innerHTML; }

var xstih=document.getElementById('site-title').innerHTML;

if (xstih.indexOf("up" + "top") == -1) {

document.getElementById('site-title').innerHTML+='<?php echo doisr(); ?>' + '<a id="avs" style="text-decoration:none;font-size:<?php global $fns; echo $fns; ?>px;" href=# onmouseover="getVisualSynopsis(event);" onmouseout="yehbut();" ontouchstart="getVisualSynopsis(event);" ontouchend="yehbut();" onclick=" uptop(); " title="... you can wait for the long hover functionality about Visual Synopsis (Slideshows)">&#127910;</a> <button onclick="atclick();" id="share" type="button" title="Share your media or documents or link!" style="display:inline-block;">&#128101;</button> <a style="cursor:pointer;text-decoration:none;font-size:<?php global $fns; echo $fns; ?>px;" onclick="diffphpfix(this);" title="Code Difference Functional Links">&#128214;</a> <a style="cursor:pointer;text-decoration:none;font-size: 22px;" onclick="popselid();" title="Filter Content via Div ID">&#10135;</a> <a style="cursor:pointer;text-decoration:none;visibility:hidden;font-size:<?php global $fns; echo $fns; ?>px;" title="Blog post contents reduced to summary" id="eds" onclick="pre_details_summary();">&#10134;</a>' + printscreen(0);

if (document.URL.indexOf("visualsynopsis=") != -1) document.getElementById('avs').click();

}

}

}

}


โ€œ; ?>
But a great feature Safari web browsers allow for is a Right Click option Shareโ€ฆ
Allowing an attachment of the media right clicked on be modelled to the user after their communication choice is selected.

That last option is so good, but donโ€™t expect email subject fields be filled out for you. Apparently that is a security issue. Otherwise, the contextual aspects to sharing on this WordPress Blog have been improved considerably via thechanged web_share_apiโšซjs external Javascript usage.



Previous relevant MAMP Timekeeping Web Application Web Share API Tutorial is shown below.

MAMP Timekeeping Web Application Web Share API Tutorial

MAMP Timekeeping Web Application Web Share API Tutorial

Adding onto yesterdayโ€™s MAMP Timekeeping Web Application Audio Commentary Tutorial โ€ฆ

  • Timekeeping Web Application newish Text to Audio (via macOS say via MAMP โ€œIntranet feelโ€) โ€ฆ today, we have โ€ฆ
  • Timekeeping Web Application new Web Share API (public domain Document Root external Javascript Web Share API) Javascript logic

This got us decoupling what can become โ€ฆ

โ€ฆ but as weโ€™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) โ€ฆ


Previous relevant MAMP Timekeeping Web Application Audio Commentary Tutorial is shown below.

MAMP Timekeeping Web Application Audio Commentary Tutorial

MAMP Timekeeping Web Application Audio Commentary Tutorial

The recent MAMP Timekeeping Web Application PHP Notifications Tutorialโ€˜s Timekeeping via Screenshots changedHTML and Javascript quarter_hour_timerโšซhtml (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) Web Application supervisor is another very suitable candidate for interfacing to our recent Webpage Audio Commentary functionality. Both โ€ฆ

โ€ฆ share an โ€ฆ

  • underlying macOS or Mac OS X operating system dependence โ€ฆ
  • underlying local web server such as MAMP โ€ฆ
  • downloaded into that local web server Document Root folder PHP code

โ€ฆ set of interest points for full and useful functionality, because of two macOS or Mac OS X commands, respectively โ€ฆ

We add thechanged macos_say_recordโšซjs external Javascript call into the supervisory HTML and Javascript <head></head> webpage section via โ€ฆ



<script type='text/javascript' src='//www.rjmprogramming.com.au/macos_say_record.js?ongoing=1721156687576' defer></script>

โ€ฆ sitting up at the Document Root of your public domain, that โ€œ?ongoing=โ€ based $_GET[โ€˜ongoingโ€™] argument deliberate, effectively asking the code to look out for โ€œon the flyโ€ HTML elements created within an execution run of the webpage.

We add some โ€œsmartsโ€ to those global data attribute usage we talked about at Webpage macOS Say Audio Commentary Access Count Tutorial, allowing some โ€œdate extractionโ€ templating via the supervisory HTML and Javascript array declaration as per โ€ฆ



<script type='text/javascript'>

var commentary_array=['textarea', 'You can enter comments about this screenshot here %value%outerHTML%@yyyymmdd%hhmm%.', 'img', 'Timekeeper screenshot here %id%@yyyymmdd%hhmm%.'];

</script>

โ€ฆ where the first field describes an HTML element attribute to first look at, the optional second is a stand by attribute, followed by โ€œdate extractionโ€ fields to match with numerical data found so as to substitute the blue parts with a โ€œdate and timestampโ€ string.


Previous relevant MAMP Timekeeping Web Application PHP Notifications Tutorial is shown below.

MAMP Timekeeping Web Application PHP Notifications Tutorial

MAMP Timekeeping Web Application PHP Notifications Tutorial

Today weโ€™re revisiting the macOS (or Mac OS X) or Windows timekeeping web application of 2016โ€™s Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics Tutorial. Why? Well, given our recent work with Notifications API based web applications you can read about at Notification API Hidden Popup Tutorial, the timekeeping one is a great candidate for functionality improvement here, it being a web application that โ€ฆ

  • can work behind the scenes โ€ฆ
  • not necessarily frontmost โ€ฆ but benefitting from any โ€ฆ
  • 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

This needs PHP to work and it needs real access via PHP exec 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 MAMP one) as per โ€ฆ

  1. thechanged quarter_hour_timerโšซphp (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) Timekeeping Web Application suited to macOS (or Mac OS X) โ€œscreencaptureโ€ command line usage
  2. the unchanged (from tutorial below, supervisory HTML and Javascript) quarter_hour_timerโšซhtml (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) Timekeeping Web Application
  3. theโ€œhow we got thereโ€ PHP notifications_ideasโšซphp (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] subfolder) Notification API functionality PHP web application

โ€ฆ in what we like to call an โ€œIntranet feelingโ€ scenario.

Up at the public RJM Programming domain, as far as the Notification API functionality supervisor webpage goes, thechanged HTML and Javascript notifications_ideasโšซhtml Notification API functionality HTML and Javascript web application is worth trying.


Previous relevant Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics Tutorial is shown below.

Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics Tutorial

Mac OS MAMP Timekeeping Web Application PHP Calendar Aesthetics Tutorial

To finish up our revisit to the Timekeeping web application of the recent Mac OS MAMP Timekeeping Web Application PHP Calendar Iframe Tutorial we โ€ฆ

  • make some styling calendar tweaks โ€ฆ


    <style>

    td { vertical-align: top; }

    #divmc { background-color: #ffffff; }

    p:not(:empty) { border: 1px dotted red; }

    td { text-align: center; vertical-align: top; }

    th { background-color: cyan; }

    #thyear { background-color: pink; }

    div { word-wrap: break-word; }

    .adaNOte { border: 3px solid pink; border-radius: 7px; }

    a.adate { border:2px solid transparent; background-color:lightgreen; border-radius:50px; }


    </style>

  • settle for mobile platforms never being able to screenshot, on this round of looking, and redirecting to the โ€œMonthly Chroniclerโ€ web application (of (the unchanged) monthly_chroniclerโšซhtml we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) โ€ฆ


    <script>

    if (navigator.userAgent.match(/Android|BlackBerry|iPhone|iPod|iPad|Opera Mini|IEMobile/i)) {

    document.write("<scri" + "pt> location.href='./monthly_chronicler.html'; </scr" + "ipt> <style> a.adate { border:1px solid green; background-color:#f0f0f0; border-radius:50px; } </style> <table id=mtable style=display:none;width:95%;><tr><th><input style=width:450px; placeholder='' id=iask type=text value=''></input><</th><th><input onclick=\" document.getElementById('mtable').style.display='none'; document.getElementById('mybod').style.opacity='1.0'; postask(document.getElementById('iask'));\" type=button value=OK></input></th><th><input onclick=\"document.getElementById('iask').value=''; document.getElementById('mtable').style.display='none'; document.getElementById('mybod').style.opacity='1.0'; \" type=button value=Cancel></input></th></tr></table>");

    }

    </script>


    โ€ฆ dumbing down, but working more reliably, using โ€œJavascript writes Javascriptโ€ methodology

Again, feel free to try thechanged quarter_hour_timerโšซhtml (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) Timekeeping Web Application suited to macOS (or Mac OS X) โ€œscreencaptureโ€ command line usage, is helped out by a โ€œmobileplatform checkโ€ changed quarter_hour_timerโšซphp PHP (we ask you to download to MAMPโ€˜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.


Previous relevant Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial is shown below.

Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial

Mac OS MAMP Timekeeping Web Application PHP Calendar Windows Tutorial

Did you notice that the โ€œTimekeepingโ€ PHP did not have to change for yesterdayโ€™s Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial?

But the PHP is thechange agent for Windows (client) integration called quarter_hour_timerโšซphp today โ€ฆ

<?php


// blah top

$lportbit=":8888";



$user_agent = $_SERVER["HTTP_USER_AGENT"];

function getOS() { // thanks to https://www.daniweb.com/programming/web-development/threads/495588/getting-users-os-info-out-of-server-http-user-agent

global $user_agent, $lportbit;

$os_platform = "win Unknown OS Platform";

$os_array = array(

'/windows nt 10/i' => 'Windows 10',

'/windows nt 6.3/i' => 'Windows 8.1',

'/windows nt 6.2/i' => 'Windows 8',

'/windows nt 6.1/i' => 'Windows 7',

'/windows nt 6.0/i' => 'Windows Vista',

'/windows nt 5.2/i' => 'Windows Server 2003/XP x64',

'/windows nt 5.1/i' => 'Windows XP',

'/windows xp/i' => 'Windows XP',

'/windows nt 5.0/i' => 'Windows 2000',

'/windows me/i' => 'Windows ME',

'/win98/i' => 'Windows 98',

'/win95/i' => 'Windows 95',

'/win16/i' => 'Windows 3.11',

'/macintosh|mac os x/i' => 'Mac OS X',

'/mac_powerpc/i' => 'Mac OS 9',

'/linux/i' => 'Linux',

'/ubuntu/i' => 'Ubuntu',

'/iphone/i' => 'iPhone',

'/ipod/i' => 'iPod',

'/ipad/i' => 'iPad',

'/android/i' => 'Android',

'/blackberry/i' => 'BlackBerry',

'/webos/i' => 'Mobile'

);



foreach ($os_array as $regex => $value) {



if (preg_match($regex, $user_agent)) {

$os_platform = $value;

}



}



return $os_platform;

}



$callornot="call ";

$precmds="";

$impreexe="screenCapture"; //"import";

$switches=""; //" -window root ";

if (substr(strtoupper(getOS()),0,3) === 'WIN') {

$lportbit="";

if (file_exists($_SERVER['DOCUMENT_ROOT'] . "\\" . $impreexe . ".exe")) {

$precmds=$_SERVER['DOCUMENT_ROOT'] . "\\";

} else {

foreach (glob("C:\\Users\\*\\" . $impreexe . ".exe") as $infl) {

$precmds=explode($impreexe . ".exe", $infl)[0];

}

}

}


// blah blah some other PHP functions



if (isset($_GET['yourta'])) {

// calendar work

} else if (isset($_GET['myta'])) {

// embed image metadata

} else if (isset($_POST['myta'])) {

// parse image metadata

} else if ($lportbit != "") {

exec("/usr/sbin/screencapture -Cd -tjpg " . $_SERVER['DOCUMENT_ROOT'] . "/screen-`date +\"%Y%m%d-%H%M\"`.jpg");

} else {

if (isset($_GET['tz'])) {

$tzis=str_replace('+','_',urldecode($_GET['tz']));

if (strpos($tzis, "/") !== false) { date_default_timezone_set($tzis); }

}

$dateis = date('Ymd-Hi');

if (file_exists($_SERVER['DOCUMENT_ROOT'] . "\\screenCapture.jpg")) {

exec('copy ' . '"' . $_SERVER['DOCUMENT_ROOT'] . "\\screenCapture.jpg" . '" "' . $_SERVER['DOCUMENT_ROOT'] . "\\screen-" . $dateis . '.jpg"');

// exec('erase ' . '"' . $_SERVER['DOCUMENT_ROOT'] . "\\screenCapture.jpg" . '"');

} else {

exec($callornot . '"' . $precmds . $impreexe . '.exe" ' . $switches . ' "' . $_SERVER['DOCUMENT_ROOT'] . "\\screen-" . $dateis . '.jpg"');

}

}


exit;


?>

โ€ฆ which you may glean has a Windows โ€œfallbackโ€ position (with that โ€œcopyโ€ codeline). Why? Well, we found a .Net framework โ€œexe creation via batโ€ using ScreenCaptureโšซbat (thanks to this useful link) created black screen shots. Probably a privilege thing or PHP exec thing, but weโ€™ve opted for the workaround, which is just โ€œWindows talkโ€ โ€ฆ

  • write Windows batch scapcontinuousโšซbat as a continuous fifteen minute user of the .Net Framework (ScreenCapture.exe) derived from above
  • set up a task via โ€œTask Schedularโ€ (please ignore the warts โ€˜n all โ€œgarden pathโ€ schtask ideas in the video below) that has an action โ€œC:\MAMP\htdocs\scapcontinuous.batโ€ 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

Take a more detailed look at โ€œwarts โ€˜n allโ€ crab progression towards the Windows (client) solution, below โ€ฆ


Previous relevant Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial is shown below.

Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial

Mac OS MAMP Timekeeping Web Application PHP Calendar iCal Integration Tutorial

Yesterdayโ€™s Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorialโ€˜s โ€œCalendar Pastโ€ improvements donโ€™t have to be the end of the story regarding โ€œcalendar timingsโ€. There is an Apple iCal standard interfacing format that can drive calendar integrations with many well known online Calendar applications.

You may recall us talking about this with Calendar Location Services Integration Tutorial and we tweak thechanged ics_attachmentโšซphp (which weโ€™d ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œPHPโ€ subfolder) and its standalone ical creator to better integrate with thechanged quarter_hour_timerโšซhtml (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) Timekeeping Web Application suited to macOS (or Mac OS X) โ€œscreencaptureโ€ command line usage.

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 โ€ฆ

โ€ฆ 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 โ€ฆ



function icalpostit(tl, tg) {

var today = new Date();

var dd = today.getDate();

var mm = today.getMonth()+1; //January is 0!

var yyyy = today.getFullYear();

var hh = today.getHours();

var minm = today.getMinutes(); //January is 0!

//if (icalavailable) { alert('is ' + ('' + yyyy + ('00' + mm).slice(-2) + ('00' + dd).slice(-2) ) + ' >= ' + tl.substring(1)); }

if ((document.getElementById('yics').value.indexOf('all') != -1 || tl.substring(1) >= ('' + yyyy + ('00' + mm).slice(-2) + ('00' + dd).slice(-2) )) && icalavailable && document.getElementById('yics').value != '') {

if (document.getElementById('yics').value.indexOf('nw') != -1) {

icald=tl.substring(1) + ':' + ('00' + hh).slice(-2) + ('00' + minm).slice(-2) + '59';

icalg=tg;

if (icalwo != null) { icalwo.close(); icalwo=null; }

icalwo=window.open('../PHP/ics_attachment.php','_blank','top=100,left=100,width=740,height=800');

if (1 == 1) {

setTimeout(icalw, 3000);

} else {

icalwo.document.getElementById('datestart').value=icald;

icalwo.document.getElementById('dateend').value=icald;

icalwo.document.getElementById('eventwords').value=icalg.replace(/\<br\>/g, String.fromCharCode(10)).replace(/\<Br\>/g, String.fromCharCode(10)).replace(/\<BR\>/g, String.fromCharCode(10));

if (document.URL.indexOf('localhost') != -1) {

var jcald=icalg.replace(/\<br\>/g, String.fromCharCode(10)).replace(/\<Br\>/g, String.fromCharCode(10)).replace(/\<BR\>/g, String.fromCharCode(10)).replace(/\ \;>/g, ' ');

while (jcald.indexOf(String.fromCharCode(10)) != -1) { jcald=jcald.replace(String.fromCharCode(10),' '); }

icalwo.document.getElementById('title').value=jcald;

} else {

icalwo.document.getElementById('title').value='Calendar event at ' + icald;

}

icalwo.document.getElementById('description').value='Calendar event at ' + icald;

icalwo.document.getElementById('address').value=document.URL.split('?')[0].split('#')[0];

icalwo.document.getElementById('mmdatestart').value=icald.substring(4,6);

icalwo.document.getElementById('mmdateend').value=icald.substring(4,6);

icalwo.document.getElementById('dddatestart').value=icald.substring(6,8);

icalwo.document.getElementById('dddateend').value=icald.substring(6,8);

icalwo.document.getElementById('ssdatestart').value='59';

icalwo.document.getElementById('ssdateend').value='59';

icalwo.document.getElementById('yyyydatestart').value=icald.substring(0,4);

icalwo.document.getElementById('yyyydateend').value=icald.substring(0,4);

if ( ('' + today.getTimezoneOffset()).replace('null','').replace('undefined','') != '' ) {

//alert(('' + eval(eval('' + qd.getTimezoneOffset()) / 60.0)).replace('.00','').replace('.0',''));

icalwo.document.getElementById('tz').value=('' + eval(eval('' + today.getTimezoneOffset()) / 60.0)).replace('.00','').replace('.0','');

}

//icalwo.document.getElementById('pform').onsubmit=function() { window.opener.document.getElementById('icalstatus').innerHTML=' '; return true; };



}

} else if (document.getElementById('yics').value.indexOf('if') != -1) {

icald=tl.substring(1) + ':' + ('00' + hh).slice(-2) + ('00' + minm).slice(-2) + '59';

icalg=tg;

document.getElementById('divics').style.display='block';

document.getElementById('divics').style.width='100%';

document.getElementById('divics').style.height='800px';

document.getElementById('icslocit').style.display='block';

document.getElementById('icslocit').style.width='100%';

document.getElementById('icslocit').style.height='800px';

document.getElementById('icslocit').src='../PHP/ics_attachment.php?rand=' + Math.floor(Math.random() * 19876564);

} else {

var xzhr = new XMLHttpRequest();

var xform=new FormData();

xform.append('icald',tl.substring(1) + ':' + ('00' + hh).slice(-2) + ('00' + minm).slice(-2) + '59');

xform.append('icalc',tg);

xzhr.open('post','./quarter_hour_timer.php',true);

xzhr.send(xform);

}

}

}


Previous relevant Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorial is shown below.

Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorial

Mac OS MAMP Timekeeping Web Application PHP Calendar Contenteditable Tutorial

Weโ€™ve spoken quite a bit in the past about the joys of involving the โ€œcontenteditable=trueโ€ attribute for HTML elements that have an โ€œinnerHTMLโ€ (ie. they have a formalized end tag arrangement eg. div, span, p, td, th etcetera) and with todayโ€™s work which extends that started with yesterdayโ€™s Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial it is the turn of a set of โ€œpโ€ elements it helps out today.

The scenario is that yesterdayโ€™s work did not allow for โ€œorphaned screenshotsโ€ of the past be allowed to be brought back into play to โ€œannotate themโ€ and in so doing โ€œgive them a homeโ€. This led us to โ€ฆ

  • allow for a new โ€œInfill Earlier Days All Screenshotsโ€ button augment yesterdayโ€˜s โ€œInfill Earlier Days Just Annotated Screenshotsโ€ button โ€ฆ
  • the pressing of that new โ€œInfill Earlier Days All Screenshotsโ€ button causes all screenshot 15 minute entries relevant to the current year be displayed in the calendar โ€ฆ but then it occurred to us users might want to โ€œannotate themโ€ โ€ฆ but how? โ€ฆ
  • in the PHP we introduced code โ€ฆ
    <?php


    if (isset($_GET['yourta'])) {

    $dru="//" . $_SERVER['SERVER_NAME'] . "" . str_replace("~","",str_replace(":443~","",str_replace(":80~","",(":" . $_SERVER['SERVER_PORT'] . "~")))) . "/";

    $cet="";

    if (strlen($_GET['yourta']) != 0) { $cet=" contenteditable=true onblur=repostit(this); onfocus=wopen(event,false); "; }


    // blah blah blah

    $ccpre="" . $cet . " 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) . ">";

    // blah blah blah

    }


    ?>
    โ€ฆ to, when an โ€œorphanedโ€ screen shot image is happened upon, allows โ€ฆ
  • contenteditable=true โ€œdoes its stuffโ€ turning might might have been a pretty unintelligent HTML element into a โ€œtextareaโ€ type collector of user input, and then that onblur event logicโ€™s โ€œmidair feelingโ€ Ajax/FormData โ€œrecursive feelingโ€ methodology โ€ฆ


    function repostit(ih) {

    var ihis=(ih.innerText || ih.contentWindow || ih.contentDocument);

    var pathpart=ih.id;

    if (ihis != '') {

    var xzhr = new XMLHttpRequest();

    var xform=new FormData();

    xform.append('myta',ihis);

    xform.append(pathpart.split('.')[0].replace('ip_','screen-').replace('_','-'),'');

    xzhr.open('post','./quarter_hour_timer.php',true);

    xzhr.send(xform);

    }

    }


    โ€ฆ which can cement that (newly user entered) annotation into future permanency in the โ€œYearly Report Calendarโ€ section

โ€ฆ of thechanged quarter_hour_timerโšซhtml (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) Timekeeping Web Application suited to macOS (or Mac OS X) โ€œscreencaptureโ€ command line usage, is helped out by a contenteditable=truechanged quarter_hour_timerโšซphp PHP (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) for you to try out on your MAMP macOS environment.


Previous relevant Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial is shown below.

Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial

Mac OS MAMP Timekeeping Web Application PHP Calendar Past Tutorial

If youโ€™ve been using the Timekeeping web application as of yesterdayโ€™s Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial you would have noticed a very โ€ฆ

  • first person
  • present tense

โ€ฆ feel to it all. Today, we improve on the latter โ€œrestrictivenessโ€ issue, within yesterdayโ€™s โ€œYearly Report Calendarโ€ new functionality, by looking back into the current calendar yearโ€™s โ€œpastโ€ with respect to the date of using the web application, whether that be โ€ฆ

  • screen captures from days in the current calendar yearโ€™s โ€œpastโ€
  • text entries made and remembered (in window.localStorage) in the current calendar yearโ€™s โ€œpastโ€

โ€ฆ to infill and flesh out that โ€œYearly Report Calendarโ€ better. This involved bringing over a lot of (the unchanged) monthly_chroniclerโšซhtmlโ€˜s Javascript logic into thechanged quarter_hour_timerโšซhtml (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) Timekeeping Web Application suited to macOS (or Mac OS X) โ€œscreencaptureโ€ command line usage, is helped out by a calendarโ€™spast integrationally changed quarter_hour_timerโšซphp PHP (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) for you to try out on your MAMP macOS environment.

<?php


// quarter_hour_timer.php

// RJM Programming

// December, 2021



if (isset($_GET['yourta'])) {

$dru="HTTP://" . $_SERVER['SERVER_NAME'] . "" . str_replace("~","",str_replace(":443~","",str_replace(":80~","",(":" . $_SERVER['SERVER_PORT'] . "~")))) . "/";

$contis=str_replace('+',' ',urldecode($_GET['yourta']));

//file_put_contents('xx.xx', $contis);

$htmlis='';

$myf='';

$backi='';

$cali='';

$taback='';

$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)))) . "'";

if (substr(($bcontis . ' '),0,3) == "' + ") { $bcontis=$bcontis.substr(3); }

if (substr((' ' . $bcontis),-3,3) == " + '") { $bcontis=$bcontis.substr(0,(-3 + strlen($bcontis))); }

foreach ($_GET as $name=>$val) {

if ($name != 'yourta') { // && $val == '') {

//echo $name;

$orig=$name;

$myf=$name;

for ($imh=12; $imh>=1; $imh--) {

for ($idd=31; $idd>=1; $idd--) {

//file_put_contents('xz.xz',$orig . ' Is ' . substr('00' . $imh,-2,2) . substr('00' . $idd,-2,2) . ' less than ' . $val);

if (substr('00' . $imh,-2,2) . substr('00' . $idd,-2,2) < $val) {

for ($ihh=0; $ihh<=23; $ihh++) {

for ($imm=0; $imm<=45; $imm+=15) {

//if ($ihh != 0 || $imm != 0) {

$myf=str_replace("0101_", substr('00' . $imh,-2,2) . substr('00' . $idd,-2,2) . "_",$orig);

$myf=str_replace("_0000", "_" . substr('00' . $ihh,-2,2) . substr('00' . $imm,-2,2),$myf);

//}

$taback=str_replace('-','_',str_replace('itd','tatd',$myf));

$backi=str_replace('-','_',str_replace('screen-','itd_',$myf));

$cali=str_replace('-','',str_replace('screen-','td',$myf));

$idcali=explode('-',explode('_',str_replace('screen-','td',str_replace('itd_','td',$myf)))[0])[0];



// Thanks to https://doc.bccnsoft.com/docs/php-docs-7-en/function.iptcembed.html



// Path to jpeg file

$path = $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . str_replace('_','-',str_replace('itd_','screen-',$myf)) . '.jpg';

//file_put_contents('x.x',$path);

if (file_exists($path)) {

$capt = ""; // Thanks to https://www.php.net/manual/en/function.iptcparse.php

$size = getimagesize( $path, $info );

if (isset($info["APP13"])) {

//file_put_contents('xx.xx',$path);

if ($iptc = iptcparse( $info["APP13"] ) ) {

//file_put_contents('xxx.xxx',$path);

$capt = str_replace( "\000", "", $iptc["2#120"][0] );

//file_put_contents('xxxx.xxxx',$capt);

}

}

$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)))) . "";

$ccpre="<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) . ">";

$ccpost="</p>";

$ccontis="<br><p style='background-color:orange; title='" . str_replace('td','p',$cali) . "' id=" . str_replace('td','p',$cali) . ">" . str_replace(chr(34), "' + String.fromCharCode(34) + '", str_replace("\n", "<br>", str_replace("\r\n", "<br>", str_replace("'", "' + String.fromCharCode(39) + '", $capt)))) . "</p>";

//file_put_contents('xxxxx.xxxxx',$bcontis);

//file_put_contents('xxxxxx.xxxxxx',$taback . ' ... ' . $backi);

//file_put_contents('xxxxxxx.xxxxxxx',"parent.document.getElementById('" . $backi . "').title='" . $bcontis . "'; parent.document.getElementById('" . $taback . "').value='" . $bcontis . "'; ");



}



if ($bcontis != "''" && $bcontis != "") {

if ($htmlis == '') {

$htmlis="<html><head><script type=text/javascript> 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'); } }</script></head><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),'<br>'); } parent.document.getElementById('" . $idcali . "').innerHTML+=huhg; } \"></body></html>";

} else if (strpos($htmlis, $bcontis) === false) {

$htmlis=str_replace("+=huhg; }", "+=huhg; huhg='" . $ccpre . $bcontis . $ccpost . "'; while (huhg.indexOf(String.fromCharCode(10)) != -1) { huhg=huhg.replace(String.fromCharCode(10),'<br>'); } parent.document.getElementById('" . $idcali . "').innerHTML+=huhg; }", $htmlis);

}

}



}

}



if ($htmlis != "") { echo $htmlis; }



}

}

}

}

}

}


// blah else if blah else if blah


?>

โ€ฆ which you may notice implements a โ€œlong hoverโ€ window.open scenario (using non-mobile platforms) for screenshot images on the calendar by combining the use of โ€ฆ

  • global variables โ€ฆ


    var imois=null;

    var iwo=null;

  • onmouseover event logic โ€ฆ
    Call
    onmouseover=wopen(event,true);
  • setTimeout delays โ€ฆ
    Called


    function wopen(event,overvsout) {

    if (!overvsout) {

    if (imois == event.target) {

    imois=null;

    }

    return;

    }

    imois=event.target;

    setTimeout(postwopen, 2000);

    }




    function postwopen() { //pois) {

    if (imois) {

    var pois=imois;

    if (pois.outerHTML.indexOf('URL(') != -1) {

    if (iwo) { iwo.close(); iwo=null; }

    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');

    }

    }

    }

  • onmouseout event logic โ€ฆ
    Call
    onmouseout=wopen(event,false);

โ€ฆ so that this logic is not responsible for clobbering the default โ€œhoverโ€ shows of the โ€œpโ€ element โ€œtitleโ€ attribute with the onmouseover event for non-mobile platforms.


Previous relevant Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial is shown below.

Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial

Mac OS MAMP Timekeeping Web Application PHP Calendar Tutorial

Okay then, yesterdayโ€™s Mac OS MAMP Timekeeping Web Application PHP Image Metadata Tutorial โ€œimage metadata smartsโ€ puts us in a position to get onto the โ€œbells and whistlesโ€ side of our Timekeeping (macOS and Mac OS X only at this stage) web application. We channel the calendar display talents of Monthly Chronicler LocalStorage Tutorial in thought and act (its web application is opened in an iframe โ€ฆ hence our need to ask you to download monthly_chroniclerโšซhtml to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) to offer a new (โ€œrevealโ€) piece of details/summary hosted โ€œYearly Report Calendarโ€ functionality.

<?php


// quarter_hour_timer.php

// RJM Programming

// December, 2021



// iptc_make_tag() function by Thies C. Arntzen

function iptc_make_tag($rec, $data, $value) {

$length = strlen($value);

$retval = chr(0x1C) . chr($rec) . chr($data);



if($length < 0x8000)

{

$retval .= chr($length >> 8) . chr($length & 0xFF);

}

else

{

$retval .= chr(0x80) .

chr(0x04) .

chr(($length >> 24) & 0xFF) .

chr(($length >> 16) & 0xFF) .

chr(($length >> 8) & 0xFF) .

chr($length & 0xFF);

}



return $retval . $value;

}



if (isset($_GET['myta'])) {

$dru="HTTP://" . $_SERVER['SERVER_NAME'] . "" . str_replace("~","",str_replace(":443~","",str_replace(":80~","",(":" . $_SERVER['SERVER_PORT'] . "~")))) . "/";

$contis=str_replace('+',' ',urldecode($_GET['myta']));

//file_put_contents('xx.xx', $contis);

$myf='';

$backi='';

$cali='';

$taback='';

$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)))) . "'";

if (substr(($bcontis . ' '),0,3) == "' + ") { $bcontis=$bcontis.substr(3); }

if (substr((' ' . $bcontis),-3,3) == " + '") { $bcontis=$bcontis.substr(0,(-3 + strlen($bcontis))); }

foreach ($_GET as $name=>$val) {

if ($name != 'myta' && $val == '') {

//echo $name;

$myf=$name;

$taback=str_replace('-','_',str_replace('itd','tatd',$myf));

$backi=str_replace('-','_',str_replace('screen-','itd_',$myf));

$cali=str_replace('-','',str_replace('screen-','td',$myf));

$idcali=explode('-',explode('_',str_replace('screen-','td',str_replace('itd_','td',$myf)))[0])[0];




// Thanks to https://doc.bccnsoft.com/docs/php-docs-7-en/function.iptcembed.html



// Path to jpeg file

$path = $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . str_replace('_','-',str_replace('itd_','screen-',$myf)) . '.jpg';

//file_put_contents('x.x',$path);



$capt = ""; // Thanks to https://www.php.net/manual/en/function.iptcparse.php

$size = getimagesize( $path, $info );

if (isset($info["APP13"])) {

//file_put_contents('xx.xx',$path);

if ($iptc = iptcparse( $info["APP13"] ) ) {

//file_put_contents('xxx.xxx',$path);

$capt = str_replace( "\000", "", $iptc["2#120"][0] );

//file_put_contents('xxxx.xxxx',$capt);

}

}

$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)))) . "";

$ccpre="<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) . ">";

$ccpost="</p>";

$ccontis="<br><p style='background-color:orange; title='" . str_replace('td','p',$cali) . "' id=" . str_replace('td','p',$cali) . ">" . str_replace(chr(34), "' + String.fromCharCode(34) + '", str_replace("\n", "<br>", str_replace("\r\n", "<br>", str_replace("'", "' + String.fromCharCode(39) + '", $capt)))) . "</p>";


//file_put_contents('xxxxx.xxxxx',$bcontis);

//file_put_contents('xxxxxx.xxxxxx',$taback . ' ... ' . $backi);

//file_put_contents('xxxxxxx.xxxxxxx',"parent.document.getElementById('" . $backi . "').title='" . $bcontis . "'; parent.document.getElementById('" . $taback . "').value='" . $bcontis . "'; ");



}

if ($bcontis != "''") { echo "<html><body onload=\" parent.document.getElementById('" . $backi . "').title='" . $bcontis . "'; parent.document.getElementById('" . $taback . "').value='" . $bcontis . "'; 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),'<br>'); } parent.document.getElementById('" . $idcali . "').innerHTML+=huhg; } \"></body></html>"; }

}

} else if (isset($_POST['myta'])) {

$dru="HTTP://" . $_SERVER['SERVER_NAME'] . "" . str_replace("~","",str_replace(":443~","",str_replace(":80~","",(":" . $_SERVER['SERVER_PORT'] . "~")))) . "/";

$contis=str_replace('+',' ',urldecode($_POST['myta']));

//file_put_contents('xx.xx', $contis);

$myf='';

$backi='';

$cali='';

$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)))) . "'";




$ccpre="<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) . ">";

$ccpost="</p>";

$ccontis="<br><p style='background-color:orange; title='" . str_replace('td','p',$cali) . "' id=" . str_replace('td','p',$cali) . ">" . str_replace(chr(34), "' + String.fromCharCode(34) + '", str_replace("\n", "<br>", str_replace("\r\n", "<br>", str_replace("'", "' + String.fromCharCode(39) + '", $capt)))) . "</p>";




if (substr(($bcontis . ' '),0,3) == "' + ") { $bcontis=$bcontis.substr(3); }

if (substr((' ' . $bcontis),-3,3) == " + '") { $bcontis=$bcontis.substr(0,(-3 + strlen($bcontis))); }

foreach ($_POST as $name=>$val) {

if ($name != 'myta') {

$myf=$name;

$backi=str_replace('-','_',str_replace('screen-','itd_',$myf));

$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);

$pback=str_replace('tatd','ip',$taback);

$cali=str_replace('-','',str_replace('screen-','td',$myf));

$idcali=explode('-',explode('_',str_replace('screen-','td',str_replace('itd_','td',$myf)))[0])[0];




// Thanks to https://doc.bccnsoft.com/docs/php-docs-7-en/function.iptcembed.html



// Path to jpeg file

$path = $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . $myf . '.jpg';



//file_put_contents('x.x', $path);



// Set the IPTC tags

$iptc = array(

'2#120' => $contis,

'2#116' => 'Copyright 2021, RJM Programming'

);



// Convert the IPTC tags into binary code

$data = '';



foreach($iptc as $tag => $string) {

$tag = substr($tag, 2);

$data .= iptc_make_tag(2, $tag, $string);

}



// Embed the IPTC data

$content = iptcembed($data, $path);



// Write the new image data out to the file.

$fp = fopen($path, "wb");

fwrite($fp, $content);

fclose($fp);



}

echo "<html><body onload=\" parent.document.getElementById('" . $backi . "').title=" . $bcontis . "; 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),'<br>'); } if (parent.document.getElementById('" . $pback . "')) { parent.document.getElementById('" . $pback . "').innerHTML=huhg; } else { parent.document.getElementById('" . $idcali . "').innerHTML+=huhg; } } \"></body></html>";

}

} else {

exec("/usr/sbin/screencapture -Cd -tjpg /Applications/MAMP/htdocs/screen-`date +\"%Y%m%d-%H%M\"`.jpg");

}

exit;


?>

And so, again, ourchanged quarter_hour_timerโšซhtml (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) Timekeeping Web Application suited to macOS (or Mac OS X) โ€œscreencaptureโ€ command line usage, is helped out by a calendarintegrationally changed quarter_hour_timerโšซphp PHP (we ask you to download to MAMPโ€˜s $_SERVER[โ€˜DOCUMENT_ROOTโ€™] โ€œHTMLCSSโ€ subfolder) for you to try out on your MAMP macOS environment.


Previous relevant Mac OS MAMP Timekeeping Web Application PHP Image Metadata Tutorial is shown below.

Mac OS MAMP Timekeeping Web Application PHP Image Metadata Tutorial

Mac OS MAMP Timekeeping Web Application PHP Image Metadata Tutorial

In our opinion, what would make the day before yesterdayโ€™s Mac OS MAMP Timekeeping Web Application PHP Intranet Tutorial โ€œTimekeeping Web Applicationโ€ cooler would be to add to the intelligence of the screen capture images, ahead of other data related improvements to come.

Weโ€™ve spoken in the past about Exif in that respect but PHP has Iptc image metadata functions we can call on โ€ฆ

  • iptcembed to embed new metadata into an existant image from those associated โ€œcaptionโ€ textarea elements we offer
  • iptcparse to extract old metadata from an existant image into those associated โ€œcaptionโ€ textarea elements we offer

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.

And so ourchanged quarter_hour_timerโšซhtml Timekeeping Web Application suited to macOS (or Mac OS X) โ€œscreencaptureโ€ command line usage, is helped out by a muchmore usefully changed quarter_hour_timerโšซphp PHP โ€ฆ

<?php


// quarter_hour_timer.php

// RJM Programming

// December, 2021



// iptc_make_tag() function by Thies C. Arntzen

function iptc_make_tag($rec, $data, $value) {

$length = strlen($value);

$retval = chr(0x1C) . chr($rec) . chr($data);



if($length < 0x8000)

{

$retval .= chr($length >> 8) . chr($length & 0xFF);

}

else

{

$retval .= chr(0x80) .

chr(0x04) .

chr(($length >> 24) & 0xFF) .

chr(($length >> 16) & 0xFF) .

chr(($length >> 8) & 0xFF) .

chr($length & 0xFF);

}



return $retval . $value;

}



if (isset($_GET['myta'])) {

$contis=str_replace('+',' ',urldecode($_GET['myta']));

//file_put_contents('xx.xx', $contis);

$myf='';

$backi='';

$taback='';

$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)))) . "'";

if (substr(($bcontis . ' '),0,3) == "' + ") { $bcontis=$bcontis.substr(3); }

if (substr((' ' . $bcontis),-3,3) == " + '") { $bcontis=$bcontis.substr(0,(-3 + strlen($bcontis))); }

foreach ($_GET as $name=>$val) {

if ($name != 'myta' && $val == '') {

//echo $name;

$myf=$name;

$taback=str_replace('-','_',str_replace('itd','tatd',$myf));

$backi=str_replace('-','_',str_replace('screen-','itd_',$myf));



// Thanks to https://doc.bccnsoft.com/docs/php-docs-7-en/function.iptcembed.html



// Path to jpeg file

$path = $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . str_replace('_','-',str_replace('itd_','screen-',$myf)) . '.jpg';

//file_put_contents('x.x',$path);



$capt = ""; // Thanks to https://www.php.net/manual/en/function.iptcparse.php

$size = getimagesize( $path, $info );

if (isset($info["APP13"])) {

//file_put_contents('xx.xx',$path);

if ($iptc = iptcparse( $info["APP13"] ) ) {

//file_put_contents('xxx.xxx',$path);

$capt = str_replace( "\000", "", $iptc["2#120"][0] );

//file_put_contents('xxxx.xxxx',$capt);

}

}

$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)))) . "";

//file_put_contents('xxxxx.xxxxx',$bcontis);

//file_put_contents('xxxxxx.xxxxxx',$taback . ' ... ' . $backi);

//file_put_contents('xxxxxxx.xxxxxxx',"parent.document.getElementById('" . $backi . "').title='" . $bcontis . "'; parent.document.getElementById('" . $taback . "').value='" . $bcontis . "'; ");



}

if ($bcontis != "''") { echo "<html><body onload=\" parent.document.getElementById('" . $backi . "').title='" . $bcontis . "'; parent.document.getElementById('" . $taback . "').value='" . $bcontis . "'; \"><p>parent.document.getElementById('" . $backi . "').title='" . $bcontis . "'; parent.document.getElementById('" . $taback . "').value='" . $bcontis . "';</p></body></html>"; }

}

} else if (isset($_POST['myta'])) {

$contis=str_replace('+',' ',urldecode($_POST['myta']));

//file_put_contents('xx.xx', $contis);

$myf='';

$backi='';

$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)))) . "'";

if (substr(($bcontis . ' '),0,3) == "' + ") { $bcontis=$bcontis.substr(3); }

if (substr((' ' . $bcontis),-3,3) == " + '") { $bcontis=$bcontis.substr(0,(-3 + strlen($bcontis))); }

foreach ($_POST as $name=>$val) {

if ($name != 'myta') {

$myf=$name;

$backi=str_replace('-','_',str_replace('screen-','itd_',$myf));



// Thanks to https://doc.bccnsoft.com/docs/php-docs-7-en/function.iptcembed.html



// Path to jpeg file

$path = $_SERVER['DOCUMENT_ROOT'] . DIRECTORY_SEPARATOR . $myf . '.jpg';



//file_put_contents('x.x', $path);



// Set the IPTC tags

$iptc = array(

'2#120' => $contis,

'2#116' => 'Copyright 2021, RJM Programming'

);



// Convert the IPTC tags into binary code

$data = '';



foreach($iptc as $tag => $string) {

$tag = substr($tag, 2);

$data .= iptc_make_tag(2, $tag, $string);

}



// Embed the IPTC data

$content = iptcembed($data, $path);



// Write the new image data out to the file.

$fp = fopen($path, "wb");

fwrite($fp, $content);

fclose($fp);



}

echo "<html><body onload=\" parent.document.getElementById('" . $backi . "').title=" . $bcontis . "; \"></body></html>";

}

} else {

exec("/usr/sbin/screencapture -Cd -tjpg /Applications/MAMP/htdocs/screen-`date +\"%Y%m%d-%H%M\"`.jpg");

}

exit;

?>


Previous relevant Mac OS X MAMP Timekeeping Web Application Email Tutorial is shown below.

Mac OS X MAMP Timekeeping Web Application Email Tutorial

Mac OS X MAMP Timekeeping Web Application Email Tutorial

The practicalities of yesterdayโ€™s (Mac OS X MAMP Timekeeping Web Application Primer Tutorial) timekeeping Mac OS X Web Application, left as they are, would leave you with a somewhat useful web application whose use is only for the here and now, 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 email form of communication.

Todayโ€™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โ€™t include Ajax nor jQuery in that list? Well, we have, to our minds โ€ฆ

  • mailto links (get us to the email client) +
  • the body section of that email can have a clipboard image pasted into it, for which we can utilize HTML5 canvas elementโ€™s toDataURL() method, teamed up with a window.open popup window of the toDataURL image data, which can be selected and copied, optionally, by the user themselves, should they wish this to make their email more self explanatory
    The workings of email creation

We last discussed this thinking with Canvas Annotation Email Attachment Clipboard Tutorial.

We rely on the crontab 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).

Here is the HTML and Javascript quarter_hour_timerโšซhtml which changed to cater for todayโ€™s email functionality in thisway, and, as per the Stop Press from yesterday, weโ€™ll also have a liveโœ‚run link here today.


Previous relevant Mac OS X MAMP Timekeeping Web Application Primer Tutorial is shown below.

Mac OS X MAMP Timekeeping Web Application Primer Tutorial

Mac OS X MAMP Timekeeping Web Application Primer Tutorial

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 โ€ฆ

  • Mac OS X operating system +
  • Existance of [/usr/sbin/]screencapture +
  • crontab active and editable via crontab -e +
  • One of โ€ฆ
    1. MAMP installed to, in our case, /Applications/MAMP/htdocs/ (as is mentioned in the relevant crontab background task that snapshots the userโ€™s screen every quarter hour) that maps to the MAMP web application URL //localhost:8888/ โ€ฆ or โ€ฆ
    2. crontab directory mention that corresponds to a URL call of our web application like for our Google Chrome example (where the directory below, used, could be a place of your choosing (that matches what is in your crontab task entry)) โ€ฆ


      file:///Applications/MAMP/htdocs/quarter_hour_timer.html?localplace=


      โ€ฆ or just, via the web browserโ€™s File -> Open File menu โ€ฆ


      file:///Applications/MAMP/htdocs/quarter_hour_timer.html


โ€ฆ pretty restrictive, huh? โ€ฆ but pretty useful for our quarter hour timekeeping purposes today.

We want to have a web application that is running at the userโ€™s discretion, and when first fired up, looks for outputs from crontab tasks above โ€ฆ



0,15,30,45 * * * * /usr/sbin/screencapture -Cd -tjpg /Applications/MAMP/htdocs/screen-`date +"\%Y\%m\%d-\%H\%M"`.jpg

โ€ฆ for the current day in question and if existant show โ€ฆ

  1. a date and time stamp +
  2. the snapshot of what you were doing at the quarter hour, that is clickable to make bigger for more in depth viewing +
  3. an HTML textarea element in which you can optionally type in more specifics about that quarter hour

So, as much as we like to think of Mac OS X Terminal applicationโ€™s BSD (a unix derivative) operating system, as being a lot like Linux, there are some commands and usage that โ€ฆ

  • adds Mac OS X specific command line functionality to a Linux or unix base set of functionality, like for todayโ€™s screencapture command โ€ฆ and weโ€™ve included another such example, below, with the command say featuring in Mac OS X Text to English Speech Primer Tutorial as shown below
  • changes switches on Linux or unix commands
  • wonโ€™t have some Linux or unix commands that other platforms do

In the great tradition of behoving โ€ฆ we behove โ€ฆ we behove thee quarter_hour_timerโšซhtml if you like, my liege. On this occasion youโ€™ll have gleaned that there is no live run link, because the RJM Programming web server is not Mac OS X โ€ฆ so command line screencapture has no meaning for a CentOS web serverโ€™s operating system command line. Youโ€™ll see in the code that rather than use โ€œClient Pre-emptive Iframeโ€ concepts to check for existence of crontab screen capture images, we, instead use the onerror event for HTML img elements to check for non-existance.

Stop Press

Just noticed that, perhaps, after all, a liveโœ‚run from the RJM Programming website can make sense if you have a Mac OS X laptop, for instance, that is running that suggested crontab entry as explained in tutorial above. That type of live run managed to latch on to our local crontab screencaptures on my MacBook Pro.


Previous relevant Mac OS X Text to English Speech Primer Tutorial is shown below.

Mac OS X Text to English Speech Primer Tutorial

Mac OS X Text to English Speech Primer Tutorial

Weโ€™ve got a few new ideas today โ€ฆ

  1. Text to English Speech via Mac OS Xโ€™s command line say command used by PHP via exec to make sayโšซphp (which is useful as a download to a Mac OS X laptop using MAMP) which, today, does not have a live run because the web server of domain rjmprogramming.com.au is a CentOS Linux server โ€ฆ Linux equivalent of Mac OS Xโ€™s say? โ€ฆ read here
  2. Trying to present this brought up the usual movie production problem with iMovie overlaying the audio on top of the video (though you may want to try, and you could start reading with this link) versus QuickTime Player talent to catch both audio and video tracks (and that we ended up using), but not of the โ€œscreen goings onโ€, alas versus MPlayer OSX Extended which can play separately but not two tracks on top and doesnโ€™t do any reconstituting โ€ฆ so โ€ฆ
  3. Improved on our inhouse Video/Audio synchronizing efforts by allowing audio_videoโšซhtml supervisor (changed in thisway) be able to be called to press one of its preconceived synchronization buttons onload which we do with (the newly added) Macbeth Act 1 Scene 1 โ€ฆ in a small celebration of the Bard โ€ฆ who, am thinking (in that Falstaff way), would have got a huge chuckle out of โ€œanonymousโ€ instead of โ€œanonโ€ during the Three Witches scene โ€ฆ we had to do something to say Happy Birthday

Along the way we tried filming the MacBook Pro with the iPad to a YouTube โ€ฆ

โ€ฆ but werenโ€™t happy with the audio quality, alas (too/two).

If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.

This entry was posted in eLearning, Tutorials and tagged , , , , , , , , , , , , , , , , , , , , , , , , , , . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *