Yes … in all seriousness to us it depends how we define these ideas. What we said was …
median colour is the one where you line up pixels in order of the (modal) list starting with the more popular one through to the least popular one, and the middle RGB colour value of these we’ll call “the median colour” …
mode colour is easy … the most popular colour (ie. most numerous) … which we had huge help from this great link regarding its suggested PHP GD based code to help, thanks … and …
mean (ie. average) colour is calculated as the rgb(r,g,b) whereby r=moving average of Red pixel “strengths” encountered and g=moving average of Green pixel “strengths” encountered and b=moving average of Blue pixel “strengths” encountered
Why couldn’t a colour system be …
pfoa([pink amount 0 up to 255], [fuchsia amount 0 up to 255]], [olive amount 0 up to 255], [transparency amount 0 to 1]);
?
Well, yes, there are lots of colour systems? There’s one with Cyan and Magenta and something else, but, guess we’re wondering if there is a transference mechanism (in mathematics, like)? And, “is your Red” like “my Red”, is curious with all this?! Anyway, enough philosophy!
HTML/Javascript Binary to Hexadecimal Base Game Tutorial
Remember being pointed out, at school, in mathematics, how you could have numerical counting systems that weren’t base 10, and it blowing my tiny little mind! Then, in high school, imaginary numbers … wow! Still don’t know what they’re useful for?! But, for us, the point is, it can unhinge you to be thrown into, say, what we’d call “a dimensional thing” that you are just not used to.
The next few days we’re devoting to a little more of this sort of thing, with …
today, extending on from the base 2 (binary) and base 8 (octal) and base 16 (hexadecimal) themes of the quiz game of HTML/Javascript Binary/Octal/Hexadecimal Game Tutorial to allow for base numbers you set all the way from 2 to 16 (and please don’t ask me, yet, about fractional (ie. mantissaish) real number representations) … and …
tomorrow, though we really wanted to break open colour Red/Green/Blue (ie. RGB) thinking to other “base thoughts”, for now, because we haven’t found any suitable lead ins yet, we’re settling on the exploration of PHP image “average colour” themes
In today’s quiz work we melded those new base modes of play into the Hexadecimal Way (turn left at Station Street, up High Street, down Lowdown Crook, straight into Park Lane, hard right at Mayfair, and take the Town Drain home or away) where we started adjusting dropdown (ie. select) element innards so as to show blank options, then resurrect them, rather then reinventing 12? wheels …
function restorestuff() {
var sv='';
var parts=[], wasbit='', nowbit='', subparts=[], isp=0, numtodo='';
if (1 == 2) {
var opts=document.getElementsByTagName('options');
for (var iopts=0; iopts<opts.length; iopts++) {
if (opts[iopts].value != '00') {
if (opts[iopts].innerText != opts[iopts].value) {
opts[iopts].Text=opts[iopts].value;
}
}
}
}
My head hurts thinking about what we’d have had to do to make the other base that we use a lot around here, work! That base is 64, used a lot with webpage information encoding and decoding these days. Think …
to pass across data that is programming language … ie. bound to contain some + characters … being that + is also used to encode a space character … how do you tell the difference between these guises at the other end? … well, lately, we’ve been …
introducing a form onsubmit event where, maybe just for the few seconds needed, the textbox or textarea content is changed to base64 via window.btoa and at some time after the return true; that finishes the event logic you might want to revert back (ie. use combination of setTimeout and window.atob to revert back, for this purpose) … and at the receiving end …
for HTML/Javascript (or PHP, for that matter) use window.atob (only) or for PHP use base64_decode (only) …
to better preserve real + characters in the transfer
HTML/Javascript Binary/Octal/Hexadecimal Game Tutorial
Are you feeling transformational? Maybe calculating? Perhaps didactic? Witheringly logical? You can test how you feel, in a mathematical sense, by playing our “Binary/Octal/Hexadecimal” game today.
The study of bases other than (decimal) 10 in mathematics is very interesting and it is used a lot in computing, a simple example of which is notation like #ffffff to describe the colour white, which lots of us were taught at school as the colour that contains the lot, hence all the 255 (hexadecimal ff) of Red and 255 (hexadecimal ff) of Green and 255 (hexadecimal ff) of Blue in the RGB colour model system. You might think that a computer would be able to work faster with the smaller amounts of data of hexadecimal, but, basically, the computer will, eventually, go and turn this into binary because at the bottom of its design it understands on and off, as you would understand voltage on a Bugs Bunny cartoon if you were the Coyote just missing the Roadrunner, running into an electrical socket running an Eat at Joes sign being switched off, on (sizzle), off, on (sizzle), off, on (sizzled Coyote, meet Daffy Duck?!).
Anyway, see how you go with this game that asks you to solve 5 problems as quickly as possible. One way around you can cheat the system, and this is fine by me, in the sense that the intention is just to put that picture in your head of the powers of 2 involved to get a little bit familiar with them. Another way to do this is to access a text editor that can simultaneously display a hexadecimal view (or dump) of that data. UltraEdit on Windows can do this.
Here is a link to some downloadable HTML (with Javascript) programming code you could rename to binary_quiz.html and a live run.
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.
HTML/Javascript Binary to Hexadecimal Base Game Tutorial
Remember being pointed out, at school, in mathematics, how you could have numerical counting systems that weren’t base 10, and it blowing my tiny little mind! Then, in high school, imaginary numbers … wow! Still don’t know what they’re useful for?! But, for us, the point is, it can unhinge you to be thrown into, say, what we’d call “a dimensional thing” that you are just not used to.
The next few days we’re devoting to a little more of this sort of thing, with …
today, extending on from the base 2 (binary) and base 8 (octal) and base 16 (hexadecimal) themes of the quiz game of HTML/Javascript Binary/Octal/Hexadecimal Game Tutorial to allow for base numbers you set all the way from 2 to 16 (and please don’t ask me, yet, about fractional (ie. mantissaish) real number representations) … and …
tomorrow, though we really wanted to break open colour Red/Green/Blue (ie. RGB) thinking to other “base thoughts”, for now, because we haven’t found any suitable lead ins yet, we’re settling on the exploration of PHP image “average colour” themes
In today’s quiz work we melded those new base modes of play into the Hexadecimal Way (turn left at Station Street, up High Street, down Lowdown Crook, straight into Park Lane, hard right at Mayfair, and take the Town Drain home or away) where we started adjusting dropdown (ie. select) element innards so as to show blank options, then resurrect them, rather then reinventing 12? wheels …
function restorestuff() {
var sv='';
var parts=[], wasbit='', nowbit='', subparts=[], isp=0, numtodo='';
if (1 == 2) {
var opts=document.getElementsByTagName('options');
for (var iopts=0; iopts<opts.length; iopts++) {
if (opts[iopts].value != '00') {
if (opts[iopts].innerText != opts[iopts].value) {
opts[iopts].Text=opts[iopts].value;
}
}
}
}
My head hurts thinking about what we’d have had to do to make the other base that we use a lot around here, work! That base is 64, used a lot with webpage information encoding and decoding these days. Think …
to pass across data that is programming language … ie. bound to contain some + characters … being that + is also used to encode a space character … how do you tell the difference between these guises at the other end? … well, lately, we’ve been …
introducing a form onsubmit event where, maybe just for the few seconds needed, the textbox or textarea content is changed to base64 via window.btoa and at some time after the return true; that finishes the event logic you might want to revert back (ie. use combination of setTimeout and window.atob to revert back, for this purpose) … and at the receiving end …
for HTML/Javascript (or PHP, for that matter) use window.atob (only) or for PHP use base64_decode (only) …
to better preserve real + characters in the transfer
HTML/Javascript Binary/Octal/Hexadecimal Game Tutorial
Are you feeling transformational? Maybe calculating? Perhaps didactic? Witheringly logical? You can test how you feel, in a mathematical sense, by playing our “Binary/Octal/Hexadecimal” game today.
The study of bases other than (decimal) 10 in mathematics is very interesting and it is used a lot in computing, a simple example of which is notation like #ffffff to describe the colour white, which lots of us were taught at school as the colour that contains the lot, hence all the 255 (hexadecimal ff) of Red and 255 (hexadecimal ff) of Green and 255 (hexadecimal ff) of Blue in the RGB colour model system. You might think that a computer would be able to work faster with the smaller amounts of data of hexadecimal, but, basically, the computer will, eventually, go and turn this into binary because at the bottom of its design it understands on and off, as you would understand voltage on a Bugs Bunny cartoon if you were the Coyote just missing the Roadrunner, running into an electrical socket running an Eat at Joes sign being switched off, on (sizzle), off, on (sizzle), off, on (sizzled Coyote, meet Daffy Duck?!).
Anyway, see how you go with this game that asks you to solve 5 problems as quickly as possible. One way around you can cheat the system, and this is fine by me, in the sense that the intention is just to put that picture in your head of the powers of 2 involved to get a little bit familiar with them. Another way to do this is to access a text editor that can simultaneously display a hexadecimal view (or dump) of that data. UltraEdit on Windows can do this.
Here is a link to some downloadable HTML (with Javascript) programming code you could rename to binary_quiz.html and a live run.
If this was interesting you may be interested in this too.
If this was interesting you may be interested in this too.
The way the functionality style of today’s Use iPhone as Webcam for Nearby macOS signature procedure mentions …
… is close to …
… regarding a prerequisite to how this Webcam functionality functions, made me think, in a similar ilk to the previous Apple iPad to New iPad Bluetooth Assisted Setup Tutorial‘s role for bluetooth, we were actually needing bluetooth again, though none of the install setup mentioned it. But, more and more, clever functionality can happen between Apple devices (whether they be iOS or macOS … like our iPhone and MacBook Air featuring today) either sharing …
the same WiFi network … a possibility here too … and/or …
bluetooth
… technology. Anyway, irrespective of the innards of how it works, the idea is pretty interesting, perhaps as a great way to document the action of a procedure, that needs tactile explanation, as distinct from screenshots being able to explain the procedure. If totally a tactile thing, we can see it as extremely useful. As a programmer explaining code though, we’ll want to duck out of Webcam mode and into and out of Screenshot mode. Mind you, with practice, a webcam can do it all, we’re sure. It just takes practice!
Apple iPad to New iPad Bluetooth Assisted Setup Tutorial
As with the install qualities bluetooth helped out with during Apple TV Setup via WiFi and Bluetooth Tutorial, the other day we had occasion to setup a new iPad (preferably the same as an ailing old iPad) and, again, bluetooth came to the rescue making an Apple install or setup a very easy and enjoyable experience.
For more than 90% of the setup, including the absorption of a myriad of app installs and password rememberings, the simple steps of …
hold the old iPad near the new iPad … and …
patience (while bluetooth assisted install takes place)
We’re following up on the previous Apple TV Primer Tutorial with an upgrade because it is far more functional today, with its live television options (doing away with the need for television aerials for live streaming alternative), and we want to admire the Apple TV setup’s adroitness combining …
WiFi … and …
Bluetooth
… those two “giants” of modern personal computing networking functionality.
Those two appearing together all the time in Settings scenarios, we’ve often wondered how best to combine their talents, and the recent Apple TV version’s setup used them effectively (though optionally) to our minds.
At a certain point in the setup a choice that could make use of WiFi and Bluetooth together saved us having to remember Apple ID passwords and other such matters. At this point you could bring your other Apple device up close to the Apple TV device during the setup and arrange that Bluetooth was on, and it proceeded as if to suck the useful setting data out of the iPad device we offered up to the “Apple TV God”.
Do you like the jiggle? Let me explain. In iOS land you can delete mobile apps, effectively, by holding a touch down for a while, and waiting for all the icons to jiggle, and (re)touch any you want to delete. Well, the Apple TV operating system can work the same way. Also the same mobile app Install and Open arrangements, so the setup will be familiar to many, am sure.
Do you own Apple devices like iPads and iPhones? Do you have a home WiFi wireless router? And do you have a reasonable modern television, or other home-theater device?
Three yes (or yes, no, yes might still work (with AirPlay) on reading here), here, and if you don’t already (have it and working), you might be interested in a product called Apple TV, a hardware product consisting of a “box” and a remote control.
With Apple TV, whatever you can do with video, and/or streaming services, on the iPad or iPhone can often be “projected” (or (Apple says) “mirrored”) onto that much bigger television screen, so that a presentation or piece of entertainment can be shared with others.
The setup is easy, as you can see from this link from Apple …
To start over at any time, unplug your device from power, then plug back in.
Plug into power. Plug your Apple TV into power. …
Connect to your home-theater devices. … with an HDMI cable …
Turn on your television to find the setup screen. …
Connect your remote. …
Pick language settings. …
Choose how to finish setup.
Much more amazing than that “old days” feeling of a Windows desktop being projected onto multiple screens at once!
Today’s tutorial picture shows Apple TV in action around our way.
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.
YouTube Video API Event Playlist Save and Recall Tutorial
Meanwhile, back at the wishlist, with our recent YouTube API interfacing web application project …
st*_st* way to set mute straight away via $_GET[‘mute’] and/or blanks in duration get and a hashtag way to temporarily mute
Save a playlist for later via window.localStorage
Share a playlist
Radio and Oneatatime with a straight hashtag URL
Mute and unmute dynamically
Turn “-” into a reset link
Amalgamate entries searched for into IP address and raw character sets (perhaps collected in top.document.title)
… it is the olive ideas we’ve made a start on today. We say “we’ve made a start on” only because, when it comes to programming, it doesn’t pay to close off alternate ideas as you go about looking for solutions. Take “Amalgamate entries searched for into IP address and raw character sets (perhaps collected in top.document.title)” (for some reason we’re nicknaming “innerHTML” … who wrote this script) …
… well, yes, that would be nice, but, more to the point, we started involving top.document.title in solution making but then, along the way, started incorporating just plain and simple Javascript get/set functionality …
var ajaxs_ih='';
function get_ajaxs_ih() {
return ajaxs_ih;
}
function set_ajaxs_ih(wht) {
ajaxs_ih=wht;
}
… parent.get_ajaxs_ih() and parent.set_ajaxs_ih(strIn) references from the “parent” level referencing the “grandparent” level (of code above) and being able to populate those YouTube search dropdowns more efficiently. This get/set paradigm is “a classic” methodology in a lot of OOP work, further to the recent YouTube Video API Event Radio Play Sharing Tutorial.
st*_st* way to set mute straight away via $_GET[‘mute’] and/or blanks in duration get and a hashtag way to temporarily mute
Save a playlist for later via window.localStorage
Share a playlist
Radio and Oneatatime with a straight hashtag URL
Mute and unmute dynamically
Turn “-” into a reset link
Amalgamate entries searched for into IP address and raw character sets (perhaps collected in top.document.title)
And yes, we want to try to get a mobile Radio scenario working for mobile, perhaps, by researching YouTube API (their) playlists … no guarantees, as you’d imagine!
Of interest, here, might be the “emoji means” and top.document.title means by which we tackle the Mute and unmute dynamically issue. Why use top.document.title here? Well, a grandchild of the grandparent is best placed to …
tell the grandparent the non-muted volume (which seems to always be 100, as you control what 100 means with the actual volume you have for your speakers) … as well as …
obey a grandparent edict to either …
mute
unmute
… the volume as our way to say “keep playing the radio but shush while I take this phone call” in certain scenarios that might happen
… meaning that all the grandparent has to do, effectively “broadcasting” to any “grandchildren YouTube video players”, is “the emoji flagging work” and adjusting (what it knows as) document.title to perform this functionality for the two new input type=checkboxes (appended by an empty span element and nested in a span id=smute element) we add into the HTML design mix via onchange event function Javascript …
… Javascript event control of it’s “bubbling” (up through an element hierarchy), in other words, depending where you place this, stopping it’s “bubbling up” at that element concerned …
The stopPropagation() method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases. It does not, however, prevent any default behaviors from occurring; for instance, clicks on links are still processed. If you want to stop those behaviors, see the preventDefault() method. It also does not prevent propagation to other event-handlers of the current element. If you want to stop those, see stopImmediatePropagation().
We find, around here, we don’t know we’ve created a need for event.stopPropagation() usage until we’ve stumbled onto it, most of the time, so trying to get in ahead of it with today’s proof of conceptto event.stopPropagation() or not to event.stopPropagation() web application feels a bit novel to us, in a good way.
This means by which to toggle that mode of use was more straightforward than “data control” with our musical YouTube API video functionality allowing a user to choose and slot in their own video ideas via either …
YouTube video ID … 11 characters long … or …
search string to try to select a video, via a programmatically populated dropdown, with an 11 character long YouTube video ID
… asking us to do a fair bit of tweaking to our inhouse interfacing …
The recent Making Of Earth Scanner Legs Tutorial set us to thinking about how to offer a toggling arrangement between our inhouse YouTube Embedded Iframe API playing of …
video … with an incarnation of this that plays …
audio … “sort of” only (but able to be toggled back to video playing)
… and it got us wondering how to “dull out” a video. We chose the CSS …
<style>
iframe { filter: invert(45%); }
</style>
If you want a “complete dull out” try filter: invert(50%); … but we wanted to see controls down the bottom, still useful for audio only playing.
AlmaLinux Apache Status Report Inspiration Tutorial
Examining the RJM Programming’s Apache web server’s cPanel‘s …
Apache Status
… report, showing RJM Programming URL accesses in real time, can be very eye opening. Among recent surprises we got there were accesses ( regarding PHP $_SERVER[‘REQUEST_URI’] … ie. the stuff after www.rjmprogramming.com.au ) starting with …
Another day, another use for (in our case Google Chrome web browser) web inspector functionality. Yes, even if the source of the issue is PHP (which we moved on from a CentOS starting with 5 version to an AlmaLinux version starting with an 8) we’re yet to see an issue that could not be resolved with the help of a clientside web inspector debugging arrangement. Of course, the simpler the PHP the more likely this is to happen, but we can’t emphasise enough how useful these web inspectors are.
Today’s case in point revisits the use_time.htm clientside web application we talked about at HTML5 Time Tag Timeline Tutorial. Moving to AlmaLinux, and revisiting it on trying …
examining Apache Status log every now and then … via (now AlmaLinux cPanel but used to also be on CentOS cPanel) Apache Status report we talked about at CentOS Web Server cPanel Apache Status Tutorial
… as a “what the users are trying” resource available for AlmaLinux (cPanel using) web masters to keep in touch with goings on … was fun.
The fix, again, was to do with our “assumptive” PHP5 associative array logics … will Nala ever learn?!
The recent HTML5 Time Tag Primer Tutorial introduced the time tag, an HTML5 initiative, into our frame of reference here at this blog. As soon as date and/or time come into the picture the “when” of life comes into focus, and the use of the fourth dimension. As such, this HTML time tag can be the launching pad for interfacing to other “when” based web applications we’ve developed here.
take the opportunity, while the HTML is so separated from the Javascript (and CSS) in this project to move the Javascript to an external Javascript use_time.js (causing the HTML and CSS to shrink in this way)
With changes like this it can be important to leave the door open for people to not access this new Timeline (in an HTML iframe element), in terms of backward compatibility “friendliness”, and we allow for that via either/both bold (part of) ways below …
HTML and CSS parent use_time.htm calling supervised Javascript use_time.js via …
<script type='text/javascript' src='use_time.js?notimeline=y'></script>
But we are of the view that interfacing to other web applications with synergies is generally a good thing to do, and can inspire other ideas to develop regarding improvements to functionality.
You might be forgiven reading this webpage about the time tag introduced with HTML5 that it is not of much use, because it doesn’t show any distinguishing feature yet, in any of the web browsers.
But you can tailor the use of it yourself, and to show this we took the HTML lacking a <head></head> section and not change this HTML at all, but add our own CSS and Javascript (DOM) <head></head> section to embellish its functionality considerably.
document.body.innerHTML+=styles; // Javascript where styles variable contains dynamically constructed <body></body> section CSS <style></style> (an important thing to remember you can do (at a document.body onload event Javascript function, for example)) … and for this we used …
dynamically classed HTML time elements and moving on the onclick event (for mobile device use) as per …
times[iw].onclick = function() { };
times[iw].className+=' atime' + iw; // the times array which is derived via
var times=document.getElementsByTagName('time');
to be able to dynamically populate that styles variable as per codelines like …
styles=styles.replace("</style>"," .atime" + iw + ":hover::after { content: ' is " + sin(yyyy2,4) + "/" + sin(mm2,2) + "/" + sin(dd2,2) + " " + sin(hh2,2) + ":" + sin(minm2,2) + ":" + sin(ss2,2) + "'; } </style>");
Here is a link to some downloadable HTML programming source code which you may want to rename to use_time.html for this live run link.
Stop Press
If you were an “early bird” reading the early editions of this blog post, sorry, but you will have missed this, perhaps, and then again, maybe I am wasting my time pointing this out, but, since those early editions we’ve added a couple of iw links that harness some new functionality we have in our “highlighting” armoury (shall we say) making use of the new HTML5 mark tag, which we’ll be detailing more about in tomorrow’s blog posting. Clicking these links effectively does a web browser “View Page Source” type of functionality, but also highlights and positions (to first find), in situations like the “iw” one, where it is just a counter, but is unexplained, so we leave it up to curious users to find out something about its context.
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.
st*_st* way to set mute straight away via $_GET[‘mute’] and/or blanks in duration get and a hashtag way to temporarily mute
Save a playlist for later via window.localStorage
Share a playlist
Radio and Oneatatime with a straight hashtag URL
Mute and unmute dynamically
Turn “-” into a reset link
Amalgamate entries searched for into IP address and raw character sets (perhaps collected in top.document.title)
And yes, we want to try to get a mobile Radio scenario working for mobile, perhaps, by researching YouTube API (their) playlists … no guarantees, as you’d imagine!
Of interest, here, might be the “emoji means” and top.document.title means by which we tackle the Mute and unmute dynamically issue. Why use top.document.title here? Well, a grandchild of the grandparent is best placed to …
tell the grandparent the non-muted volume (which seems to always be 100, as you control what 100 means with the actual volume you have for your speakers) … as well as …
obey a grandparent edict to either …
mute
unmute
… the volume as our way to say “keep playing the radio but shush while I take this phone call” in certain scenarios that might happen
… meaning that all the grandparent has to do, effectively “broadcasting” to any “grandchildren YouTube video players”, is “the emoji flagging work” and adjusting (what it knows as) document.title to perform this functionality for the two new input type=checkboxes (appended by an empty span element and nested in a span id=smute element) we add into the HTML design mix via onchange event function Javascript …
… Javascript event control of it’s “bubbling” (up through an element hierarchy), in other words, depending where you place this, stopping it’s “bubbling up” at that element concerned …
The stopPropagation() method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases. It does not, however, prevent any default behaviors from occurring; for instance, clicks on links are still processed. If you want to stop those behaviors, see the preventDefault() method. It also does not prevent propagation to other event-handlers of the current element. If you want to stop those, see stopImmediatePropagation().
We find, around here, we don’t know we’ve created a need for event.stopPropagation() usage until we’ve stumbled onto it, most of the time, so trying to get in ahead of it with today’s proof of conceptto event.stopPropagation() or not to event.stopPropagation() web application feels a bit novel to us, in a good way.
This means by which to toggle that mode of use was more straightforward than “data control” with our musical YouTube API video functionality allowing a user to choose and slot in their own video ideas via either …
YouTube video ID … 11 characters long … or …
search string to try to select a video, via a programmatically populated dropdown, with an 11 character long YouTube video ID
… asking us to do a fair bit of tweaking to our inhouse interfacing …
The recent Making Of Earth Scanner Legs Tutorial set us to thinking about how to offer a toggling arrangement between our inhouse YouTube Embedded Iframe API playing of …
video … with an incarnation of this that plays …
audio … “sort of” only (but able to be toggled back to video playing)
… and it got us wondering how to “dull out” a video. We chose the CSS …
<style>
iframe { filter: invert(45%); }
</style>
If you want a “complete dull out” try filter: invert(50%); … but we wanted to see controls down the bottom, still useful for audio only playing.
So far, it seems, until today, and we were surprised, we’d only been thinking ….
Text to Speech macOS say … usage, and expecting success with … Small Amounts of Data … but today, with a future plan in mind we announce …
Text to Speech macOS say Large Data Mark I
… an idea we had was the motivation for the recent Text to Speech work? Part of that “set of ideas” was work to do with Speech to Text we only allow functionality interfacing with …
Text to Speech macOS Say Large Data Local Web Server Tutorial
Are all kludges coming from the “optimistic side of the mind equation“? Today, we did one regarding integrating “say” (which is macOS based only) in our changedmacos_say_record.php PHP Voiceover inhouse web application to a local macOS Apache/PHP/MySql web server such as MAMP to see where we are going with all this, when choosing one of the “say” dropdown options, public website “button integration” via Safari web browser …
Where we ran out of options on server and client sides, and just optimistically presented a button in hope, with the understanding we had insufficient proof that clicking on that button would result in navigation to a legitimate local web server URL such as is on a macOS MAMP local web server environment
… and wonder whether this is the case?!
Today’s “work remit” was really simple. On any of the (non argumentative) simplest public website incarnation calls of our Voiceover inhouse web application we wanted to …
not present any popup windows (improving on very kludgy efforts of the past) presenting …
an evidence based logic offering of a (newly presented) “say” button, the click of which navigates the user to a (so far just macOS local Apache/PHP/MySql web server MAMP port 8888 based) URL able to reach that user’s local operating system “say” command via PHP exec or passthru calls because they’ve got MAMP installed locally along with having macos_say_record.php local system positioning equate to
HTTP://localhost:8888/macos_say_record.php
Satisfying not resorting to kludgy popup window involvement, but only sidestepping CORS issues working with a cross-domain scenario, rather than a scientific and rigorous solution. Sometimes needs must?!
Text to Speech macOS Say Large Data Sharing Tutorial
Part of improving a web application regarding “large data” is offering some sharing functionality for “large data” scenarios, but this project we have learnt, it being unique regarding the “macOS only say” aspects to it, have taught us not to go overboard trying to cater for everything here. Yesterday’s Text to Speech macOS Say Large Data Tutorial got us started regarding “large data” scenarios where it was just designed for the single user usage. This does not require the transfer of data from that macOS local web browser environment up to a pubic website (Linux) web server environment, involving audio files that can become too large for comfort, often, here.
Our biggest dilemma in this work was, so far in testing we found, only the Firefox web browser would accept either of …
“a” “mailto:” link of too big a length involving the audio data URI contained in a hashtag, initiated from localhost MAMP environment
call of public website version of macos_say_record.php involving the audio data URI contained in a hashtag, initiated from localhost MAMP environment
… else the all too common …
about:blank#blocked
… would stymie our efforts in “large data” scenarios, where audio data URIs appear within the email link URL hashtag part. Guess we just lost 80% of the audience (except if we tell you now we rely less on audio data URIs appearing within the email link URL hashtag part). But we really wish users would not get spooked by seeing “about:blank#blocked” and think there is anything sinister necessarily, but rather try new web browsers, and try new ways of using free tools. What we are trying to show here, in a free way, is a bit of a way in to some aspects of what people refer to as “artificial intelligence” coming “out of the box” from an operating system. No service fee … just what should be happening from big players down to users on the Internet. It should be applauded, rather than suspected regarding “kludginess”, because the software basis is free, in contrast to the squillions of services popping up that are far from free.
Anyway, you can try downloading our changedmacos_say_record.php PHP Voiceover inhouse web application to a local macOS Apache/PHP/MySql web server such as MAMP to see where we are going with all this, when choosing one of the “say” dropdown options, via …
So far, it seems, until today, and we were surprised, we’d only been thinking ….
Text to Speech macOS say … usage, and expecting success with … Small Amounts of Data … but today, with a future plan in mind we announce …
Text to Speech macOS say Large Data Mark I
… where you feed the wonderful macOS say command a whole block of code, say?! We did this in all innocence earlier today and … gasp … it failed.
Since then though, we’ve chipped away at some of the issues and discovered two ideas …
for huge amounts of data the macOS say command has a useful …
-f [inputFileName]
… switch idea and for …
command lines avoiding the use of ” or ‘ initial delimitation we can use backslash character escaping for those ascii characters less than (32 for) space
There’s more to “large data” issues in this our changedmacos_say_record.php PHP Voiceover inhouse web application (that we last talked about with Haiku Image Tutorial) than this start today, but it is an encouraging start for our idea’s progression.
Why do we mention macOS when our public web server is Linux, in terms of operating systems? Yes, this work presupposes you have a macOS operating system in your life, because that is where you see the …
say
… command in its natural environment. Not a pretty sight at times …
Down, I say. “Say”, I down.
… but if you stick to the correct feeding times, well … you may just reap the benefits on a local Apache/PHP/MySql web server environment such as MAMP where we have our macos_say_record.php accessing passthru or exec accessing say via URL …
HTTP://localhost:8888/macos_say_record.php
… where the macOS “out of the box” say command, among other Voiceover ideas, is in play as the great Text to Speech tool that it is.
? And then, sometime between then and now were you a “Doubting Thomas” thinking we’d forgotten about that statement? And while we’re at it, where were you on February 6, 2025 03:01 AEST?
I’m conflicted if your answers are “No” and “Robbing a bank” but, be that as it may, “we did have an integration purpose in mind” and we’ve come back to it via Haiku poetry, and a web application we wrote some time ago regarding them, and it interfaced to the theme of “the integration purpose in mind” … well you had to be there, said Putricia?!
Yes, it’s the case that hoping for the umpteenth re-researching whether anything manageable Linux wise can match what the great macOS say command has done for Speech to Text relations since Audrey Hepburn’s speech … and coming back with a “No” yet again … we started looking at it a bit more laterally and thought 😜😜 …
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.
… Javascript event control of it’s “bubbling” (up through an element hierarchy), in other words, depending where you place this, stopping it’s “bubbling up” at that element concerned …
The stopPropagation() method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases. It does not, however, prevent any default behaviors from occurring; for instance, clicks on links are still processed. If you want to stop those behaviors, see the preventDefault() method. It also does not prevent propagation to other event-handlers of the current element. If you want to stop those, see stopImmediatePropagation().
We find, around here, we don’t know we’ve created a need for event.stopPropagation() usage until we’ve stumbled onto it, most of the time, so trying to get in ahead of it with today’s proof of conceptto event.stopPropagation() or not to event.stopPropagation() web application feels a bit novel to us, in a good way.
This means by which to toggle that mode of use was more straightforward than “data control” with our musical YouTube API video functionality allowing a user to choose and slot in their own video ideas via either …
YouTube video ID … 11 characters long … or …
search string to try to select a video, via a programmatically populated dropdown, with an 11 character long YouTube video ID
… asking us to do a fair bit of tweaking to our inhouse interfacing …
The recent Making Of Earth Scanner Legs Tutorial set us to thinking about how to offer a toggling arrangement between our inhouse YouTube Embedded Iframe API playing of …
video … with an incarnation of this that plays …
audio … “sort of” only (but able to be toggled back to video playing)
… and it got us wondering how to “dull out” a video. We chose the CSS …
<style>
iframe { filter: invert(45%); }
</style>
If you want a “complete dull out” try filter: invert(50%); … but we wanted to see controls down the bottom, still useful for audio only playing.
