Shower Songs Delimitation Role Tutorial
You’d think we’d be done with ablutions at this blog, but noooooo wayyyy … Luna says … there’s all manner of molecular interest out there …
It’s not just H and the 2 and the O … it’s the art of the
roleroll.
… or so says “The Lu” anyway!
We wanted our recent Shower Songs web application be the application of choice for URLs at RJM Programming involving …
- comma separated (ie. tightly separated) delimiter lists … consisting of …
- seven items … each …
- eleven characters long … and satisfying …
- our YouTube video identifier code tests ( ie. end in a particular character within AEIMQUYcgkosw048 and encodeURIComponent([thisCode]) == [thisCode] ) … else, other comma separated lists might be passed onto Tabular Single Row Image Gallery
… akin to Operating System application “associations”, and carrying on the themes talked about with Media Data URI WordPress Blog Not Found Redirect Tutorial and the recent Shower Songs Colour Coding Tutorial.
It’s going to take longer than today’s work, but progress is there with a “first draft” of making this happen involving …
- the changed shower_songs.html external Javascript powered Shower Songs (at the grandparent level)
- the changed karaoke_youtube_api.htm YouTube API inhouse supervisor (at the parent level)
- the changed stop_start_youtube.html YouTube API inhouse interfacer (at the grandchild/child level) … all helped out by …
- the changed ytaudioonly.js external Javascript helper
… along with the RJM Programming’s 404.shtml HTTP Error Code 404 supervisor …
if (eval(('' + encodeURIComponent((decodeURIComponent(document.URL.replace(anybitstoignore,'').replace('.au ','.au/').replace('.au%20','.au/').split('rjmprogramming.com.au/')[1].replace(/^index\.php/g,'').replace(/^index\.html/g,'').replace(/^index\.htm/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'')) + ',').replace(/[AEIMQUYcgkosw048]\,/g,'z'))).length) == 77 && eval(('' + decodeURIComponent(document.URL.replace(anybitstoignore,'').replace('.au ','.au/').replace('.au%20','.au/').split('rjmprogramming.com.au/')[1].replace(/^index\.php/g,'').replace(/^index\.html/g,'').replace(/^index\.htm/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,''))).length) == 83 && eval('' + decodeURIComponent(document.URL.replace(anybitstoignore,'').replace('.au ','.au/').replace('.au%20','.au/').split('rjmprogramming.com.au/')[1].replace(/^index\.php/g,'').replace(/^index\.html/g,'').replace(/^index\.htm/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'')).split(',').length) == 7) {
location.href='//www.rjmprogramming.com.au/HTMLCSS/shower_songs.html?thelist=' + encodeURIComponent(decodeURIComponent(document.URL.replace(anybitstoignore,'').replace('.au ','.au/').replace('.au%20','.au/').split('rjmprogramming.com.au/')[1].replace(/^index\.php/g,'').replace(/^index\.html/g,'').replace(/^index\.htm/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'').replace(/^\%20/g,'')));
}
… making it swing the Shower Songs into play with an erroneous URL such as …
Previous relevant Shower Songs Colour Coding Tutorial is shown below.
Shower Songs Colour Coding Tutorial
YouTube API Songname Providence Shower Songs Tutorial of recent times had us interfacing …
- song providence via Wikipedia ideas … with …
- our inhouse Shower Songs project using YouTube API means to “Radio Play” some, let’s say, “theatrical pursuits by the water”
A couple of times now, we’ve used it as company in the bath via an iPhone, preparing the list ahead of ever having to tap another anything, to hear some songs in the sequence the user establishes ahead of time … ie. the purpose of this web application.
However, we made some bad colour choices, especially regarding the mobile red button overlayed by black text containing the song title. It was hard to see. It is easier now, that text being yellow.
While there, we decided on a pale green background colour to apply to the textarea user interactive input and progress displaying conduit, when it’s relevant YouTube video is playing (in audio stream only mode), and another principle of our Shower Songs logic is that you should only see one pale green textarea for any great period of time … ie. the songs play in sequence, and looping around in continuous play, like on the radio.
Believe it or not, the actual top level hierarchy Shower Songs window needs no changes for this, but …
- the changed …
<script type=text/javascript>
if (navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i) || eval('' + navigator.maxTouchPoints) > 0) {
if (window.parent != window.self) {
if (('' + top.document.URL).indexOf('/shower_songs.htm') != -1 || ('' + parent.document.URL).indexOf('/shower_songs.htm') != -1) {
document.write('<div><sty' + 'le> button { color: yellow !important; font-weight: bold !important; text-shadow: -1px 1px 1px #e52dff !important; } </sty' + 'le></div>');
}
}
}
</script>
</body>
… karaoke_youtube_api.htm inhouse YouTube video interfacer helps with the yellow font via CSS … while with the supervised we have … - a changed two scenario Javascript situation …
// textarea gets a pale green background
if (('' + top.document.URL).indexOf('/shower_songs.htm') != -1 || ('' + parent.parent.document.URL).indexOf('/shower_songs.htm') != -1) {
parent.parent.document.getElementById(location.hash.replace(/\#/g,'')).style.backgroundColor='#F0FFF0';
}
parent.parent.document.getElementById(location.hash.replace(/\#/g,'')).placeholder='' + secscnt + '/' + duration + ' ... ' + 'P=pause/play S=stop M=mute U=unmute Y=YouTube G=Google W=Wikipedia L=loop ';
//
// textarea gets usual white background
if (('' + top.document.URL).indexOf('/shower_songs.htm') != -1 || ('' + parent.parent.document.URL).indexOf('/shower_songs.htm') != -1) {
parent.parent.document.getElementById(location.hash.replace(/\#/g,'')).style.backgroundColor='white';
}
parent.parent.document.getElementById(location.hash.replace(/\#/g,'')).placeholder='' + Math.round(cen) + '/' + duration + ' ... ' + 'P=play/pause S=stop M=' + mletter + 'ute U=' + uletter + 'nmute Y=YouTube G=Google W=Wikipedia L=loop' + psuf;
… where stop_start_youtube.html controls those textarea element background colours in that grandchild YouTube API inhouse interfacer
… were needed to make this colour coding logic happen to improve how the user uses this web application, we’re hoping. Ie. bye for now.
If this was interesting you may be interested in this too.
If this was interesting you may be interested in this too.
