[Pro] HTML5 Audio Player

Good Morning

I’ve now got to get a Audio Player into the site http://cherokeedesigns.co.uk/thequeue/audio.html if possible an HTML5 player.

Can anybody recommend one suitable that will work in FW.

Thanks in advance

Lee


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Here is Tim’s Action: http://actionsforge.com/actions/audio-js

Note that it WILL NOT WORK unless you put it on an HTML5 page!

Next…

Tim, can some or all of the following suggestions please be added SOON?
(Consider that 2.5 years have passed with no updates.)

  1. VOLUME CONTROL. This is the most basic yet sought after feature. Consider well how this HTML5 implementation gives you an audio control in all modern browsers: W3Schools Tryit Editor

  2. AUTOPLAY CHECKBOX. This should be an option via the Actions palette.

  3. SKINS. Change the size/color of the player.

The above are listed in order of IMPORTANCE.

Thanks,

James Wages


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

You really don’t need this any more – it was a placeholder while the browsers evolved and HTML5 became a thing. All of the browsers (IE 8 +) can play an

Walter

On Jul 30, 2014, at 9:03 PM, JDW wrote:

Here is Tim’s Action: http://actionsforge.com/actions/audio-js

Note that it WILL NOT WORK unless you put it on an HTML5 page!

Next…

Tim, can some or all of the following suggestions please be added SOON?
(Consider that 2.5 years have passed with no updates.)

  1. VOLUME CONTROL. This is the most basic yet sought after feature. Consider well how this HTML5 implementation gives you an audio control in all modern browsers: http://tinyurl.com/8ae78pt

  2. AUTOPLAY CHECKBOX. This should be an option via the Actions palette.

  3. SKINS. Change the size/color of the player.

The above are listed in order of IMPORTANCE.

Thanks,

James Wages


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

You’re right. It seems that all modern version of FireFox now support MP3, and since FireFox users are totally unlike IE users, they tend to stay current, ensuring that most FF users will likely be able to see the audio content.

So what I am doing is adding a Markup item to a new page in my site that contains the following:

<audio controls>
  <source src="http://visionsecurity.jp/jp/sirens/sounds/KR22-1.mp3" type="audio/mpeg">
Error: Your browser does not support HTML5 Audio.
エラー:そちらのブラウザが「HTML5オーディオ」をサポートしていません。
</audio>

Of course, others need only do the same an replace that URL with a URL to their own MP3 file.

I then will access that page via ScriptyLightbox3 to make it an overlay (hovering above the current web page).

Best,

James Wages


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Walter, I just discovered today that IE doesn’t like either the AUDIO tag or my implementation.

Example page: VISION サイレン オプション

Click a siren to get the overlay (and player, in most cases).

Note that only my overlay is an HTML5 page, while the parent page (and all other pages in my site) are still HTML4.

Works great in Chrome (Mac/Win), Firefox (Mac/Win), and Safari. IE8 produces the “Error…” line, and IE11 displays a player with the text “INVALID Source.”

IE8 appears incompatible with HTML5. Strange, but I guess I can live with it. But I am concerned about why IE11 is giving me that INVALID error. Since the vast majority of our web visitors use IE (sadly), I need to at least have compatibility with the latest and greatest version of IE.

Any ideas?

–James Wages


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Addendum to my previous post…

Since the IE11 error mentions “source” I decided to delete that word from the code to get this:

<audio controls>
  <src="http://visionsecurity.jp/jp/sirens/sounds/KR22-1.mp3" type="audio/mpeg">
Error: Your browser does not support HTML5 Audio.
エラー:そちらのブラウザが「HTML5オーディオ」をサポートしていません。
</audio>

When I reloaded the page in IE11, the player loaded and I could adjust the volume. Everything worked great until I clicked the Play button. Then I got an UNKNOWN ERROR OCCURRED message. AND I found that the audio would not play in Chrome.

Drat this problem!

Try it yourself in IE11: KR22-1, KB22-1, KB24-1サイレン音(MP3オーディオ)

Any ideas would be greatly appreciated.

Thanks,

