… on a device the size of an iPhone? We’ll leave the answer up to you, but we would say …
a lot of the world’s population is asked, at various points of their life … to work with …
documents and letters or spreadsheets or presentations or book publications … to us, under the umbrella term …
Document Processing
… and we figure there will be times you are out and about, cornered to deal with an issue, and want some access to professional document editing smarts. Here we’ve talked about Open Source ways (such as with Word to HTML to CSV Delimitation Primer Tutorial below) that did not involve any Microsoft Office functionality, and we still use LibreOffice around here on our MacBook Air (using macOS), for these purposes. But what about the iPhone or iPad (on iOS) regarding this thinking, and embracing the expertise of Microsoft in the Document Processing arena?
Well, we came across the, initially free, Microsoft 365 product (for iOS), that might fit the requirements of a lot of iPhone or iPad users out there.
It certainly looks the part and wherever Microsoft meets iOS has got to be a crossover reason to celebrate … right?!
The modern document applications allow conversion to HTML. What happens during that process, exactly? Well, that’s “under the hood” stuff. A little background, though, and context …
Why would you want to convert, say a Word file, to HTML (using, perhaps, LibreOffice, in our case, or Microsoft Word)? … well, as a mere mortal programmer …
(any form of) text is easier to deal with for “mere mortal programmer” languages we might want to use like …
PHP … is very good at the delimiter processing bits that allow the programmer be useful …
converting … the data into other guises, the one that interested us being …
CSV (comma separated value) data … to be fed into spreadsheet applications like Excel or LibreOffice’s one … and then create charts
… and to do useful delimiter work in PHP you need to know, or suss out, “what happens”, or evidence of that … think hex dumps (where $dr is a PHP variable containing an HTML file record) …
<?php
echo bin2hex($dr) . "\n";
// ... gave, in our case, output such as ...
// c2a020c2a020c2a020c2a020c2a020c2a020c2a020c2a020c2a020c2a020c2a020c2a020c2a020c2a020c2a020c2a020c2a020546f74616c207c20c2a020c2a02036302c30333220c2a020c2a020c2a03130302e3030
?>
And so we line up all the useful contributors …
CP3O
C2A0
R2D2
… … …
Hang on?! What’s with C2A0? And for that matter, the pitiful “am typing” simulation “… … … “?!
Well, we asked around, and got to this useful link telling us these are non-ascii characters describing a …
Non-breaking space
… scenario programmers of HTML will know can be those …
… HTML entities in your webpage content. Well, now, at least to us, that all makes sense. But, for our job, that could be the tip of the “UTF-8 headache” situation! We know we’re only interested in ascii data characters for the conversion job we are trying to do. Is there a way to simplify this “middleperson” HTML data content? Well, this other useful link … got us to use …
new CSS Style dropdown option … handled by the changedinhouse_slideshow.js Inhouse Slideshow external Javascript helper only
Of course, that is what external Javascript design is all about. You adjust one code source only, to affect a whole lot of web applications, rather than the worry of many code source changes. We know which we prefer, as programmers?!
Is your way into programming via CSS styling? Perhaps it would tempt you if we pointed out that there are I.T. jobs out there asking for people with expert CSS styling skills. By this, you may understand it can be an art form transforming dreary looking HTML content into dynamic and vibrant looking webpages (all with the same content).
We’ve learnt most about CSS styling, fast, via web browser web inspectors and seeing an initial webpage look change before our eyes via tweaks applied dynamically. We recommend this highly, but don’t expect everyone to be that keen. In any case, we’re trying to channel that dynamism today, offering the user to see our Inhouse Slideshow change it’s look via user CSS Styling entries in a prompt window instigated by a new “Style” dropdown option.
CSS styling does well with webpages dynamically because, quite often, the Javascript DOM approach (where yourselectorpluscss contains CSS styling code) …
… types of CSS clauses to mildly change the styling for each cartoon slide. After using this, for the first time, we wrote down for future tutorial ideas “write a web application helping users improve on their selector smarts”. But we think this Inhouse Slideshow opportunity might be a better dynamic approach for this.
… we can add two more dropdown modus operandi options for …
Video
Animated GIF
… feeding it through to a changedlatest draft cowsay.php media creator via slides via ffmpeg inhouse talent, called by our inhouse slideshow external Javascript helper …
function changeto(tvis) {
if (tvis.toLowerCase().indexOf('video') == 0) {
document.getElementById('divcowpf').innerHTML+='<input type=hidden name=fromindex id=fromindex value=y></input>';
document.getElementById('vlist').click();
document.getElementById('mycowifr').style.display='block';
document.getElementById('mycowifr').style.visibility='hidden';
document.getElementById('mycowifr').style.height='1px';
//document.getElementById('mycowifr').scrollIntoView();
//location.href='#mycowifr';
setTimeout(function(){ document.getElementById('mycowifr').scrollIntoView(); }, 8000);
} else if (tvis.toLowerCase().indexOf('animated gif') == 0) {
document.getElementById('divcowpf').innerHTML+='<input type=hidden name=fromindex id=fromindex value=y></input>';
document.getElementById('aglist').click();
document.getElementById('mycowifr').style.display='block';
document.getElementById('mycowifr').style.visibility='hidden';
document.getElementById('mycowifr').style.height='1px';
//document.getElementById('mycowifr').scrollIntoView();
//location.href='#mycowifr';
setTimeout(function(){ document.getElementById('mycowifr').scrollIntoView(); }, 8000);
} else if (tvis.toLowerCase().indexOf('exif') == 0) {
if (document.URL.indexOf('?') == -1) {
location.href=posturl(document.URL.split('#')[0] + '?exif=y');
} else {
location.href=posturl(document.URL.split('#')[0].replace(/pdf\=/g, 'pdTf=') + '&exif=y');
}
} else if (tvis.toLowerCase().indexOf('pdf') == 0) {
if (document.URL.indexOf('?') == -1) {
location.href=posturl(document.URL.split('#')[0] + '?pdf=y');
} else {
location.href=posturl(document.URL.split('#')[0].replace(/exif\=/g, 'exTif=') + '&pdf=y');
}
} else if (tvis.toLowerCase().indexOf('emoji') == 0) {
//var borderis=prompt('Please enter comma separated HTML decimal entity(s) for your Emoji Border to slideshow. Can use an Emoji Menu entry.', '');
var bbsuffix=' Optionally append &[text|image]css=[CSSstyle] to change styling. Optionally justify some text via &[ul|uc|ur|ml|[mc]|mr|bl|bc|br]text=[someText%0AsecondLine] to change styling. Eg. ' + String.fromCodePoint(127958) + '&css=opacity:0.9;&textcss=font-size:20px;&ultext=Hello%0AThere ';
borderblurb='Please enter comma separated HTML decimal entity(s) for your Emoji Border to slideshow. Can use an Emoji Menu entry (eg. control-command-space for macOS or Mac OS X, logo key + . (period) for Windows, control+space for iOS, top left + for Android keyboard). ' + bbsuffix;
var borderis=prompt(borderblurb, '');
var emojiy='', emojisuffix='';
if (borderis == null) {
borderis='';
} else if (borderis.indexOf('&') != -1) {
if (borderis.split('&')[0].trim() == '') {
emojisuffix=encodeURIComponent(borderis.replace(/\%23[cC][iI][rR][cC][lL][eE]/g, '#circle').replace(/\%23[eE][lL][lL][iI][pP][sS][eE]/g, '#ellipse').replace(/\%23[tT][eE][xX][tT]/g, '#text').replace(/\%23[lL][iI][nN][eE]/g, '#line').replace(/\%23[pP][oO][lL][yY][lL][iI][nN][eE]/g, '#polyline').replace(/\%23[pP][oO][lL][yY][gG][oO][nN]/g, '#polygon').replace(/\%23/g, encodeURIComponent('%23')).replace(/\%23/g, encodeURIComponent('%23')).replace(/\%0a/g, encodeURIComponent('%0A')).replace(/\%0A/g, encodeURIComponent('%0A'))); //.replace(/\&/g,'%26').replace(/\=/g,'%3D');
borderis='';
} else {
emojisuffix=encodeURIComponent(borderis.replace(borderis.split('&')[0], '').replace(/\%23[cC][iI][rR][cC][lL][eE]/g, '#circle').replace(/\%23[eE][lL][lL][iI][pP][sS][eE]/g, '#ellipse').replace(/\%23[tT][eE][xX][tT]/g, '#text').replace(/\%23[lL][iI][nN][eE]/g, '#line').replace(/\%23[pP][oO][lL][yY][lL][iI][nN][eE]/g, '#polyline').replace(/\%23[pP][oO][lL][yY][gG][oO][nN]/g, '#polygon').replace(/\%23/g, encodeURIComponent('%23')).replace(/\%23/g, encodeURIComponent('%23')).replace(/\%0a/g, encodeURIComponent('%0A')).replace(/\%0A/g, encodeURIComponent('%0A'))); //.replace(/\&/g,'%26').replace(/\=/g,'%3D');
borderis=postbb(borderis.split('&')[0]);
}
} else {
borderis=postbb(borderis.split('&')[0]);
}
if ((borderis + emojisuffix) != '') { emojiy='emoji=' + encodeURIComponent(borderis) + emojisuffix; }
if (emojiy != '') {
if (document.URL.indexOf('?') == -1) {
location.href=posturl(document.URL.split('#')[0] + '?' + emojiy);
} else {
location.href=posturl(document.URL.split('#')[0].replace(/emoji\=/g, 'emojTi=') + '&' + emojiy);
}
}
} else {
if (document.URL.indexOf('exif=') != -1 || document.URL.indexOf('pdf=') != -1) {
location.href=posturl(document.URL.split('#')[0].replace(/exif\=/g, 'exTif=').replace(/pdf\=/g, 'pdTf='));
} else {
location.href=posturl(document.URL.split('#')[0] + '&eHuhxif=y');
}
}
}
… approach we have used successfully recently did not work here. Anyway, deprecated or non-existant it doesn’t matter, we decided to resort to good ol’ PHP exec methodologies in a new “inhouse slideshow” (featuring in a changed example PHP inhouse slideshow creator web application) call …
if (file_exists($zipisis)) {
$items = glob($hereis . "*[-_][0-9]*of.[jJgGpP][pPiInN]*");
foreach ($items as $key => $val) {
$alreadythere=true;
}
}
if (!function_exists("zip_entry_read")) {
function zip_entry_read($zip_read_output, $zip_entry_len) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_read_output, $gzip_entry_len;
return 'pork';
}
}
if (!function_exists("zip_entry_filesize")) {
function zip_entry_filesize($zip_read_filename) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_entry_filename;
return 'pork';
}
}
if (!function_exists("zip_read")) {
function zip_read($zip_oben_handle) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_open_handle;
return 'pork';
}
}
if (!function_exists("zip_open")) {
function zip_open($zip_filename) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_filename;
$gzip_filename=$zip_filename;
$gzip_number=0;
$gzip_open_handle='pork';
return 'pork';
}
}
if (!function_exists("zip_entry_name")) {
function zip_entry_name($zip_read_output) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_read_output;
return 'pork';
}
}
if (!function_exists("zip_entry_open")) {
function zip_entry_open($zip_open_handle, $zip_read_output, $inmode) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_open_handle, $gzip_read_output;
return 'pork';
}
}
if (!function_exists("zip_close")) {
function zip_close($zip_open_handle) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_open_handle;
return 'pork';
}
}
… as a first draft. We have much more to do trying to resurrect, if possible, some other inhouse PHP web applications we’ve based on the use of Zip in PHP. Pardon us, until tomorrow, while we have a little cry.
… that means we can back up a “peer based” solution such as talked about with Inhouse Slideshow Backup Tidy Up Report Viewing Tutorial (ie. done as a user is surfing the net with some PHP of ours) methodology should it fail. We think we have an occasionally failing one as far as the tidy up of zipped up inhouse slideshows goes. It could be to do with a search engine crawling operation, we have not found out for sure, but we’ve decided to write our own …
PHP … via …
crontab
curl
… based independent tidying up procedure we’ll run once an hour via crontab record …
for ($i=0; $i<sizeof($lines); $i++) {
$lines[$i]=explode("\n", $lines[$i])[0];
if (file_exists(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) {
if (('' . filesize(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) == '38794') {
if (file_exists("slideshow_zero.txx")) {
unlink("slideshow_zero.txx");
}
exec("unzip -l " . $lines[$i] . " | grep '.jpg' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/ /s// /g' | sed '/ /s// /g' | sed '/ /s// /g' | sed '/ /s// /g' | cut -f4 -d' ' | grep '-' > " . dirname(__FILE__) . DIRECTORY_SEPARATOR . "slideshow_zero.txx");
if (file_exists("slideshow_zero.txx")) {
$sublines=file(dirname(__FILE__) . DIRECTORY_SEPARATOR . "slideshow_zero.txx");
for ($j=0; $j<sizeof($sublines); $j++) {
$sublines[$j]=explode(" ", explode("\n", $sublines[$j])[0])[0];
$fis=explode("slideshow_0.zip", $lines[$i])[0] . $sublines[$j];
if (file_exists($fis)) {
$md=filemtime($fis);
if ($md) {
if ((time() - $md) > 1200) {
if (file_exists("slideshow_zero.kkk")) {
exec("rm -f " . $fis); //file_put_contents("slideshow_zero.kkk", file_get_contents("slideshow_zero.kkk") . "rm -f " . $fis . "\n");
} else {
exec("rm -f " . $fis); //file_put_contents("slideshow_zero.kkk", "rm -f " . $fis . "\n");
}
}
}
}
}
}
} else if (1 == 3) {
if (file_exists("slideshow_zero.kkk")) {
file_put_contents("slideshow_zero.kkk", file_get_contents("slideshow_zero.kkk") . "# " . ('' . filesize(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) . " is not 38794 " . str_replace("slideshow_0.zip", "index.php", $lines[$i]) . "\n");
} else {
file_put_contents("slideshow_zero.kkk", "# " . ('' . filesize(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) . " is not 38794 " . str_replace("slideshow_0.zip", "index.php", $lines[$i]) . "\n");
}
}
}
}
if (file_exists("slideshow_zero.txx")) {
unlink("slideshow_zero.txx");
}
if (file_exists("slideshow_zero.txt")) {
unlink("slideshow_zero.txt");
}
if (file_exists("slideshow_zero.kkk")) {
unlink("slideshow_zero.kkk");
}
//echo $htmlis;
exit;
?>
… as that “ahhhhhhhh, what a relief” reliever of tension running the RJM Programming website. The subtext is, our inode limits are a concern!
We think another lesson here is that PHP can be a good alternative to scripting languages such as Korn Shell to create “operational” procedures, especially when you consider that curl means it can be like writing your “surfing the net” type of PHP (slideshow_zero.php) work.
it is information we do not want everyone to be able to see (easily, shall we say) … and in the sense that …
the report is stored away from RJM Programming’s “public_html” folder (ie. its Apache/PHP/MySql “Document Root”) is good … but even with today’s work …
hidden from everybody who does not have access to the RJM Programming’s web server … but …
the administrator of the RJM Programming’s web server (yoo hoo!) wants a mechanism to view the report that does not involve some “arcane procedure” each time to view it
… and so we decided that because …
the administrator of the RJM Programming's web server = the administrator of this blog
… we’d like to organize a system that latches onto that “security footing” and only show a “broom emoji button” (🧹 🧹) way to access the report when the administrator of this blog is logged in. We can do this by amending our Twenty Ten theme’s good ol’ header.php as per (where the “function mlater” you may recall from the days of WordPress Blog Email Post Collaboration Ajax Image Tutorial) …
<?php
$fns="36";
function doisr() {
global $fns;
$inmb="";
if (('' . get_current_user_id()) != '0' && ('' . get_current_user_id()) == '1') {
if (file_exists('/tmp/slideshow_cleanup.txt')) {
$fns="24";
$inmb="<a style=font-size:24px; title='Inhouse Slideshow Tidy Up Report' onclick=\"var iswo=window.open('','_blank','top=100,left=100,height=600,width=730'); iswo.document.write('<html><head><title>Inhouse Slideshow Tidy Up Report</title></head><body><pre>" . str_replace("\n","<br>",file_get_contents('/tmp/slideshow_cleanup.txt')) . "</pre></body></html>'); \">🧹</a> ";
}
}
return str_replace("'","' + String.fromCharCode(39) + '",$inmb);
}
?>
… PHP affects some (PHP writes) Javascript below …
<?php
function mlater() {
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)">🎦</a> <a style="cursor:pointer;text-decoration:none;font-size:<?php global $fns; echo $fns; ?>px;" onclick="diffphpfix(this);" title="Code Difference Functional Links">📖</a> <a style="cursor:pointer;text-decoration:none;font-size:36px;" onclick="popselid();" title="Filter Content via Div ID">➗</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();">➖</a>' + printscreen(0);
if (document.URL.indexOf("visualsynopsis=") != -1) document.getElementById('avs').click();
}
}
}
use zip files to “scrunch up” a series of image files into the one zip file … for the vast majority of time … but when asked to, by a user …
unzip the image files when required by a user wanting to see them … and then …
tidy up, after some delay in time
… but we want to design a PHP way to independently tidy up as a backup mechanism. And we say, with PHP code, that if such files have been on the web server longer than ten minutes, this PHP callable slideshow_cleanup.php code …
<?php
// slideshow_cleanup.php
// RJM Programming
// May, 2022
The recent Inhouse Slideshow Mobile Tutorial did not satisfy all the “mobile usability” tests performed by the “Google Crawl” algorithm, failing on “Content wider than screen”, and you can read some background to this with Google Crawl Viewport Geographicals Tutorial. And so we try some refinements here today, with an idea to control on mobile platforms the max-width CSS property of the document.body of a Inhouse Slideshow webpage, which made up the URLs failing this test at the Google Search Console.
We were reading this great and useful link, thanks, and decided to see whether this stopping of scrolling in X on mobile platform versions of the Inhouse Slideshow webpages gels better with Google Search Console “Google Crawl” Mobility Usability algorithms.
Yet again, deployment of these changes is similar to that last time, and the times before that, as per …
the changedindex.php new “inhouse slideshow” presentation supervisor (exemplified by this live run link) reading of a slideshow_0.zip zip file … was done in …
In a “going off to the right table row of cells” arrangement like this, what are some considerations that improve the user experience (of our inhouse slideshows) for mobile platform users?
turn the “@” link into an “emoji button” as per ➡ ( ➡ )
for both mobile and non-mobile, we’ve decided …
UTF-8 meta …
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<style>
td { vertical-align:top; }
</style>
change the h4 element to be h2 to help with legibility
iOS (ie. iPad and iPhone) PDF iframe elements have known scrolling issues, which we decided to bypass by opening these PDF creations in a new webpage window
Deployment of these changes is similar to that last time, and the times before that, as per …
the changedindex.php new “inhouse slideshow” presentation supervisor (exemplified by this live run link) reading of a slideshow_0.zip zip file … was done in …
Exif Slideshow … and the new, as of today’s work …
PDF Slideshow
… that little bit different in that a PDF Slideshow occupies just the one table cell (rather than the many horizontal cells of the other display modes) and the resultant embedded PDF data vertically scrolls when multiple image slides are involved.
This new option also adds onto this “Inhouse Slideshow” functionality the chance to download and keep a PDF representation of that slideshow to your local system. Perhaps this makes this be of interest to you?!
The changedform_creator.php‘s live run is what gets integrated into the “Inhouse Slideshow” “sisterhood”. We say “sisterhood” because this “Inhouse Slideshow” is designed as a single PHP codefile “hived off” to a lot of other web server folders as their default “index.php” web browser default webpage in a “peer to peer” feeling arrangement. Such an arrangement asks a bit of the deployment arrangements, and we’ve talked about this before (with underlying links pointing to today’s work, should you be interested) …
the changedindex.php new “inhouse slideshow” presentation supervisor (exemplified by this live run link) reading of a slideshow_0.zip zip file … was done in …
But when we say “Unit testing completed” above, we need to fill you in on a Fpdf issue we came across during unit testing of our changes. We were getting a …
FPDF Error: Not a JPEG file
… Fpdf error message choosing the new “PDF Slideshow” option on some, but not all, “Inhouse Slideshow” address bar URLs. And so the online research began as per …
… almost getting us there to a solution (and as far as the last link goes “that was before we posted the suggestion below”). Then we took one of the error messages at its word …
FPDF error: Not a JPEG file: ../Mac/Linux_drutil-238of.jpg
… and independently looked into the issue via Linux (or macOS command line) file command …
# cd $HOME/public_html/Mac
# ls -l Linux_dr*
-rw-r--r-- 1 owner group 724353 Oct 29 08:00 Linux_drutil-238of.jpg
-rw-r--r-- 1 owner group 132707 Oct 29 08:00 Linux_drutil-239of.jpg
-rw-r--r-- 1 owner group 109595 Oct 29 08:00 Linux_drutil-240of.jpg
# file Linux_drutil-238of.jpg
Linux_drutil-238of.jpg: PNG image data, 1280 x 800, 8-bit/color RGBA, non-interlaced
# file Linux_drutil-239of.jpg
Linux_drutil-239of.jpg: JPEG image data, JFIF standard 1.01
#
… when the penny dropped (about our (macOS) Paintbrush slideshow slide creation habits)! We quote our entry into “php – FPDF error: Not a JPEG file: http://10.11.201.93:81/webdocc/uploaded/tes3.jpg – Stack Overflow” …
Have found that constructing slideshows with Paintbrush on a MacBook Pro for years have sometimes been saving what “file jpeg_filename.jpg” determines is a PNG, as a JPEG, which is not the end of the world as far as the browsers go rendering this. Within FPDF’s fpdf.php I fixed my own shortcomings that were resulting in “FPDF Error: Not a JPEG file” via the kludgy “if($a[2]==3) { return $this->_parsepng($file); }” additional codeline below …
… and this change to Fpdf’s fpdf.php fixed the issue in our case for a lot of our previously erroneous “PDF Slideshow” displays of “Inhouse Slideshows”.
PDF Slideshow and Form Creation Helper Primer Tutorial
Our recent work involving the great Fpdf creator of PDF files when we presented Ajax FormData Object No Body PHP PDF Tutorial has got us starting on a new PDF (PHP) web application we are starting out thinking will help with …
online forms (probably via thinking in terms of Fpdf open source programmers like Rick van Buuren and Clément Lavoillotte‘s excellent HTML table rendering ideas) via HTML table intermediate user interactions … and …
slideshows
… but we will not be surprised if the project branches out into other ideas. We’ll see over time.
We hope you come along for the trip starting with a bit of a proof of concept form_creator.php‘s live run for you to try, where we allow you to enter (and be able to change) some HTML table code (if that’s what you end up with?!) in a pink HTML textarea element, and that will become PDF should you click the underlying HTML form’s yellow submit button.
Hope to see you for tomorrow’s PDF writing developments here.
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.
… we can add two more dropdown modus operandi options for …
Video
Animated GIF
… feeding it through to a changedlatest draft cowsay.php media creator via slides via ffmpeg inhouse talent, called by our inhouse slideshow external Javascript helper …
function changeto(tvis) {
if (tvis.toLowerCase().indexOf('video') == 0) {
document.getElementById('divcowpf').innerHTML+='<input type=hidden name=fromindex id=fromindex value=y></input>';
document.getElementById('vlist').click();
document.getElementById('mycowifr').style.display='block';
document.getElementById('mycowifr').style.visibility='hidden';
document.getElementById('mycowifr').style.height='1px';
//document.getElementById('mycowifr').scrollIntoView();
//location.href='#mycowifr';
setTimeout(function(){ document.getElementById('mycowifr').scrollIntoView(); }, 8000);
} else if (tvis.toLowerCase().indexOf('animated gif') == 0) {
document.getElementById('divcowpf').innerHTML+='<input type=hidden name=fromindex id=fromindex value=y></input>';
document.getElementById('aglist').click();
document.getElementById('mycowifr').style.display='block';
document.getElementById('mycowifr').style.visibility='hidden';
document.getElementById('mycowifr').style.height='1px';
//document.getElementById('mycowifr').scrollIntoView();
//location.href='#mycowifr';
setTimeout(function(){ document.getElementById('mycowifr').scrollIntoView(); }, 8000);
} else if (tvis.toLowerCase().indexOf('exif') == 0) {
if (document.URL.indexOf('?') == -1) {
location.href=posturl(document.URL.split('#')[0] + '?exif=y');
} else {
location.href=posturl(document.URL.split('#')[0].replace(/pdf\=/g, 'pdTf=') + '&exif=y');
}
} else if (tvis.toLowerCase().indexOf('pdf') == 0) {
if (document.URL.indexOf('?') == -1) {
location.href=posturl(document.URL.split('#')[0] + '?pdf=y');
} else {
location.href=posturl(document.URL.split('#')[0].replace(/exif\=/g, 'exTif=') + '&pdf=y');
}
} else if (tvis.toLowerCase().indexOf('emoji') == 0) {
//var borderis=prompt('Please enter comma separated HTML decimal entity(s) for your Emoji Border to slideshow. Can use an Emoji Menu entry.', '');
var bbsuffix=' Optionally append &[text|image]css=[CSSstyle] to change styling. Optionally justify some text via &[ul|uc|ur|ml|[mc]|mr|bl|bc|br]text=[someText%0AsecondLine] to change styling. Eg. ' + String.fromCodePoint(127958) + '&css=opacity:0.9;&textcss=font-size:20px;&ultext=Hello%0AThere ';
borderblurb='Please enter comma separated HTML decimal entity(s) for your Emoji Border to slideshow. Can use an Emoji Menu entry (eg. control-command-space for macOS or Mac OS X, logo key + . (period) for Windows, control+space for iOS, top left + for Android keyboard). ' + bbsuffix;
var borderis=prompt(borderblurb, '');
var emojiy='', emojisuffix='';
if (borderis == null) {
borderis='';
} else if (borderis.indexOf('&') != -1) {
if (borderis.split('&')[0].trim() == '') {
emojisuffix=encodeURIComponent(borderis.replace(/\%23[cC][iI][rR][cC][lL][eE]/g, '#circle').replace(/\%23[eE][lL][lL][iI][pP][sS][eE]/g, '#ellipse').replace(/\%23[tT][eE][xX][tT]/g, '#text').replace(/\%23[lL][iI][nN][eE]/g, '#line').replace(/\%23[pP][oO][lL][yY][lL][iI][nN][eE]/g, '#polyline').replace(/\%23[pP][oO][lL][yY][gG][oO][nN]/g, '#polygon').replace(/\%23/g, encodeURIComponent('%23')).replace(/\%23/g, encodeURIComponent('%23')).replace(/\%0a/g, encodeURIComponent('%0A')).replace(/\%0A/g, encodeURIComponent('%0A'))); //.replace(/\&/g,'%26').replace(/\=/g,'%3D');
borderis='';
} else {
emojisuffix=encodeURIComponent(borderis.replace(borderis.split('&')[0], '').replace(/\%23[cC][iI][rR][cC][lL][eE]/g, '#circle').replace(/\%23[eE][lL][lL][iI][pP][sS][eE]/g, '#ellipse').replace(/\%23[tT][eE][xX][tT]/g, '#text').replace(/\%23[lL][iI][nN][eE]/g, '#line').replace(/\%23[pP][oO][lL][yY][lL][iI][nN][eE]/g, '#polyline').replace(/\%23[pP][oO][lL][yY][gG][oO][nN]/g, '#polygon').replace(/\%23/g, encodeURIComponent('%23')).replace(/\%23/g, encodeURIComponent('%23')).replace(/\%0a/g, encodeURIComponent('%0A')).replace(/\%0A/g, encodeURIComponent('%0A'))); //.replace(/\&/g,'%26').replace(/\=/g,'%3D');
borderis=postbb(borderis.split('&')[0]);
}
} else {
borderis=postbb(borderis.split('&')[0]);
}
if ((borderis + emojisuffix) != '') { emojiy='emoji=' + encodeURIComponent(borderis) + emojisuffix; }
if (emojiy != '') {
if (document.URL.indexOf('?') == -1) {
location.href=posturl(document.URL.split('#')[0] + '?' + emojiy);
} else {
location.href=posturl(document.URL.split('#')[0].replace(/emoji\=/g, 'emojTi=') + '&' + emojiy);
}
}
} else {
if (document.URL.indexOf('exif=') != -1 || document.URL.indexOf('pdf=') != -1) {
location.href=posturl(document.URL.split('#')[0].replace(/exif\=/g, 'exTif=').replace(/pdf\=/g, 'pdTf='));
} else {
location.href=posturl(document.URL.split('#')[0] + '&eHuhxif=y');
}
}
}
… approach we have used successfully recently did not work here. Anyway, deprecated or non-existant it doesn’t matter, we decided to resort to good ol’ PHP exec methodologies in a new “inhouse slideshow” (featuring in a changed example PHP inhouse slideshow creator web application) call …
if (file_exists($zipisis)) {
$items = glob($hereis . "*[-_][0-9]*of.[jJgGpP][pPiInN]*");
foreach ($items as $key => $val) {
$alreadythere=true;
}
}
if (!function_exists("zip_entry_read")) {
function zip_entry_read($zip_read_output, $zip_entry_len) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_read_output, $gzip_entry_len;
return 'pork';
}
}
if (!function_exists("zip_entry_filesize")) {
function zip_entry_filesize($zip_read_filename) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_entry_filename;
return 'pork';
}
}
if (!function_exists("zip_read")) {
function zip_read($zip_oben_handle) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_open_handle;
return 'pork';
}
}
if (!function_exists("zip_open")) {
function zip_open($zip_filename) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_filename;
$gzip_filename=$zip_filename;
$gzip_number=0;
$gzip_open_handle='pork';
return 'pork';
}
}
if (!function_exists("zip_entry_name")) {
function zip_entry_name($zip_read_output) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_read_output;
return 'pork';
}
}
if (!function_exists("zip_entry_open")) {
function zip_entry_open($zip_open_handle, $zip_read_output, $inmode) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_open_handle, $gzip_read_output;
return 'pork';
}
}
if (!function_exists("zip_close")) {
function zip_close($zip_open_handle) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_open_handle;
return 'pork';
}
}
… as a first draft. We have much more to do trying to resurrect, if possible, some other inhouse PHP web applications we’ve based on the use of Zip in PHP. Pardon us, until tomorrow, while we have a little cry.
… that means we can back up a “peer based” solution such as talked about with Inhouse Slideshow Backup Tidy Up Report Viewing Tutorial (ie. done as a user is surfing the net with some PHP of ours) methodology should it fail. We think we have an occasionally failing one as far as the tidy up of zipped up inhouse slideshows goes. It could be to do with a search engine crawling operation, we have not found out for sure, but we’ve decided to write our own …
PHP … via …
crontab
curl
… based independent tidying up procedure we’ll run once an hour via crontab record …
for ($i=0; $i<sizeof($lines); $i++) {
$lines[$i]=explode("\n", $lines[$i])[0];
if (file_exists(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) {
if (('' . filesize(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) == '38794') {
if (file_exists("slideshow_zero.txx")) {
unlink("slideshow_zero.txx");
}
exec("unzip -l " . $lines[$i] . " | grep '.jpg' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/ /s// /g' | sed '/ /s// /g' | sed '/ /s// /g' | sed '/ /s// /g' | cut -f4 -d' ' | grep '-' > " . dirname(__FILE__) . DIRECTORY_SEPARATOR . "slideshow_zero.txx");
if (file_exists("slideshow_zero.txx")) {
$sublines=file(dirname(__FILE__) . DIRECTORY_SEPARATOR . "slideshow_zero.txx");
for ($j=0; $j<sizeof($sublines); $j++) {
$sublines[$j]=explode(" ", explode("\n", $sublines[$j])[0])[0];
$fis=explode("slideshow_0.zip", $lines[$i])[0] . $sublines[$j];
if (file_exists($fis)) {
$md=filemtime($fis);
if ($md) {
if ((time() - $md) > 1200) {
if (file_exists("slideshow_zero.kkk")) {
exec("rm -f " . $fis); //file_put_contents("slideshow_zero.kkk", file_get_contents("slideshow_zero.kkk") . "rm -f " . $fis . "\n");
} else {
exec("rm -f " . $fis); //file_put_contents("slideshow_zero.kkk", "rm -f " . $fis . "\n");
}
}
}
}
}
}
} else if (1 == 3) {
if (file_exists("slideshow_zero.kkk")) {
file_put_contents("slideshow_zero.kkk", file_get_contents("slideshow_zero.kkk") . "# " . ('' . filesize(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) . " is not 38794 " . str_replace("slideshow_0.zip", "index.php", $lines[$i]) . "\n");
} else {
file_put_contents("slideshow_zero.kkk", "# " . ('' . filesize(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) . " is not 38794 " . str_replace("slideshow_0.zip", "index.php", $lines[$i]) . "\n");
}
}
}
}
if (file_exists("slideshow_zero.txx")) {
unlink("slideshow_zero.txx");
}
if (file_exists("slideshow_zero.txt")) {
unlink("slideshow_zero.txt");
}
if (file_exists("slideshow_zero.kkk")) {
unlink("slideshow_zero.kkk");
}
//echo $htmlis;
exit;
?>
… as that “ahhhhhhhh, what a relief” reliever of tension running the RJM Programming website. The subtext is, our inode limits are a concern!
We think another lesson here is that PHP can be a good alternative to scripting languages such as Korn Shell to create “operational” procedures, especially when you consider that curl means it can be like writing your “surfing the net” type of PHP (slideshow_zero.php) work.
it is information we do not want everyone to be able to see (easily, shall we say) … and in the sense that …
the report is stored away from RJM Programming’s “public_html” folder (ie. its Apache/PHP/MySql “Document Root”) is good … but even with today’s work …
hidden from everybody who does not have access to the RJM Programming’s web server … but …
the administrator of the RJM Programming’s web server (yoo hoo!) wants a mechanism to view the report that does not involve some “arcane procedure” each time to view it
… and so we decided that because …
the administrator of the RJM Programming's web server = the administrator of this blog
… we’d like to organize a system that latches onto that “security footing” and only show a “broom emoji button” (🧹 🧹) way to access the report when the administrator of this blog is logged in. We can do this by amending our Twenty Ten theme’s good ol’ header.php as per (where the “function mlater” you may recall from the days of WordPress Blog Email Post Collaboration Ajax Image Tutorial) …
<?php
$fns="36";
function doisr() {
global $fns;
$inmb="";
if (('' . get_current_user_id()) != '0' && ('' . get_current_user_id()) == '1') {
if (file_exists('/tmp/slideshow_cleanup.txt')) {
$fns="24";
$inmb="<a style=font-size:24px; title='Inhouse Slideshow Tidy Up Report' onclick=\"var iswo=window.open('','_blank','top=100,left=100,height=600,width=730'); iswo.document.write('<html><head><title>Inhouse Slideshow Tidy Up Report</title></head><body><pre>" . str_replace("\n","<br>",file_get_contents('/tmp/slideshow_cleanup.txt')) . "</pre></body></html>'); \">🧹</a> ";
}
}
return str_replace("'","' + String.fromCharCode(39) + '",$inmb);
}
?>
… PHP affects some (PHP writes) Javascript below …
<?php
function mlater() {
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)">🎦</a> <a style="cursor:pointer;text-decoration:none;font-size:<?php global $fns; echo $fns; ?>px;" onclick="diffphpfix(this);" title="Code Difference Functional Links">📖</a> <a style="cursor:pointer;text-decoration:none;font-size:36px;" onclick="popselid();" title="Filter Content via Div ID">➗</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();">➖</a>' + printscreen(0);
if (document.URL.indexOf("visualsynopsis=") != -1) document.getElementById('avs').click();
}
}
}
use zip files to “scrunch up” a series of image files into the one zip file … for the vast majority of time … but when asked to, by a user …
unzip the image files when required by a user wanting to see them … and then …
tidy up, after some delay in time
… but we want to design a PHP way to independently tidy up as a backup mechanism. And we say, with PHP code, that if such files have been on the web server longer than ten minutes, this PHP callable slideshow_cleanup.php code …
<?php
// slideshow_cleanup.php
// RJM Programming
// May, 2022
The recent Inhouse Slideshow Mobile Tutorial did not satisfy all the “mobile usability” tests performed by the “Google Crawl” algorithm, failing on “Content wider than screen”, and you can read some background to this with Google Crawl Viewport Geographicals Tutorial. And so we try some refinements here today, with an idea to control on mobile platforms the max-width CSS property of the document.body of a Inhouse Slideshow webpage, which made up the URLs failing this test at the Google Search Console.
We were reading this great and useful link, thanks, and decided to see whether this stopping of scrolling in X on mobile platform versions of the Inhouse Slideshow webpages gels better with Google Search Console “Google Crawl” Mobility Usability algorithms.
Yet again, deployment of these changes is similar to that last time, and the times before that, as per …
the changedindex.php new “inhouse slideshow” presentation supervisor (exemplified by this live run link) reading of a slideshow_0.zip zip file … was done in …
In a “going off to the right table row of cells” arrangement like this, what are some considerations that improve the user experience (of our inhouse slideshows) for mobile platform users?
turn the “@” link into an “emoji button” as per ➡ ( ➡ )
for both mobile and non-mobile, we’ve decided …
UTF-8 meta …
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<style>
td { vertical-align:top; }
</style>
change the h4 element to be h2 to help with legibility
iOS (ie. iPad and iPhone) PDF iframe elements have known scrolling issues, which we decided to bypass by opening these PDF creations in a new webpage window
Deployment of these changes is similar to that last time, and the times before that, as per …
the changedindex.php new “inhouse slideshow” presentation supervisor (exemplified by this live run link) reading of a slideshow_0.zip zip file … was done in …
Exif Slideshow … and the new, as of today’s work …
PDF Slideshow
… that little bit different in that a PDF Slideshow occupies just the one table cell (rather than the many horizontal cells of the other display modes) and the resultant embedded PDF data vertically scrolls when multiple image slides are involved.
This new option also adds onto this “Inhouse Slideshow” functionality the chance to download and keep a PDF representation of that slideshow to your local system. Perhaps this makes this be of interest to you?!
The changedform_creator.php‘s live run is what gets integrated into the “Inhouse Slideshow” “sisterhood”. We say “sisterhood” because this “Inhouse Slideshow” is designed as a single PHP codefile “hived off” to a lot of other web server folders as their default “index.php” web browser default webpage in a “peer to peer” feeling arrangement. Such an arrangement asks a bit of the deployment arrangements, and we’ve talked about this before (with underlying links pointing to today’s work, should you be interested) …
the changedindex.php new “inhouse slideshow” presentation supervisor (exemplified by this live run link) reading of a slideshow_0.zip zip file … was done in …
But when we say “Unit testing completed” above, we need to fill you in on a Fpdf issue we came across during unit testing of our changes. We were getting a …
FPDF Error: Not a JPEG file
… Fpdf error message choosing the new “PDF Slideshow” option on some, but not all, “Inhouse Slideshow” address bar URLs. And so the online research began as per …
… almost getting us there to a solution (and as far as the last link goes “that was before we posted the suggestion below”). Then we took one of the error messages at its word …
FPDF error: Not a JPEG file: ../Mac/Linux_drutil-238of.jpg
… and independently looked into the issue via Linux (or macOS command line) file command …
# cd $HOME/public_html/Mac
# ls -l Linux_dr*
-rw-r--r-- 1 owner group 724353 Oct 29 08:00 Linux_drutil-238of.jpg
-rw-r--r-- 1 owner group 132707 Oct 29 08:00 Linux_drutil-239of.jpg
-rw-r--r-- 1 owner group 109595 Oct 29 08:00 Linux_drutil-240of.jpg
# file Linux_drutil-238of.jpg
Linux_drutil-238of.jpg: PNG image data, 1280 x 800, 8-bit/color RGBA, non-interlaced
# file Linux_drutil-239of.jpg
Linux_drutil-239of.jpg: JPEG image data, JFIF standard 1.01
#
… when the penny dropped (about our (macOS) Paintbrush slideshow slide creation habits)! We quote our entry into “php – FPDF error: Not a JPEG file: http://10.11.201.93:81/webdocc/uploaded/tes3.jpg – Stack Overflow” …
Have found that constructing slideshows with Paintbrush on a MacBook Pro for years have sometimes been saving what “file jpeg_filename.jpg” determines is a PNG, as a JPEG, which is not the end of the world as far as the browsers go rendering this. Within FPDF’s fpdf.php I fixed my own shortcomings that were resulting in “FPDF Error: Not a JPEG file” via the kludgy “if($a[2]==3) { return $this->_parsepng($file); }” additional codeline below …
… and this change to Fpdf’s fpdf.php fixed the issue in our case for a lot of our previously erroneous “PDF Slideshow” displays of “Inhouse Slideshows”.
PDF Slideshow and Form Creation Helper Primer Tutorial
Our recent work involving the great Fpdf creator of PDF files when we presented Ajax FormData Object No Body PHP PDF Tutorial has got us starting on a new PDF (PHP) web application we are starting out thinking will help with …
online forms (probably via thinking in terms of Fpdf open source programmers like Rick van Buuren and Clément Lavoillotte‘s excellent HTML table rendering ideas) via HTML table intermediate user interactions … and …
slideshows
… but we will not be surprised if the project branches out into other ideas. We’ll see over time.
We hope you come along for the trip starting with a bit of a proof of concept form_creator.php‘s live run for you to try, where we allow you to enter (and be able to change) some HTML table code (if that’s what you end up with?!) in a pink HTML textarea element, and that will become PDF should you click the underlying HTML form’s yellow submit button.
Hope to see you for tomorrow’s PDF writing developments here.
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.
sharing links in many communication choices, such as, on this macOS MacBook Air (out of the box) …
Mail
Messages
AirDrop
Notes
Reminders
sharing documents as attachments in many communication choices, such as, on this macOS MacBook Air (out of the box) …
Mail
Messages
AirDrop
Notes
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 …
New emoji button 👥 (👥) 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)">🎦</a> <button onclick="atclick();" id="share" type="button" title="Share your media or documents or link!" style="display:inline-block;">👥</button> <a style="cursor:pointer;text-decoration:none;font-size:<?php global $fns; echo $fns; ?>px;" onclick="diffphpfix(this);" title="Code Difference Functional Links">📖</a> <a style="cursor:pointer;text-decoration:none;font-size: 22px;" onclick="popselid();" title="Filter Content via Div ID">➗</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();">➖</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 the changedweb_share_api.js external Javascript usage.
the changed HTML and Javascriptquarter_hour_timer.html (we still ask you to download to MAMP‘s $_SERVER[‘DOCUMENT_ROOT’] “HTMLCSS” subfolder) Web Application supervisor …
<script type='text/javascript' src='//www.rjmprogramming.com.au/web_share_api_test.js?populate=as_necessary' defer></script>
… nicely
… 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) …
… 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.
<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.
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 …
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 the changedquarter_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 “mobile platform check” changedquarter_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.
… 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 …
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; };
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="http://" . $_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="
?>
… 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
… 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”
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.
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.
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 …
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
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 this way, and, as per the Stop Press from yesterday, we’ll also have a live run link here today.
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 …
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 http://localhost:8888/ … or …
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 …
… for the current day in question and if existant show …
a date and time stamp +
the snapshot of what you were doing at the quarter hour, that is clickable to make bigger for more in depth viewing +
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.
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
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 …
Improved on our inhouse Video/Audio synchronizing efforts by allowing audio_video.html supervisor (changed in this way) 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.
We noted, looking at our Apache Status report, that fairly often readers of this blog, thanks, search for mention of a particular GETME file, it being our “source control” basis whereby …
first draft of a “source control” file, named cowsay.php as an example, would be called …
cowsay.php_GETME
and then subsequent drafts use –s rather than _ meaning a “second draft” would be called …
cowsay.php-GETME
… and a fourth …
cowsay.php---GETME
You go through with a particularized search like that and you’d be looking for specific referencing, we reckon. And yet, once the project rolls along a search for cowsay.php_GETME as your example will land you on four or five or six mentioning tutorials, the way we do it around here. We want to tell a story, and build it up (but please do your own research regarding Google SEO before thinking this is such a good idea, as repeating content is quite often a no-no). But, like we’re intimating, such a particularized search result set like this may annoy many people looking for some quick, definitive answer.
Well, we think for some such searches, again using cowsay.php_GETME as an example, the adding and then clicking of …
… as the oldest mention of cowsay.php_GETME, could be a useful new feature … ie. getting to it’s genesis. Many people will be most interested going back to this genesis, but please note, in the case we’ve mentioned, using our “present as a book” emoji button (📖 📖) functionality (reading like a book, functionality talked about with WordPress Blog Posting Thread Book Primer Tutorial) on the topmost (usually, but regarding hot off the press business “topmost that does not have the title WordPress Blog Getme Searches Tutorial“) link you are presented with would do a good job here too.
Okay, so how does a user start getting to this additional Oldest link creation logic? Well, in our changed bits on our WordPress blog TwentyTen themed header.php (a modus operandi also used for WordPress Blog Byline Zoom Fix Tutorial) …
… reading between the lines and taking into consideration a changed codeline in function precc …
<?php echo ”
document.getElementById('s').placeholder='Space appended compares to whole posting content. Spaces after GETME search facilitates Oldest link.';
setInterval(sipreradiocc, 5000);
“; ?>
… in conjunction with a new document.body onload Javascript function …
<?php echo ”
function chkinodo() {
var mkh=0, lastahelsid='', lastahelstitle='';
if (document.URL.indexOf('s=') != -1 && document.URL.indexOf('wopenall=') != -1 && document.URL.indexOf('ifnooldestdoone=') != -1 && document.URL.replace('/page','page=').indexOf('page=') == -1) {
var hels=document.getElementsByTagName('h1');
if (eval('' + hels.length) > 0 && document.body.innerHTML.indexOf('lder post') == -1) {
if (hels[0].innerHTML.indexOf('ldest') == -1) {
if (hels[0].innerHTML.toLowerCase().indexOf('search result') != -1) {
var ahels=document.getElementsByTagName('a');
for (var jkh=0; jkh<ahels.length; jkh++) {
if (('' + ahels[jkh].title).indexOf('Permalink to ') != -1) {
if (('' + ahels[jkh].outerHTML).indexOf(' id=') == -1) {
ahels[jkh].id='mya' + mkh;
lastahelsid='' + ahels[jkh].id;
lastahelstitle='' + ('' + ahels[jkh].title).split('Permalink to ')[1];
mkh++;
} else {
lastahelsid='' + ahels[jkh].id;
lastahelstitle='' + ('' + ahels[jkh].title).split('Permalink to ')[1];
}
}
}
}
}
if (lastahelsid != '' && lastahelstitle != '') {
hels[0].innerHTML+=' ... <a href="#' + lastahelsid + '" title="' + lastahelstitle + '">Oldest</a> ';
}
}
}
}
“; ?>
… the user just adds a trailing space to their entered GETME search textbox entry, to pre-empt the underlying HTML form navigation and, instead, do a navigation such as …
How on non-mobile, with this blog, the byline …
A “Dot Dot Dot” Information Technology Blog
… can mal-align as a user zooms in or out.
And we were doing things for the first time we can remember, regarding the fix, which we weren’t expecting. So …
For the first time we can remember …
for a position: absolute “overlay” scenerio … we did not use a left: 123px style of positioning … but, rather …
used a right: 45.6% style of positioning …
lining the byline’s right with the blog title’s right … more or less …
making the byline more central …
giving it more “wander room” as a user zooms in or out
Ever since the advent of “mobile” platforms, the idea of “zoom” has become more and more of a “mute point”, but not for “non-mobile”, as with this “kind of unusual” adding, via “overlay” idea, regarding HTML elements.
On this topic, we’d like to thank this excellent link which reminded us that “responsive design”‘s biggest friend is the percent (ie. “%”) unit of webpage measure!
By the way, even on “non-mobile”, the window.onresize event is triggered we found, but once there we struggled to do much about the mal-alignment zooming in or out was sometimes doing to the byline off to the left.
The new code (intervention, that made the difference), in good ol’ header.php?
Some time ago now we added a Visual Synopsis piece of functionality (via 🎦 🎦 button up the top) to our WordPress blog workings you can read more about at WordPress Visual Synopsis Automated Scrolling Tutorial.
We’re revisiting this, because now that we have the great ffmpeg as a publicly installed Open Source media creating software suite up at the RJM Programming AlmaLinux web server, this has changed the dynamics regarding media creation. In other words, it’s a lot easier!
So a sequence of images, that the Visual Synopsis is, represents a “moving pictures” chance to offer to the user the chance to turn this into media, either ffmpeg created …
video
animated GIF
… via these changes to TwentyTen theme’s header.php as per …
Hang on! Just a minute there, #@$@#@$@#! What’s with … testgif() above, $%#?
Well, we’re learning, but from what seems to be the go, an animated GIF input to an ffmpeg command needs no framerate mention, and it will fail if you do mention it and your *.gif is an animated GIF … happily always the case with the way this WordPress Blog rolls …
Yesterday, with WordPress Visual Synopsis Slideshow Posting Links Tutorial as shown below, we continued on with our Visual Synopsis view functionality for this blog, adding some Blog Posting Links, and today, we allow for an automated left to right scrolling functionality.
With this automated scrolling we involved a “location.href=’#td_[blog_posting_permalink_code]’;” arrangement rather that a “window.scrollBy(x,y);” or “window.scrollTo(x,y);” method, as this is what worked best on Firefox.
So what coding changes were needed for this blog automated scrolling? It was only the TwentyTen theme’s header.php PHP code (of Javascript) that changed for today’s requirements in bold itallic specifically for today bold itallic specifically for yesterday and just bold for earlier work …
header.php bold onload event changes, as per our usual pattern, as shown below with …
var sscr=false;
var xsscr=0;
var presscr=false;
function startscrolling() {
if (sscr) {
document.getElementById('slide' + 'showdiv').style.borderStyle='dotted';
xsscr++;
var tdplaces=document.body.innerHTML.split('<td id="td_');
if (xsscr >= tdplaces.length) xsscr=1;
var pretdplaces=tdplaces[xsscr].split('"');
if (1 == 1) {
location.href='#td_' + pretdplaces[0];
} else {
document.title=xsscr;
window.scrollTo(xsscr, 0);
document.title='+' + xsscr;
}
setTimeout(startscrolling, 1000);
} else {
document.getElementById('slide' + 'showdiv').style.borderStyle='solid';
}
}
Yesterday, with WordPress Visual Synopsis Slideshow Primer Tutorial as shown below, we started on some Visual Synopsis view functionality for this blog. We got to the point that the blog postings could be summarised up the top in a table enforcing a horizontal line of images and/or slideshow presentations representing the blog posts on the web page the user is currently on. We discuss this also at WordPress 4.1.1 with WordPress Visual Synopsis Slideshow Posting Links Tutorial.
An improvement to this functionality we’ve been developing today is to add some meaning to the relationship between these blog postings because at this blog, blog postings can …
stand alone as a piece of work … or …
be the most recent of a series of blog postings linked, usually reverse chronologically, but not always … or …
be in the middle of a series of blog postings linked … or …
be the oldest of a series of blog postings linked … quite often our “… Primer Tutorial” type of blog posting
We’d like to have the Visual Synopsis reflect these relationships in some ways, so we, respectively …
center justify the blog posting titles for these … and …
left justify the blog posting titles for these and add a single right arrow link to navigate to the next (older) Visual Synopsis cell and add a double right arrow link to navigate to the next (older) Visual Synopsis cell’s blog posting into a new webpage … and …
center justify the blog posting titles for these and add a single left/right arrow link to navigate to the previous/next (more recent/older) Visual Synopsis cell and and add a double left/right arrow link to navigate to the previous/next (more recent/older) Visual Synopsis cell’s blog posting into a new webpage … and …
right justify the blog posting titles for these and add a single left arrow link to navigate to the previous (more recent) Visual Synopsis cell and and add a double left arrow link to navigate to the previous (more recent) Visual Synopsis cell’s blog posting into a new webpage
This is a bit like the very well established web design idea of “breadcrumbs” that you see so often on the web, including WordPress blogs.
So what coding changes were needed for this blog posting linking? It was only the TwentyTen theme’s header.php PHP code (of Javascript) that changed for today’s requirements in bold itallic specifically for today and just bold for yesterday’s work …
function courseCookies() {
img_alt(); // Make sure all img have alt (=title)
ajaxcontexthelp_mode(); // Check on Context Help mode
download_mode(); // Check on Download mode
metasep(); // meta-sep class dropdown
checkpt(); // category and tag "oldest"
rptwo(); // Recent Post images
ul_li_noclass(); // Alternative to bullet ul/li lists
winit(); // Ajax functionality 26/11/2014 ... slow hover ... not for mobile
checkMarginLeftImages();
//setTimeout(checkAcourseBackground, 3000);
if ((ourpp != "" || ourpn != "") && ourpp != ourp && ourpn != ourp) {
quizmaybe('atopn','atopp');
}
var stih=document.getElementById('site-title').innerHTML;
if (stih.indexOf("up" + "top") == -1) { //visualsynopsis=") != -1) {
document.getElementById('site-title').innerHTML+='<a id="avs" style="text-decoration:none;" 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)">🎦</a>'; if (document.URL.indexOf("visualsynopsis=") != -1) document.getElementById('avs').click();
}
WordPress Visual Synopsis Slideshow Primer Tutorial
Think I am not alone in hankering for chances to “cut to the chase” when surfing the web, because, although there is great information out there, there can also be too much of it, and users appreciate ways to reduce the amount to take in, on occasions.
At this blog we try to have a visual side up the top of a blog posting, consisting of a combination of …
one image explaining something about the blog posting … or …
a link to a potential slideshow consisting of several image stills … or …
one image hoverable overable (our so-called “twirl” arrangement, suitable for laptops, at least)
… before the blog posting wording starts.
We figure a good “cut to the chase” could be to leave it as that top bit, as a Visual Synopsis (Slideshows) if the blog postings relevant to the WordPress blog webpage the user is currently on. Sounds a bit silly, when you are already on it? Well, we don’t think it is so silly for one of those blog postings that has been developing over time, especially one that has been using many scenario 1 blog postings in a series, because now, if you pick the latest one of these, and choose to invoke this new functionality …
(which, by the way, is invoked by clicking on the Cinema symbol (🎦 🎦) after the word “Blog” up the top of the page)
… all the relevant images of blog postings will line up from left to right in chronological order.
Down below we allow you to open a new web page taking you to a WordPress 4.1.1 blog posting, whereas if you click the image of the Visual Synopsis (Slideshows) you may be taken to an image or a slideshow or a live run, perhaps … it depends, but is more often than not more involved with the “cutting to the chase” about the matter than reading the wording of the Blog Posting, perhaps.
It’s one of those things that some users may like, and others may not.
So what coding changes were needed for this? It was twofold (basically, though there are Ajax contextual help changes as well), with the usual first suspect being our favourite header.php code changes and then a whole new piece of PHP as per …
function courseCookies() {
img_alt(); // Make sure all img have alt (=title)
ajaxcontexthelp_mode(); // Check on Context Help mode
download_mode(); // Check on Download mode
metasep(); // meta-sep class dropdown
checkpt(); // category and tag "oldest"
rptwo(); // Recent Post images
ul_li_noclass(); // Alternative to bullet ul/li lists
winit(); // Ajax functionality 26/11/2014 ... slow hover ... not for mobile
checkMarginLeftImages();
//setTimeout(checkAcourseBackground, 3000);
if ((ourpp != "" || ourpn != "") && ourpp != ourp && ourpn != ourp) {
quizmaybe('atopn','atopp');
}
var stih=document.getElementById('site-title').innerHTML;
if (stih.indexOf("up" + "top") == -1) { //visualsynopsis=") != -1) {
document.getElementById('site-title').innerHTML+='<a style="text-decoration:none;" 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)">🎦</a>';
}
Ajax contextual help changes affected wajax.js (the generic Ajax Javascript code, and its vacant looking mate nothing.js) (changed as per wajax.js and nothing.js)
We hope you try it (you’re here … yoo hoo!), and like it.
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.
… approach we have used successfully recently did not work here. Anyway, deprecated or non-existant it doesn’t matter, we decided to resort to good ol’ PHP exec methodologies in a new “inhouse slideshow” (featuring in a changed example PHP inhouse slideshow creator web application) call …
if (file_exists($zipisis)) {
$items = glob($hereis . "*[-_][0-9]*of.[jJgGpP][pPiInN]*");
foreach ($items as $key => $val) {
$alreadythere=true;
}
}
if (!function_exists("zip_entry_read")) {
function zip_entry_read($zip_read_output, $zip_entry_len) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_read_output, $gzip_entry_len;
return 'pork';
}
}
if (!function_exists("zip_entry_filesize")) {
function zip_entry_filesize($zip_read_filename) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_entry_filename;
return 'pork';
}
}
if (!function_exists("zip_read")) {
function zip_read($zip_oben_handle) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_open_handle;
return 'pork';
}
}
if (!function_exists("zip_open")) {
function zip_open($zip_filename) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_filename;
$gzip_filename=$zip_filename;
$gzip_number=0;
$gzip_open_handle='pork';
return 'pork';
}
}
if (!function_exists("zip_entry_name")) {
function zip_entry_name($zip_read_output) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_read_output;
return 'pork';
}
}
if (!function_exists("zip_entry_open")) {
function zip_entry_open($zip_open_handle, $zip_read_output, $inmode) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_open_handle, $gzip_read_output;
return 'pork';
}
}
if (!function_exists("zip_close")) {
function zip_close($zip_open_handle) {
global $gzip_filename, $gzip_number, $gzip_log_text, $gzip_open_handle;
return 'pork';
}
}
… as a first draft. We have much more to do trying to resurrect, if possible, some other inhouse PHP web applications we’ve based on the use of Zip in PHP. Pardon us, until tomorrow, while we have a little cry.
… that means we can back up a “peer based” solution such as talked about with Inhouse Slideshow Backup Tidy Up Report Viewing Tutorial (ie. done as a user is surfing the net with some PHP of ours) methodology should it fail. We think we have an occasionally failing one as far as the tidy up of zipped up inhouse slideshows goes. It could be to do with a search engine crawling operation, we have not found out for sure, but we’ve decided to write our own …
PHP … via …
crontab
curl
… based independent tidying up procedure we’ll run once an hour via crontab record …
for ($i=0; $i<sizeof($lines); $i++) {
$lines[$i]=explode("\n", $lines[$i])[0];
if (file_exists(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) {
if (('' . filesize(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) == '38794') {
if (file_exists("slideshow_zero.txx")) {
unlink("slideshow_zero.txx");
}
exec("unzip -l " . $lines[$i] . " | grep '.jpg' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/^ /s///g' | sed '/ /s// /g' | sed '/ /s// /g' | sed '/ /s// /g' | sed '/ /s// /g' | cut -f4 -d' ' | grep '-' > " . dirname(__FILE__) . DIRECTORY_SEPARATOR . "slideshow_zero.txx");
if (file_exists("slideshow_zero.txx")) {
$sublines=file(dirname(__FILE__) . DIRECTORY_SEPARATOR . "slideshow_zero.txx");
for ($j=0; $j<sizeof($sublines); $j++) {
$sublines[$j]=explode(" ", explode("\n", $sublines[$j])[0])[0];
$fis=explode("slideshow_0.zip", $lines[$i])[0] . $sublines[$j];
if (file_exists($fis)) {
$md=filemtime($fis);
if ($md) {
if ((time() - $md) > 1200) {
if (file_exists("slideshow_zero.kkk")) {
exec("rm -f " . $fis); //file_put_contents("slideshow_zero.kkk", file_get_contents("slideshow_zero.kkk") . "rm -f " . $fis . "\n");
} else {
exec("rm -f " . $fis); //file_put_contents("slideshow_zero.kkk", "rm -f " . $fis . "\n");
}
}
}
}
}
}
} else if (1 == 3) {
if (file_exists("slideshow_zero.kkk")) {
file_put_contents("slideshow_zero.kkk", file_get_contents("slideshow_zero.kkk") . "# " . ('' . filesize(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) . " is not 38794 " . str_replace("slideshow_0.zip", "index.php", $lines[$i]) . "\n");
} else {
file_put_contents("slideshow_zero.kkk", "# " . ('' . filesize(str_replace("slideshow_0.zip", "index.php", $lines[$i]))) . " is not 38794 " . str_replace("slideshow_0.zip", "index.php", $lines[$i]) . "\n");
}
}
}
}
if (file_exists("slideshow_zero.txx")) {
unlink("slideshow_zero.txx");
}
if (file_exists("slideshow_zero.txt")) {
unlink("slideshow_zero.txt");
}
if (file_exists("slideshow_zero.kkk")) {
unlink("slideshow_zero.kkk");
}
//echo $htmlis;
exit;
?>
… as that “ahhhhhhhh, what a relief” reliever of tension running the RJM Programming website. The subtext is, our inode limits are a concern!
We think another lesson here is that PHP can be a good alternative to scripting languages such as Korn Shell to create “operational” procedures, especially when you consider that curl means it can be like writing your “surfing the net” type of PHP (slideshow_zero.php) work.
it is information we do not want everyone to be able to see (easily, shall we say) … and in the sense that …
the report is stored away from RJM Programming’s “public_html” folder (ie. its Apache/PHP/MySql “Document Root”) is good … but even with today’s work …
hidden from everybody who does not have access to the RJM Programming’s web server … but …
the administrator of the RJM Programming’s web server (yoo hoo!) wants a mechanism to view the report that does not involve some “arcane procedure” each time to view it
… and so we decided that because …
the administrator of the RJM Programming's web server = the administrator of this blog
… we’d like to organize a system that latches onto that “security footing” and only show a “broom emoji button” (🧹 🧹) way to access the report when the administrator of this blog is logged in. We can do this by amending our Twenty Ten theme’s good ol’ header.php as per (where the “function mlater” you may recall from the days of WordPress Blog Email Post Collaboration Ajax Image Tutorial) …
<?php
$fns="36";
function doisr() {
global $fns;
$inmb="";
if (('' . get_current_user_id()) != '0' && ('' . get_current_user_id()) == '1') {
if (file_exists('/tmp/slideshow_cleanup.txt')) {
$fns="24";
$inmb="<a style=font-size:24px; title='Inhouse Slideshow Tidy Up Report' onclick=\"var iswo=window.open('','_blank','top=100,left=100,height=600,width=730'); iswo.document.write('<html><head><title>Inhouse Slideshow Tidy Up Report</title></head><body><pre>" . str_replace("\n","<br>",file_get_contents('/tmp/slideshow_cleanup.txt')) . "</pre></body></html>'); \">🧹</a> ";
}
}
return str_replace("'","' + String.fromCharCode(39) + '",$inmb);
}
?>
… PHP affects some (PHP writes) Javascript below …
<?php
function mlater() {
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)">🎦</a> <a style="cursor:pointer;text-decoration:none;font-size:<?php global $fns; echo $fns; ?>px;" onclick="diffphpfix(this);" title="Code Difference Functional Links">📖</a> <a style="cursor:pointer;text-decoration:none;font-size:36px;" onclick="popselid();" title="Filter Content via Div ID">➗</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();">➖</a>' + printscreen(0);
if (document.URL.indexOf("visualsynopsis=") != -1) document.getElementById('avs').click();
}
}
}
use zip files to “scrunch up” a series of image files into the one zip file … for the vast majority of time … but when asked to, by a user …
unzip the image files when required by a user wanting to see them … and then …
tidy up, after some delay in time
… but we want to design a PHP way to independently tidy up as a backup mechanism. And we say, with PHP code, that if such files have been on the web server longer than ten minutes, this PHP callable slideshow_cleanup.php code …
<?php
// slideshow_cleanup.php
// RJM Programming
// May, 2022
The recent Inhouse Slideshow Mobile Tutorial did not satisfy all the “mobile usability” tests performed by the “Google Crawl” algorithm, failing on “Content wider than screen”, and you can read some background to this with Google Crawl Viewport Geographicals Tutorial. And so we try some refinements here today, with an idea to control on mobile platforms the max-width CSS property of the document.body of a Inhouse Slideshow webpage, which made up the URLs failing this test at the Google Search Console.
We were reading this great and useful link, thanks, and decided to see whether this stopping of scrolling in X on mobile platform versions of the Inhouse Slideshow webpages gels better with Google Search Console “Google Crawl” Mobility Usability algorithms.
Yet again, deployment of these changes is similar to that last time, and the times before that, as per …
the changedindex.php new “inhouse slideshow” presentation supervisor (exemplified by this live run link) reading of a slideshow_0.zip zip file … was done in …
In a “going off to the right table row of cells” arrangement like this, what are some considerations that improve the user experience (of our inhouse slideshows) for mobile platform users?
turn the “@” link into an “emoji button” as per ➡ ( ➡ )
for both mobile and non-mobile, we’ve decided …
UTF-8 meta …
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<style>
td { vertical-align:top; }
</style>
change the h4 element to be h2 to help with legibility
iOS (ie. iPad and iPhone) PDF iframe elements have known scrolling issues, which we decided to bypass by opening these PDF creations in a new webpage window
Deployment of these changes is similar to that last time, and the times before that, as per …
the changedindex.php new “inhouse slideshow” presentation supervisor (exemplified by this live run link) reading of a slideshow_0.zip zip file … was done in …
Exif Slideshow … and the new, as of today’s work …
PDF Slideshow
… that little bit different in that a PDF Slideshow occupies just the one table cell (rather than the many horizontal cells of the other display modes) and the resultant embedded PDF data vertically scrolls when multiple image slides are involved.
This new option also adds onto this “Inhouse Slideshow” functionality the chance to download and keep a PDF representation of that slideshow to your local system. Perhaps this makes this be of interest to you?!
The changedform_creator.php‘s live run is what gets integrated into the “Inhouse Slideshow” “sisterhood”. We say “sisterhood” because this “Inhouse Slideshow” is designed as a single PHP codefile “hived off” to a lot of other web server folders as their default “index.php” web browser default webpage in a “peer to peer” feeling arrangement. Such an arrangement asks a bit of the deployment arrangements, and we’ve talked about this before (with underlying links pointing to today’s work, should you be interested) …
the changedindex.php new “inhouse slideshow” presentation supervisor (exemplified by this live run link) reading of a slideshow_0.zip zip file … was done in …
But when we say “Unit testing completed” above, we need to fill you in on a Fpdf issue we came across during unit testing of our changes. We were getting a …
FPDF Error: Not a JPEG file
… Fpdf error message choosing the new “PDF Slideshow” option on some, but not all, “Inhouse Slideshow” address bar URLs. And so the online research began as per …
… almost getting us there to a solution (and as far as the last link goes “that was before we posted the suggestion below”). Then we took one of the error messages at its word …
FPDF error: Not a JPEG file: ../Mac/Linux_drutil-238of.jpg
… and independently looked into the issue via Linux (or macOS command line) file command …
# cd $HOME/public_html/Mac
# ls -l Linux_dr*
-rw-r--r-- 1 owner group 724353 Oct 29 08:00 Linux_drutil-238of.jpg
-rw-r--r-- 1 owner group 132707 Oct 29 08:00 Linux_drutil-239of.jpg
-rw-r--r-- 1 owner group 109595 Oct 29 08:00 Linux_drutil-240of.jpg
# file Linux_drutil-238of.jpg
Linux_drutil-238of.jpg: PNG image data, 1280 x 800, 8-bit/color RGBA, non-interlaced
# file Linux_drutil-239of.jpg
Linux_drutil-239of.jpg: JPEG image data, JFIF standard 1.01
#
… when the penny dropped (about our (macOS) Paintbrush slideshow slide creation habits)! We quote our entry into “php – FPDF error: Not a JPEG file: http://10.11.201.93:81/webdocc/uploaded/tes3.jpg – Stack Overflow” …
Have found that constructing slideshows with Paintbrush on a MacBook Pro for years have sometimes been saving what “file jpeg_filename.jpg” determines is a PNG, as a JPEG, which is not the end of the world as far as the browsers go rendering this. Within FPDF’s fpdf.php I fixed my own shortcomings that were resulting in “FPDF Error: Not a JPEG file” via the kludgy “if($a[2]==3) { return $this->_parsepng($file); }” additional codeline below …
… and this change to Fpdf’s fpdf.php fixed the issue in our case for a lot of our previously erroneous “PDF Slideshow” displays of “Inhouse Slideshows”.
PDF Slideshow and Form Creation Helper Primer Tutorial
Our recent work involving the great Fpdf creator of PDF files when we presented Ajax FormData Object No Body PHP PDF Tutorial has got us starting on a new PDF (PHP) web application we are starting out thinking will help with …
online forms (probably via thinking in terms of Fpdf open source programmers like Rick van Buuren and Clément Lavoillotte‘s excellent HTML table rendering ideas) via HTML table intermediate user interactions … and …
slideshows
… but we will not be surprised if the project branches out into other ideas. We’ll see over time.
We hope you come along for the trip starting with a bit of a proof of concept form_creator.php‘s live run for you to try, where we allow you to enter (and be able to change) some HTML table code (if that’s what you end up with?!) in a pink HTML textarea element, and that will become PDF should you click the underlying HTML form’s yellow submit button.
Hope to see you for tomorrow’s PDF writing developments here.
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.
As soon as a web application talks about image slides, as we have been dealing with allowing for the creation of cartoons with our recent cowsay Python API / Command-line tool interfacing PHP web application, maybe as Louis Lumière did many years ago, it brings out media thoughts regarding “moving pictures”. We use, here, at our RJM Programming AlmaLinux web server, the great Open Source ffmpeg to help create such media, in today’s case …
video
animated GIF
… productions using those image slides created via the (again, Open Source) cowsay Python API / Command-line tool …
the inhouse Text to Images web application calls on the cowsay Python API / Command-line tool interfacing PHP web application of yesterday (via our changedlatest draft cowsay.php code) … and that …
called PHP now not only involves Python but a part of today’s Text to Images logic calls on Perl (when trying to display emoji characters (and is imperfect, by the way, but thanks for the heads up)) … which can only mean 36.3 … sorry … 1 thing …
Yes, the great ImageMagick (and we’re using it’s command line “convert” command here to make this happen) can convert text to images (ie. HTML img elements). Now, we’re not saying you always get perfect matches here, but it is akin to mere mortal dreamers think of as “intelligent scanning”. So, we wanted to have this sidetrack, and we will be resuming “normal transmission” shortly?!
We’ll leave you with some cowsay.php new relevant PHP code to ponder …
If you were to ask most people what is more onerous filling in online web forms on the way to making something happen …
we’re guessing, rather than saying button presses …
we’re guessing, they’re more likely to say typing out text …
… with it’s associated tabbing out to negotiate as well. But, supposing we could offer you a “speech to text” approach to performing “typing out text” in our latest cowsay Python API / Command-line tool interfacing PHP web application?
even if it remains hidden, it is still apparent to the focussed cowsay interfacing parent window on account of an orange “microphone on recording” icon appearing for the Google Chrome web browser user up at it’s Menu Bar … and …
the Google Speech to Text smarts help transfer that resultant text over to the textarea of the cowsay interfacing parent window, even avoiding any need to tab out of that textarea element … ahead of …
the rest of the dropdown selections and button presses needed to achieve the user aim of establishing a new slide, perhaps for a Cartoon being created
We’ve long been interested in online web application ideas that end up with a half decent cartoon the user can create, and share, themselves. “Half decent” becomes “fully decent” with a user who has a great imagination. And so, onto yesterday’s Python Cowsay API Primer Tutorial‘s start with interfacing to the great cowsay Python API / Command-line tool we access via the PHP exec method conduit to our AlmaLinux Apache/PHP/MySql Linux web server, today we’ve extended that …
“proof of concept” thinking … onto …
cartoon creation “smarts” … starting with (also egged on here by mobile platform problems with monospaced fonts, it seems like) …
allowing a tabular display of our cowsay components … into …
table cells horizontally aligned (and so, less vulnerable to monospacing inaccuracies) … also allowing …
within any table cell there is a topmost th table cell wording part above a cowsay character td cell lower part …
whenever new cell content happens padding-top adding CSS Javascript DOM nuanced display logic via …
<?php echo ”
function paddingtopit() {
var maxtwo=0, thistwo=0;
var thhs=[], tdhs=[], it=0;
var thdids=[];
//trthtd1
//trtdtd1
var tds=document.getElementsByTagName('td');
for (it=0; it<tds.length; it++) {
if (('' + tds[it].id).indexOf('trtdtd') != -1) {
if (('' + tds[it].style.paddingTop).replace(/^null/g,'').replace(/^undefined/g,'').trim() != '') {
tds[it].style.paddingTop='0px';
}
}
}
for (it=0; it<tds.length; it++) {
if (('' + tds[it].id).indexOf('trtdtd') != -1) {
tdhs.push(eval('' + tds[it].getBoundingClientRect().height));
thdids.push('' + tds[it].id);
}
}
var ths=document.getElementsByTagName('th');
for (it=0; it<ths.length; it++) {
if (('' + ths[it].id).indexOf('trthtd') != -1) {
thhs.push(eval('' + ths[it].getBoundingClientRect().height));
thistwo=eval(thhs[it] + tdhs[it]);
if (thistwo > maxtwo) { maxtwo=thistwo; }
}
}
for (it=0; it<tdhs.length; it++) {
thistwo=eval(thhs[it] + tdhs[it]);
if (thistwo < maxtwo) {
document.getElementById(thdids[it]).style.paddingTop='' + eval(maxtwo - thistwo) + 'px';
}
}
}
“; ?>
… so that …
cartoons present with “speech bubble” wording aligned to the top in our “cells” (ie. th contenteditable=true editable wording on top of td horizontal flip (double click) and/or vertical flop (right click) editable lower part) with those characters aligned to the bottom
We discovered an interesting Open Source Python API / Command-line tool called cowsay which we installed up at our AlmaLinux web server via …
pip install cowsay
… with an integration purpose in mind, so thanks. Before many readers’ time indeed, but some may remember those cute banner printouts that told you who owned the next printout on a spooling “crude graphics” printout in the late 70’s … well cowsay encapsulates those heady days (and who can forget punch cards)?! Before integration, though, we want to test it via a new PHP supervisor on exec method Linux command line interfacings to cowsay.