I recently visited a Forum and when you visit their profile a song of their choice begins playing. I messaged the user and he told me this was done in JS by creating a profile field that's able to play youtube videos and play the song of your choice that's on youtube. He of course could not give me the code since it doesn't belong to him, but I was wondering if someone here can help me with that. 

Tagging: @Jscript

Hello!

I have not seen anything about it, but can be done in different ways, here are some examples:
http://www.phon.ucl.ac.uk/home/mark/audio/play3.htm
https://github.com/admsev/jquery-play-sound

Or put an <audio> element on your page, Then get your audio element and call the play() method: document.getElementById('yourAudioTag').play();

Or something like that:

Code:


_playSound function (url) {
  document.getElementById ("sound") innerHTML = "<embed src = '" + url + "' hidden = true autostart = true loop = false>.";
}


JS

http://www.avacweb.com/t1482-profile-songs-for-phpbb-2?highlight=profile+songs

Hey, here is the code but you need to adjust it depending on what type of forum you have and the profile field you are going to use.

CrystalSoul wrote:http://www.avacweb.com/t1482-profile-songs-for-phpbb-2?highlight=profile+songs

Hey, here is the code but you need to adjust it depending on what type of forum you have and the profile field you are going to use.

I had forgotten to get back to this topic. I saw the code but where would I change the forum version since the code is for phpBB2 and I have phpBB3. Also, when I create the profile field what settings do I have to use? Sorry if I sound a bit noobish when it comes to JS @Crystalsoul

Can anyone still help with this?

goto acp>users&groups>profile>

add a new profile text field

then

goto acp>modules>JavaScript management

create a new javascript

title:profmusic
placement: all pages

Code:

$(function(){
    if(_userdata.user_level == 1){
   
$('head').append(' <style>#pflinfo {color: red;font-weight:
bold;background: none repeat scroll 0% 0% black;display:
inline-block;padding: 5px;border: 1px solid white;border-radius:
5px;transition: 2s;}#pflinfo:hover {font-size:3em;padding:
10px;}</style> ')
    $('#profile-tab-field-profil dl').each(function(){
    $(this).append(' <span id="pflinfo" style="">'+$(this).attr("id")+'</span> ');});
 
   $('#profile-advanced-details dl').each(function(){$(this).append('
<span id="pflinfo" style="">'+$(this).attr("id")+'</span>
');
    });}});

submit 

then view someones profile and copy the id of the field you created for the profile music


next replace the first javascript with

Code:

$(function(){
   var proffield = 'field_id-9';
  if(RegExp("/u[0-9]+").test(window.location.pathname)) {
      var mobileAgents = new RegExp("Android|BlackBerry|Blazer|BOLT|SymbianOS|Doris|Mobile|Phone|Fennec|GoBrowser|Iris|Maemo|MIB\/2\.2|Minimo|NetFront|Opera Mini|Opera Mobi|SEMC|Skyfire|Teleca|uZardWeb","i");
      if(mobileAgents.test(navigator.userAgent)) {
        return;
      }
      var profsong = $("dl"+proffield+" dt + dd div:first-of-type") || undefined;
      if(!profsong) {
        return;
      }
      var trueorfalse = profsong.text().trim().charAt(0) !== "-" || false;
      if(trueorfalse) {
            var vid = profsong.text().replace(/\/watch\?v\=/,"/v/"),
                        friends = $('#profile-advanced-right .module:eq(1)'),
            name = $('.page-title span strong'),
            namecolor = name.css('color');
            $('dl#'+proffield).css('display','none').next().css('display','none');
            friends.after('<table width="100%" cellspacing="1" cellpadding="0" border="0" class="forumline"><tbody><tr><td class="catLeft"><span class="genmed module-title"><span style="color: '+namecolor+';"><strong>'+name.text()+'</strong></span>\'s Profile Song</span></td></tr><tr><td><object width= "298" height="24"><param name="movie" value="'+vid+'?autoplay=1&rel=0&fs=0&autohide=0"></param><param name="allowFullScreen" value="false"></param><param name="allowscriptaccess" value="always"></param><embed src="'+vid+'?autoplay=1&rel=0&fs=0&autohide=0" type="application/x-shockwave-flash" allowfullscreen="false" width="298" height="24" allowscriptaccess="always"></embed></object></td></tr></table>');
        } else {
            return;
        }
  } else {
      return;
  }
});

replace

Code:

field_id-9

with new profile field id then submit

add a song to your profile and you should be good 2 go

Ok I did all the steps, and in the profile field I created I inserted a song from Youtube and saved changes, now this appears on the bottom righ, where it says Demo Account's Profile song but no song is playing or anything http://prntscr.com/5s98qy

whats the url u used for the video?

Lol this is the song I used to test it. https://www.youtube.com/watch?v=R3_0Pky8vVg

And I pasted that exact link in the text field http://prntscr.com/5sdf5q

it was my fault i missed something

remember to switch ur field id