James Wages


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Try making the whole page (including the overlay) HTML5 as well. IE only treats a page correctly if it does not trigger “quirks” mode, so you may need to work through whatever is keeping your outer page from bing HTML5.

Walter

On Aug 5, 2014, at 4:14 AM, JDW wrote:

Addendum to my previous post…

Since the IE11 error mentions “source” I decided to delete that word from the code to get this:

<audio controls>
>  <src="http://visionsecurity.jp/jp/sirens/sounds/KR22-1.mp3" type="audio/mpeg">
> Error: Your browser does not support HTML5 Audio.
> エラー:そちらのブラウザが「HTML5オーディオ」をサポートしていません。
> </audio>

When I reloaded the page in IE11, the player loaded and I could adjust the volume. Everything worked great until I clicked the Play button. Then I got an UNKNOWN ERROR OCCURRED message. AND I found that the audio would not play in Chrome.

Drat this problem!

Try it yourself in IE11: KR22-1, KB22-1, KB24-1サイレン音(MP3オーディオ)

Any ideas would be greatly appreciated.

Thanks,

James Wages


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Walter, in my previous post I provided a direct URL to the HTML5 page (the overlay content). And yet, as I said, it does not work in IE11. Here it is again:

http://visionsecurity.jp/jp/sirens/sounds/kr22-1.html

I use SLB3 to access that HTML5 page from an HTML4 page. But if you use the direct URL above, it is PURE HTML5, untainted by HTML4.

I did a Google search and some people say “IE11 only understands M4A audio” so I added a line to such a file, and while the player in IE11 starts to work, when you click the play button on the player, you end up with an error. So even M4A does not work.

Surely there must be a workaround for this.

I hate IE. And I despise Microsoft for having created this bastard. It’s been a bastard since inception. And now that we finally can wash our hands of STUPID IE6 and IE7 (most IE users use IE8 and above now), we now have this stupid problem even in the latest IE11! But like I said, most of the world is filled with lemmings addicted to Windows, who in turn are blind to anything other than IE, and therefore I sadly have to find workarounds for these helpless people.

Any further thoughts would be greatly appreciated.

Thanks,

James Wages


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Update…

I called some people and asked them to check their IE11 machines. All of them apparently can see the player just fine. One used Windows 7 and IE11, while the others used Windows 8.1 and IE11 (all Japanese edition). And yet, this Windows 8.1 PC at the office running IE11 gives an error. Yes, it has Windows Media Player installed. And yes, I verified that it is running the newest IE11 just like my associates’ PCs. There are no Security settings that I can see which would result in this error.

My concern is that if this PC has a problem, perhaps some of our other web visitors will also have the same issue. But for the life of me, I cannot figure out why this particular PC would cough up an INVALID SOURCE error while other PCs (seemingly identical) would not.

Will some of you IE11 users please give it a test and report back?

http://visionsecurity.jp/jp/sirens/sounds/kr22-1.html

Thanks.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

The utter dearth of replies indicate that Freeway users are not very hip on putting modern audio on their websites! :slight_smile:

Anyway…

As to IE8 compatibility, I Googled up some info that says adding the following code in the section will make HTML5 audio tags work perfectly:

<!--[if lt IE 9]>
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.js"></script>
<![endif]-->

But in fact, that info is BOGUS and does no good whatsoever to enlighten IE8 to the glories of HTML5 audio. Don’t be tricked. “html5shiv.js” does NOT magically make the HTML5

After much fiddling, I finally found an acceptable solution to me (which is saying something seeing I am somewhat of a perfectionist).

Here is the

<audio controls>
  <source src="http://YOURDOMAIN/YOUR_AUDIO_FILE.mp3" type="audio/mpeg">
  <object type="application/x-shockwave-flash" data="http://YOURDOMAIN/dewplayer/dewplayer.swf" width="200" height="20" id="dewplayer" name="dewplayer">
    <param name="wmode" value="transparent" />
    <param name="movie" value="http://YOURDOMAIN/dewplayer/dewplayer.swf" />
    <param name="flashvars" value="mp3=http://YOURDOMAIN/YOUR_AUDIO_FILE.mp3&amp;showtime=1" />
    <p>Error: Your browser does not support HTML5 Audio.<br>エラー:そちらのブラウザが「HTML5オーディオ」をサポートしていません。</p>
    </object>
