New Audio player BB Tag

Post by jb » Sat Apr 18, 2015 8:01 am

There is now an "audio" BB tag available. Simply wrap a URL in the audio tag and rather than showing the URL itself, when the post loads it will display a player for that file.

http://johnorama.com/songs/collaboratio ... _black.mp3

NOTE: So far this only really works on the SubSilver2 theme. I'm working to get it working on ProSilver (though I do like SubSilver2 better, FYI.

JB

ken · Post by **ken** » Sat Apr 18, 2015 8:14 am

It sort of looks like you put an example in this post, but it doesn't seem to be working for me.

Post by jb » Sat Apr 18, 2015 10:44 am

ken wrote:It sort of looks like you put an example in this post, but it doesn't seem to be working for me.

I did put an example in the post. And it is working on my phone too.

Do you know what theme you are using?

J

Post by jb » Sat Apr 18, 2015 11:55 am

Ok it seems to be working for SubSilver and the Red one, but not the others, and I don't know why as of yet. Anybody who sees this and knows javascript, if you'd take a look and figure out what the diff is and why it's not working, help is appreciated.

J

ken · Post by **ken** » Sat Apr 18, 2015 1:39 pm

I've got Prosilver

Post by **Lunkhead** » Sat Apr 18, 2015 2:22 pm

I'm trying to take a look, but it's kind of tough to know what is going on. That JavaScript library doesn't appear to do much/any logging, and since the minified version is being used I can't really very effectively debug through their code to see what is going on. It's also not throwing any errors, at least not any that are showing up on the browser console. Judging from their source code it looks like maybe it displays errors in a div on the page if there is one that matches some criteria. I don't see any errors in those divs though. It also looks like it dynamically injects its CSS. Maybe that's not working, or there is a conflict with some CSS for some themes?

http://kolber.github.io/audiojs/docs/

Post by **Lunkhead** » Sat Apr 18, 2015 2:28 pm

It seems like it's something with the CSS. It's not getting applied in Ken's theme. I'm not sure why.

Post by jb » Sat Apr 18, 2015 4:32 pm

Good lead, Lunkhead. Haven't figured it out yet, and my attempts to force the audiojs CSS to be active on the page have not yet borne fruit. I'll give it a bit more effort.

JB

Jerkatorium · Post by **Jerkatorium** » Sat Apr 18, 2015 5:07 pm

Hi, I'm a user and a dummy; I click on things and music comes out of the speakers, and other than that I don't know what computers do or how to use them.

The Depeche Mode CoverFight ( http://songfight.net/forums/viewtopic.php?f=14&t=9623 ) has just posted songs using this new player. Is there any way I can download any of these songs, or am I stuck listening to them on the SFBB? I've tried clicking (and right-clicking) all over the place and can't seem to figure it out.

Post by jb » Sat Apr 18, 2015 5:38 pm

Jerkatorium wrote:Hi, I'm a user and a dummy; I click on things and music comes out of the speakers, and other than that I don't know what computers do or how to use them.

The Depeche Mode CoverFight ( http://songfight.net/forums/viewtopic.php?f=14&t=9623 ) has just posted songs using this new player. Is there any way I can download any of these songs, or am I stuck listening to them on the SFBB? I've tried clicking (and right-clicking) all over the place and can't seem to figure it out.

Hi Jerkatorium-- I've just modified the BB Code so that it displays the URL underneath the player. You should be able to download them easily now.

JB

Post by jb » Sat Apr 18, 2015 7:20 pm

The audiojs CSS is definitely being somehow suppressed when the page loads. On the theme where it works, the audiojs element has a whole collection of CSS things that are simply not present on the theme where it doesn't work. Harrumph.

jast · Post by **jast** » Sun Apr 19, 2015 7:22 am

The CSS is getting loaded all right, but it's not getting applied (the part that is inserted dynamically by audio.js).

In Firefox, I can work around this by removing the 'title' attribute from the dynamically generated <style> element (first one in <head>), using DOM Inspector. In Chrome, I've managed to make it work once by randomly messing around with stuff in <head>; can't reproduce, though.

Gotta love web dev...

jast · Post by **jast** » Sun Apr 19, 2015 7:24 am

PS (can't edit my post): in IE11 it works out of the box, wtf...

fluffy · Post by **fluffy** » Sun Apr 19, 2015 8:25 pm

Why use this crazy overwrought plugin instead of just inserting an <audio> tag with appropriate options? I guess it's nice to have playlists and only one thing playing at once though.

On my sites I use jPlayer which is just about as easy to install as the old Yahoo Media Player, and that should work fine with phpBB as well (you'll still need a bbcode thing to actually insert the required attribute on the <a> tag though).

Post by jb » Sun Apr 19, 2015 10:08 pm

fluffy wrote:Why use this crazy overwrought plugin instead of just inserting an <audio> tag with appropriate options? I guess it's nice to have playlists and only one thing playing at once though.

I didn't realize I could just use that tag, with a "controls" parameter, and it would show up like that! So I've taken all the script stuff out and just put in that audio tag.

On my sites I use jPlayer which is just about as easy to install as the old Yahoo Media Player, and that should work fine with phpBB as well (you'll still need a bbcode thing to actually insert the required attribute on the <a> tag though).

Not to argue, but from scanning the docs, jPlayer looks much more overwrought than Audiojs-- at least to my shitty hacker eyes.

Anyway, it looks like we have an audio plugin BB Code! And considering the age of the browsers that w3schools says support this tag, anybody that can't see the tags really needs to come into the now.

And a flash backup-- dunno why that's really called for in this day and age. I guess if it's like you say, fluffy, and with the audio tag there's nothing preventing you from having multiple files playing at once, that's a bit of a challenge (it's nice if the one playing shuts off if you click another one...). But not that big a deal I guess in the grand scheme.

If you know of something simple that will change that behavior, lemme know. Otherwise I'm calling this one done.

ken · Post by **ken** » Mon Apr 20, 2015 8:41 am

Hey! It seems to be working now. Well done gents.

fluffy · Post by **fluffy** » Mon Apr 20, 2015 12:44 pm

jb wrote:And a flash backup-- dunno why that's really called for in this day and age. I guess if it's like you say, fluffy, and with the audio tag there's nothing preventing you from having multiple files playing at once, that's a bit of a challenge (it's nice if the one playing shuts off if you click another one...). But not that big a deal I guess in the grand scheme.

If you know of something simple that will change that behavior, lemme know. Otherwise I'm calling this one done.

The simplest thing I know of is jPlayer. :) Well, specifically jPlayer Jukebox, which uses jPlayer to do its thing. That's what I meant to refer to.

There's probably also a way of hooking the onPlayed event on any given <audio> tag to also pause any other active players. But now we can also have instant mashups on the forum, too.

New Audio player BB Tag

New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag

Re: New Audio player BB Tag