{"id":66303,"date":"2025-01-01T03:01:00","date_gmt":"2024-12-31T17:01:00","guid":{"rendered":"https:\/\/www.rjmprogramming.com.au\/ITblog\/?p=66303"},"modified":"2024-12-31T18:24:07","modified_gmt":"2024-12-31T08:24:07","slug":"ffmpeg-voiceover-almalinux-synchronize-browsing-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-voiceover-almalinux-synchronize-browsing-tutorial\/","title":{"rendered":"Ffmpeg Voiceover AlmaLinux Synchronize Browsing Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg Voiceover AlmaLinux Synchronize Browsing Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_sync.png\" title=\"Ffmpeg Voiceover AlmaLinux Synchronize Browsing Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg Voiceover AlmaLinux Synchronize Browsing Tutorial<\/p><\/div>\n<p>Today it is the case of &#8230;<\/p>\n<ul>\n<li>combining the work of yesterday&#8217;s <a target=\"_blank\" href='https:\/\/www.rjmprogramming.com.au\/ITblog\/local-file-browsing-tool-stringency-tutorial\/' title='Local File Browsing Tool Stringency Tutorial' rel=\"noopener\">Local File Browsing Tool Stringency Tutorial<\/a> &#8230; with that of the recent &#8230;<\/li>\n<li><a title='Ffmpeg Voiceover AlmaLinux Tutorial' href='#fvalt'>Ffmpeg Voiceover AlmaLinux Tutorial<\/a><\/li>\n<\/ul>\n<p> &#8230; to show how that work of yesterday&#8217;s onto the functionality of our inhouse local file browsing <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/client_browsing.htm\" rel=\"noopener\">client_browsing.htm<\/a> helper tool can help.<\/p>\n<p>We&#8217;ve created a new &#8220;optional approach&#8221; browsing button in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-------------------GETME\" rel=\"noopener\">our changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-------------------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">Voiceover<\/a> web application where the browsing conditions are &#8220;stringent&#8221;, as we imtimated we might be interested in with yesterday&#8217;s blog posting &#8230;<\/p>\n<p>&lt;?php echo &#8221;<br \/>\n<code><br \/>\n&lt;iframe title='Select one video and one audio.' onload=checkit(this); scrolling=no frameborder=0 id=cbi data-type=file data-value=inv.mp4 data-accept=video\/*audio\/* src='\/HTMLCSS\/client_browsing.htm?numhastobe=2&typehastobe=videoaudio&rand=\" . rand(0,18967564) . \"' style='display:none;position:absolute;top:0px;left:150px;width:173px;height:218px;margin-top:-204px;'&gt;&lt;\/iframe&gt;<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<\/p>\n<p> &#8230; so that <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/client_browsing.html---------------------------------------------------GETME' rel=\"noopener\">a tweaked<\/a> <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/client_browsing.html---------------------------------------------------GETME' rel=\"noopener\">client_browsing.htm<\/a> can help slot data URI data to &#8230;<\/p>\n<ol>\n<li>video<\/li>\n<li>audio<\/li>\n<\/ol>\n<p> &#8230; element <a target=\"_blank\" title='HTML source element information from W3schools' href='https:\/\/www.w3schools.com\/tags\/tag_source.asp' rel=\"noopener\">source<\/a> subelement <i>src<\/i> attributes as part of the work it now does &#8230; when allowed to &#8230;  <a target=\"_blank\" title='?' href='https:\/\/www.youtube.com\/watch?v=PtR4cWb4HNg' rel=\"noopener\">that is<\/a>!<\/p>\n<p>Patently, to synchronize a video and audio &#8220;track&#8221; together like this requires both elements to be readied ahead of being asked to play, like this.<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-voiceover-almalinux-synchronize-browsing-tutorial\/' rel=\"noopener\">New Ffmpeg Voiceover AlmaLinux Synchronize Browsing Tutorial<\/a>.<\/p-->\n<div id=divsp style=display:block;>\n<p><b><i>Stop Press<\/i><\/b><\/p>\n<p>Can you guess the musical connections?  Happy new year!<\/p>\n<details onclick=\"document.getElementById('ifbtob').src=document.getElementById('ifbtob').src.replace('=off','=on');\">\n<summary>BtoB<\/summary>\n<p><iframe style=width:100%;height:900px; id=ifbtob onload=\"if (top.document.URL.indexOf('showit=') != -1) { document.getElementById('divsp').style.display='block'; } \" src='\/\/www.rjmprogramming.com.au\/HTMLCSS\/karaoke_youtube_api.htm?youtubeid=Klh7sAv9hu4&#038;youtube_duration=214.000&#038;email=&#038;email=&#038;emoji=on&#038;c0=off&#038;i0=0&#038;j0=214&#038;i1=&#038;j1=&#038;i2=&#038;j2=&#038;i3=&#038;j3=&#038;i4=&#038;j4=&#038;i5=&#038;j5=&#038;i6=&#038;j6=&#038;i7=&#038;j7=&#038;i8=&#038;j8=&#038;i9=&#038;j9=&#038;i10=&#038;j10=&#038;i11=&#038;j11=&#038;i12=&#038;j12=&#038;i13=&#038;j13=&#038;i14=&#038;j14=&#038;i15=&#038;j15=&#038;i16=&#038;j16=&#038;i17=&#038;j17=&#038;i18=&#038;j18=&#038;i19=&#038;j19=&#038;i20=&#038;j20=&#038;i21=&#038;j21=&#038;i22=&#038;j22=&#038;i23=&#038;j23=&#038;i24=&#038;j24=&#038;i25=&#038;j25=&#038;i26=&#038;j26=&#038;i27=&#038;j27=&#038;i28=&#038;j28=&#038;i29=&#038;j29='><\/iframe><br \/>\n<\/details>\n<details onclick=\"document.getElementById('ifbtobtwo').src=document.getElementById('ifbtobtwo').src.replace('=off','=on');\">\n<summary>Tmol<\/summary>\n<p><iframe style=width:100%;height:900px; id=ifbtobtwo onload=\"if (top.document.URL.indexOf('showit=') != -1) { document.getElementById('divsp').style.display='block'; } \" src='\/\/www.rjmprogramming.com.au\/HTMLCSS\/karaoke_youtube_api.htm?youtubeid=fx2ns6fC4nw&#038;youtube_duration=273.000&#038;email=&#038;email=&#038;emoji=on&#038;c0=off&#038;i0=0&#038;j0=273&#038;i1=&#038;j1=&#038;i2=&#038;j2=&#038;i3=&#038;j3=&#038;i4=&#038;j4=&#038;i5=&#038;j5=&#038;i6=&#038;j6=&#038;i7=&#038;j7=&#038;i8=&#038;j8=&#038;i9=&#038;j9=&#038;i10=&#038;j10=&#038;i11=&#038;j11=&#038;i12=&#038;j12=&#038;i13=&#038;j13=&#038;i14=&#038;j14=&#038;i15=&#038;j15=&#038;i16=&#038;j16=&#038;i17=&#038;j17=&#038;i18=&#038;j18=&#038;i19=&#038;j19=&#038;i20=&#038;j20=&#038;i21=&#038;j21=&#038;i22=&#038;j22=&#038;i23=&#038;j23=&#038;i24=&#038;j24=&#038;i25=&#038;j25=&#038;i26=&#038;j26=&#038;i27=&#038;j27=&#038;i28=&#038;j28=&#038;i29=&#038;j29='><\/iframe><br \/>\n<\/details>\n<details onclick=\"document.getElementById('ifbtobthree').src=document.getElementById('ifbtobthree').src.replace('=off','=on');\">\n<summary>Glue<\/summary>\n<p><iframe style=width:100%;height:900px; id=ifbtobthree onload=\"if (top.document.URL.indexOf('showit=') != -1) { document.getElementById('divsp').style.display='block'; } \" src='\/\/www.rjmprogramming.com.au\/HTMLCSS\/karaoke_youtube_api.htm?youtubeid=k4V3Mo61fJM&#038;youtube_duration=313.000&#038;email=&#038;email=&#038;emoji=on&#038;c0=off&#038;i0=0&#038;j0=313&#038;i1=&#038;j1=&#038;i2=&#038;j2=&#038;i3=&#038;j3=&#038;i4=&#038;j4=&#038;i5=&#038;j5=&#038;i6=&#038;j6=&#038;i7=&#038;j7=&#038;i8=&#038;j8=&#038;i9=&#038;j9=&#038;i10=&#038;j10=&#038;i11=&#038;j11=&#038;i12=&#038;j12=&#038;i13=&#038;j13=&#038;i14=&#038;j14=&#038;i15=&#038;j15=&#038;i16=&#038;j16=&#038;i17=&#038;j17=&#038;i18=&#038;j18=&#038;i19=&#038;j19=&#038;i20=&#038;j20=&#038;i21=&#038;j21=&#038;i22=&#038;j22=&#038;i23=&#038;j23=&#038;i24=&#038;j24=&#038;i25=&#038;j25=&#038;i26=&#038;j26=&#038;i27=&#038;j27=&#038;i28=&#038;j28=&#038;i29=&#038;j29='><\/iframe><br \/>\n<\/details>\n<details onclick=\"document.getElementById('ifbtobpostthree').src=document.getElementById('ifbtobpostthree').src.replace('=off','=on');\">\n<summary>IHad<\/summary>\n<p><iframe style=width:100%;height:900px; id=ifbtobpostthree onload=\"if (top.document.URL.indexOf('showit=') != -1) { document.getElementById('divsp').style.display='block'; } \" src='\/\/www.rjmprogramming.com.au\/HTMLCSS\/karaoke_youtube_api.htm?youtubeid=-p6OH7FoWoQ&#038;youtube_duration=263.000&#038;email=&#038;email=&#038;emoji=on&#038;c0=off&#038;i0=0&#038;j0=263&#038;i1=&#038;j1=&#038;i2=&#038;j2=&#038;i3=&#038;j3=&#038;i4=&#038;j4=&#038;i5=&#038;j5=&#038;i6=&#038;j6=&#038;i7=&#038;j7=&#038;i8=&#038;j8=&#038;i9=&#038;j9=&#038;i10=&#038;j10=&#038;i11=&#038;j11=&#038;i12=&#038;j12=&#038;i13=&#038;j13=&#038;i14=&#038;j14=&#038;i15=&#038;j15=&#038;i16=&#038;j16=&#038;i17=&#038;j17=&#038;i18=&#038;j18=&#038;i19=&#038;j19=&#038;i20=&#038;j20=&#038;i21=&#038;j21=&#038;i22=&#038;j22=&#038;i23=&#038;j23=&#038;i24=&#038;j24=&#038;i25=&#038;j25=&#038;i26=&#038;j26=&#038;i27=&#038;j27=&#038;i28=&#038;j28=&#038;i29=&#038;j29='><\/iframe><br \/>\n<\/details>\n<details onclick=\"document.getElementById('ifbtobfour').src=document.getElementById('ifbtobfour').src.replace('=off','=on');\">\n<summary>F1<\/summary>\n<p><iframe style=width:100%;height:900px; id=ifbtobfour onload=\"if (top.document.URL.indexOf('showit=') != -1) { document.getElementById('divsp').style.display='block'; } \" src='\/\/www.rjmprogramming.com.au\/HTMLCSS\/karaoke_youtube_api.htm?youtubeid=AIOAlaACuv4&#038;youtube_duration=161.000&#038;email=&#038;email=&#038;emoji=on&#038;c0=off&#038;i0=0&#038;j0=161&#038;i1=&#038;j1=&#038;i2=&#038;j2=&#038;i3=&#038;j3=&#038;i4=&#038;j4=&#038;i5=&#038;j5=&#038;i6=&#038;j6=&#038;i7=&#038;j7=&#038;i8=&#038;j8=&#038;i9=&#038;j9=&#038;i10=&#038;j10=&#038;i11=&#038;j11=&#038;i12=&#038;j12=&#038;i13=&#038;j13=&#038;i14=&#038;j14=&#038;i15=&#038;j15=&#038;i16=&#038;j16=&#038;i17=&#038;j17=&#038;i18=&#038;j18=&#038;i19=&#038;j19=&#038;i20=&#038;j20=&#038;i21=&#038;j21=&#038;i22=&#038;j22=&#038;i23=&#038;j23=&#038;i24=&#038;j24=&#038;i25=&#038;j25=&#038;i26=&#038;j26=&#038;i27=&#038;j27=&#038;i28=&#038;j28=&#038;i29=&#038;j29='><\/iframe><br \/>\n<\/details>\n<details onclick=\"document.getElementById('ifbtobfive').src=document.getElementById('ifbtobfive').src.replace('=off','=on');\">\n<summary>90am<\/summary>\n<p><iframe style=width:100%;height:900px; id=ifbtobfive onload=\"if (top.document.URL.indexOf('showit=') != -1) { document.getElementById('divsp').style.display='block'; } \" src='\/\/www.rjmprogramming.com.au\/HTMLCSS\/karaoke_youtube_api.htm?youtubeid=HTzGMEfbnAw&#038;youtube_duration=233.000&#038;email=&#038;email=&#038;emoji=on&#038;c0=off&#038;i0=0&#038;j0=233&#038;i1=&#038;j1=&#038;i2=&#038;j2=&#038;i3=&#038;j3=&#038;i4=&#038;j4=&#038;i5=&#038;j5=&#038;i6=&#038;j6=&#038;i7=&#038;j7=&#038;i8=&#038;j8=&#038;i9=&#038;j9=&#038;i10=&#038;j10=&#038;i11=&#038;j11=&#038;i12=&#038;j12=&#038;i13=&#038;j13=&#038;i14=&#038;j14=&#038;i15=&#038;j15=&#038;i16=&#038;j16=&#038;i17=&#038;j17=&#038;i18=&#038;j18=&#038;i19=&#038;j19=&#038;i20=&#038;j20=&#038;i21=&#038;j21=&#038;i22=&#038;j22=&#038;i23=&#038;j23=&#038;i24=&#038;j24=&#038;i25=&#038;j25=&#038;i26=&#038;j26=&#038;i27=&#038;j27=&#038;i28=&#038;j28=&#038;i29=&#038;j29='><\/iframe><br \/>\n<\/details>\n<details onclick=\"document.getElementById('ifbtobpresix').src=document.getElementById('ifbtobpresix').src.replace('=off','=on');\" open=\"\">\n<summary>Sshh<\/summary>\n<p><iframe style=\"width:100%;height:900px;\" id=\"ifbtobpresix\" onload=\"if (top.document.URL.indexOf('showit=') != -1) { document.getElementById('divsp').style.display='block'; } \" src=\"https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/karaoke_youtube_api.htm?youtubeid=CW_ZiojrkVY&amp;youtube_duration=224.000&amp;email=&amp;email=&amp;emoji=on&amp;c0=on&amp;i0=0&amp;j0=224&amp;i1=&amp;j1=&amp;i2=&amp;j2=&amp;i3=&amp;j3=&amp;i4=&amp;j4=&amp;i5=&amp;j5=&amp;i6=&amp;j6=&amp;i7=&amp;j7=&amp;i8=&amp;j8=&amp;i9=&amp;j9=&amp;i10=&amp;j10=&amp;i11=&amp;j11=&amp;i12=&amp;j12=&amp;i13=&amp;j13=&amp;i14=&amp;j14=&amp;i15=&amp;j15=&amp;i16=&amp;j16=&amp;i17=&amp;j17=&amp;i18=&amp;j18=&amp;i19=&amp;j19=&amp;i20=&amp;j20=&amp;i21=&amp;j21=&amp;i22=&amp;j22=&amp;i23=&amp;j23=&amp;i24=&amp;j24=&amp;i25=&amp;j25=&amp;i26=&amp;j26=&amp;i27=&amp;j27=&amp;i28=&amp;j28=&amp;i29=&amp;j29=\"><\/iframe>\n<\/p>\n<\/details>\n<details onclick=\"document.getElementById('ifbtobsix').src=document.getElementById('ifbtobsix').src.replace('=off','=on');\">\n<summary>Faith<\/summary>\n<p><iframe style=width:100%;height:900px; id=ifbtobsix onload=\"if (top.document.URL.indexOf('showit=') != -1) { document.getElementById('divsp').style.display='block'; } \" src='\/\/www.rjmprogramming.com.au\/HTMLCSS\/karaoke_youtube_api.htm?youtubeid=FtE3hoR_Nvo&#038;youtube_duration=239.000&#038;email=&#038;email=&#038;emoji=on&#038;c0=off&#038;i0=0&#038;j0=239&#038;i1=&#038;j1=&#038;i2=&#038;j2=&#038;i3=&#038;j3=&#038;i4=&#038;j4=&#038;i5=&#038;j5=&#038;i6=&#038;j6=&#038;i7=&#038;j7=&#038;i8=&#038;j8=&#038;i9=&#038;j9=&#038;i10=&#038;j10=&#038;i11=&#038;j11=&#038;i12=&#038;j12=&#038;i13=&#038;j13=&#038;i14=&#038;j14=&#038;i15=&#038;j15=&#038;i16=&#038;j16=&#038;i17=&#038;j17=&#038;i18=&#038;j18=&#038;i19=&#038;j19=&#038;i20=&#038;j20=&#038;i21=&#038;j21=&#038;i22=&#038;j22=&#038;i23=&#038;j23=&#038;i24=&#038;j24=&#038;i25=&#038;j25=&#038;i26=&#038;j26=&#038;i27=&#038;j27=&#038;i28=&#038;j28=&#038;i29=&#038;j29='><\/iframe><br \/>\n<\/details>\n<\/div>\n<hr>\n<p id='fvalt'>Previous relevant <a target=\"_blank\" title='Ffmpeg Voiceover AlmaLinux Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-voiceover-almalinux-tutorial\/' rel=\"noopener\">Ffmpeg Voiceover AlmaLinux Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg Voiceover AlmaLinux Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_almalinux.jpg\" title=\"Ffmpeg Voiceover AlmaLinux Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg Voiceover AlmaLinux Tutorial<\/p><\/div>\n<p>Two recent aspects to work here have meant that the Voiceover work of <a title='Ffmpeg Shelling Peas Tutorial' href='#fspt'>Ffmpeg Shelling Peas Tutorial<\/a> can be improved upon &#8230;<\/p>\n<ul>\n<li>migrating the web server from CentOS to AlmaLinux gave us the opportunity to have <a target=\"_blank\" title='ffmpeg' href='https:\/\/www.ffmpeg.org\/' rel=\"noopener\">ffmpeg<\/a> installed on the (public) web server &#8230; and &#8230;<\/li>\n<li>when we presented <a target=\"_blank\" href='https:\/\/www.rjmprogramming.com.au\/ITblog\/making-of-iphone-videos-play-around-the-traps-tutorial\/' title='Making of iPhone Videos Play Around the Traps Tutorial' rel=\"noopener\">Making of iPhone Videos Play Around the Traps Tutorial<\/a> we created a Javascript clientside approach to synchronizing two separate video and audio tracks, a topic that has interested us since &#8220;ever knows when&#8221;<\/li>\n<\/ul>\n<p> &#8230; the implications of the first idea above meaning, depending on user supplied video and audio compatible files <font size=1>(small enough)<\/font>, we&#8217;ll be able to show an ffmpeg created video combining the two, all the work taking place on our AlmaLinux&#8217;s <i>\/tmp\/<\/i> folder for a five minute period, as time enough to gather the video and audio data and try the ffmpeg command shown to you ahead of doing it.<\/p>\n<p>Codewise, this involved &#8230;<\/p>\n<ul>\n<li><a target=\"_blank\" href='https:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/client_browsing.html------------------------------------------------GETME' rel=\"noopener\">a changed<\/a> <a target=\"_blank\" href='https:\/\/www.rjmprogramming.com.au\/HTMLCSS\/client_browsing.html------------------------------------------------GETME' rel=\"noopener\">client_browsing.htm<\/a> client side HTML and Javascript inhouse helper &#8230; of &#8230;<\/li>\n<li><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-----------------GETME\" rel=\"noopener\">a changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-----------------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">Voiceover<\/a> web application<\/li>\n<\/ul>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-voiceover-almalinux-tutorial\/' rel=\"noopener\">Ffmpeg Voiceover AlmaLinux Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fspt'>Previous relevant <a target=\"_blank\" title='Ffmpeg Shelling Peas Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-shelling-peas-tutorial\/' rel=\"noopener\">Ffmpeg Shelling Peas Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg Shelling Peas Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_ffmpeg_shelling.jpg\" title=\"Ffmpeg Shelling Peas Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg Shelling Peas Tutorial<\/p><\/div>\n<p>Well, our wish to &#8220;shell peas&#8221; setting up more <a style=\"vertical-align:top;\" target=\"_blank\" title=\"ffmpeg\" href='\/\/ffmpeg.org' rel=\"noopener\">ffmpeg<\/a> media options based on the excellent <a target=\"_blank\" title='FFmpeg cheat sheet' href='\/\/gist.github.com\/steven2358\/ba153c642fe2bb1e47485962df07c730' rel=\"noopener\">FFmpeg cheat sheet<\/a>, thanks, today, had its ups and downs for speed of progress, but, yes, to have a solid &#8220;framework&#8221; to work within, that you are happy with, barring those tweaks you inevitably discover in projects as they gain complexity, is the best first endeavour you might need to do, to feel more relaxed about the parts of the project requiring that third party expertise, which it is your job to test that you have successfully merged into the project.  And so, onto yesterday&#8217;s <a title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Linear Gradient Tutorial' href='#fpimpdlgt'>Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Linear Gradient Tutorial<\/a>, <font color=blue>we have included new<\/font> &#8230;<\/p>\n<p>&lt;?php<br \/>\n<code><br \/>\n$vssfi='img%03d.png';<br \/>\n$bn='*';<br \/>\n$bntwo='.*';<br \/>\n<br \/>\nforeach (glob('newfolder_*') as $idfilename) {<br \/>\n  if (file_exists($idfilename) && $vssfi == 'img%03d.png') {<br \/>\n    foreach (glob($idfilename . DIRECTORY_SEPARATOR . '*') as $idifilename) {<br \/>\n      if ($vssfi == 'img%03d.png' && strpos($idifilename, '.') !== false) {<br \/>\n        $bnis=basename($idifilename);<br \/>\n        $bn='';<br \/>\n        $bntwo='';<br \/>\n        for ($ibn=0; $ibn&lt;strlen(explode('.', $bnis)[0]); $ibn++) {<br \/>\n           if (substr(substr($bnis, $ibn),0,1) &gt;= '0' && substr(substr($bnis, $ibn),0,1) &lt;= '9') {<br \/>\n             if ($bntwo == '') {<br \/>\n               if (substr(substr($bnis, $ibn),0,1) == '0') {<br \/>\n                 $bntwo='%0' . strlen(substr(explode('.', $bnis)[0], $ibn)) . 'd' . '.' . explode('.', $idifilename)[-1 + sizeof(explode('.', $idifilename))];<br \/>\n               } else {<br \/>\n                 $bntwo='%d' . '.' . explode('.', $idifilename)[-1 + sizeof(explode('.', $idifilename))];<br \/>\n               }<br \/>\n             }<br \/>\n           } else if ($bntwo == '') {<br \/>\n             $bn.=substr(substr($bnis, $ibn),0,1);<br \/>\n           }<br \/>\n        }<br \/>\n        if ($bntwo == '') {<br \/>\n         $bn='*';<br \/>\n         $bntwo='.' . explode('.', $idifilename)[-1 + sizeof(explode('.', $idifilename))];<br \/>\n        }<br \/>\n        $vssfi=$idfilename . substr(DIRECTORY_SEPARATOR . DIRECTORY_SEPARATOR,0,1) . $bn . $bntwo;<br \/>\n      }<br \/>\n    }<br \/>\n  }<br \/>\n}<br \/>\n<\/code><br \/>\n?&gt;<br \/>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  var ffstr='  Concat demuxer,  Display the frame number on each frame,<font color=blue>  Trimming,  Delay video,  Delay audio,  Extract a frame per second,  Extract the frames from a video,  Mute some of the audio,  Extract one frame,  Create a video slideshow from images,<\/font>', offstr=null, kffstr=0, affstr=[];<br \/>\n<br \/>\n    \/\/<br \/>\n    \/\/ And then ... later ...<br \/>\n    \/\/<br \/>\n    if (newv == 'Trimming') {<br \/>\n<br \/> <br \/>\n       document.getElementById('moreb').innerHTML=firstdivih;<br \/>\n<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n       document.getElementById('secondi').innerHTML='';<br \/>\n       document.getElementById('minusi').innerHTML=' -ss 00:00:00.000 -i ';<br \/>\n       document.getElementById('minusi').title='Start time';<br \/>\n<br \/>\n       document.getElementById('sswitches').innerHTML='-t 60 -c copy ';<br \/>\n       document.getElementById('sswitches').title='Duration';<br \/>\n<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    } else if (newv == 'Delay video') {<br \/>\n<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih;<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n<br \/>\n       document.getElementById('betweenis').innerHTML='-itsoffset 1.00';<br \/>\n       document.getElementById('betweenis').title='Delay in seconds';<br \/>\n<br \/>\n       document.getElementById('sswitches').innerHTML='-map 1:v -map 0:a &lt;span id=svac contenteditable=false&gt;-vcodec copy -acodec copy &lt;\/span&gt;';<br \/>\n       document.getElementById('sswitches').title='The 1:v 0:a represents video track else use 0:v 1:a for audio track';<br \/>\n<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    } else if (newv == 'Delay audio') {<br \/>\n<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih;<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n<br \/>\n       document.getElementById('betweenis').innerHTML='-itsoffset 1.00';<br \/>\n       document.getElementById('betweenis').title='Delay in seconds';<br \/>\n<br \/>\n       document.getElementById('sswitches').innerHTML='-map 0:v -map 1:a &lt;span id=svac contenteditable=false&gt;-vcodec copy -acodec copy &lt;\/span&gt;';<br \/>\n       document.getElementById('sswitches').title='The 0:v 1:a represents audio track else use 1:v 0:a for video track';<br \/>\n<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    } else if (newv == 'Extract a frame per second') {<br \/>\n<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih.replace(' out.mp4',' ');<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n       document.getElementById('secondi').innerHTML='-filter:v fps=fps=1 -vsync 0';<br \/>\n       document.getElementById('secondi').title='The 1 represents 1 per second';<br \/>\n       document.getElementById('sswitches').innerHTML=\\\"&lt;span id=sfolder contenteditable=false&gt;newfolder_\" . rand(0,784534) . str_replace(\"\\\\\",\"\\\\\\\\\",$ddn) . \"out%d.png\\\" + '&lt;\/span&gt;';<br \/>\n<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    } else if (newv == 'Extract the frames from a video') {<br \/>\n<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih.replace(' out.mp4',' ');<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n       document.getElementById('secondi').innerHTML=\\\"-vf \\\" + String.fromCharCode(34) + \\\"select='between(t,1,5)+between(t,11,15)'\\\" + String.fromCharCode(34) + \\\" -vsync 0\\\";<br \/>\n       document.getElementById('secondi').title='To extract all frames from between 1 and 5 seconds, and also between 11 and 15 seconds';<br \/>\n       document.getElementById('sswitches').innerHTML=\\\"&lt;span id=sfolder contenteditable=false&gt;newfolder_\" . rand(0,784534) . str_replace(\"\\\\\",\"\\\\\\\\\",$ddn) . \"out%d.png\\\" + '&lt;\/span&gt;';<br \/>\n<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    } else if (newv == 'Mute some of the audio') {<br \/>\n<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih;<br \/>\n       document.getElementById('secondi').innerHTML='';<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n<br \/>\n       document.getElementById('sswitches').innerHTML=\\\"-vcodec copy -af \\\" + String.fromCharCode(34) + \\\"volume=enable='between(t,80,90)'&lt;span id=svolume contenteditable=false&gt;:volume=0\\\" + String.fromCharCode(34) + \\\" &lt;\/span&gt;\\\";<br \/>\n       document.getElementById('sswitches').title='To replace all audio between 1:20 and 1:30 with silence';<br \/>\n<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    } else if (newv == 'Create a video slideshow from images') {<br \/>\n<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih;<br \/>\n<br \/>\n       document.getElementById('minusi').innerHTML='-r 1\/5 -i ';<br \/>\n       document.getElementById('minusi').title='Parameter -r marks the image framerate (inverse time of each image); -vf fps=25 marks the true framerate of the output';<br \/>\n<br \/>\n       document.getElementById('secondi').innerHTML='';<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n       document.getElementById('scbi').innerHTML='\" . $vssfi . \"';<br \/>\n<br \/>\n       document.getElementById('sswitches').innerHTML=' -c:v libx264 -vf fps=25&lt;span id=shat contenteditable=false&gt; -pix_fmt yuv420p &lt;\/span&gt;';<br \/>\n<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    } else if (newv == 'Extract one frame') {<br \/>\n<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih.replace(' out.mp4',' out.jpg');<br \/>\n       document.getElementById('secondi').innerHTML='';<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n<br \/>\n       document.getElementById('sswitches').innerHTML='-ss 00:00:10.000&lt;span id=svframes contenteditable=false&gt; -vframes 1 &lt;\/span&gt;';<br \/>\n       document.getElementById('sswitches').title='Extract one frame at 10 second mark';<br \/>\n<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<\/p>\n<p> &#8230; <a style=\"vertical-align:top;\" target=\"_blank\" title=\"ffmpeg\" href='\/\/ffmpeg.org' rel=\"noopener\">ffmpeg<\/a> media functionality talents for you to try yourself, today, in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php---------------GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php---------------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>).<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/new-ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-dropdown-linear-gradient-tutorial\/' rel=\"noopener\">New Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Linear Gradient Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fpimpdlgt'>Previous relevant <a target=\"_blank\" title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Linear Gradient Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-dropdown-linear-gradient-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Linear Gradient Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Linear Gradient Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_linear_gradient_underlay.jpg\" title=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Linear Gradient Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Linear Gradient Tutorial<\/p><\/div>\n<p>There were two weakness with the logic in yesterday&#8217;s <a title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Hover Swipe Tutorial' href='#fpimpdhst'>Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Hover Swipe Tutorial<\/a>, we reckon, those being &#8230;<\/p>\n<ol>\n<li>it is hard to &#8220;hover swipe&#8221; with no linework to show where one option starts and another ends, in Y (or top) co-ordinates &#8230; and &#8230;<\/li>\n<li>the user has trouble knowing whether their swipe attempt worked<\/li>\n<\/ol>\n<p> &#8230; for which we supply ideas &#8230;<\/p>\n<ol>\n<li>linear-gradient background, in the form of a colourful &#8220;underlay&#8221; div element under (now transparent background<sub>ed<\/sub>) select (ie. dropdown) element (and associated &#8220;overlay&#8221; div)  &#8230; and &#8230;<\/li>\n<li>emoji for swipe left &#11013; (&amp;#11013;) and for swipe right &#10145; (&amp;#10145;) shown briefly<\/li>\n<\/ol>\n<p> &#8230; featuring <font color=blue>relevant code<\/font> snippets &#8230;<\/p>\n<ol>\n<li>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  function overlay() {<br \/>\n   origval=document.getElementById('schoices').value;<br \/>\n   var rect=document.getElementById('fcommand').getBoundingClientRect();<br \/>\n   document.getElementById('moreb').style.position='absolute';<br \/>\n   document.getElementById('moreb').style.left='' + rect.left + 'px';<br \/>\n   document.getElementById('moreb').style.top='' + rect.top + 'px';<br \/>\n   document.getElementById('moreb').style.width='96%'; \/\/' + rect.width + 'px';<br \/>\n   document.getElementById('moreb').style.height='' + rect.height + 'px';<br \/>\n<br \/> <br \/>\n   document.getElementById('moreb').style.border='1px solid black';<br \/>\n   document.getElementById('moreb').style.paddingLeft='20px';<br \/>\n   document.getElementById('moreb').style.backgroundColor='#f9f9f9';<br \/>\n   document.getElementById('fcommand').style.opacity='0.0';<br \/>\n   document.getElementById('fcommand').style.cursor='pointer';<br \/>\n<br \/> <br \/>\n   document.getElementById('moreb').innerHTML='&lt;span id=precmds&gt;&lt;\/span&gt;&lt;span id=verb&gt;ffmpeg\" . $ffmpegsuf . \"&lt;\/span&gt; &lt;span id=prescbi&gt;&lt;\/span&gt;&lt;span id=minusi&gt; -i &lt;\/span&gt;&lt;span id=scbi&gt;&lt;iframe onload=checkif(this,\\\"inv.mp4\\\"); scrolling=no frameborder=0 id=cbi data-type=file data-value=inv.mp4 data-accept=\\\"video\/*\\\" style=\\\"display:inline-block;height:40px;width:92px;vertical-align:middle;\\\" src=\\\"\/HTMLCSS\/client_browsing.htm?d=69075964842271&left=y\\\"&gt;&lt;\/iframe&gt;&lt;\/span&gt; &lt;span id=betweenis&gt;&lt;\/span&gt; &lt;span id=secondi&gt;-i &lt;span id=scbix&gt;&lt;iframe onload=checkiftwo(this,\\\"inva.mp4\\\"); scrolling=no frameborder=0 id=cbix data-type=file data-value=inva.mp4 data-accept=\\\"video\/*\\\" style=\\\"display:inline-block;height:40px;width:106px;vertical-align:middle;\\\" src=\\\"\/HTMLCSS\/client_browsing.htm?d=69075964842271&right=y\\\"&gt;&lt;\/iframe&gt;&lt;\/span&gt;&lt;\/span&gt; &lt;span id=sswitches&gt;-c copy -map 0:v:0 -map 1:a:0 -shortest&lt;\/span&gt; out.mp4 &gt; &lt;a target=_blank title=ffimpdf.bad onclick=getvb(); style=cursor:pointer;text-decoration:underline; data-href=.\/ffimpdf.bad&gt;ffimpdf.bad&lt;\/a&gt;';<br \/>\n   if (firstdivih == '') { firstdivih=document.getElementById('moreb').innerHTML; }<br \/>\n   if (firstbutval == '') { firstbutval=document.getElementById('mysub').value; }<br \/>\n   document.getElementById('schoices').style.display='inline-block';<br \/>\n<br \/> <br \/>\n   rect=document.getElementById('schoices').getBoundingClientRect();<br \/>\n<br \/> <br \/>\n   if (eval('' + rect.height) &gt; 100 || 1 == 1) {<br \/>\n<br \/> <br \/>\n   <font color=blue>document.getElementById('schoices').style.backgroundColor='transparent';<br \/>\n   document.getElementById('tf').style.position='absolute'; \/\/ using new &lt;div id=tf&gt;&lt;\/div&gt;<br \/>\n   document.getElementById('tf').style.left='' + rect.left + 'px';<br \/>\n   document.getElementById('tf').style.top='' + rect.top + 'px';<br \/>\n   document.getElementById('tf').style.width='' + rect.width + 'px';<br \/>\n   document.getElementById('tf').style.height='' + rect.height + 'px';<br \/>\n   \/\/ Thanks to <a target=\"_blank\" title='https:\/\/stackoverflow.com\/questions\/49660659\/css-gradients-inside-gradients' href='https:\/\/stackoverflow.com\/questions\/49660659\/css-gradients-inside-gradients' rel=\"noopener\">https:\/\/stackoverflow.com\/questions\/49660659\/css-gradients-inside-gradients<\/a><br \/>\n   document.getElementById('tf').style.background='linear-gradient(0deg, #ffffff 10%, rgba(255,255,0,0.6) 20%, rgba(192,192,192,0.6) 31%, rgba(255,215,0,0.6) 42%, rgba(211,211,211,0.6) 53%, rgba(255,165,0,0.6) 63%, rgba(224,255,255,0.6) 74%, rgba(254,254,254,0.6) 85%, #CC7722 100%), linear-gradient( to right, yellow, pink )'; \/\/ #fcfafc #f9f6f8 #f8f1f3<br \/>\n   document.getElementById('tf').style.zIndex='-1';<\/font><br \/>\n<br \/>\n   document.getElementById('doverlay').style.position='absolute';<br \/>\n   document.getElementById('doverlay').style.left='' + rect.left + 'px';<br \/>\n   document.getElementById('doverlay').style.top='' + rect.top + 'px';<br \/>\n   document.getElementById('doverlay').style.width='' + rect.width + 'px';<br \/>\n   if (eval('' + rect.height) &lt; 30) {<br \/>\n   document.getElementById('doverlay').style.height='' + rect.height + 'px';<br \/>\n   } else {<br \/>\n   document.getElementById('doverlay').style.height='' + eval(eval('' + rect.height) \/ eval('' + document.getElementById('schoices').size)) + 'px';<br \/>\n   }<br \/>\n   document.getElementById('doverlay').style.zIndex='96';<br \/>\n   document.getElementById('doverlay').style.textAlign='center';<br \/>\n   document.getElementById('doverlay').style.display='block';<br \/>\n   document.getElementById('doverlay').title=document.getElementById('mydefopt').title;<br \/>\n   \/\/document.getElementById('mydefopt').style.fontColor='transparent';<br \/>\n   document.getElementById('mydefopt').innerHTML='';<br \/>\n<br \/> <br \/>\n   document.getElementById('doverlaytwo').style.position='absolute';<br \/>\n   document.getElementById('doverlaytwo').style.left='' + rect.left + 'px';<br \/>\n   \/\/document.getElementById('doverlaytwo').style.top='' + eval(eval('' + rect.height) - eval(2 * eval('' + rect.height) \/ eval('' + document.getElementById('schoices').size))) + 'px';<br \/>\n   document.getElementById('doverlaytwo').style.top='' + eval(eval('' + rect.height) - eval(0.5 * eval('' + rect.height) \/ eval('' + document.getElementById('schoices').size))) + 'px';<br \/>\n   \/\/document.getElementById('doverlaytwo').style.bottom='' + rect.bottom + 'px';<br \/>\n   document.getElementById('doverlaytwo').style.width='' + rect.width + 'px';<br \/>\n   if (eval('' + rect.height) &lt; 30) {<br \/>\n   if (1 == 2) { document.getElementById('doverlaytwo').style.height='' + rect.height + 'px'; }<br \/>\n   } else {<br \/>\n   document.getElementById('doverlaytwo').style.height='' + eval(eval('' + rect.height) \/ eval('' + document.getElementById('schoices').size)) + 'px';<br \/>\n   }<br \/>\n   document.getElementById('doverlaytwo').style.zIndex='96';<br \/>\n   document.getElementById('doverlaytwo').style.textAlign='center';<br \/>\n   document.getElementById('doverlaytwo').style.display='block';<br \/>\n   document.getElementById('mydefopttwo').innerHTML='';<br \/>\n<br \/>\n   rect=document.getElementById('mysub').getBoundingClientRect();<br \/>\n   document.getElementById('mysub').style.position='absolute';<br \/>\n   document.getElementById('mysub').style.left='' + rect.left + 'px';<br \/>\n   document.getElementById('mysub').style.top='' + rect.top + 'px';<br \/>\n<br \/>\n   setInterval(fhoc, 1000);<br \/>\n   }<br \/>\n<br \/> <br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<br \/>\n &#8230; using a multiple linear-gradient element style background for the first time we can remember\n<\/li>\n<li>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  <font color=blue>var swipel='', swipelcp='', swiper='', swipercp='';<br \/>\n<br \/>\n  var ra='&amp;#10145;', racp=String.fromCodePoint(10145);<br \/>\n  var la='&amp;#11013;', lacp=String.fromCodePoint(11013);<\/font><br \/>\n<br \/>\n  function isplace(thiso, e) {<br \/>\n    var kkk=0;<br \/>\n    e = e || window.event;<br \/>\n    e.preventDefault();<br \/>\n       if (e.touches) {<br \/>\n       if (e.touches[0].pageX) {<br \/>\n       pos3 = e.touches[0].pageX;<br \/>\n       pos4 = e.touches[0].pageY;<br \/>\n       } else {<br \/>\n       pos3 = e.touches[0].clientX;<br \/>\n       pos4 = e.touches[0].clientY;<br \/>\n       }<br \/>\n       \/\/console.log('pos3=' + pos3 + ',pos4=' + pos4);<br \/>\n       } else if (e.clientX || e.clientY) {<br \/>\n        pos3 = e.clientX;<br \/>\n        pos4 = e.clientY;<br \/>\n       } else {<br \/>\n        pos3 = e.pageX;<br \/>\n        pos4 = e.pageY;<br \/>\n       }<br \/>\n       if (lasto == e.target) {<br \/>\n        if (Math.abs(pos1 - pos3) &gt;= 70) {<br \/>\n          if (pos3 &gt; pos1) { \/\/ swipe right<br \/>\n            <font color=blue>swiper=ra;<br \/>\n            swipercp=racp;<\/font><br \/>\n            if (e.target == opastr) {<br \/>\n              kkk=eval(1 + eval('' + kpastr));<br \/>\n              if (kkk &gt;= eval('' + apastr.length)) {<br \/>\n                kpastr=eval('' + kpastr);<br \/>\n              } else {<br \/>\n                kpastr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == opdstr) {<br \/>\n              kkk=eval(1 + eval('' + kpdstr));<br \/>\n              if (kkk &gt;= eval('' + apdstr.length)) {<br \/>\n                kpdstr=eval('' + kpdstr);<br \/>\n              } else {<br \/>\n                kpdstr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == oimstr) {<br \/>\n              kkk=eval(1 + eval('' + kimstr));<br \/>\n              if (kkk &gt;= eval('' + aimstr.length)) {<br \/>\n                kimstr-=eval('' + kimstr);<br \/>\n              } else {<br \/>\n                kimstr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == offstr) {<br \/>\n              kkk=eval(1 + eval('' + kffstr));<br \/>\n              if (kkk &gt;= eval('' + affstr.length)) {<br \/>\n                kffstr-=eval('' + kffstr);<br \/>\n              } else {<br \/>\n                kffstr=kkk;<br \/>\n              }<br \/>\n            }<br \/>\n          } else { \/\/ swipe left<br \/>\n            <font color=blue>swipel=la;<br \/>\n            swipelcp=lacp;<\/font><br \/>\n            if (e.target == opastr) {<br \/>\n              kkk=eval(-1 + eval('' + kpastr));<br \/>\n              if (kkk &lt; 0) {<br \/>\n                kpastr=eval(-1 + eval('' + apastr.length));<br \/>\n              } else {<br \/>\n                kpastr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == opdstr) {<br \/>\n              kkk=eval(-1 + eval('' + kpdstr));<br \/>\n              if (kkk &lt; 0) {<br \/>\n                kpdstr=eval(-1 + eval('' + apdstr.length));<br \/>\n              } else {<br \/>\n                kpdstr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == oimstr) {<br \/>\n              kkk=eval(-1 + eval('' + kimstr));<br \/>\n              if (kkk &lt; 0) {<br \/>\n                kimstr=eval(-1 + eval('' + aimstr.length));<br \/>\n              } else {<br \/>\n                kimstr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == offstr) {<br \/>\n              kkk=eval(-1 + eval('' + kffstr));<br \/>\n              if (kkk &lt; 0) {<br \/>\n                kffstr=eval(-1 + eval('' + affstr.length));<br \/>\n              } else {<br \/>\n                kffstr=kkk;<br \/>\n              }<br \/>\n            }<br \/>\n          }<br \/>\n        }<br \/>\n        \/\/alert('swipe distance = ' + Math.abs(pos1 - pos3));<br \/>\n       }<br \/>\n       lasto=e.target;<br \/>\n  }<br \/>\n<br \/>\n  function betweeneatatjoes() {<br \/>\n     var origt='', origrest='', kkprefix=<font color=blue>swipelcp + <\/font>'...', kksuffix='...'<font color=blue> + swipercp<\/font>;<br \/>\n     <font color=blue>var origkkprefix='', origkksuffix='', origkprefix='', origksuffix='';<\/font><br \/>\n     if (kprefix == '' && ksuffix == '') {<br \/>\n       kprefix=<font color=blue>swipel + <\/font>'&amp;#128309;..';<br \/>\n       kkprefix=<font color=blue>swipelcp + <\/font>String.fromCodePoint(128309) + '..';<br \/>\n       ksuffix='...'<font color=blue> + swiper<\/font>;<br \/>\n       \/\/document.getElementById('doverlaytwo').style.marginTop='20px';<br \/>\n     } else if (kprefix == <font color=blue>swipel + <\/font>'&amp;#128309;..') {<br \/>\n       kprefix=<font color=blue>swipel + <\/font>'.&amp;#128309;.';<br \/>\n       kkprefix=<font color=blue>swipelcp +'.' + <\/font>String.fromCodePoint(128309) + '.';<br \/>\n       ksuffix='...'<font color=blue> + swiper<\/font>;<br \/>\n     } else if (kprefix == <font color=blue>swipel + <\/font>'.&amp;#128309;.') {<br \/>\n       kprefix=<font color=blue>swipel + <\/font>'..&amp;#128309;';<br \/>\n       kkprefix=<font color=blue>swipelcp + <\/font>'..' + String.fromCodePoint(128309) + '';<br \/>\n       ksuffix='...'<font color=blue> + swiper<\/font>;<br \/>\n     } else if (kprefix == <font color=blue>swipel + <\/font>'..&amp;#128309;') {<br \/>\n       ksuffix='&amp;#128309;..'<font color=blue> + swiper<\/font>;<br \/>\n       kksuffix=String.fromCodePoint(128309) + '..'<font color=blue> + swipercp<\/font>;<br \/>\n       kprefix=swipel + '...'<font color=blue> + swiper<\/font>;<br \/>\n     } else if (ksuffix == '&amp;#128309;..'<font color=blue> + swiper<\/font>) {<br \/>\n       ksuffix='.&amp;#128308;.'<font color=blue> + swiper<\/font>;<br \/>\n       kksuffix='.' + String.fromCodePoint(128308) + '.'<font color=blue> + swipercp<\/font>;<br \/>\n       kprefix=<font color=blue>swipel + <\/font>'...';<br \/>\n     } else if (ksuffix == '.&amp;#128308;.'<font color=blue> + swiper<\/font>) {<br \/>\n       ksuffix='..&amp;#128308;'<font color=blue> + swiper<\/font>;<br \/>\n       kksuffix='..' + String.fromCodePoint(128308) + ''<font color=blue> + swipercp<\/font>;<br \/>\n       kprefix=<font color=blue>swipel + <\/font>'...';<br \/>\n     } else {<br \/>\n       kprefix=<font color=blue>swipel + <\/font>'&amp;#917536;..';<br \/>\n       kkprefix=<font color=blue>swipelcp + <\/font>'..' + String.fromCodePoint(917536) + '..';<br \/>\n       ksuffix='...'<font color=blue> + swiper<\/font>;<br \/>\n       \/\/document.getElementById('doverlaytwo').style.marginTop='0px';<br \/>\n     }<br \/>\n<br \/> <br \/>\n     <font color=blue>origkkprefix=kkprefix;<br \/>\n     origkksuffix=kksuffix;<br \/>\n     origkprefix=kprefix;<br \/>\n     origksuffix=ksuffix;<\/font><br \/>\n<br \/> <br \/>\n     if (oimstr) {<br \/>\n       origt=oimstr.getAttribute('data-title');<br \/>\n       <font color=blue>if (lasto == oimstr) {<br \/>\n        kkprefix=origkkprefix;<br \/>\n        kksuffix=origkksuffix;<br \/>\n        kprefix=origkprefix;<br \/>\n        ksuffix=origksuffix;<br \/>\n       } else if (swipel + swiper != '') {<br \/>\n        kkprefix=origkkprefix.replace(swipelcp,'');<br \/>\n        kksuffix=origkksuffix.replace(swipercp,'');<br \/>\n        kprefix=origkprefix.replace(swipel,'');<br \/>\n        ksuffix=origksuffix.replace(swiper,'');<br \/>\n       }<\/font><br \/>\n       if (kimstr == 0) {<br \/>\n         oimstr.innerHTML='  ' + kprefix + aimstr[kimstr] + ksuffix;<br \/>\n         origrest=(origt.split('' + aimstr[kimstr])[1] + ',' + origt.split('' + aimstr[kimstr])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         oimstr.title=kkprefix + aimstr[kimstr] + kksuffix + origrest;<br \/>\n       } else {<br \/>\n         oimstr.innerHTML='  ' + kprefix + aimstr[eval(-1 + kimstr)] + ksuffix;<br \/>\n         origrest=(origt.split('' + aimstr[eval(-1 + kimstr)])[1] + ',' + origt.split('' + aimstr[eval(-1 + kimstr)])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         oimstr.title=kkprefix + aimstr[eval(-1 + kimstr)] + kksuffix + origrest;<br \/>\n       }<br \/>\n     }<br \/>\n     if (opdstr) {<br \/>\n       origt=opdstr.getAttribute('data-title');<br \/>\n       <font color=blue>if (lasto == opdstr) {<br \/>\n        kkprefix=origkkprefix;<br \/>\n        kksuffix=origkksuffix;<br \/>\n        kprefix=origkprefix;<br \/>\n        ksuffix=origksuffix;<br \/>\n       } else if (swipel + swiper != '') {<br \/>\n        kkprefix=origkkprefix.replace(swipelcp,'');<br \/>\n        kksuffix=origkksuffix.replace(swipercp,'');<br \/>\n        kprefix=origkprefix.replace(swipel,'');<br \/>\n        ksuffix=origksuffix.replace(swiper,'');<br \/>\n       }<\/font><br \/>\n       if (kpdstr == 0) {<br \/>\n         opdstr.innerHTML='  ' + kprefix + apdstr[kpdstr] + ksuffix;<br \/>\n         origrest=(origt.split('' + apdstr[kpdstr])[1] + ',' + origt.split('' + apdstr[kpdstr])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         opdstr.title=kkprefix + apdstr[kpdstr] + kksuffix + origrest;<br \/>\n       } else {<br \/>\n         opdstr.innerHTML='  ' + kprefix + apdstr[eval(-1 + kpdstr)] + ksuffix;<br \/>\n         origrest=(origt.split('' + apdstr[eval(-1 + kpdstr)])[1] + ',' + origt.split('' + apdstr[eval(-1 + kpdstr)])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         opdstr.title=kkprefix + apdstr[eval(-1 + kpdstr)] + kksuffix + origrest;<br \/>\n       }<br \/>\n     }<br \/>\n     if (opastr) {<br \/>\n       origt=opastr.getAttribute('data-title');<br \/>\n       <font color=blue>if (lasto == opastr) {<br \/>\n        kkprefix=origkkprefix;<br \/>\n        kksuffix=origkksuffix;<br \/>\n        kprefix=origkprefix;<br \/>\n        ksuffix=origksuffix;<br \/>\n       } else if (swipel + swiper != '') {<br \/>\n        kkprefix=origkkprefix.replace(swipelcp,'');<br \/>\n        kksuffix=origkksuffix.replace(swipercp,'');<br \/>\n        kprefix=origkprefix.replace(swipel,'');<br \/>\n        ksuffix=origksuffix.replace(swiper,'');<br \/>\n       }<\/font><br \/>\n       if (kpastr == 0) {<br \/>\n         opastr.innerHTML='  ' + kprefix + apastr[kpastr] + ksuffix;<br \/>\n         origrest=(origt.split('' + apastr[kpastr])[1] + ',' + origt.split('' + apastr[kpastr])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         opastr.title=kkprefix + apastr[kpastr] + kksuffix + origrest;<br \/>\n       } else {<br \/>\n         opastr.innerHTML='  ' + kprefix + apastr[eval(-1 + kpastr)] + ksuffix;<br \/>\n         origrest=(origt.split('' + apastr[eval(-1 + kpastr)])[1] + ',' + origt.split('' + apastr[eval(-1 + kpastr)])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         opastr.title=kkprefix + apastr[eval(-1 + kpastr)] + kksuffix + origrest;<br \/>\n       }<br \/>\n     }<br \/>\n     if (offstr) {<br \/>\n       origt=offstr.getAttribute('data-title');<br \/>\n       <font color=blue>if (lasto == offstr) {<br \/>\n        kkprefix=origkkprefix;<br \/>\n        kksuffix=origkksuffix;<br \/>\n        kprefix=origkprefix;<br \/>\n        ksuffix=origksuffix;<br \/>\n       } else if (swipel + swiper != '') {<br \/>\n        kkprefix=origkkprefix.replace(swipelcp,'');<br \/>\n        kksuffix=origkksuffix.replace(swipercp,'');<br \/>\n        kprefix=origkprefix.replace(swipel,'');<br \/>\n        ksuffix=origksuffix.replace(swiper,'');<br \/>\n       }<\/font><br \/>\n       if (kffstr == 0) {<br \/>\n         offstr.innerHTML='  ' + kprefix + affstr[kffstr] + ksuffix;<br \/>\n         origrest=(origt.split('' + affstr[kffstr])[1] + ',' + origt.split('' + affstr[kffstr])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         offstr.title=kkprefix + affstr[kffstr] + kksuffix + origrest;<br \/>\n       } else {<br \/>\n         offstr.innerHTML='  ' + kprefix + affstr[eval(-1 + kffstr)] + ksuffix;<br \/>\n         origrest=(origt.split('' + affstr[eval(-1 + kffstr)])[1] + ',' + origt.split('' + affstr[eval(-1 + kffstr)])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         offstr.title=kkprefix + affstr[eval(-1 + kffstr)] + kksuffix + origrest;<br \/>\n       }<br \/>\n     }<br \/>\n     kcnt++;<br \/>\n     <font color=blue>swipel='';<br \/>\n     swipelcp='';<br \/>\n     swiper='';<br \/>\n     swipercp='';<\/font><br \/>\n     if (kcnt &lt; 7) {  setTimeout(betweeneatatjoes, 1000); }<br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;\n<\/li>\n<\/ol>\n<p> &#8230; in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php--------------GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php--------------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>).<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-dropdown-linear-gradient-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Linear Gradient Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fpimpdhst'>Previous relevant <a target=\"_blank\" title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Hover Swipe Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-dropdown-hover-swipe-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Hover Swipe Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Hover Swipe Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_swipe.jpg\" title=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Hover Swipe Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Hover Swipe Tutorial<\/p><\/div>\n<p>Some users are impatient, we grant you.  Maybe some don&#8217;t want to wait the whole time of an 8 second &#8220;Eat at Joes&#8221; rotation.  Well, we thought about this, and got an idea to extend yesterday&#8217;s <a title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Onhover Marquee Tutorial' href='#fpimpdomt'>Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Onhover Marquee Tutorial<\/a>&#8216;s non-mobile functionality via &#8230;<\/p>\n<ul>\n<li>dropdown option (with animation) element onmouseover (hover swipe <font size=1>(maybe)<\/font> in x,y) &#8230; call such as <i>oimstr.onmouseover=function(event) { wasplace(oimstr, event);  };<\/i> &#8230; uses &#8230;<br \/>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  var pos1=0, pos2=0, pos3=0, pos4=0, lasto=null;<br \/>\n<br \/>\n  function wasplace(thiso, e) {<br \/>\n    e = e || window.event;<br \/>\n    e.preventDefault();<br \/>\n       if (e.touches) {<br \/>\n       if (e.touches[0].pageX) {<br \/>\n       pos1 = e.touches[0].pageX;<br \/>\n       pos2 = e.touches[0].pageY;<br \/>\n       } else {<br \/>\n       pos1 = e.touches[0].clientX;<br \/>\n       pos2 = e.touches[0].clientY;<br \/>\n       }<br \/>\n       \/\/console.log('pos3=' + pos3 + ',pos4=' + pos4);<br \/>\n       } else if (e.clientX || e.clientY) {<br \/>\n        pos1 = e.clientX;<br \/>\n        pos2 = e.clientY;<br \/>\n       } else {<br \/>\n        pos1 = e.pageX;<br \/>\n        pos2 = e.pageY;<br \/>\n       }<br \/>\n       lasto=e.target;<br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<br \/>\n &#8230;and onmouseout (hover swipe out x,y) events &#8230; if delta<sup>x<\/sup> >= 70 &#8230; call such as <i>oimstr.onmouseout=function(event) { isplace(oimstr, event);  };<\/i> &#8230; uses &#8230;<br \/>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  function isplace(thiso, e) {<br \/>\n    var kkk=0;<br \/>\n    e = e || window.event;<br \/>\n    e.preventDefault();<br \/>\n       if (e.touches) {<br \/>\n       if (e.touches[0].pageX) {<br \/>\n       pos3 = e.touches[0].pageX;<br \/>\n       pos4 = e.touches[0].pageY;<br \/>\n       } else {<br \/>\n       pos3 = e.touches[0].clientX;<br \/>\n       pos4 = e.touches[0].clientY;<br \/>\n       }<br \/>\n       \/\/console.log('pos3=' + pos3 + ',pos4=' + pos4);<br \/>\n       } else if (e.clientX || e.clientY) {<br \/>\n        pos3 = e.clientX;<br \/>\n        pos4 = e.clientY;<br \/>\n       } else {<br \/>\n        pos3 = e.pageX;<br \/>\n        pos4 = e.pageY;<br \/>\n       }<br \/>\n       if (lasto == e.target) {<br \/>\n        if (Math.abs(pos1 - pos3) >= 70) {<br \/>\n          if (pos3 &gt; pos1) { \/\/ swipe right<br \/>\n            if (e.target == opastr) {<br \/>\n              kkk=eval(1 + eval('' + kpastr));<br \/>\n              if (kkk &gt;= eval('' + apastr.length)) {<br \/>\n                kpastr=0;<br \/>\n              } else {<br \/>\n                kpastr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == opdstr) {<br \/>\n              kkk=eval(1 + eval('' + kpdstr));<br \/>\n              if (kkk &gt;= eval('' + apdstr.length)) {<br \/>\n                kpdstr=0;<br \/>\n              } else {<br \/>\n                kpdstr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == oimstr) {<br \/>\n              kkk=eval(1 + eval('' + kimstr));<br \/>\n              if (kkk &gt;= eval('' + aimstr.length)) {<br \/>\n                kimstr=0;<br \/>\n              } else {<br \/>\n                kimstr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == offstr) {<br \/>\n              kkk=eval(1 + eval('' + kffstr));<br \/>\n              if (kkk &gt;= eval('' + affstr.length)) {<br \/>\n                kffstr=0;<br \/>\n              } else {<br \/>\n                kffstr=kkk;<br \/>\n              }<br \/>\n            }<br \/>\n          } else { \/\/ swipe left<br \/>\n            if (e.target == opastr) {<br \/>\n              kkk=eval(-1 + eval('' + kpastr));<br \/>\n              if (kkk &lt; 0) {<br \/>\n                kpastr=eval(-1 + eval('' + apastr.length));<br \/>\n              } else {<br \/>\n                kpastr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == opdstr) {<br \/>\n              kkk=eval(-1 + eval('' + kpdstr));<br \/>\n              if (kkk &lt; 0) {<br \/>\n                kpdstr=eval(-1 + eval('' + apdstr.length));<br \/>\n              } else {<br \/>\n                kpdstr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == oimstr) {<br \/>\n              kkk=eval(-1 + eval('' + kimstr));<br \/>\n              if (kkk &lt; 0) {<br \/>\n                kimstr=eval(-1 + eval('' + aimstr.length));<br \/>\n              } else {<br \/>\n                kimstr=kkk;<br \/>\n              }<br \/>\n            } else if (e.target == offstr) {<br \/>\n              kkk=eval(-1 + eval('' + kffstr));<br \/>\n              if (kkk &lt; 0) {<br \/>\n                kffstr=eval(-1 + eval('' + affstr.length));<br \/>\n              } else {<br \/>\n                kffstr=kkk;<br \/>\n              }<br \/>\n            }<br \/>\n          }<br \/>\n        }<br \/>\n        \/\/alert('swipe distance = ' + Math.abs(pos1 - pos3));<br \/>\n       }<br \/>\n       lasto=e.target;<br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;\n<\/li>\n<li>class a swipe right (if delta<sup>x<\/sup> > 0) else swipe left &#8230; resulting in &#8230;<\/li>\n<li>immediately show next option innerText if swipe right and show previous option innerText if swipe left<\/li>\n<\/ul>\n<p> &#8230; for you to <font color=blue>try for yourself<\/font> &#8230;<\/p>\n<blockquote><p>\nMedia and document action items<font color=blue> &#8230; please note you can hover swipe right or left, accurately, and with panache, regarding animated options to speed up transitions between option values<\/font>\n<\/p><\/blockquote>\n<p> &#8230; in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-------------GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-------------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>).<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-dropdown-hover-swipe-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Hover Swipe Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fpimpdomt'>Previous relevant <a target=\"_blank\" title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Onhover Marquee Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-dropdown-onhover-marquee-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Onhover Marquee Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Onhover Marquee Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_title_marquee.gif\" title=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Onhover Marquee Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Onhover Marquee Tutorial<\/p><\/div>\n<p>The non-mobile platforms have that useful wooooorrrrllllddd, the &#8220;onhover wooooorrrrllllddd&#8221; <font size=1>(to be precise)<\/font> that can be a great partner for Javascript <a target=\"_blank\" title='Ajax information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/Ajax_(programming)' rel=\"noopener\">Ajax<\/a> methodologies.  This onhover (actually the &#8220;onmouseover&#8221;) event is also useful whereby as a user hovers over an HTML element, and that element&#8217;s <i>title<\/i> attribute has a value, then the user can see that value displayed.<\/p>\n<p>And though, with yesterday&#8217;s <a title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Emoji Tutorial' href='#fpimpaet'>Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Emoji Tutorial<\/a> work &#8230;<\/p>\n<blockquote cite='\/\/www.rjmprogramming.com.au\/ITblog\/new-ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-animated-emoji-tutorial\/'><p>\nthough we&#8217;re not going &#8220;full marquee Eat at Joes&#8221;\n<\/p><\/blockquote>\n<p> &#8230; regarding the dropdown option innerText &#8220;look&#8221;, there is, for non-mobile, this &#8220;onhover wooooorrrrllllddd&#8221; we can use to try a form of <a target=\"_blank\" title='HTML marquee tag' href='https:\/\/www.w3schools.in\/html\/marquee-tag' rel=\"noopener\">marquee<\/a> &#8220;look&#8221; there, <font color=blue>as per<\/font> &#8230;<\/p>\n<p>&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  function betweeneatatjoes() {<br \/>\n     <font color=blue>var origt='', origrest='', kkprefix='...', kksuffix='...';<\/font><br \/>\n     if (kprefix == '' && ksuffix == '') {<br \/>\n       kprefix='&amp;#128309;..';<br \/>\n       <font color=blue>kkprefix=String.fromCodePoint(128309) + '..';<\/font><br \/>\n       ksuffix='...';<br \/>\n       \/\/document.getElementById('doverlaytwo').style.marginTop='20px';<br \/>\n     } else if (kprefix == '&amp;#128309;..') {<br \/>\n       kprefix='.&amp;#128309;.';<br \/>\n       <font color=blue>kkprefix='.' + String.fromCodePoint(128309) + '.';<\/font><br \/>\n       ksuffix='...';<br \/>\n     } else if (kprefix == '.&amp;#128309;.') {<br \/>\n       kprefix='..&amp;#128309;';<br \/>\n       <font color=blue>kkprefix='..' + String.fromCodePoint(128309) + '';<\/font><br \/>\n       ksuffix='...';<br \/>\n     } else if (kprefix == '..&amp;#128309;') {<br \/>\n       ksuffix='&amp;#128309;..';<br \/>\n       <font color=blue>kksuffix=String.fromCodePoint(128309) + '..';<\/font><br \/>\n       kprefix='...';<br \/>\n     } else if (ksuffix == '&amp;#128309;..') {<br \/>\n       ksuffix='.&amp;#12830<font color=blue>8<\/font>;.';<br \/>\n       <font color=blue>kksuffix='.' + String.fromCodePoint(128308) + '.';<\/font><br \/>\n       kprefix='...';<br \/>\n     } else if (ksuffix == '.&amp;#12830<font color=blue>8<\/font>;.') {<br \/>\n       ksuffix='..<font color=blue>&amp;#128308;<\/font>';<br \/>\n       <font color=blue>kksuffix='..' + String.fromCodePoint(128308) + '';<\/font><br \/>\n       kprefix='...';<br \/>\n     } else {<br \/>\n       kprefix='<font color=blue>&amp;#917536;<\/font>..';<br \/>\n       <font color=blue>kkprefix='..' + String.fromCodePoint(917536) + '..';<\/font><br \/>\n       ksuffix='...';<br \/>\n       \/\/document.getElementById('doverlaytwo').style.marginTop='0px';<br \/>\n     }<br \/>\n     if (oimstr) {<br \/>\n       <font color=blue>origt=oimstr.getAttribute('data-title');<\/font><br \/>\n       if (kimstr == 0) {<br \/>\n         oimstr.innerHTML='  ' + kprefix + aimstr[kimstr] + ksuffix;<br \/>\n         <font color=blue>origrest=(origt.split('' + aimstr[kimstr])[1] + ',' + origt.split('' + aimstr[kimstr])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         oimstr.title=kkprefix + aimstr[kimstr] + kksuffix + origrest;<\/font><br \/>\n       } else {<br \/>\n         oimstr.innerHTML='  ' + kprefix + aimstr[eval(-1 + kimstr)] + ksuffix;<br \/>\n         <font color=blue>origrest=(origt.split('' + aimstr[eval(-1 + kimstr)])[1] + ',' + origt.split('' + aimstr[eval(-1 + kimstr)])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         oimstr.title=kkprefix + aimstr[eval(-1 + kimstr)] + kksuffix + origrest;<\/font><br \/>\n       }<br \/>\n     }<br \/>\n     if (opdstr) {<br \/>\n       <font color=blue>origt=opdstr.getAttribute('data-title');<\/font><br \/>\n       if (kpdstr == 0) {<br \/>\n         opdstr.innerHTML='  ' + kprefix + apdstr[kpdstr] + ksuffix;<br \/>\n         <font color=blue>origrest=(origt.split('' + apdstr[kpdstr])[1] + ',' + origt.split('' + apdstr[kpdstr])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         opdstr.title=kkprefix + apdstr[kpdstr] + kksuffix + origrest;<\/font><br \/>\n       } else {<br \/>\n         opdstr.innerHTML='  ' + kprefix + apdstr[eval(-1 + kpdstr)] + ksuffix;<br \/>\n         <font color=blue>origrest=(origt.split('' + apdstr[eval(-1 + kpdstr)])[1] + ',' + origt.split('' + apdstr[eval(-1 + kpdstr)])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         opdstr.title=kkprefix + apdstr[eval(-1 + kpdstr)] + kksuffix + origrest;<\/font><br \/>\n       }<br \/>\n     }<br \/>\n     if (opastr) {<br \/>\n       <font color=blue>origt=opastr.getAttribute('data-title');<\/font><br \/>\n       if (kpastr == 0) {<br \/>\n         opastr.innerHTML='  ' + kprefix + apastr[kpastr] + ksuffix;<br \/>\n         <font color=blue>origrest=(origt.split('' + apastr[kpastr])[1] + ',' + origt.split('' + apastr[kpastr])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         opastr.title=kkprefix + apastr[kpastr] + kksuffix + origrest;<\/font><br \/>\n       } else {<br \/>\n         opastr.innerHTML='  ' + kprefix + apastr[eval(-1 + kpastr)] + ksuffix;<br \/>\n         <font color=blue>origrest=(origt.split('' + apastr[eval(-1 + kpastr)])[1] + ',' + origt.split('' + apastr[eval(-1 + kpastr)])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         opastr.title=kkprefix + apastr[eval(-1 + kpastr)] + kksuffix + origrest;<\/font><br \/>\n       }<br \/>\n     }<br \/>\n     if (offstr) {<br \/>\n       <font color=blue>origt=offstr.getAttribute('data-title');<\/font><br \/>\n       if (kffstr == 0) {<br \/>\n         offstr.innerHTML='  ' + kprefix + affstr[kffstr] + ksuffix;<br \/>\n         <font color=blue>origrest=(origt.split('' + affstr[kffstr])[1] + ',' + origt.split('' + affstr[kffstr])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         offstr.title=kkprefix + affstr[kffstr] + kksuffix + origrest;<\/font><br \/>\n       } else {<br \/>\n         offstr.innerHTML='  ' + kprefix + affstr[eval(-1 + kffstr)] + ksuffix;<br \/>\n         <font color=blue>origrest=(origt.split('' + affstr[eval(-1 + kffstr)])[1] + ',' + origt.split('' + affstr[eval(-1 + kffstr)])[0]).trim().replace(\/\\,\\,\/g,'').replace('undefined','');<br \/>\n         offstr.title=kkprefix + affstr[eval(-1 + kffstr)] + kksuffix + origrest;<\/font><br \/>\n       }<br \/>\n     }<br \/>\n     kcnt++;<br \/>\n     if (kcnt &lt; 7) {  setTimeout(betweeneatatjoes, 1000); }<br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<\/p>\n<p>Proof positive that emojis are text, and can help provide a graphic display interest for a webpage.  As well, as a CSS means by which we stop &#8220;dropdown Y jitteriness&#8221;, we introduce the use of <font color=blue>an emoji<\/font> &#9898; (&amp;#9898; or &amp;#x26aa;) for most option element <a target=\"_blank\" title='Claytons ... the drink you are having when you are not having a drink ... and this CSS technique contributes to what we know of as an option element innerText area but is not there in the Javascript DOM (and we are happy about this, being kind of lazy).' href='https:\/\/www.youtube.com\/watch?v=3qf4yUMxnjw' rel=\"noopener\"><i>Clayton<\/i><\/a> innerText parts, always &#8230;<\/p>\n<p><code><br \/>\n&lt;style&gt;<br \/>\n  <font color=blue>option:not(.nonwhite)::before {<br \/>\n    content: '\\0026aa';<br \/>\n  }<\/font><br \/>\n<br \/>\n  #doverlay {<br \/>\n     background-color: #FFE7E9;<br \/>\n  }<br \/>\n<br \/> <br \/>\n  #doverlaytwo {<br \/>\n     background-color: #FFE7E9;<br \/>\n  }<br \/>\n<br \/> <br \/>\n  body {<br \/>\n    background-color: #FFFFEF;<br \/>\n  }<br \/>\n&lt;\/style&gt;<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<\/p>\n<p> &#8230; with one more <font color=blue>media functionality<\/font> &#8230;<\/p>\n<p>&lt;?php<br \/>\n<code><br \/>\n  var mlook=false, kcnt=0, kprefix='', ksuffix='';<br \/>\n  var imstr='  Images to PDF,  Images to GIF,', oimstr=null, kimstr=0, aimstr=[];<br \/>\n  var pdstr='  PDF to Images,  PDF to HTML,  PDF to XML,', opdstr=null, kpdstr=0, apdstr=[];<br \/>\n  var pastr='  Text to HTML,  Text to Rich Text,  Text to Word,', opastr=null, kpastr=0, apastr=[];<br \/>\n  var ffstr='  Concat demuxer,<font color=blue>  Display the frame number on each frame,<\/font>', offstr=null, kffstr=0, affstr=[];<br \/>\n<\/code><br \/>\n?&gt;<\/p>\n<p> &#8230; in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php------------GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php------------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>).<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/new-ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-animated-emoji-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Dropdown Onhover Marquee Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fpimpaet'>Previous relevant <a target=\"_blank\" title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Emoji Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-animated-emoji-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Emoji Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Emoji Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_eatatjoes_emoji.jpg\" title=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Emoji Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Emoji Tutorial<\/p><\/div>\n<p>The &#8220;dropdown animations&#8221; introduced into yesterday&#8217;s <a title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Dropdown Tutorial' href='#fpimpadt'>Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Dropdown Tutorial<\/a> were a tad subtle, it only involving &#8230;<\/p>\n<ul>\n<li>the wording of option elements within the dropdown &#8230; and though we&#8217;re not going &#8220;full marquee Eat at Joes&#8221; we are accentuating &#8220;midway&#8221;, today, by &#8230;<\/li>\n<li>adding emoji &#128309; (&amp;#128309;) movement to the animation for interest sake, as well as being informative (in that the user can anticipate when the new innerText text will arrive, as the emoji moves from left to right)<\/li>\n<\/ul>\n<p> &#8230; that we team with <font color=blue>more instances<\/font> of multiple animation settings &#8230;<\/p>\n<p>&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  var mlook=false, kcnt=0, kprefix='', ksuffix='';<br \/>\n  var imstr='  Images to PDF,  <font color=blue>Images to GIF,<\/font>', oimstr=null, kimstr=0, aimstr=[];<br \/>\n  var pdstr='  PDF to Images,  <font color=blue>PDF to HTML,  PDF to XML,<\/font>', opdstr=null, kpdstr=0, apdstr=[];<br \/>\n  var pastr='  Text to HTML,  Text to Rich Text,<font color=blue>  Text to Word,<\/font>', opastr=null, kpastr=0, apastr=[];<br \/>\n  var ffstr='  Concat demuxer,  ', offstr=null, kffstr=0, affstr=[];<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<\/p>\n<p> &#8230; and a <font color=blue>new &#8220;between the 8 second setInterval wording refreshes&#8221; Javascript function<\/font> &#8230;<\/p>\n<p>&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  <font color=blue>function betweeneatatjoes() {<br \/>\n     if (kprefix == '' && ksuffix == '') {<br \/>\n       kprefix='&amp;#128309;..';<br \/>\n       ksuffix='...';<br \/>\n       document.getElementById('doverlaytwo').style.marginTop='20px';<br \/>\n     } else if (kprefix == '&amp;#128309;..') {<br \/>\n       kprefix='.&amp;#128309;.';<br \/>\n       ksuffix='...';<br \/>\n     } else if (kprefix == '.&amp;#128309;.') {<br \/>\n       kprefix='..&amp;#128309;';<br \/>\n       ksuffix='...';<br \/>\n     } else if (kprefix == '..&amp;#128309;') {<br \/>\n       ksuffix='&amp;#128309;..';<br \/>\n       kprefix='...';<br \/>\n     } else if (ksuffix == '&amp;#128309;..') {<br \/>\n       ksuffix='.&amp;#128309;.';<br \/>\n       kprefix='...';<br \/>\n     } else if (ksuffix == '.&amp;#128309;.') {<br \/>\n       ksuffix='..&amp;#128309;';<br \/>\n       kprefix='...';<br \/>\n     } else {<br \/>\n       kprefix='...';<br \/>\n       ksuffix='...';<br \/>\n       document.getElementById('doverlaytwo').style.marginTop='0px';<br \/>\n     }<br \/>\n     if (oimstr) {<br \/>\n       if (kimstr == 0) {<br \/>\n         oimstr.innerHTML='  ' + kprefix + aimstr[kimstr] + ksuffix;<br \/>\n       } else {<br \/>\n         oimstr.innerHTML='  ' + kprefix + aimstr[eval(-1 + kimstr)] + ksuffix;<br \/>\n       }<br \/>\n     }<br \/>\n     if (opdstr) {<br \/>\n       if (kpdstr == 0) {<br \/>\n         opdstr.innerHTML='  ' + kprefix + apdstr[kpdstr] + ksuffix;<br \/>\n       } else {<br \/>\n         opdstr.innerHTML='  ' + kprefix + apdstr[eval(-1 + kpdstr)] + ksuffix;<br \/>\n       }<br \/>\n     }<br \/>\n     if (opastr) {<br \/>\n       if (kpastr == 0) {<br \/>\n         opastr.innerHTML='  ' + kprefix + apastr[kpastr] + ksuffix;<br \/>\n       } else {<br \/>\n         opastr.innerHTML='  ' + kprefix + apastr[eval(-1 + kpastr)] + ksuffix;<br \/>\n       }<br \/>\n     }<br \/>\n     if (offstr) {<br \/>\n       if (kffstr == 0) {<br \/>\n         offstr.innerHTML='  ' + kprefix + affstr[kffstr] + ksuffix;<br \/>\n       } else {<br \/>\n         offstr.innerHTML='  ' + kprefix + affstr[kffstr] + ksuffix;<br \/>\n       }<br \/>\n     }<br \/>\n     kcnt++;<br \/>\n     if (kcnt &lt; 7) {  setTimeout(betweeneatatjoes, 1000); }<br \/>\n  }<\/font><br \/>\n<br \/> <br \/>\n  function eatatjoes() {<br \/>\n     <font color=purple>kcnt=0;<br \/>\n     kprefix='';<br \/>\n     ksuffix='';<br \/>\n     document.getElementById('doverlaytwo').style.marginTop='0px';<\/font><br \/>\n     if (oimstr) {<br \/>\n       if (kimstr &gt;= eval('' + aimstr.length)) {<br \/>\n         kimstr=0;<br \/>\n         oimstr.innerHTML='  ' + aimstr[kimstr];<br \/>\n       } else {<br \/>\n         oimstr.innerHTML='  ' + aimstr[kimstr];<br \/>\n         kimstr++;<br \/>\n       }<br \/>\n     }<br \/>\n     if (opdstr) {<br \/>\n       if (kpdstr &gt;= eval('' + apdstr.length)) {<br \/>\n         kpdstr=0;<br \/>\n         opdstr.innerHTML='  ' + apdstr[kpdstr];<br \/>\n       } else {<br \/>\n         opdstr.innerHTML='  ' + apdstr[kpdstr];<br \/>\n         kpdstr++;<br \/>\n       }<br \/>\n     }<br \/>\n     if (opastr) {<br \/>\n       \/\/alert(apastr.length);<br \/>\n       if (kpastr &gt;= eval('' + apastr.length)) {<br \/>\n         kpastr=0;<br \/>\n         opastr.innerHTML='  ' + apastr[kpastr];<br \/>\n       } else {<br \/>\n         opastr.innerHTML='  ' + apastr[kpastr];<br \/>\n         kpastr++;<br \/>\n       }<br \/>\n     }<br \/>\n     if (offstr) {<br \/>\n       if (kffstr &gt;= eval('' + affstr.length)) {<br \/>\n         kffstr=0;<br \/>\n         offstr.innerHTML='  ' + affstr[kffstr];<br \/>\n       } else {<br \/>\n         offstr.innerHTML='  ' + affstr[kffstr];<br \/>\n         kffstr++;<br \/>\n       }<br \/>\n     }<br \/>\n     <font color=purple>setTimeout(betweeneatatjoes, 1000);<\/font><br \/>\n  }<br \/>\n<br \/> <br \/>\n  <font color=cyan>function andthen(iidea) {<\/font><br \/>\n     var outidea=iidea;<br \/>\n     var fndpos=-1;<br \/>\n     var optsare=document.getElementsByTagName('option'), ioptsare=0;<br \/>\n     var iimstr=(imstr.indexOf(',') == -1 ? -1 : outidea.indexOf(imstr.split(',')[0].trim() + ','));<br \/>\n     mlook=false;<br \/>\n     if (iimstr != -1) {<br \/>\n        if ((imstr.split(',')[0].trim() + ',') != imstr.trim()) {<br \/>\n          if (document.getElementById('oimagemagick')) {<br \/>\n             oimstr=document.getElementById('oimagemagick');<br \/>\n             mlook=true;<br \/>\n             aimstr=imstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n          } else {<br \/>\n             for (ioptsare=0; ioptsare&lt;optsare.length; ioptsare++) {<br \/>\n                if (optsare[ioptsare].value == imstr.split(',')[0].trim()) {<br \/>\n                  oimstr=optsare[ioptsare];<br \/>\n                  mlook=true;<br \/>\n                  aimstr=imstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n                }<br \/>\n             }<br \/>\n          }<br \/>\n          outidea=outidea.replace(imstr.split(',')[0].trim(), imstr.split(',')[0].trim() + '' + (imstr.replace(imstr.split(',')[0],'').trim() + ',').replace(',,',',').replace(\/\\,$\/g,''));<br \/>\n        }<br \/>\n     }<br \/>\n     var ipdstr=(pdstr.indexOf(',') == -1 ? -1 : outidea.indexOf(pdstr.split(',')[0].trim() + ','));<br \/>\n     if (ipdstr != -1) {<br \/>\n        if ((pdstr.split(',')[0].trim() + ',') != pdstr.trim()) {<br \/>\n          if (document.getElementById('opdfimages')) {<br \/>\n             opdstr=document.getElementById('opdfimages');<br \/>\n             mlook=true;<br \/>\n             apdstr=pdstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n          } else {<br \/>\n             for (ioptsare=0; ioptsare&lt;optsare.length; ioptsare++) {<br \/>\n                if (optsare[ioptsare].value == pdstr.split(',')[0].trim()) {<br \/>\n                  opdstr=optsare[ioptsare];<br \/>\n                  mlook=true;<br \/>\n                  apdstr=pdstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n                }<br \/>\n             }<br \/>\n          }<br \/>\n          outidea=outidea.replace(pdstr.split(',')[0].trim(), pdstr.split(',')[0].trim() + '' + (pdstr.replace(imstr.split(',')[0],'').trim() + ',').replace(',,',',').replace(\/\\,$\/g,''));<br \/>\n        }<br \/>\n     }<br \/>\n     var ipastr=(pastr.indexOf(',') == -1 ? -1 : outidea.indexOf(pastr.split(',')[0].trim() + ','));<br \/>\n     if (ipastr != -1) {<br \/>\n        if ((pastr.split(',')[0].trim() + ',') != pastr.trim()) {<br \/>\n          if (document.getElementById('opandoc')) {<br \/>\n             opastr=document.getElementById('opandoc');<br \/>\n             mlook=true;<br \/>\n             apastr=pastr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n          } else {<br \/>\n             for (ioptsare=0; ioptsare&lt;optsare.length; ioptsare++) {<br \/>\n                if (optsare[ioptsare].value == pastr.split(',')[0].trim()) {<br \/>\n                  opastr=optsare[ioptsare];<br \/>\n                  mlook=true;<br \/>\n                  apastr=pastr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n                }<br \/>\n             }<br \/>\n          }<br \/>\n          outidea=outidea.replace(pastr.split(',')[0].trim(), pastr.split(',')[0].trim() + '' + (pastr.replace(imstr.split(',')[0],'').trim() + ',').replace(',,',',').replace(\/\\,$\/g,''));<br \/>\n        }<br \/>\n     }<br \/>\n     var iffstr=(ffstr.indexOf(',') == -1 ? -1 : outidea.indexOf(ffstr.split(',')[0].trim() + ','));<br \/>\n     if (iffstr != -1) {<br \/>\n        if ((ffstr.split(',')[0].trim() + ',') != ffstr.trim()) {<br \/>\n          if (document.getElementById('offmpeg')) {<br \/>\n             offstr=document.getElementById('offmpeg');<br \/>\n             mlook=true;<br \/>\n             affstr=ffstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n          } else {<br \/>\n             for (ioptsare=0; ioptsare&lt;optsare.length; ioptsare++) {<br \/>\n                if (optsare[ioptsare].value == ffstr.split(',')[0].trim()) {<br \/>\n                  offstr=optsare[ioptsare];<br \/>\n                  mlook=true;<br \/>\n                  affstr=ffstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n                }<br \/>\n             }<br \/>\n          }<br \/>\n          outidea=outidea.replace(ffstr.split(',')[0].trim(), ffstr.split(',')[0].trim() + '' + (ffstr.replace(imstr.split(',')[0],'').trim() + ',').replace(',,',',').replace(\/\\,$\/g,''));<br \/>\n        }<br \/>\n     }<br \/>\n     <font color=magenta>if (mlook) { setInterval(eatatjoes, 8000); }<\/font><br \/>\n     return outidea;<br \/>\n  <font color=cyan>}<\/font><br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<\/p>\n<p> &#8230; helped out via the original <font color=magenta>setInterval Javascript &#8220;eatatjoes&#8221; function<\/font> (all kicked off via modified document.body onload logic <br \/><i style=font-size:8px;>document.getElementById(&#8216;mainspan&#8217;).title = <font color=cyan>andthen(<\/font>document.getElementById(&#8216;schoices&#8217;).innerText.replace(\/\\&#038;nbsp\\;\/g,&#8217; &#8216;).replace(\/\\ \\ \/g,&#8217;, &#8216;)<font color=cyan>)<\/font>;<\/i><br \/>), <font color=purple>as modified<\/font>, above.<\/p>\n<p>You can see this in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-----------GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-----------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>).<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/new-ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-animated-dropdown-tutorial\/' rel=\"noopener\">New Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Dropdown Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fpimpadt'>Previous relevant <a target=\"_blank\" title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Dropdown Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-animated-dropdown-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Dropdown Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Dropdown Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_eatatjoes.jpg\" title=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages  Animated Dropdown Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Dropdown Tutorial<\/p><\/div>\n<p><a target=\"_blank\" title='?' href='https:\/\/www.youtube.com\/watch?v=tpwI7xk34bc' rel=\"noopener\">Lemon curry<\/a>?!  Animated dropdown?!  What gives?  Well, it&#8217;s not &#8220;shelling peas&#8221;, yet!<\/p>\n<p>Yes, there is another &#8220;framework&#8221; step forward we wanted to implement before the peas.  And yes, no surprises there, the &#8220;framework&#8221; work relates to adding functionality to our main dropdown.  We&#8217;re adding a layer of functionality we&#8217;re going to refer to as &#8220;animated dropdown&#8221;.  It amounts to &#8230;<\/p>\n<ul>\n<li>dropdown (ie. <a target=\"_blank\" href='http:\/\/www.w3schools.com\/tags\/tag_select.asp' title='HTML select tag information from w3schools' rel=\"noopener\">select<\/a> element) &#8230; for non-mobile &#8230;<\/li>\n<li>has <i>size<\/i> attribute equal to the number of option elements it contains<\/li>\n<li>logic wise, because our non-nothing option innerText<sub>s<\/sub> have equalled option value<sub>s<\/sub> (if you Javascript trim() the option innerText, <a target=\"_blank\" title='?' href='https:\/\/www.youtube.com\/watch?v=PtR4cWb4HNg' rel=\"noopener\">that is<\/a>), we have the opportunity to <font color=blue>start taking more notice<\/font> of the &#8230;<br \/>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  function process(tv, tvo) {<br \/>\n    var newval='';<br \/>\n    <font color=blue>var ourtv=tvo.value;<br \/>\n    if (tv != '') {<br \/>\n      ourtv=tvo.options[tvo.selectedIndex].innerText.trim();<br \/>\n    }<\/font><br \/>\n    if (origval == '') { origval=document.getElementById('mydefopt').title;  }<br \/>\n    if (tv == '') {<br \/>\n      document.getElementById('mainspan').innerHTML=document.getElementById('mydefopt').title;<br \/>\n    } else {<br \/>\n      document.getElementById('mydefopt').title=<font color=blue>ourtv; \/\/<\/font>tv;<br \/>\n      document.getElementById('mainspan').innerHTML=document.getElementById('mydefopt').title;<br \/>\n      document.getElementById('schoices').value='';<br \/>\n    }<br \/>\n    newval=document.getElementById('mydefopt').title;<br \/>\n    \/\/alert('origval,newval=' + origval + ' ' + newval);<br \/>\n    if (newval != origval) {<br \/>\n      origval=newval;<br \/>\n      wentfrom(origval, newval);<br \/>\n    } else {<br \/>\n      origval=newval;<br \/>\n    }<br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<br \/>\n &#8230; option innerHTML as above, meaning &#8230;\n<\/li>\n<li>we can set up Javascript code facilitating the animated feel of some option innerHTML looks that are taken notice of as selected via &#8230;<br \/>\n<table style=font-size:10px;>\n<tr>\n<th>Global var<font size=1>iables<\/font> arranged via each &#8220;verb&#8221; involved &#8230; for today&#8217;s &#8220;proof of concept&#8221; we add one extra Pandoc &#8220;Text to Rich Text&#8221; option, <font color=blue>for now<\/font>, before the flood of peas arrives &#8230;<\/th>\n<\/tr>\n<tr>\n<td>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  var mlook=false;<br \/>\n  var imstr='  Images to PDF,  ', oimstr=null, kimstr=0, aimstr=[];<br \/>\n  var pdstr='  PDF to Images,  ', opdstr=null, kpdstr=0, apdstr=[];<br \/>\n  var pastr='  Text to HTML,  <font color=blue>Text to Rich Text,<\/font>', opastr=null, kpastr=0, apastr=[];<br \/>\n  var ffstr='  Concat demuxer,  ', offstr=null, kffstr=0, affstr=[];<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;\n<\/td>\n<\/tr>\n<tr>\n<td>As heading title is determined at document.body onload <i>document.getElementById(&#8216;mainspan&#8217;).title=<font color=blue>andthen(<\/font>document.getElementById(&#8216;schoices&#8217;).innerText.replace(\/\\&#038;nbsp\\;\/g,&#8217; &#8216;).replace(\/\\ \\ \/g,&#8217;, &#8216;)<font color=blue>)<\/font>;<\/i> &#8230;<\/td>\n<\/tr>\n<tr>\n<td>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  function andthen(iidea) {<br \/>\n     var outidea=iidea;<br \/>\n     var fndpos=-1;<br \/>\n     var optsare=document.getElementsByTagName('option'), ioptsare=0;<br \/>\n     var iimstr=(imstr.indexOf(',') == -1 ? -1 : outidea.indexOf(imstr.split(',')[0].trim() + ','));<br \/>\n     mlook=false;<br \/>\n     if (iimstr != -1) {<br \/>\n        if ((imstr.split(',')[0].trim() + ',') != imstr.trim()) {<br \/>\n          if (document.getElementById('oimagemagick')) {<br \/>\n             oimstr=document.getElementById('oimagemagick');<br \/>\n             mlook=true;<br \/>\n             aimstr=imstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n          } else {<br \/>\n             for (ioptsare=0; ioptsare&lt;optsare.length; ioptsare++) {<br \/>\n                if (optsare[ioptsare].value == imstr.split(',')[0].trim()) {<br \/>\n                  oimstr=optsare[ioptsare];<br \/>\n                  mlook=true;<br \/>\n                  aimstr=imstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n                }<br \/>\n             }<br \/>\n          }<br \/>\n          outidea=outidea.replace(imstr.split(',')[0].trim(), imstr.split(',')[0].trim() + '' + (imstr.replace(imstr.split(',')[0],'').trim() + ',').replace(',,',',').replace(\/\\,$\/g,''));<br \/>\n        }<br \/>\n     }<br \/>\n     var ipdstr=(pdstr.indexOf(',') == -1 ? -1 : outidea.indexOf(pdstr.split(',')[0].trim() + ','));<br \/>\n     if (ipdstr != -1) {<br \/>\n        if ((pdstr.split(',')[0].trim() + ',') != pdstr.trim()) {<br \/>\n          if (document.getElementById('opdfimages')) {<br \/>\n             opdstr=document.getElementById('opdfimages');<br \/>\n             mlook=true;<br \/>\n             aipdtr=pdstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n          } else {<br \/>\n             for (ioptsare=0; ioptsare&lt;optsare.length; ioptsare++) {<br \/>\n                if (optsare[ioptsare].value == pdstr.split(',')[0].trim()) {<br \/>\n                  opdstr=optsare[ioptsare];<br \/>\n                  mlook=true;<br \/>\n                  apdstr=pdstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n                }<br \/>\n             }<br \/>\n          }<br \/>\n          outidea=outidea.replace(pdstr.split(',')[0].trim(), pdstr.split(',')[0].trim() + '' + (pdstr.replace(imstr.split(',')[0],'').trim() + ',').replace(',,',',').replace(\/\\,$\/g,''));<br \/>\n        }<br \/>\n     }<br \/>\n     var ipastr=(pastr.indexOf(',') == -1 ? -1 : outidea.indexOf(pastr.split(',')[0].trim() + ','));<br \/>\n     if (ipastr != -1) {<br \/>\n        if ((pastr.split(',')[0].trim() + ',') != pastr.trim()) {<br \/>\n          if (document.getElementById('opandoc')) {<br \/>\n             opastr=document.getElementById('opandoc');<br \/>\n             mlook=true;<br \/>\n             apastr=pastr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n          } else {<br \/>\n             for (ioptsare=0; ioptsare&lt;optsare.length; ioptsare++) {<br \/>\n                if (optsare[ioptsare].value == pastr.split(',')[0].trim()) {<br \/>\n                  opastr=optsare[ioptsare];<br \/>\n                  mlook=true;<br \/>\n                  apastr=pastr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n                }<br \/>\n             }<br \/>\n          }<br \/>\n          outidea=outidea.replace(pastr.split(',')[0].trim(), pastr.split(',')[0].trim() + '' + (pastr.replace(imstr.split(',')[0],'').trim() + ',').replace(',,',',').replace(\/\\,$\/g,''));<br \/>\n        }<br \/>\n     }<br \/>\n     var iffstr=(ffstr.indexOf(',') == -1 ? -1 : outidea.indexOf(ffstr.split(',')[0].trim() + ','));<br \/>\n     if (iffstr != -1) {<br \/>\n        if ((ffstr.split(',')[0].trim() + ',') != ffstr.trim()) {<br \/>\n          if (document.getElementById('offmpeg')) {<br \/>\n             offstr=document.getElementById('offmpeg');<br \/>\n             mlook=true;<br \/>\n             affstr=ffstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n          } else {<br \/>\n             for (ioptsare=0; ioptsare&lt;optsare.length; ioptsare++) {<br \/>\n                if (optsare[ioptsare].value == ffstr.split(',')[0].trim()) {<br \/>\n                  offstr=optsare[ioptsare];<br \/>\n                  mlook=true;<br \/>\n                  affstr=ffstr.trim().replace(\/\\,\\ \\ \/g,',').replace(\/\\,\\ \/g,',').replace(\/\\,$\/g,'').split(',');<br \/>\n                }<br \/>\n             }<br \/>\n          }<br \/>\n          outidea=outidea.replace(ffstr.split(',')[0].trim(), ffstr.split(',')[0].trim() + '' + (ffstr.replace(imstr.split(',')[0],'').trim() + ',').replace(',,',',').replace(\/\\,$\/g,''));<br \/>\n        }<br \/>\n     }<br \/>\n     if (mlook) { setInterval(eatatjoes, 8000); }<br \/>\n     return outidea;<br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<br \/>\n &#8230; the appeal of all this being that the dropdown height can be controlled by swapping animation for height extension (and user experience downgrades)\n<\/td>\n<\/tr>\n<tr>\n<td>Animated dropdown setInterval Javascript function (<i>bit like<\/i> marquee <i>Eat at Joes<\/i> type of animation<font size=1> (we&#8217;ll see if it gets more like it into the future, perhaps?)<\/font>) &#8230;<\/td>\n<\/tr>\n<tr>\n<td>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  function eatatjoes() {<br \/>\n     if (oimstr) {<br \/>\n       if (kimstr &gt;= eval('' + aimstr.length)) {<br \/>\n         kimstr=0;<br \/>\n         oimstr.innerHTML='  ' + aimstr[kimstr];<br \/>\n       } else {<br \/>\n         oimstr.innerHTML='  ' + aimstr[kimstr];<br \/>\n         kimstr++;<br \/>\n       }<br \/>\n     }<br \/>\n     if (opdstr) {<br \/>\n       if (kpdstr &gt;= eval('' + apdstr.length)) {<br \/>\n         kpdstr=0;<br \/>\n         opdstr.innerHTML='  ' + apdstr[kpdstr];<br \/>\n       } else {<br \/>\n         opdstr.innerHTML='  ' + apdstr[kpdstr];<br \/>\n         kpdstr++;<br \/>\n       }<br \/>\n     }<br \/>\n     if (opastr) {<br \/>\n       if (kpastr &gt;= eval('' + apastr.length)) {<br \/>\n         kpastr=0;<br \/>\n         opastr.innerHTML='  ' + apastr[kpastr];<br \/>\n       } else {<br \/>\n         opastr.innerHTML='  ' + apastr[kpastr];<br \/>\n         kpastr++;<br \/>\n       }<br \/>\n     }<br \/>\n     if (offstr) {<br \/>\n       if (kffstr &gt;= eval('' + affstr.length)) {<br \/>\n         kffstr=0;<br \/>\n         offstr.innerHTML='  ' + affstr[kffstr];<br \/>\n       } else {<br \/>\n         offstr.innerHTML='  ' + affstr[kffstr];<br \/>\n         kffstr++;<br \/>\n       }<br \/>\n     }<br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;\n<\/td>\n<\/tr>\n<\/table>\n<\/li>\n<\/ul>\n<p> &#8230; onto yesterday&#8217;s <a title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Media Tutorial' href='#fpimpmt'>Ffmpeg and Pandoc and ImageMagick and Pdfimages Media Tutorial<\/a> in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php----------GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php----------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>).<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-animated-dropdown-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Animated Dropdown Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fpimpmt'>Previous relevant <a target=\"_blank\" title='Ffmpeg and Pandoc and ImageMagick and Pdfimages Media Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-media-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Media Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Media Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_pandoc.jpg\" title=\"Ffmpeg and Pandoc and ImageMagick and Pdfimages Media Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Media Tutorial<\/p><\/div>\n<p>Onto yesterday&#8217;s <a title='Ffmpeg and ImageMagick and Pdfimages Media Tutorial' href='#fimpmt'>Ffmpeg and ImageMagick and Pdfimages Media Tutorial<\/a> &#8230;<\/p>\n<ul>\n<li><a style=\"vertical-align:top;\" target=\"_blank\" title=\"ffmpeg\" href='\/\/ffmpeg.org' rel=\"noopener\">ffmpeg<\/a> &#8230; two more media manipulation &#8220;verb&#8221; stars today &#8230;<\/li>\n<li><a target=\"_blank\" title='ImageMagick software suite' href='https:\/\/www.imagemagick.org\/' rel=\"noopener\">ImageMagick<\/a> (can help us with new &#8220;Images to PDF&#8221; option)<\/li>\n<li><a target=\"_blank\" title='Pdfimages' href='https:\/\/www.xpdfreader.com\/pdfimages-man.html' rel=\"noopener\">pdfimages<\/a> (can help us with new &#8220;PDF to Images&#8221; option) &#8230; &#8220;verb&#8221; collection, today, we wanted to add &#8230;<\/li>\n<li><a target=\"_blank\" title='Pandoc' href='https:\/\/pandoc.org' rel=\"noopener\">pandoc<\/a> (can help us with new &#8220;Text to HTML&#8221; option) &#8230;<br \/>\n<blockquote cite='\/\/pandoc.org'><p>\nIf you need to convert files from one markup format into another, pandoc is your swiss-army knife.\n<\/p><\/blockquote>\n<\/li>\n<\/ul>\n<p> &#8230; to help improve the &#8220;one stop shop&#8221; aspects, especially regarding &#8220;documents&#8221;, to our current Intranet feeling web application in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php---------GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php---------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>).<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-pandoc-and-imagemagick-and-pdfimages-media-tutorial\/' rel=\"noopener\">Ffmpeg and Pandoc and ImageMagick and Pdfimages Media Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fimpmt'>Previous relevant <a target=\"_blank\" title='Ffmpeg and ImageMagick and Pdfimages Media Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-imagemagick-and-pdfimages-media-tutorial\/' rel=\"noopener\">Ffmpeg and ImageMagick and Pdfimages Media Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg and ImageMagick and Pdfimages Media Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/imagemagick_and_pdfimages_and_ffmpeg_media_manipulations.gif\" title=\"Ffmpeg and ImageMagick and Pdfimages Media Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg and ImageMagick and Pdfimages Media Tutorial<\/p><\/div>\n<p>Yesterday&#8217;s <a title='Ffmpeg Rotate Video Tutorial' href='#frvt'>Ffmpeg Rotate Video Tutorial<\/a> left you with &#8230;<\/p>\n<blockquote cite='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-rotate-video-tutorial\/'><p>\nWe now present those four in &#8220;an expanded out&#8221; (at least on non-mobile) dropdown HTML element.  Maybe you can guess why?\n<\/p><\/blockquote>\n<p> &#8230; and today we are deploying the framework parts and two new media manipulation options regarding PDF that add to our PHP web application&#8217;s functionality.<\/p>\n<p>Operating system commands can be thought of to start with &#8230;<\/p>\n<ul>\n<li>an action item (to be precise a desktop software file specification) &#8230; and, what we often think is, like &#8230;<\/li>\n<li>the command&#8217;s &#8220;verb&#8221; part <font size=1>(as funny as that is to think of a &#8220;noun&#8221; sounding desktop software file specification being like a &#8220;verb&#8221;)<\/font> &#8230; verbs being action items in a sentence &#8230; down to being essential in any sentence &#8230; to the point a &#8220;verb&#8221; can be the whole sentence<\/li>\n<\/ul>\n<p>We want to add functionality by adding to our first &#8220;verb&#8221; &#8230;<\/p>\n<ul>\n<li><a style=\"vertical-align:top;\" target=\"_blank\" title=\"ffmpeg\" href='\/\/ffmpeg.org' rel=\"noopener\">ffmpeg<\/a> &#8230; two more media manipulation &#8220;verb&#8221; stars today &#8230;<\/li>\n<li><a target=\"_blank\" title='ImageMagick software suite' href='https:\/\/www.imagemagick.org\/' rel=\"noopener\">ImageMagick<\/a> (can help us with new &#8220;Images to PDF&#8221; option)<\/li>\n<li><a target=\"_blank\" title='Pdfimages' href='https:\/\/www.xpdfreader.com\/pdfimages-man.html' rel=\"noopener\">pdfimages<\/a> (can help us with new &#8220;PDF to Images&#8221; option)<\/li>\n<\/ul>\n<p> &#8230; and to help the &#8220;framework&#8221; ahead of &#8220;shelling peas&#8221; we lean on the experience we got from the <a target=\"_blank\" title='Animated GIF Creation on Windows MAMP via PDF Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/animated-gif-creation-on-windows-mamp-via-pdf-tutorial\/' rel=\"noopener\">Animated GIF Creation on Windows MAMP via PDF Tutorial<\/a> thread of blog postings to deal with &#8230;<\/p>\n<ul>\n<li>software paths<\/li>\n<li>presenting two new &#8220;verb&#8221; ideas &#8230; and us being so fond of dropdowns, we decided to try, for our first time &#8230;\n<ol>\n<li>start to use three HTML option CSS <i>text-align<\/i> style choices being left (for ffmpeg), center (for ImageMagick) and right (for pdfimages) &#8230; as in &#8230;<br \/>\n<select size=7 data-onchange=process(this.value,this); style=display:inline-block;font-size:8px; id=schoices><option style=text-align:center; id=mydefopt title='Add Voiceover Audio to Video' value=''>&#10549; Image&#11015;Magick &#10550;<\/option><option value='Add Voiceover Audio to Video'> Add Voiceover Audio to Video&nbsp;<\/option><option style='text-align:center;' value='Images to PDF'>  Images to PDF<\/option><option style='text-align:right;' value='PDF to Images'>  PDF to Images<\/option><option value='Burn subtitles'>  Burn subtitles<\/option><option value='Concat demuxer'>  Concat demuxer<\/option><option value='Rotate a video'>  Rotate a video<\/option><\/select><br \/>\n &#8230; within &#8230;<\/p>\n<h4 id=myh1 style=vertical-align:top;><span id=mainspan style=vertical-align:top;>Add Voiceover Audio to Video<\/span><span style=vertical-align:top;> via <\/span><a style=\"vertical-align:top;\" target=\"_blank\" title=\"ffmpeg\" href='\/\/ffmpeg.org' rel=\"noopener\">ffmpeg<\/a>&nbsp;<select size=7 data-onchange=process(this.value,this); style=display:inline-block;font-size:8px; id=schoices><option style=text-align:center; id=mydefopt title='Add Voiceover Audio to Video' value=''>&#10549; Image&#11015;Magick &#10550;<\/option><option value='Add Voiceover Audio to Video'> Add Voiceover Audio to Video&nbsp;<\/option><option style='text-align:center;' value='Images to PDF'>  Images to PDF<\/option><option style='text-align:right;' value='PDF to Images'>  PDF to Images<\/option><option value='Burn subtitles'>  Burn subtitles<\/option><option value='Concat demuxer'>  Concat demuxer<\/option><option value='Rotate a video'>  Rotate a video<\/option><\/select>&nbsp;<a style=\"vertical-align:top;\" target=\"_blank\" title=\"pdfimages\" href='\/\/www.xpdfreader.com\/pdfimages-man.html' rel=\"noopener\">pdfimages<\/a><\/h4>\n<p> &#8230;<br \/>\n<code><br \/>\n&lt;select size=7 onchange=process(this.value,this); style=display:inline-block;font-size:8px; id=schoices&gt;&lt;option style=text-align:center; id=mydefopt title='Add Voiceover Audio to Video' value=''&gt;&amp;#10549; Image&amp;#11015;Magick &amp;#10550;&lt;\/option&gt;&lt;option value='Add Voiceover Audio to Video'&gt; Add Voiceover Audio to Video&nbsp;&lt;\/option&gt;&lt;option style='text-align:center;' value='Images to PDF'&gt;  Images to PDF&lt;\/option&gt;&lt;option style='text-align:right;' value='PDF to Images'&gt;  PDF to Images&lt;\/option&gt;&lt;option value='Burn subtitles'&gt;  Burn subtitles&lt;\/option&gt;&lt;option value='Concat demuxer'&gt;  Concat demuxer&lt;\/option&gt;&lt;option value='Rotate a video'&gt;  Rotate a video&lt;\/option&gt;&lt;\/select&gt;<br \/>\n<\/code><br \/>\n &#8230; and then in order to offer the &#8220;center&#8221; ImageMagick be a link back to the product we introduce some <font color=blue>new overlay code<\/font> &#8230;<br \/>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  function overlay() {<br \/>\n   origval=document.getElementById('schoices').value;<br \/>\n   var rect=document.getElementById('fcommand').getBoundingClientRect();<br \/>\n   document.getElementById('moreb').style.position='absolute';<br \/>\n   document.getElementById('moreb').style.left='' + rect.left + 'px';<br \/>\n   document.getElementById('moreb').style.top='' + rect.top + 'px';<br \/>\n   document.getElementById('moreb').style.width='96%'; \/\/' + rect.width + 'px';<br \/>\n   document.getElementById('moreb').style.height='' + rect.height + 'px';<br \/>\n   document.getElementById('moreb').style.border='1px solid black';<br \/>\n   document.getElementById('moreb').style.paddingLeft='20px';<br \/>\n   document.getElementById('moreb').style.backgroundColor='#f9f9f9';<br \/>\n   document.getElementById('fcommand').style.opacity='0.0';<br \/>\n   document.getElementById('fcommand').style.cursor='pointer';<br \/>\n   document.getElementById('moreb').innerHTML='&lt;span id=precmds&gt;&lt;\/span&gt;&lt;span id=verb&gt;ffmpeg\" . $ffmpegsuf . \"&lt;\/span&gt; &lt;span id=prescbi&gt;&lt;\/span&gt;&lt;span id=minusi&gt; -i &lt;\/span&gt;&lt;span id=scbi&gt;&lt;iframe onload=checkif(this,\\\"inv.mp4\\\"); scrolling=no frameborder=0 id=cbi data-type=file data-value=inv.mp4 data-accept=\\\"video\/*\\\" style=\\\"display:inline-block;height:40px;width:92px;vertical-align:middle;\\\" src=\\\"\/HTMLCSS\/client_browsing.htm?d=69075964842271&left=y\\\"&gt;&lt;\/iframe&gt;&lt;\/span&gt; &lt;span id=betweenis&gt;&lt;\/span&gt; &lt;span id=secondi&gt;-i &lt;span id=scbix&gt;&lt;iframe onload=checkiftwo(this,\\\"inva.mp4\\\"); scrolling=no frameborder=0 id=cbix data-type=file data-value=inva.mp4 data-accept=\\\"video\/*\\\" style=\\\"display:inline-block;height:40px;width:106px;vertical-align:middle;\\\" src=\\\"\/HTMLCSS\/client_browsing.htm?d=69075964842271&right=y\\\"&gt;&lt;\/iframe&gt;&lt;\/span&gt;&lt;\/span&gt; &lt;span id=sswitches&gt;-c copy -map 0:v:0 -map 1:a:0 -shortest&lt;\/span&gt; out.mp4 &gt; &lt;a target=_blank title=ffimpdf.bad onclick=getvb(); style=cursor:pointer;text-decoration:underline; data-href=.\/ffimpdf.bad&gt;ffimpdf.bad&lt;\/a&gt;';<br \/>\n   if (firstdivih == '') { firstdivih=document.getElementById('moreb').innerHTML; }<br \/>\n   if (firstbutval == '') { firstbutval=document.getElementById('mysub').value; }<br \/>\n   document.getElementById('schoices').style.display='inline-block';<br \/>\n<br \/> <br \/>\n   <font color=blue>rect=document.getElementById('schoices').getBoundingClientRect();<br \/>\n<br \/> <br \/>\n   if (eval('' + rect.height) &gt; 100 || 1 == 1) {<br \/>\n   document.getElementById('doverlay').style.position='absolute';<br \/>\n   document.getElementById('doverlay').style.left='' + rect.left + 'px';<br \/>\n   document.getElementById('doverlay').style.top='' + rect.top + 'px';<br \/>\n   document.getElementById('doverlay').style.width='' + rect.width + 'px';<br \/>\n   if (eval('' + rect.height) &lt; 30) {<br \/>\n   document.getElementById('doverlay').style.height='' + rect.height + 'px';<br \/>\n   } else {<br \/>\n   document.getElementById('doverlay').style.height='' + eval(eval('' + rect.height) \/ eval('' + document.getElementById('schoices').size)) + 'px';<br \/>\n   }<br \/>\n   document.getElementById('doverlay').style.zIndex='96';<br \/>\n   document.getElementById('doverlay').style.textAlign='center';<br \/>\n   document.getElementById('doverlay').style.display='block';<br \/>\n   document.getElementById('doverlay').title=document.getElementById('mydefopt').title;<br \/>\n   \/\/document.getElementById('mydefopt').style.fontColor='transparent';<br \/>\n   document.getElementById('mydefopt').innerHTML='';<br \/>\n   setInterval(fhoc, 1000);<br \/>\n   }<\/font><br \/>\n<br \/> <br \/>\n  }<br \/>\n<br \/> <br \/>\n  <font color=blue>function fhoc() {<br \/>\n   var rectx=document.getElementById('schoices').getBoundingClientRect();<br \/>\n   document.getElementById('doverlay').style.left='' + rectx.left + 'px';<br \/>\n   document.getElementById('doverlay').title=document.getElementById('mydefopt').title;<br \/>\n   if (document.getElementById('scbi')) {<br \/>\n     if (document.getElementById('scbi').innerHTML.indexOf('&lt;') == -1) {<br \/>\n      if (document.getElementById('scbi').innerHTML.trim().indexOf(' ') != -1) {<br \/>\n        if (document.getElementById('scbi').innerHTML.trim().indexOf(String.fromCharCode(34)) == -1) {<br \/>\n          document.getElementById('scbi').innerHTML=String.fromCharCode(34) + document.getElementById('scbi').innerHTML.trim() + String.fromCharCode(34);<br \/>\n        }<br \/>\n      }<br \/>\n     }<br \/>\n   }<br \/>\n   if (document.getElementById('scbix')) {<br \/>\n     if (document.getElementById('scbix').innerHTML.indexOf('&lt;') == -1) {<br \/>\n      if (document.getElementById('scbix').innerHTML.trim().indexOf(' ') != -1) {<br \/>\n        if (document.getElementById('scbix').innerHTML.trim().indexOf(String.fromCharCode(34)) == -1) {<br \/>\n          document.getElementById('scbix').innerHTML=String.fromCharCode(34) + document.getElementById('scbix').innerHTML.trim() + String.fromCharCode(34);<br \/>\n        }<br \/>\n      }<br \/>\n     }<br \/>\n   }<br \/>\n  }<\/font><br \/>\n<\/code><br \/>\n&#8220;; ?&gt;\n<\/li>\n<\/ol>\n<\/li>\n<li>Javascript to set up the HTML div contenteditable=true look for these two new options &#8230;<br \/>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n    if (newv == 'PDF to Images') {<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih.replace(' out.mp4',' \" . $minuspng . \"');<br \/>\n       document.getElementById('secondi').innerHTML='';<br \/>\n       document.getElementById('sswitches').innerHTML=\\\"&lt;span id=sfolder contenteditable=false&gt;newfolder_\" . rand(0,784534) . str_replace(\"\\\\\",\"\\\\\\\\\",$ddn) . \"\\\" + '&lt;\/span&gt;ideas';<br \/>\n<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n       document.getElementById('verb').innerHTML='\" . $pdfimages . $pdfimagessuf . \"';<br \/>\n       document.getElementById('scbi').innerHTML=document.getElementById('scbi').innerHTML.replace(\/inv\\.mp4\/g,'inv.pdf      ');<br \/>\n       document.getElementById('minusi').innerHTML=' -j ';<br \/>\n<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    } else if (newv == 'Images to PDF') {<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih.replace('out.mp4','out.pdf');<br \/>\n<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n       document.getElementById('secondi').innerHTML='';<br \/>\n       document.getElementById('verb').innerHTML='\" . $magickverb . $magicksuf . \"';<br \/>\n       document.getElementById('sswitches').innerHTML='-auto-orient';<br \/>\n       document.getElementById('sswitches').title='To perform a folder of images (only, we suggest) right click or two finger guesture to left and enter the folder name only';<br \/>\n       document.getElementById('scbi').innerHTML=document.getElementById('scbi').innerHTML.replace(\/inv\\.mp4\/g,'inv.jpg      ');<br \/>\n       document.getElementById('minusi').innerHTML='';<br \/>\n       document.getElementById('scbi').setAttribute('contenteditable', true);<br \/>\n       document.getElementById('scbi').onblur=function(event) {  if (document.getElementById('mydefopt').title == 'Images to PDF') {  if (event.target.innerHTML.replace(\/\\&nbsp\\;\/g,' ').trim() == '') { event.target.innerHTML='folder' + \\\"\" . str_replace(\"\\\\\",\"\\\\\\\\\",$ddn) . \"*\\\";  } if (event.target.innerHTML.toLowerCase().indexOf('.txt') == -1) {  if (event.target.innerHTML.indexOf('.') != -1) { document.getElementById('ifs').innerHTML+='&lt;iframe id=voaskfor' + ifile + ' style=display:none; src=\\\".\/voiceover.php?infilegetsize=' + encodeURIComponent(listtxt + ';' + event.target.innerHTML) + '\\\"&gt;&lt;\/iframe&gt;';  ifile++;    if (document.getElementById('moreb').title.indexOf(\\\"file '\\\" + event.target.innerHTML.replace(String.fromCharCode(34),'').replace(String.fromCharCode(34),'') + \\\"'\\\") == -1) {     document.getElementById('moreb').title+=String.fromCharCode(10) + \\\"file '\\\" + event.target.innerHTML.replace(String.fromCharCode(34),'').replace(String.fromCharCode(34),'') + \\\"'\\\"; } } } event.target.innerHTML=listtxt; if (document.getElementById('minusi')) { document.getElementById('minusi').innerHTML='';  }  }  };<br \/>\n       document.getElementById('moreb').onblur=function(event) {  if (document.getElementById('mydefopt').title == 'Images to PDF') { if (document.getElementById('minusi')) { var thingos=document.getElementById('minusi').innerHTML.replace(\/\\&nbsp\\;\/g,' ').trim().split('-i '); if (thingos.length &gt; 1) { if (thingos[1].trim() != '' && (thingos[1] + '~').toLowerCase().indexOf('.txt~') == -1) { spanfill(thingos[1]); }  } document.getElementById('minusi').innerHTML='';  }  if (!document.getElementById('scbi')) { event.target.innerHTML=event.target.innerHTML.replace('&lt;span id=\\\"between', '&lt;span id=scbi contenteditable=true&gt;' + listtxt + '&lt;\/span&gt; &lt;span id=\\\"between');  putbackonblur(); if (event.target.innerHTML.indexOf('&gt; -i &lt;\/span&gt;&lt;span id=\\\"scbi\\\"') == -1) { event.target.innerHTML=event.target.innerHTML.replace('&lt;\/span&gt;' + event.target.innerHTML.split('&lt;span id=\\\"scbi\\\"')[0].split('&lt;\/span&gt;')[-1 + eval(event.target.innerHTML.split('&lt;span id=\\\"scbi\\\"')[0].split('&lt;\/span&gt;').length)],'&lt;\/span&gt;');   } } }  };<br \/>\n       document.getElementById('moreb').oncontextmenu=function(event) { document.getElementById('scbi').innerHTML='folder' + \\\"\" . str_replace(\"\\\\\",\"\\\\\\\\\",$ddn) . \"*\\\"; };<br \/>\n<br \/> <br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;\n<\/li>\n<li>the performing of those two new &#8220;verb&#8221; ideas &#8230;<br \/>\n&lt;?php<br \/>\n<code><br \/>\n   $pfolder='';<br \/>\n   $ppdf='';<br \/>\n<br \/>\n   \/\/ ... later ...<br \/>\n   $cmdis=str_replace('+',' ',urldecode($_GET['fcommand']));<br \/>\n   if (PHP_OS =='WINNT' || PHP_OS =='WIN32' || PHP_OS =='Windows') {<br \/>\n     if ($ffmpegpre != '' && strpos($cmdis, 'ffmpeg.') !== false && strpos($cmdis, $ffmpegpre) === false) {<br \/>\n       $cmdis=str_replace('ffmpeg.', $ffmpegpre . 'ffmpeg.', $cmdis);<br \/>\n     }<br \/>\n     if ($magickpre != '' && strpos($cmdis, $magickverb . '.') !== false && strpos($cmdis, $magickpre) === false) {<br \/>\n       $cmdis=str_replace($magickverb . '.', $magickpre . $magickverb . '.', $cmdis);<br \/>\n     }<br \/>\n     if ($pdfimagespre != '' && strpos($cmdis, 'pdfimages.') !== false && strpos($cmdis, $pdfimagespre) === false) {<br \/>\n       $cmdis=str_replace('pdfimages.', $pdfimagespre . 'pdfimages.', $cmdis);<br \/>\n     }<br \/>\n   }<br \/>\n<br \/>\n   $precmd=explode('&gt;', $cmdis);<br \/>\n   if (strpos($cmdis, 'pdfimages') !== false && strpos($cmdis, 'newfolder_') !== false) {<br \/>\n     $pfolder='newfolder_' . explode(DIRECTORY_SEPARATOR, explode('newfolder_', $cmdis)[1])[0];<br \/>\n     $beforep=explode($pfolder, $cmdis)[0];<br \/>\n     $afterp=explode($pfolder, $cmdis)[1];<br \/>\n     while (file_exists($pfolder)) {<br \/>\n       $pfolder='newfolder' . '_' . explode('newfolder', $pfolder)[1];<br \/>\n       $cmdis=$beforep . $pfolder . $afterp;<br \/>\n     }<br \/>\n     if (!file_exists($pfolder)) { mkdir($pfolder); }<br \/>\n   }<br \/>\n<br \/>\n   \/\/ ... later ...<br \/>\n      $outf=$subcmd[1];<br \/>\n   \/\/ ... later ...<br \/>\n      if (strpos(strtolower(trim($outf) . '~'), '.pdf~') !== false) {<br \/>\n        $ppdf=trim($outf);<br \/>\n      }<br \/>\n<br \/>\n   \/\/ ... later ...<br \/>\n   $rs=shell_exec($cmdis);<br \/>\n<br \/>\n   \/\/ ... later ...<br \/>\n   if ($pfolder != '') {<br \/>\n     $rs.=\"&lt;br&gt;&lt;br&gt;\";<br \/>\n     foreach (glob($pfolder . DIRECTORY_SEPARATOR . '*.*') as $ifilename) {<br \/>\n       $rs.='&lt;img title=\"' . $ifilename . '\" src=\"' . $ifilename . '?rand=' . rand(0,7654532) . '\"&gt;&lt;\/img&gt;';<br \/>\n     }<br \/>\n   }<br \/>\n   if ($ppdf != '') {<br \/>\n     $outf='';<br \/>\n     $rs.=\"&lt;br&gt;&lt;br&gt;&lt;iframe style='width:98%;height:800px;' src='\" . $ppdf . \"?rand=\" . rand(0,7654532) . \"' title='\" . $ppdf . \"'&gt;&lt;\/iframe&gt;\";<br \/>\n   }<br \/>\n<\/code><br \/>\n?&gt;\n<\/li>\n<\/ul>\n<p> &#8230; in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php--------GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php--------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>).<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-and-imagemagick-and-pdfimages-media-tutorial\/' rel=\"noopener\">Ffmpeg and ImageMagick and Pdfimages Media Tutorial<\/a>.<\/p-->\n<hr>\n<p id='frvt'>Previous relevant <a target=\"_blank\" title='Ffmpeg Rotate Video Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-rotate-video-tutorial\/' rel=\"noopener\">Ffmpeg Rotate Video Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg Rotate Video Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/rotate_a_video.jpg\" title=\"Ffmpeg Rotate Video Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg Rotate Video Tutorial<\/p><\/div>\n<p>It&#8217;s getting closer to &#8220;shelling peas&#8221;, are today&#8217;s &#8220;Rotate a video via <a target=\"_blank\" title='ffmpeg' href='https:\/\/www.ffmpeg.org\/' rel=\"noopener\">ffmpeg<\/a>&#8221; changes, but we are not there yet.   Yes, most programmers want to be &#8220;shelling peas&#8221; adding functionality to web applications, once they have set up a framework in which they are happy to work.  Yesterday&#8217;s <a title='Ffmpeg Concat Demuxer Tutorial' href='#fcdt'>Ffmpeg Concat Demuxer Tutorial<\/a> <a href='#pdefence'>&#8220;defence talk&#8221;<\/a> is getting us closer to that &#8220;shelling peas&#8221; &#8220;homeostasis feel&#8221; <font size=1>(with an &#8220;Intranet&#8221; pike, no doubt?!)<\/font> as you can see from a Javascript &#8220;Rotate a video&#8221; code snippet below &#8230;<\/p>\n<p>&lt;?php echo &#8221;<br \/>\n<code><br \/>\nif (newv == 'Rotate a video') {<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih;<br \/>\n<br \/>\n       document.getElementById('precmds').innerHTML=' ';<br \/>\n       document.getElementById('secondi').innerHTML='';<br \/>\n<br \/> <br \/>\n       document.getElementById('sswitches').innerHTML='&lt;span id=notranspose contenteditable=false&gt;-vf \\\"transpose=&lt;\/span&gt;&lt;span id=transpose contenteditable=true&gt;1&lt;\/span&gt;&lt;span id=nottranspose contenteditable=false&gt;\\\" &lt;\/span&gt;';<br \/>\n       document.getElementById('sswitches').title='\" . str_replace(\"\\n\", \"' + String.fromCharCode(10) + '\",$rotateadvice) . \"';<br \/>\n       document.getElementById('sswitches').oncontextmenu=function(event) { alert(event.target.title); };<br \/>\n<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n}<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<\/p>\n<p> &#8230; effectively straightjacketing the crucial &#8230;<\/p>\n<p><code><br \/>\n -vf \"transpose=1\"<br \/>\n<\/code><\/p>\n<p> &#8230; ffmpeg switch definition, by the user, to changing that <i>1<\/i> above as per the hover over advice, to help the user, straight from <a target=\"_blank\" href='https:\/\/gist.github.com\/steven2358\/ba153c642fe2bb1e47485962df07c730' rel=\"noopener\">Mux Video and Audio from another Video<\/a>, thanks, to advise &#8230;<\/p>\n<p>&lt;?php<br \/>\n<code><br \/>\n$rotateadvice=\"Rotate a video<br \/>\n<br \/>\nRotate 90 clockwise:<br \/>\n<br \/>\nffmpeg -i in.mov -vf \\\"transpose=1\\\" out.mov<br \/>\nFor the transpose parameter you can pass:<br \/>\n<br \/>\n0 = 90CounterCLockwise and Vertical Flip (default)<br \/>\n1 = 90Clockwise<br \/>\n2 = 90CounterClockwise<br \/>\n3 = 90Clockwise and Vertical Flip<br \/>\n<br \/>\nUse -vf \\\"transpose=2,transpose=2\\\" for 180 degrees.\";<br \/>\n<\/code><br \/>\n?&gt;<\/p>\n<p>Yes, the user can still put a bad entry there, but at least the web application has attempted to point them in the right direction, here.<\/p>\n<p>If you examine the changes <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-------GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>), am sure that <font color=blue>you will concur<\/font> &#8230;<\/p>\n<ul>\n<li><i>Concat demuxer<\/i> concatenation of videos <a target=\"_blank\" title='ffmpeg' href='https:\/\/www.ffmpeg.org\/' rel=\"noopener\">ffmpeg<\/a> functionality, onto the &#8220;as of yesterday&#8221; &#8230;<\/li>\n<li><i>Voiceovers<\/i> &#8230; and  &#8230;<\/li>\n<li><i>Burn subtitles<\/i><\/li>\n<li><i><font color=blue>Rotate a video<\/font><\/i><\/li>\n<\/ul>\n<p> &#8230; was the simplest functionality component, yet, of the four.  We now present those four in &#8220;an expanded out&#8221; (at least on non-mobile) dropdown HTML element.  Maybe you can guess why?<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-rotate-video-tutorial\/' rel=\"noopener\">Ffmpeg Rotate Video Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fcdt'>Previous relevant <a target=\"_blank\" title='Ffmpeg Concat Demuxer Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-concat-demuxer-tutorial\/' rel=\"noopener\">Ffmpeg Concat Demuxer Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg Concat Demuxer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/concat_demux.jpg\" title=\"Ffmpeg Concat Demuxer Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg Concat Demuxer Tutorial<\/p><\/div>\n<p>Onto yesterday&#8217;s <a title='Ffmpeg Burn Subtitles Tutorial' href='#fbst'>Ffmpeg Burn Subtitles Tutorial<\/a> work we&#8217;re still not up to &#8220;shelling any peas&#8221; adding in &#8230;<\/p>\n<ul>\n<li><i>Concat demuxer<\/i> concatenation of videos <a target=\"_blank\" title='ffmpeg' href='https:\/\/www.ffmpeg.org\/' rel=\"noopener\">ffmpeg<\/a> functionality, onto the &#8220;as of yesterday&#8221; &#8230;<\/li>\n<li><i>Voiceovers<\/i> &#8230; and  &#8230;<\/li>\n<li><i>Burn subtitles<\/i><\/li>\n<\/ul>\n<p> &#8230; progress.<\/p>\n<p>What&#8217;s different this time?  Well, ffmpeg works the command, we again thank <a target=\"_blank\" href='https:\/\/gist.github.com\/steven2358\/ba153c642fe2bb1e47485962df07c730' rel=\"noopener\">Mux Video and Audio from another Video<\/a> for (regarding &#8220;the plan&#8221;), using an interim file &#8230;<\/p>\n<blockquote cite='https:\/\/gist.github.com\/steven2358\/ba153c642fe2bb1e47485962df07c730'><p>\nConcat demuxer<br \/>\n<br \/>\nFirst, make a text file.<br \/>\n<br \/>\nfile &#8216;in1.mp4&#8217;<br \/>\nfile &#8216;in2.mp4&#8217;<br \/>\nfile &#8216;in3.mp4&#8217;<br \/>\nfile &#8216;in4.mp4&#8217;<br \/>\n<br \/>\nThen, run ffmpeg :<br \/>\n<br \/>\nffmpeg -f concat -i list.txt -c copy out.mp4\n<\/p><\/blockquote>\n<p> &#8230; and for File API browsing (with <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/client_browsing.html--------------------------------GETME\" rel=\"noopener\">our, once again, tweaked<\/a> inhouse <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/client_browsing.html--------------------------------GETME\" rel=\"noopener\">client_browsing.htm<\/a>) there will be a delay, deriving the file path in &#8220;second call PHP&#8221;.  We handle this by writing two new Javascript functions &#8230;<\/p>\n<p>&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  var ifile=0, ibfile=0;<br \/>\n<br \/>\n  function takeoffone() {<br \/>\n    ibfile--;<br \/>\n    if (ibfile &lt;= 0) {<br \/>\n      document.getElementById('mysub').style.cursor='pointer';<br \/>\n    } else {<br \/>\n      document.getElementById('mysub').style.cursor='progress';<br \/>\n    }<br \/>\n  }<br \/>\n<br \/>\n  function organizefilenamesize(fn, fs) {<br \/>\n    document.getElementById('ifs').innerHTML+='&lt;iframe id=voaskfor' + ifile + ' style=display:none; src=\\\".\/voiceover.php?concat=' + encodeURIComponent('list.txt') + '&filename=' + encodeURIComponent(fn) + '&haveasleep=' + eval(3 * eval('' + ifile)) + '&filesize=' + fs + '\\\"&gt;&lt;\/iframe&gt;';<br \/>\n    if (ibfile == 0) {<br \/>\n      document.getElementById('mysub').style.cursor='progress';<br \/>\n    }<br \/>\n    ifile++;<br \/>\n    ibfile++;<br \/>\n    if (document.getElementById('moreb').title.indexOf(\\\"file '\\\" + fn.replace(String.fromCharCode(34),'').replace(String.fromCharCode(34),'') + \\\"'\\\") == -1) {<br \/>\n    document.getElementById('moreb').title+=String.fromCharCode(10) + \\\"file '\\\" + fn.replace(String.fromCharCode(34),'').replace(String.fromCharCode(34),'') + \\\"'\\\";<br \/>\n    }<br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<\/p>\n<p> &#8230; available to call from child iframes via <i>parent.takeoneoff();<\/i> (from voiceover.php second PHP call) and <i>parent.organizefilenamesize(files[ij].name, files[ij].size);<\/i> (from client_browsing.htm) respectively, to facilitate a progress cursor on the submit button to remind the user we&#8217;d like more time.   Along the way, too, <font color=blue>we found<\/font> &#8230;<\/p>\n<p><code><br \/>\nffmpeg -f concat <font color=blue>-safe 0<\/font> -i list.txt -c copy out.mp4<br \/>\n<\/code><\/p>\n<p> &#8230; thanks to the excellent advice we found <a target=\"_blank\" title='Excellent advice' href='https:\/\/nono.ma\/says\/concat-unsafe-file-name-operation-not-permitted' rel=\"noopener\">at this webpage<\/a>.<\/p>\n<p>You can see this work in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php------GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php------GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>).<\/p>\n<p id=pdefence><b><i>Did you know?<\/i><\/b><\/p>\n<p>Just like the use of &#8230;<\/p>\n<ul>\n<li>div <a target=\"_blank\" title='Global contenteditable attribute information from W3schools' href='https:\/\/www.w3schools.com\/tags\/att_global_contenteditable.asp' rel=\"noopener\">contenteditable<\/a>=true<\/li>\n<li><a target=\"_blank\" title='HTML span element information from W3schools' href='https:\/\/www.w3schools.com\/tags\/tag_span.asp' rel=\"noopener\">span<\/a><sub>izing<\/sub> within that div<\/li>\n<li><a target=\"_blank\" title='HTML DOM innerText property info from W3schools' href='https:\/\/www.w3schools.com\/jsref\/prop_node_innertext.asp' rel=\"noopener\">innerText<\/a><\/li>\n<\/ul>\n<p> &#8230; are the <a target=\"_blank\" title='Trios' href='https:\/\/facts.net\/famous-trios\/' rel=\"noopener\">SpongeBob, Patrick, and Squidward<\/a> of the online woooorrrrllllddd, in an &#8220;offence&#8221; line of &#8220;piecing together an operating system command&#8221; thinking, thinking &#8220;defence&#8221; regarding this we added one <font size=1>(we were pleasantly surprised to discover worked, so as)<\/font> to have &#8230;<\/p>\n<ul>\n<li>div contenteditable=true<\/li>\n<li>span<sub>izing<\/sub> within that div<\/li>\n<li>innerText<\/li>\n<li>mask off parts the programmer wants left untouched via span contenteditable=false<\/li>\n<\/ul>\n<p> &#8230; being like the Hall and Oates meets Everything But the Girl <font size=1>(on a yacht, <a target=\"_blank\" title='?' href='https:\/\/en.wikipedia.org\/wiki\/Yacht_rock' rel=\"noopener\">of course<\/a>)<\/font> step back into the &#8217;80s!<\/p>\n<p>Take a look at <font color=blue>some tweaks<\/font> &#8230;<\/p>\n<p><code><br \/>\n   if (newv == 'Burn subtitles') {<br \/>\n       document.getElementById('moreb').innerHTML=firstdivih;<br \/>\n       <font color=blue>\/\/<\/font>document.getElementById('precmds').innerHTML=document.getElementById('verb').innerHTML + ' ' + document.getElementById('secondi').innerHTML.replace(\/inva\\.mp4\/g,'sub.srt      ') + ' sub.ass; ';<br \/>\n       document.getElementById('precmds').innerHTML=document.getElementById('verb').innerHTML + ' ' + document.getElementById('secondi').innerHTML.replace(\/inva\\.mp4\/g,'sub.srt      ') + ' <font color=blue>&lt;span id=subass contenteditable=false&gt;<\/font>sub.ass;<font color=blue>&lt;\/span&gt;<\/font> ';<br \/>\n       document.getElementById('secondi').innerHTML='';<br \/>\n       <font color=blue>\/\/<\/font>document.getElementById('sswitches').innerHTML='-vf ass=sub.ass';<br \/>\n       document.getElementById('sswitches').innerHTML='-vf<font color=blue>&lt;span id=asssubass contenteditable=false&gt;<\/font> ass=sub.ass <font color=blue>&lt;\/span&gt;<\/font>';<br \/>\n       document.getElementById('mysub').value=newv;<br \/>\n    }<br \/>\n<\/code><\/p>\n<p> &#8230; in a &#8220;Burn subtitles&#8221; relevant Javascript code snippet.<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-concat-demuxer-tutorial\/' rel=\"noopener\">Ffmpeg Concat Demuxer Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fbst'>Previous relevant <a target=\"_blank\" title='Ffmpeg Burn Subtitles Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-burn-subtitles-tutorial\/' rel=\"noopener\">Ffmpeg Burn Subtitles Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg Burn Subtitles Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/ffmpeg_first_suboption.jpg\" title=\"Ffmpeg Burn Subtitles Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg Burn Subtitles Tutorial<\/p><\/div>\n<p>The initial inspiration for this current <a target=\"_blank\" title='ffmpeg' href='https:\/\/www.ffmpeg.org\/' rel=\"noopener\">ffmpeg<\/a> themed series of blog posting was, and still is, <a target=\"_blank\" href='https:\/\/gist.github.com\/steven2358\/ba153c642fe2bb1e47485962df07c730' rel=\"noopener\">Mux Video and Audio from another Video<\/a>, thanks.  So many great ideas, we found, that today we add onto the &#8230;<\/p>\n<ul>\n<li>first idea of <i>Voiceovers<\/i> we&#8217;ve established to work with MAMP in macOS and Windows over the previous days, allowing us to now think to add a first suboption idea of &#8230;<\/li>\n<li><i>Burn subtitles<\/i> &#8230; as per our link&#8217;s &#8230;<br \/>\n<blockquote cite='https:\/\/gist.github.com\/steven2358\/ba153c642fe2bb1e47485962df07c730'><p>\nBurn subtitles<br \/>\nUse the libass library (make sure your ffmpeg install has the library in the configuration &#8211;enable-libass).<br \/>\n<br \/>\nFirst convert the subtitles to .ass format:<br \/>\n<br \/>\nffmpeg -i sub.srt sub.ass<br \/>\nThen add them using a video filter:<br \/>\n<br \/>\nffmpeg -i in.mp4 -vf ass=sub.ass out.mp4<\/p><\/blockquote>\n<\/li>\n<\/ul>\n<p> &#8230; as a useful video piece of functionality we&#8217;d say.<\/p>\n<p>To get this going, easily (from a programming perspective) &#8230;<\/p>\n<ul>\n<li>our textarea element remains as the form conduit to the ffmpeg command via the <a target=\"_blank\" title='Javascript onsubmit event information from W3schools' href='https:\/\/www.w3schools.com\/tags\/ev_onsubmit.asp' rel=\"noopener\">onsubmit<\/a> event final analysis of the &#8230;<\/li>\n<li>underlying div contenteditable=true is <font color=blue>&#8220;spanned&#8221; up a lot more<\/font> as per &#8230;<br \/>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n   document.getElementById('moreb').innerHTML='<font color=blue>&lt;span id=precmds&gt;&lt;\/span&gt;<\/font><font color=blue>&lt;span id=verb&gt;<\/font>ffmpeg\" . $ffmpegsuf . \"<font color=blue>&lt;\/span&gt;<\/font> -i &lt;span id=scbi&gt;&lt;iframe onload=checkif(this,\\\"inv.mp4\\\"); scrolling=no frameborder=0 id=cbi data-type=file data-value=inv.mp4 data-accept=\\\"video\/*\\\" style=\\\"display:inline-block;height:40px;width:92px;vertical-align:middle;\\\" src=\\\"\/HTMLCSS\/client_browsing.htm?d=9075964842271&left=y\\\"&gt;&lt;\/iframe&gt;&lt;\/span&gt;<font color=blue> &lt;span id=betweenis&gt;&lt;\/span&gt;<\/font> <font color=blue>&lt;span id=secondi&gt;<\/font>-i &lt;span id=scbix&gt;&lt;iframe onload=checkiftwo(this,\\\"inva.mp4\\\"); scrolling=no frameborder=0 id=cbix data-type=file data-value=inva.mp4 data-accept=\\\"video\/*\\\" style=\\\"display:inline-block;height:40px;width:106px;vertical-align:middle;\\\" src=\\\"\/HTMLCSS\/client_browsing.htm?d=9075964842271&right=y\\\"&gt;&lt;\/iframe&gt;&lt;\/span&gt;<font color=blue>&lt;\/span&gt;<\/font> <font color=blue>&lt;span id=sswitches&gt;<\/font>-c copy -map 0:v:0 -map 1:a:0 -shortest<font color=blue>&lt;\/span&gt;<\/font> out.mp4 &gt; &lt;a target=_blank title=ffm.bad onclick=getvb(); style=cursor:pointer;text-decoration:underline; data-href=.\/ffm.bad&gt;ffm.bad&lt;\/a&gt;';<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<br \/>\n &#8230; and at the onsubmit event Javascript the <a target=\"_blank\" title='DOM innerText attribute' href='https:\/\/www.w3schools.com\/jsref\/prop_node_innertext.asp' rel=\"noopener\">innerText<\/a> attribute usage makes it fairly easy <font color=blue>to say<\/font> &#8230;<br \/>\n&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  function mergechanges() {<br \/>\n     if (document.getElementById('scbi').innerHTML.indexOf('&lt;') == -1) {<br \/>\n       <font color=blue>if (document.getElementById('precmds').innerHTML != '') {<br \/>\n       document.getElementById('fcommand').value=document.getElementById('moreb').innerText;<br \/>\n       } else {<\/font><br \/>\n       document.getElementById('fcommand').value=document.getElementById('fcommand').value.replace(' inv.mp4 ', ' ' + document.getElementById('scbi').innerHTML + ' ');<br \/>\n       <font color=blue>}<\/font><br \/>\n       \/\/alert('not oops ' + document.getElementById('fcommand').value);<br \/>\n     } \/\/else {<br \/>\n       \/\/alert('oops');<br \/>\n     \/\/}<br \/>\n     if (document.getElementById('scbix').innerHTML.indexOf('&lt;') == -1) {<br \/>\n       \/\/alert('zoops');<br \/>\n       document.getElementById('fcommand').value=document.getElementById('fcommand').value.replace(' inva.mp4 ', ' ' + document.getElementById('scbix').innerHTML + ' ');<br \/>\n     }<br \/>\n     if (document.getElementById('moreb').innerText.indexOf(' -c ') != -1 && document.getElementById('fcommand').value.indexOf(' -c ') != -1) {<br \/>\n      \/\/alert('azoops');<br \/>\n      if (document.getElementById('moreb').innerText.split(' -c ')[1] != document.getElementById('fcommand').value.split(' -c ')[1]) {<br \/>\n       \/\/alert('bzoops');<br \/>\n       document.getElementById('fcommand').value=document.getElementById('fcommand').value.split(' -c ')[0] + ' -c ' + document.getElementById('moreb').innerText.split(' -c ')[1];<br \/>\n      }<br \/>\n     }<br \/>\n     return true;<br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<br \/>\n &#8230; to slice through that &#8220;span&#8221; complexity like margarine <font size=1>(or butter that&#8217;s been left out on a hot day for approximately 7 hours 17 minutes 23 seconds)<\/font>\n<\/li>\n<\/ul>\n<p>And so, onto yesterday&#8217;s <a title='Ffmpeg Improved Windows Media Browsing Tutorial' href='#fiwmbt'>Ffmpeg Improved Windows Media Browsing Tutorial<\/a> feel free to see this in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php----GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php----GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>).<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/new-ffmpeg-improved-windows-media-browsing-tutorial\/' rel=\"noopener\">Ffmpeg Improved Windows Media Browsing Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fiwmbt'>Previous relevant <a target=\"_blank\" title='Ffmpeg Improved Windows Media Browsing Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-improved-windows-media-browsing-tutorial\/' rel=\"noopener\">Ffmpeg Improved Windows Media Browsing Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg Improved Windows Media Browsing Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_windows_dir.jpg\" title=\"Ffmpeg Improved Windows Media Browsing Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg Improved Windows Media Browsing Tutorial<\/p><\/div>\n<p>Yesterday&#8217;s <a title='Ffmpeg Mux Video and Audio Windows Media Browsing Tutorial' href='#fmvawmbt'>Ffmpeg Mux Video and Audio Windows Media Browsing Tutorial<\/a> taught us a lesson, as a side issue, that what we said when we presented <a target=\"_blank\" title='Animated GIF Creation on Windows MAMP via PDF Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/animated-gif-creation-on-windows-mamp-via-pdf-tutorial\/' rel=\"noopener\">Animated GIF Creation on Windows MAMP via PDF Tutorial<\/a>  &#8230;<\/p>\n<blockquote cite='https:\/\/www.rjmprogramming.com.au\/ITblog\/animated-gif-creation-on-windows-mamp-via-pdf-tutorial\/'>\n<p>No matter how we tried, we could not get a Windows command line command like &#8230;<\/p>\n<p>\n<code><br \/>\nforfiles \/P \"[PathToFileBestGuess]\" \/S \/M \"[FileBaseName]\" \/C \"cmd \/c echo @path@fsize\" | find \"[FileSizeInBytes]\"<br \/>\n<\/code><br \/>\n<\/p>\n<p> &#8230; to work out a file path when supplied a file base name and a file size and you call as above with starting folders.  That works well (for deriverability <font size=1>(if that is a word!)<\/font>) in the &#8220;cmd&#8221; window but not when called under the auspices of PHP exec or shell_exec.  It could be that you lose a lot of a Windows user environment when asking PHP to do some operating system work.<\/p>\n<\/blockquote>\n<p> &#8230; was &#8220;only partially&#8221; the story.  We found out that that &#8221; | find &#8221; command piping could cause problems on Windows MAMP using shell_exec or exec to do some operating system functionality.  But before your enthusiasm oozes over the edges, Windows &#8220;forfiles&#8221; is still very hard to get working with PHP shell_exec or exec, even using PHP to perform that &#8221; | find &#8221; filtering of results.<\/p>\n<p>However, on revisiting the issue in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php---GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php---GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>) there were dual purpose motivations going on, for us, because <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/animegif\/tutorial_to_animated_gif.php--------------------------------------------------------------------------GETME' rel=\"noopener\">our changed animated GIF creator<\/a> PHP <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/PHP\/animegif\/tutorial_to_animated_gif.php--------------------------------------------------------------------------GETME' rel=\"noopener\">tutorial_to_animated_gif.php<\/a> <font size=1>(that if you download to MAMP would best go to Document Root PHP\/animegif folder along with the wonderful <a target=\"_blank\" title='GIFEncoder.class.php' href='https:\/\/gist.github.com\/Xeoncross\/ecccb07454d0b69d9eba' rel=\"noopener\">GIFEncoder.class.php<\/a> &#8230; thanks)<\/font> <a target=\"_blank\" href='http:\/\/www.rjmprogramming.com.au\/PHP\/animegif\/tutorial_to_animated_gif.php' rel=\"noopener\">inhouse animated GIF creator web application<\/a> and <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/php_calls_pdfimages.php----------------GETME\" rel=\"noopener\">the changed PDF parts to animated GIF creation helper<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/php_calls_pdfimages.php----------------GETME\" rel=\"noopener\">php_calls_pdfimages.php<\/a> <font size=1>(also a <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/php_calls_pdfimages.php\" rel=\"noopener\">standalone proposition<\/a>)<\/font> PHP code could be fixed up at the same time, with a new PHP <i>ourshell_exec<\/i> function <font color=blue>interventional code snippet<\/font> up at the top &#8230;<\/p>\n<p>&lt;?php<br \/>\n<code><br \/>\nfunction ourshell_exec($onea, $twoa = NULL, $threea = NULL) {<br \/>\n   $folder='';<br \/>\n   $pattern='';<br \/>\n   $size='';<br \/>\n   $filesa=[];<br \/>\n   if (PHP_OS =='WINNT' || PHP_OS =='WIN32' || PHP_OS =='Windows' || (strpos(('~@!' . $onea), '~@!forfiles \/P \"') !== false && strpos(('~@!' . $onea), '\/M \"') !== false && strpos(('~@!' . $onea), 'find \"') !== false)) {<br \/>\n     <font color=blue>$folder=explode('\"', explode('forfiles \/P \"', $onea)[1])[0]; \/\/ . substr(DIRECTORY_SEPARATOR . DIRECTORY_SEPARATOR, 0, 1);<br \/>\n     if (7 == 7) {<br \/>\n       $folder=explode('\"', explode('forfiles \/P \"', $onea)[1])[0]; \/\/ . substr(DIRECTORY_SEPARATOR . DIRECTORY_SEPARATOR, 0, 1);<br \/>\n       $pattern=explode('\"', explode('\/M \"', $onea)[1])[0];<br \/>\n       $size=explode('\"', explode('find \"', $onea)[1])[0];<br \/>\n       $thiscmd=trim(explode(\" | find \", $onea)[0]);<br \/>\n       if (strpos($pattern, ' ') === false) {  $thiscmd=str_replace('\/M \"' . $pattern . '\"', '\/M ' . $pattern, $thiscmd);  }<br \/>\n       if (strpos($folder, ' ') === false) {  $thiscmd=str_replace('\/P \"' . $folder . '\"', '\/P ' . $folder, $thiscmd);  }<br \/>\n       if (strpos($thiscmd, '\"cmd \/c ') !== false && substr($thiscmd,-1,1) != '\"') { $thiscmd.='\"'; }<br \/>\n       if (strpos($thiscmd, \"\/P C:\\\\ \") !== false) {<br \/>\n            if (strpos($thiscmd, \"\/P C:\\\\ \") !== false) {<br \/>\n                     if (strpos($pattern, \" \") === false) {<br \/>\n                            $thiscmd=\"DIR C:\\\\\" . $pattern . \" \/S \/-C\";<br \/>\n                     } else {<br \/>\n                            $thiscmd=\"DIR \\\"C:\\\\\" . $pattern . \"\\\" \/S \/-C\";<br \/>\n                     }<br \/>\n            }<br \/>\n       }<br \/>\n\/\/file_put_contents('xxx.xxx',file_get_contents('xxx.xxx'). \"\\n\" . '' . $size . ' ' . $thiscmd);<br \/>\n       $nofind=shell_exec($thiscmd . ' 2&gt; nul');<br \/>\n<br \/>\n\/\/file_put_contents('xxxx.xxxx',file_get_contents('xxxx.xxxx'). \"\\n\" . '' . $size . ' ' . $nofind);<br \/>\n\/\/exit;<br \/>\n       $findings=explode(\"\\n\", $nofind);<br \/>\n       $bitbefore='';<br \/>\n       for ($ifindgs=0; $ifindgs&lt;sizeof($findings); $ifindgs++) {<br \/>\n         if (strpos(str_replace(\"\\r\",\"\",$findings[$ifindgs]), 'Directory of ') !== false) {<br \/>\n             $bitbefore=explode('Directory of ', str_replace(\"\\r\",\"\",$findings[$ifindgs]))[1] . \"\\\\\";<br \/>\n         }<br \/>\n         if (strpos((str_replace(\"\\r\",\"\",$findings[$ifindgs]) . '~'), $size . '~') !== false) {<br \/>\n            return str_replace('~','',str_replace($size . '~', '', (str_replace(\"\\r\",\"\",$findings[$ifindgs]) . '~')));<br \/>\n         } else if (strpos((str_replace(\"\\r\",\"\",$findings[$ifindgs]) . ''), $size . ' ') !== false) {<br \/>\n\/\/file_put_contents('xxxxx.xxxxx',$bitbefore . explode($size . ' ', (str_replace(\"\\r\",\"\",$findings[$ifindgs]) . ''))[1]);<br \/>\n           return $bitbefore . explode($size . ' ', (str_replace(\"\\r\",\"\",$findings[$ifindgs]) . ''))[1];<br \/>\n         }<br \/>\n       }<br \/>\n       if ($folder == \"C:\\\\\") { return ''; }<br \/>\n     }<\/font><br \/>\n\/\/ more code<br \/>\n\/\/ as per usual<br \/>\n\/\/ stays here ...<br \/>\n   }<br \/>\n   return shell_exec($onea, $twoa, $threea);<br \/>\n}<br \/>\n<\/code><br \/>\n?&gt;<\/p>\n<p> &#8230; where we substitute in Windows <i>DIR C:\\ \/S \/-C<\/i> thinking in place of <i>forfiles<\/i> (via shell_exec minus the &#8221; | find &#8221; piping, <a target=\"_blank\" title='?' href='https:\/\/www.youtube.com\/watch?v=PtR4cWb4HNg' rel=\"noopener\">that is<\/a>).<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-burn-subtitles-tutorial\/' rel=\"noopener\">Ffmpeg Burn Subtitles Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fmvawmbt'>Previous relevant <a target=\"_blank\" title='Ffmpeg Mux Video and Audio Windows Media Browsing Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-mux-video-and-audio-windows-media-browsing-tutorial\/' rel=\"noopener\">Ffmpeg Mux Video and Audio Windows Media Browsing Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg Mux Video and Audio Windows Media Browsing Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_windows.jpg\" title=\"Ffmpeg Mux Video and Audio Windows Media Browsing Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg Mux Video and Audio Windows Media Browsing Tutorial<\/p><\/div>\n<p>You know it&#8217;s &#8220;Intranet feely land&#8221;?<\/p>\n<p>You look out the train window <font size=1>(tee hee)<\/font> and see macOS racing through their usual routine.<\/p>\n<p>Of course you&#8217;ll pick the buffet car containing the rice bubbles ahead of the vegemite corn flakes?!<\/p>\n<p>But do we need to reiterate that in &#8220;Intranet feely land&#8221; you&#8217;ve got your macOS typ<strike>os<\/strike>e of work not suiting <a target=\"_blank\" title=\"?\" href='https:\/\/www.youtube.com\/watch?v=7PUtiIFOsrs' rel=\"noopener\">&#8220;arch Windows&#8221;<\/a> methodologies?  Take the case of &#8230;<\/p>\n<blockquote><p>\nAt least, with macOS MAMP there is the excellent command line <a target=\"_blank\" title='macOS file command' href='https:\/\/ss64.com\/osx\/file.html' rel=\"noopener\">&#8220;file&#8221;<\/a> we can use to show information about some potential input files you could use in this, so far, user unfriendly, &#8220;first draft&#8221; version of the PHP.\n<\/p><\/blockquote>\n<p> &#8230; to the beach, would be nice &#8230; but we digress.  Well, in any case, we asked Google <font size=1>(not via the &#8220;arch Window&#8221;)<\/font> <a target=\"_blank\" title='Google search, thanks' href='https:\/\/www.google.com\/search?q=does+windows+have+the+equivalent+of+linux+file+command&#038;rlz=1C5CHFA_enAU973AU973&#038;oq=does+windows+have+the+equivalent+of+linux+file+command&#038;aqs=chrome..69i57j33i160l2.15353j0j4&#038;sourceid=chrome&#038;ie=UTF-8' rel=\"noopener\">does windows have the equivalent of linux file command&#8221;<\/a> and got to the helpful <a target=\"_blank\" title=\"Useful\" href='https:\/\/superuser.com\/questions\/272338\/what-is-the-equivalent-to-the-linux-file-command-for-windows' rel=\"noopener\">What is the equivalent to the Linux File command for windows? &#8211; Super User<\/a>, thanks, and then ended up at the really useful <a target=\"_blank\" title='Really useful' href='https:\/\/gnuwin32.sourceforge.net\/packages\/file.htm' rel=\"noopener\">third party &#8220;file.exe&#8221; for <font size=1>(non-arch)<\/font> Windows usage<\/a> and proceeded with it, working off  <a title='Ffmpeg Mux Video and Audio Media Browsing Tutorial' href='#fmvambt'>Ffmpeg Mux Video and Audio Media Browsing Tutorial<\/a>, to start being able to develop this &#8220;reveal&#8221; details\/summary arrangement in either macOS or Windows <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> environments, that &#8220;ffmpeg&#8221; voiceover command, which normally works a lot better than &#8230;<\/p>\n<blockquote><p>\nI command thee mux, hey you, with audible you, over yonder, by dale and meadow be, yea!\n<\/p><\/blockquote>\n<p> &#8230; when it occurred to us we could turn the base filename parts of those &#8220;file<sub>.exe<\/sub>&#8221; reports into links that when clicked mapped those clicked files into place into the &#8220;ffmpeg&#8221; command being developed above (as alternative input file designator idea to browsing or div contenteditable=true typing ways), in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php--GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php--GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder) and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>.<\/p>\n<p>And so, we reckon the work day got worth it!<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/new-ffmpeg-mux-video-and-audio-media-browsing-tutorial\/' rel=\"noopener\">New Ffmpeg Mux Video and Audio Media Browsing Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fmvambt'>Previous relevant <a target=\"_blank\" title='Ffmpeg Mux Video and Audio Media Browsing Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-mux-video-and-audio-media-browsing-tutorial\/' rel=\"noopener\">Ffmpeg Mux Video and Audio Media Browsing Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg Mux Video and Audio Media Browsing Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover_more.jpg\" title=\"Ffmpeg Mux Video and Audio Media Browsing Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg Mux Video and Audio Media Browsing Tutorial<\/p><\/div>\n<p>Onto yesterday&#8217;s <a title='Ffmpeg Mux Video and Audio Primer Tutorial' href='#fmvapt'>Ffmpeg Mux Video and Audio Primer Tutorial<\/a> &#8230;<\/p>\n<blockquote><p>\nThere be a flowerin&#8217; of inner warmth and glo&#8217; towards all our readers, youngins and oldins alike &#8230; like!\n<\/p><\/blockquote>\n<p>Yes, we&#8217;re involving good ol&#8217; HTML5 <a target=\"_blank\" title='Great link' href='http:\/\/www.html5rocks.com\/en\/tutorials\/file\/dndfiles\/' rel=\"noopener\">File API<\/a> Object Javascript logic, so our &#8220;Intranet&#8221; savvy downloaders out there &#8230;<\/p>\n<blockquote><p>\nFull o&#8217; inner warmth and glo&#8217; towards each other &#8230; like!\n<\/p><\/blockquote>\n<p> &#8230; can easily browse for their two media input files, and for the first time ever integrating <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/client_browsing.html-------------------------------GETME\" rel=\"noopener\">our ever tweaked<\/a> inhouse <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/client_browsing.html-------------------------------GETME\" rel=\"noopener\">client_browsing.htm<\/a> <font size=1>(also a <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/client_browsing.htm\" rel=\"noopener\">standalone proposition<\/a>)<\/font> (we&#8217;d like you to download to MAMP Document Root&#8217;s HTMLCSS subfolder) we add <a target=\"_blank\" title='Event oncontextmenu information from W3schools' href='https:\/\/www.w3schools.com\/jsref\/obj_mouseevent.asp' rel=\"noopener\">&#8220;oncontextmenu&#8221;<\/a> event changes to its input type=file browser <font color=blue>hosting parent iframe element onload event Javascript function as per <\/font> &#8230;<\/p>\n<p>&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  var voaf='', voaftwo='';<br \/>\n<br \/>\n  function checkif(iois, ival) {<br \/>\n    if (iois.src.indexOf('?d=') != -1) {<br \/>\n    var aconto = (iois.contentWindow || iois.contentDocument);<br \/>\n    if (aconto != null) {<br \/>\n       if (aconto.document) { aconto = aconto.document; }<br \/>\n       if (aconto.getElementById('files')) {<br \/>\n         if (voaf == '') {<br \/>\n         voaf=iois.src;<br \/>\n         iois.setAttribute('data-parentspan', 's' + ival.replace('inv.mp4','cbi').replace('inva.mp4','cbix'));<br \/>\n         document.getElementById('myh1').title='s' + ival.replace('inv.mp4','cbi').replace('inva.mp4','cbix');<br \/>\n         document.getElementById('myh1').setAttribute('data-url', iois.src);<br \/>\n         setInterval(voaff, 1000);<br \/>\n         } else if (voaftwo == '') {<br \/>\n         voaftwo=iois.src;<br \/>\n         iois.setAttribute('data-parentspan', 's' + ival.replace('inv.mp4','cbi').replace('inva.mp4','cbix'));<br \/>\n         document.getElementById('myh3').title='s' + ival.replace('inv.mp4','cbi').replace('inva.mp4','cbix');<br \/>\n         document.getElementById('myh3').setAttribute('data-url', iois.src);<br \/>\n         \/\/alert(iois.id + ' data-parentspan=' + iois.getAttribute('data-parentspan'));<br \/>\n         }<br \/>\n         \/\/alert(iois.id + ' data-parentspan=' + iois.getAttribute('data-parentspan'));<br \/>\n         aconto.getElementsByTagName('h1')[0].style.opacity='0.0';<br \/>\n         \/\/alert('here');<br \/>\n         aconto.getElementById('files').style.position='absolute';<br \/>\n         aconto.getElementById('files').style.left='0px';<br \/>\n         aconto.getElementById('files').style.top='0px';<br \/>\n         aconto.getElementById('files').style.zIndex='99';<br \/>\n         aconto.getElementById('files').style.marginLeft='10px';<br \/>\n         aconto.getElementById('files').style.marginTop='8px';<br \/>\n         aconto.getElementById('files').style.visibility='visible';<br \/>\n         aconto.getElementById('files').style.display='block';<br \/>\n         aconto.getElementById('files').style.backgroundColor='#eeeeee';<br \/>\n         aconto.getElementById('files').setAttribute('data-hostcont', ival);<br \/>\n         aconto.getElementById('files').setAttribute('data-hostspan', 's' + ival.replace('inv.mp4','cbi').replace('inva.mp4','cbix'));<br \/>\n         <font color=blue>aconto.getElementById('files').oncontextmenu = function(event) { var suf=event.target.getAttribute('data-hostspan');  parent.document.getElementById(suf).innerHTML=\\\"\" . str_replace(\"\\\\\",\"\\\\\\\\\",dirname(__FILE__) . DIRECTORY_SEPARATOR) . \"\\\" + event.target.getAttribute('data-hostcont');  }<\/font><br \/>\n         if (ival == 'inv.mp4') {<br \/>\n           aconto.getElementById('files').accept='video\/*';<br \/>\n           aconto.getElementById('files').title='Click to browse for video else right click or two finger gesture to make disappear.';<br \/>\n         } else {<br \/>\n           aconto.getElementById('files').accept='video\/*,audio\/*';<br \/>\n           aconto.getElementById('files').title='Click to browse for video or audio else right click or two finger gesture to make disappear.';<br \/>\n         }<br \/>\n         \/\/alert('there');<br \/>\n         aconto.getElementById('dwstyle').innerHTML+=\\\"&lt;style&gt; #files::before { content: '\\\" + ival + \\\"'; } &lt;\/style&gt;\\\";<br \/>\n       }<br \/>\n    }<br \/>\n    }<br \/>\n  }<br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<\/p>\n<p> &#8230; to allow a user who prefers the overlayed <strong>div contenteditable=true alternative (which speaks back to the HTML form textarea conduit when that form&#8217;s <a target=\"_blank\" title='Event oncontextmenu information from W3schools' href='https:\/\/www.w3schools.com\/jsref\/event_onsubmit.asp' rel=\"noopener\">&#8220;onsubmit&#8221;<\/a> <font color=purple>event is called<\/font>) onto yesterday&#8217;s <i>exclusively textarea<\/i> methodology<\/strong> &#8230;<\/p>\n<p>&lt;?php echo &#8221;<br \/>\n<code><br \/>\n  function overlay() {<br \/>\n   var rect=document.getElementById('fcommand').getBoundingClientRect();<br \/>\n   document.getElementById('moreb').style.position='absolute';<br \/>\n   document.getElementById('moreb').style.left='' + rect.left + 'px';<br \/>\n   document.getElementById('moreb').style.top='' + rect.top + 'px';<br \/>\n   document.getElementById('moreb').style.width='96%'; \/\/' + rect.width + 'px';<br \/>\n   document.getElementById('moreb').style.height='' + rect.height + 'px';<br \/>\n   document.getElementById('moreb').style.border='1px solid black';<br \/>\n   document.getElementById('moreb').style.paddingLeft='20px';<br \/>\n   document.getElementById('moreb').style.backgroundColor='#f9f9f9';<br \/>\n   document.getElementById('fcommand').style.opacity='0.0';<br \/>\n   document.getElementById('moreb').innerHTML='ffmpeg\" . $ffmpegsuf . \" -i &lt;span id=scbi&gt;&lt;iframe onload=checkif(this,\\\"inv.mp4\\\"); scrolling=no frameborder=0 id=cbi data-type=file data-value=inv.mp4 data-accept=\\\"video\/*\\\" style=\\\"display:inline-block;height:40px;width:92px;vertical-align:middle;\\\" src=\\\"\/HTMLCSS\/client_browsing.htm?d=975964842271&left=y\\\"&gt;&lt;\/iframe&gt;&lt;\/span&gt; -i &lt;span id=scbix&gt;&lt;iframe onload=checkiftwo(this,\\\"inva.mp4\\\"); scrolling=no frameborder=0 id=cbix data-type=file data-value=inva.mp4 data-accept=\\\"video\/*\\\" style=\\\"display:inline-block;height:40px;width:106px;vertical-align:middle;\\\" src=\\\"\/HTMLCSS\/client_browsing.htm?d=975964842271&right=y\\\"&gt;&lt;\/iframe&gt;&lt;\/span&gt; -c copy -map 0:v:0 -map 1:a:0 -shortest out.mp4 &gt; voiceover.bad';<br \/>\n  }<br \/>\n<br \/>\n  <font color=purple>function mergechanges() {<br \/>\n     if (document.getElementById('scbi').innerHTML.indexOf('&lt;') == -1) {<br \/>\n       document.getElementById('fcommand').value=document.getElementById('fcommand').value.replace(' inv.mp4 ', ' ' + document.getElementById('scbi').innerHTML + ' ');<br \/>\n       \/\/alert('not oops ' + document.getElementById('fcommand').value);<br \/>\n     } \/\/else {<br \/>\n       \/\/alert('oops');<br \/>\n     \/\/}<br \/>\n     if (document.getElementById('scbix').innerHTML.indexOf('&lt;') == -1) {<br \/>\n       document.getElementById('fcommand').value=document.getElementById('fcommand').value.replace(' inva.mp4 ', ' ' + document.getElementById('scbix').innerHTML + ' ');<br \/>\n     }<br \/>\n     if (document.getElementById('moreb').innerText.indexOf(' -c ') != -1 && document.getElementById('fcommand').value.indexOf(' -c ') != -1) {<br \/>\n      if (document.getElementById('moreb').innerText.split(' -c ')[1] != document.getElementById('fcommand').value.split(' -c ')[1]) {<br \/>\n       document.getElementById('fcommand').value=document.getElementById('fcommand').value.split(' -c ')[0] + ' -c ' + document.getElementById('moreb').innerText.split(' -c ')[1];<br \/>\n      }<br \/>\n     }<br \/>\n     return true;<br \/>\n  }<\/font><br \/>\n<\/code><br \/>\n&#8220;; ?&gt;<\/p>\n<p> &#8230; reign supreme collecting their media file specification information in <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-GETME\" rel=\"noopener\">the changed<\/a> <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php-GETME\" rel=\"noopener\">voiceover.php<\/a> PHP (we&#8217;d want you to download to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server&#8217;s Document Root folder) and which you can <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run that PHP there<\/a>.<\/p>\n<p>The previous work of <a target=\"_blank\" href='https:\/\/www.rjmprogramming.com.au\/ITblog\/animated-gif-creation-install-paths-tutorial\/' title='Animated GIF Creation Install Paths Tutorial' rel=\"noopener\">Animated GIF Creation Install Paths Tutorial<\/a>&#8216;s thread of blog postings has been a great help with this ffmpeg &#8220;Intranet feeling&#8221; integration work we use, around here, in conjunction with macOS or Windows operating system <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache local web server environments.<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=\"_blank\" href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-mux-video-and-audio-media-browsing-tutorial\/' rel=\"noopener\">Ffmpeg Mux Video and Audio Media Browsing Tutorial<\/a>.<\/p-->\n<hr>\n<p id='fmvapt'>Previous relevant <a target=\"_blank\" title='Ffmpeg Mux Video and Audio Primer Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-mux-video-and-audio-primer-tutorial\/' rel=\"noopener\">Ffmpeg Mux Video and Audio Primer Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Ffmpeg Mux Video and Audio Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.jpg\" title=\"Ffmpeg Mux Video and Audio Primer Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">Ffmpeg Mux Video and Audio Primer Tutorial<\/p><\/div>\n<p>We&#8217;ve got another &#8220;Intranet feeling&#8221; PHP web application  &#8220;first draft&#8221; for you today.  The reason we&#8217;re opting for &#8220;Intranet feeling&#8221; (ie. we&#8217;re asking you to download the <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php_GETME\" rel=\"noopener\">voiceover.php<\/a> PHP to a local <a target=\"_blank\" title='MAMP' href='http:\/\/www.mamp.info' rel=\"noopener\">MAMP<\/a> Apache web server and <a target=\"_blank\" href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/voiceover.php\" rel=\"noopener\">run the PHP there<\/a> from its Document Root folder) is that we want to further explore the brilliant &#8230;<\/p>\n<p><code><br \/>\n<a target=\"_blank\" title='ffmpeg' href='https:\/\/www.ffmpeg.org\/' rel=\"noopener\">ffmpeg<\/a> -i inv.mp4 -i inva.mp4 -c copy -map 0:v:0 -map 1:a:0 -shortest out.mp4<br \/>\n<\/code><\/p>\n<p> &#8230; we got inspired to try via <a target=\"_blank\" href='https:\/\/gist.github.com\/steven2358\/ba153c642fe2bb1e47485962df07c730' rel=\"noopener\">Mux Video and Audio from another Video<\/a> and <a target=\"_blank\" href='https:\/\/stackoverflow.com\/questions\/12938581\/ffmpeg-mux-video-and-audio-from-another-video-mapping-issue' rel=\"noopener\">FFMPEG mux video and audio (from another video) &#8211; mapping issue<\/a> &#8230; thanks and thanks &#8230; to add audio to a video stream from two different sources.<\/p>\n<p>At least, with macOS MAMP there is the excellent command line <a target=\"_blank\" title='macOS file command' href='https:\/\/ss64.com\/osx\/file.html' rel=\"noopener\">&#8220;file&#8221;<\/a> we can use to show information about some potential input files you could use in this, so far, user unfriendly, &#8220;first draft&#8221; version of the PHP.<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59397' onclick='var dv=document.getElementById(\"d59397\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/video\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59397' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59407' onclick='var dv=document.getElementById(\"d59407\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/ffmpeg\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59407' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59425' onclick='var dv=document.getElementById(\"d59425\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/mamp\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59425' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59438' onclick='var dv=document.getElementById(\"d59438\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/dir\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59438' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59447' onclick='var dv=document.getElementById(\"d59447\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/subtitle\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59447' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59454' onclick='var dv=document.getElementById(\"d59454\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/iframe\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59454' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59472' onclick='var dv=document.getElementById(\"d59472\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/rotation\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59472' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59492' onclick='var dv=document.getElementById(\"d59492\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/imagemagick\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59492' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59507' onclick='var dv=document.getElementById(\"d59507\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/pandoc\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59507' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59515' onclick='var dv=document.getElementById(\"d59515\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/select\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59515' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59526' onclick='var dv=document.getElementById(\"d59526\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/emoji\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59526' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59540' onclick='var dv=document.getElementById(\"d59540\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/title\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59540' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59553' onclick='var dv=document.getElementById(\"d59553\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/onmouseover\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59553' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59560' onclick='var dv=document.getElementById(\"d59560\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/linear-gradient\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59560' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d59569' onclick='var dv=document.getElementById(\"d59569\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/swipe\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d59569' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d66143' onclick='var dv=document.getElementById(\"d66143\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/almalinux\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d66143' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d66303' onclick='var dv=document.getElementById(\"d66303\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/browse\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d66303' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Today it is the case of &#8230; combining the work of yesterday&#8217;s Local File Browsing Tool Stringency Tutorial &#8230; with that of the recent &#8230; Ffmpeg Voiceover AlmaLinux Tutorial &#8230; to show how that work of yesterday&#8217;s onto the functionality &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/ffmpeg-voiceover-almalinux-synchronize-browsing-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,14,29,37],"tags":[113,1993,3531,2650,354,415,576,652,4772,760,2092,5050,932,2362,997,3262,1200,1234,1670,1757,1296,1319,1369,3348],"class_list":["post-66303","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-operating-system","category-tutorials","tag-audio","tag-browse","tag-browsing","tag-convert","tag-dom","tag-ffmpeg","tag-html","tag-javascript","tag-local-file","tag-media","tag-multiple","tag-operating","tag-php","tag-play","tag-programming","tag-source","tag-stop-press","tag-synchronization","tag-synchronize","tag-system","tag-track","tag-tutorial","tag-video","tag-voiceover"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/66303"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=66303"}],"version-history":[{"count":9,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/66303\/revisions"}],"predecessor-version":[{"id":66343,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/66303\/revisions\/66343"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=66303"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=66303"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=66303"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}