</audio>

You can download and use the FREE Dewplayer.swf here: http://www.alsacreations.fr/dl/dewplayer.zip

But since the default sized audio player in IE11 is eye-poppingly HUGE, I shrink it to a decent size with the following CSS added to Page Markup in the Before section (adjust the px values to suit your own taste):

<style type="text/css">
<!--
audio { width: 350px; height: 40px; }
-->
</style>

After all this, I must say that Tim Plumb’s action would certainly be a faster way to achieve the same thing, assuming the Action could be updated and modernized: http://actionsforge.com/actions/audio-js

In the meantime, if any of you kind souls could please test the following URL in your copy of IE11 (preferably running on Win8.1), I would be grateful for your feedback:

http://visionsecurity.jp/jp/sirens/sounds/kr22-1.html

As I said in my previous posts, the player works perfectly on some Win8.1 machines but coughs up an INVALID SOURCE error on others. “WHY” that error occurs only on some IE11 machines is what I am desperately trying to determine.

Thanks!

James Wages


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi not a problem with an audio player, but I had the same issue using a Hype movie, and the answer was that the one computer (out of an office of 8 identical setups) that wouldn’t play was the boss’ computer and he had some extra security software installed for logging in to various financial websites. It took us a while to get to the bottom of it as he insisted that there was no difference between his and the rest of the office.

just a thought.

Trev

On 6 Aug 2014, at 03:37, JDW email@hidden wrote:

Update…

I called some people and asked them to check their IE11 machines. All of them apparently can see the player just fine. One used Windows 7 and IE11, while the others used Windows 8.1 and IE11 (all Japanese edition). And yet, this Windows 8.1 PC at the office running IE11 gives an error. Yes, it has Windows Media Player installed. And yes, I verified that it is running the newest IE11 just like my associates’ PCs. There are no Security settings that I can see which would result in this error.

My concern is that if this PC has a problem, perhaps some of our other web visitors will also have the same issue. But for the life of me, I cannot figure out why this particular PC would cough up an INVALID SOURCE error while other PCs (seemingly identical) would not.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks, Trev.

We checked all the IE11 browser security settings. The settings are the same across all machines tested. The anti-virus software is also the same too. There is no software firewall being used, and two of the machines share the same network, which is attached to an Airport Express (Time Capsule). Those two machines on the same network use Win8.1 and IE11, and one works great with the

–James W.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

The utter dearth of replies indicate that Freeway users are not very hip on putting modern audio on their websites!

The utter dearth of replies indicates that most of us are asleep!

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Sleeping since July 31st, 2014 (when Walter and I resurrected this thread)???!!!

Hah!

:slight_smile:

Looking forward to hearing your test results in IE11, Dave!

http://visionsecurity.jp/jp/sirens/sounds/kr22-1.html

Thanks!

James W.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Looking forward to hearing your test results in IE11, Dave!

Don’t have it and won’t install it until I can put earlier versions of IE out to pasture.

I will have to make do with BrowserStack etc until then and as anyone can use that sort of service my feedback wouldn’t be valuable.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I haven’t been using Freeway much recently, but have an older site I need to update. I am running 6.1.2 and see in the documentation that Freeway now supports a Vidoe/Audio element. Where is this located? I can’t find it anywhere. I’ve set my document to html5.

Do I understand that the audio.js action is out of date now? If so, why leave on actionforge?

Thanks for any feedback.


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Jan,
Read this from soft press and watch the linked tutorial. Another tip - I use an free app called “Miro Video Converter” to get the Ogg and Webm versions.

PaulM


freewaytalk mailing list
email@hidden
Update your subscriptions at:

PaulM, what in the world does Google Analytics have to do with Audio, which is the topic of this thread and of Jan Smoot’s post?


freewaytalk mailing list
email@hidden
Update your subscriptions at:

I goofed here is the correct link.

PaulM


freewaytalk mailing list
email@hidden
Update your subscriptions at: