Versions

audiojs.zip (2012-02-01) (Downloaded 269 times)

Contains:

  • audio.js (action) - v. 1.0

Compatible: Pro 5 and Pro 5.5

Author: Tim Plumb

This Action uses the audio.js library to place MP3 audio players on your site. It uses the HTML5 audio tag if available or falls back to using Flash if not.

With Flash as a fallback, it should work pretty much anywhere.

It has been verified to work across:

  • Mobile Safari (iOS 3+)
  • Android (2.2+, w/Flash)
  • Safari (4+)
  • Chrome (7+)
  • Firefox (3+, w/ Flash)
  • Opera (10+, w/ Flash)
  • IE (6, 7, 8, w/ Flash)

Check out the audio.js page for full details.

14 Comments

I am so glad you developed this action. It was about time to have an audio HTML 5 player with flash fallback option on Freeway. Scripting it myself within Freeway was pretty complicated. Your action really works well!

I have one question: is there a way to adjust the player? I would like to make it a bit smaller for my site and also remove the time display.

Thank you Stefan

I am so glad you developed this action. It was about time to have an audio HTML 5 player with flash fallback option on Freeway. Scripting it myself within Freeway was pretty complicated. Your action really works well!

I have one question: is there a way to adjust the player? I would like to make it a bit smaller for my site and also remove the time display.

Thank you Stefan

Currently there is no way to easily alter the style of the player without adding your own CSS to the host page. I hope to add a skins option in a future version so you can easily choose other visual styles.

Thank you for your quick answer. I would find it really helpful if you can also adjust autoplay and preload. On some songs I want autoplay on. It seems I can only do it on the host page as well? No chance to do this within Freeway?

I can't believe this came out in Feb. this year but I only stumbled across it today. I have long been looking for an embeddable MP3 player for my web pages.

Unfortunately, the player is quite wide. If re-skinning it would allow it's dimensions to be slimmed down, then I look forward to seeing some of those skins.

But perhaps the greatest flaw in this player is that it lacks a volume control. If you sketch an HTML box and import an MP3 file in Freeway, when you display the page on the Mac, the standard QuickTime player bar will appear, equipped with a Volume control slider. With no way to quickly reduce or mute the volume, most people would actually be turned off by it.

So in summary, add an option to make the player physically smaller, and add a volume control. Then it will be perfect!

Great idea! Saves doing it manually.

Is this still up and running? I see the player when working in Freeway but it isn't there when previewing on different browsers.

This Action has been of great benefit to me and a big thank you for it.

Is there any chance that a similar action could be made for video clips? I am having such a hard time getting video's to play on my sites. I CAN use the built-in players (and I've tried many of them), but they all require the video to be embedded in the action - your audio player uses a URL call to access an audio file which has already been uploaded outwith Freeway. Freeway has an irritating problem in that it wants to upload every file after only the smallest of changes have been made to any of the pages. I have a video file which is 722MB in size and FW takes over 2hours to upload it EVERY time. If I could just find an action like audio.js, my life would be easier.

When there is more than one mp3 per page, is there any way to stop one when the other is clicked to play?

Folks, this action won't work unless you have an HTML5 page. Note that!

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

Oh there have been updates James, just none that I've released here.

In answer to your questions; 1. It can't be done. I've looked into it and the AudioJs code can't be extended to add volume control.

  1. The Action had an autoplay option in the original version but I took it out as it was temperamental and would only work reliably when the page was hosted online.

  2. I've created 5 or 6 skins for the player for both my projects and for (paying) Freeway users. Each takes an age to hand code and, if you want then to be responsive, even longer. If I update the Action I'll consider adding these in.

I don't have unlimited time to make changes to Actions unless I either need the functionality myself or someone is willing to fund the development and can't justify putting this work ahead of client projects.

Hi Tim,

Thanks for the action! I would be very happy if you could make an update with different (smaller) skins. But thanks anyhow

Hey Guys,

Great idea but i don't how to add the code into the page so my audio player will appear on the page. Please Guys. i have to submit my project very soon.

Hey Guys,

I have come to a point that i really need help.Done already this following steps 1. I create a Markup item on my HTML page so i open with the right mouse click then i paste in the following code in the Modification Popup

<script type="text/javascript"> // <![CDATA[

var so = new SWFObject(&quot;ep_player.swf&quot;, &quot;ep_player&quot;, &quot;269&quot;, &quot;226&quot;, &quot;9&quot;, &quot;#FFFFFF&quot;);
so.addVariable(&quot;skin&quot;, &quot;skins/nobius_blue/skin.xml&quot;);
so.addVariable(&quot;playlist&quot;, &quot;playlist.xml&quot;);
so.addVariable(&quot;autoplay&quot;, &quot;false&quot;);
so.addVariable(&quot;shuffle&quot;, &quot;false&quot;);
so.addVariable(&quot;buffertime&quot;, &quot;1&quot;);
so.write(&quot;flashcontent&quot;);

// ]]&gt;

</script>

So the question is now. how set this code to the right path to recognise my Epplayer file i have already download and just do some changes to the playlist.xml. Please Help

Hey Guys,

I have come to a point that i really need help.Done already this following steps 1. I create a Markup item on my HTML page so i open with the right mouse click then i paste in the following code in the Modification Popup

<script type="text/javascript"> // <![CDATA[

var so = new SWFObject(&quot;ep_player.swf&quot;, &quot;ep_player&quot;, &quot;269&quot;, &quot;226&quot;, &quot;9&quot;, &quot;#FFFFFF&quot;);
so.addVariable(&quot;skin&quot;, &quot;skins/nobius_blue/skin.xml&quot;);
so.addVariable(&quot;playlist&quot;, &quot;playlist.xml&quot;);
so.addVariable(&quot;autoplay&quot;, &quot;false&quot;);
so.addVariable(&quot;shuffle&quot;, &quot;false&quot;);
so.addVariable(&quot;buffertime&quot;, &quot;1&quot;);
so.write(&quot;flashcontent&quot;);

// ]]&gt;

</script>

So the question is now. how set this code to the right path to recognise my Epplayer file i have already download and just do some changes to the playlist.xml. Please Help

Sign In or Sign Up to comment.