Code:

    $(function(){
      var proffield = 'field_id-8';
      if(RegExp("/u[0-9]+").test(window.location.pathname)) {
          var mobileAgents = new RegExp("Android|BlackBerry|Blazer|BOLT|SymbianOS|Doris|Mobile|Phone|Fennec|GoBrowser|Iris|Maemo|MIB\/2\.2|Minimo|NetFront|Opera Mini|Opera Mobi|SEMC|Skyfire|Teleca|uZardWeb","i");
          if(mobileAgents.test(navigator.userAgent)) {
            return;
          }
          var profsong = $("dl#"+proffield+" dt + dd div:first-of-type") || undefined;
          if(!profsong) {
            return;
          }
          var trueorfalse = profsong.text().trim().charAt(0) !== "-" || false;
          if(trueorfalse) {
                var vid = profsong.text().replace(/\/watch\?v\=/,"/v/"),
                            friends = $('#profile-advanced-right .module:eq(1)'),
                name = $('.page-title span strong'),
                namecolor = name.css('color');
                $('dl#'+proffield).css('display','none').next().css('display','none');
                friends.after('<table width="100%" cellspacing="1" cellpadding="0" border="0" class="forumline"><tbody><tr><td class="catLeft"><span class="genmed module-title"><span style="color: '+namecolor+';"><strong>'+name.text()+'</strong></span>\'s Profile Song</span></td></tr><tr><td><object width= "298" height="24"><param name="movie" value="'+vid+'?autoplay=1&rel=0&fs=0&autohide=0"></param><param name="allowFullScreen" value="false"></param><param name="allowscriptaccess" value="always"></param><embed src="'+vid+'?autoplay=1&rel=0&fs=0&autohide=0" type="application/x-shockwave-flash" allowfullscreen="false" width="298" height="24" allowscriptaccess="always"></embed></object></td></tr></table>');
            } else {
                return;
            }
      } else {
          return;
      }
    });

I did everything as instructed. I change Songs to this one just in case https://www.youtube.com/watch?v=qgeaoW55Pks

and I replaced the field id which in my case is

Code:

profile_field_13_10

And still this is the only thing that comes out. http://prntscr.com/5sl5ck


This is the last code you posted with the field changed for my forum:

Code:

$(function(){
      var proffield = 'profile_field_13_10';
      if(RegExp("/u[0-9]+").test(window.location.pathname)) {
          var mobileAgents = new RegExp("Android|BlackBerry|Blazer|BOLT|SymbianOS|Doris|Mobile|Phone|Fennec|GoBrowser|Iris|Maemo|MIB\/2\.2|Minimo|NetFront|Opera Mini|Opera Mobi|SEMC|Skyfire|Teleca|uZardWeb","i");
          if(mobileAgents.test(navigator.userAgent)) {
            return;
          }
          var profsong = $("dl#"+proffield+" dt + dd div:first-of-type") || undefined;
          if(!profsong) {
            return;
          }
          var trueorfalse = profsong.text().trim().charAt(0) !== "-" || false;
          if(trueorfalse) {
                var vid = profsong.text().replace(/\/watch\?v\=/,"/v/"),
                            friends = $('#profile-advanced-right .module:eq(1)'),
                name = $('.page-title span strong'),
                namecolor = name.css('color');
                $('dl#'+proffield).css('display','none').next().css('display','none');
                friends.after('<table width="100%" cellspacing="1" cellpadding="0" border="0" class="forumline"><tbody><tr><td class="catLeft"><span class="genmed module-title"><span style="color: '+namecolor+';"><strong>'+name.text()+'</strong></span>\'s Profile Song</span></td></tr><tr><td><object width= "298" height="24"><param name="movie" value="'+vid+'?autoplay=1&rel=0&fs=0&autohide=0"></param><param name="allowFullScreen" value="false"></param><param name="allowscriptaccess" value="always"></param><embed src="'+vid+'?autoplay=1&rel=0&fs=0&autohide=0" type="application/x-shockwave-flash" allowfullscreen="false" width="298" height="24" allowscriptaccess="always"></embed></object></td></tr></table>');
            } else {
                return;
            }
      } else {
          return;
      }
    });

For me it is working (phpBB3):

can you provide me with a account to login, and link to that profile

Sent in a PM

the field was not set to be visible in profiles .. also you used the field id from the edit profile page ..not the view profile page .. and lastly it has to be a youtube url.... but you should be good to go now i fixed everything for you

I just visited your temporary profile I can hear the song!!

So happy this is finally solved!!!! Thank you very much.

your welcome

Update if other code dont work use this one

Code:


      $(function(){
          var proffield = 'JS_field_id10';
          if(RegExp("/u[0-9]+").test(window.location.pathname)) {
              var mobileAgents = new RegExp("Android|BlackBerry|Blazer|BOLT|SymbianOS|Doris|Mobile|Phone|Fennec|GoBrowser|Iris|Maemo|MIB\/2\.2|Minimo|NetFront|Opera Mini|Opera Mobi|SEMC|Skyfire|Teleca|uZardWeb","i");
              if(mobileAgents.test(navigator.userAgent)) {
                return;
              }
              var profsong = $("#"+proffield+" .field_uneditable") || undefined;
              if(!profsong) {
                return;
              }
              var trueorfalse = profsong.html().trim().charAt(0) !== "-" || false;
              if(trueorfalse) {
                    var vid = profsong.text().replace(/\/watch\?v\=/,"/v/"),
                                friends = $('#profile-advanced-right .module:eq(1)'),
                    name = $('.page-title span strong'),
                    namecolor = name.css('color');
                    $('dl#'+proffield).css('display','none').next().css('display','none');
               
                    friends.after('<table width="100%" cellspacing="1" cellpadding="0" border="0" class="forumline"><tbody><tr><td class="catLeft"><span class="genmed module-title"><span style="color: '+namecolor+';"><strong>'+name.text()+'</strong></span>\'s Profile Song</span></td></tr><tr><td><object width= "298" height="24"><param name="movie" value="'+vid+'?autoplay=1&rel=0&fs=0&autohide=0"></param><param name="allowFullScreen" value="false"></param><param name="allowscriptaccess" value="always"></param><embed src="'+vid+'?autoplay=1&rel=0&fs=0&autohide=0" type="application/x-shockwave-flash" allowfullscreen="false" width="298" height="24" allowscriptaccess="always"></embed></object></td></tr></table>');
                } else {
                    return;
                }
          } else {
              return;
          }
        });