Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 16
  1. #1
    New Coder
    Join Date
    Jan 2009
    Location
    Bristol, England
    Posts
    43
    Thanks
    11
    Thanked 0 Times in 0 Posts

    Play sound file randomly

    Hello geniuses.

    I really need your help and didn't know who else to turn to.

    Using JavaScript, I require a code that allows me to play .wav sound files randomly and automatically on page start-up, I also need them to loop as they are drum beats.

    The plan: to load my web page and hear a random drum beat that loops continuously.

    I need it to be compatible with most, if not all Internet browsers (Chrome, Internet Explorer, Firefox and Opera are crucial) and to state what sound file is playing on the page (allowing me to identify the looping drum beat/sound file), and if possible to provide a link to the actual sound file for download.

    I've tried endlessly trying to find code to build upon but have failed miserably, I would appreciate any code submissions as it would help me out massively.
    It's a lot to ask I know, but it would be so very appreciated.
    My knowledge with JavaScript is sadly minimal.

    I've also got a quick question, how would I prevent Google Chrome from putting a pause after each sound loop? Of course, being drum beats; I require it to loop in sync and it appears only Google Chrome puts a 1 second period after each play.

    Please help, I am so stuck.
    Anyway guys, thanks for reading!

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    *NOT TESTED*

    Code:
    <html>
    <head>
    <script type="text/javascript">
    function startSound( ) 
    {
        var sounds = [
            "jungle_rhythms", "heartbeat", "pulse",
            ... any number of file names ...
            ... do not put comma after the LAST one ...
            ];
    
        var sound = Math.floor( Math.random() * sounds.length );
        var where = document.getElementById("soundHolder");
        var name = document.getElementById("soundName");
        where.innerHTML = 
            '<embed src="/path/to/sounds/' + sound + '.wav" autostart="true" width="0" height="0" '
            + ' repeat="true" loop="true" enablejavascript="false" />';
        name.innerHTML = sound;
    }
    </script>
    </head>
    <body onload="startSound( )">
    ...
    ... someplace in body ...
    
    <span id="soundHolder" style="visibility: hidden;"></span>
    ...
    Now playing: <span id="soundName"></span>
    ...
    </body>
    </html>
    I think IE uses repeat and other use loop, but not sure. In any case shouldn't hurt to use both.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    Can't help you w/ Chrome and the 1 second pause. Never noticed it before, but never looked for it, either.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #4
    New Coder
    Join Date
    Jan 2009
    Location
    Bristol, England
    Posts
    43
    Thanks
    11
    Thanked 0 Times in 0 Posts
    Thank you for your swift response, I was quite amazed at how fast you compiled that code.

    But I have encountered a few problems that I really need help with:

    . I can only ever get it to play the first wave file in the code and have tried swapping the files around to confirm they weren't bust.
    . It often states 'Now playing: 0', is there a way I can get it to state the actual sequence number and title of the file?
    . The code appears to be incompatible with Internet Explorer and only works in Google Chrome.
    . I don't know how to make it display a hyper to the sound file it's playing.

    Can you help me?
    You've been brilliant so far.
    Last edited by jameswsparker; 11-16-2010 at 01:40 AM. Reason: Ease of understanding

  • #5
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    Hmmm...I really thought that would work with MSIE.

    And it *certainly* should be picking a random file.

    Can you copy/paste the code you are actually using? Might be a typo in it.

    As for the URL: Easy.

    Change the span to a link:
    Code:
    Now playing: <a id="soundName" href="#"></a>
    and change
    Code:
        name.innerHTML = sound;
    to
    Code:
        name.href = "/path/to/sounds/" + sound + ".wav"
        name.innerHTML = sound;
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    Yeah, here's a demo I did a while back.
    http://www.mywhizbang.com/imagemapdemo.html

    Click on one of the two balloons. In MSIE.

    So I dunno what is different about this code.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #7
    Senior Coder
    Join Date
    Jul 2009
    Location
    South Yorkshire, England
    Posts
    2,318
    Thanks
    6
    Thanked 304 Times in 303 Posts
    Quote Originally Posted by jameswsparker View Post
    Using JavaScript, I require a code that allows me to play .wav sound files randomly and automatically on page start-up, I also need them to loop as they are drum beats.

    The plan: to load my web page and hear a random drum beat that loops continuously.
    Some users/visitors are going to hate you with a vengeance if you automatically start any noise playing on page load. Don't do it. If someone wants to listen to anything on your site, allow them to make that choice. Don't force it upon them.

  • #8
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    Oh, sheesh! What a DOOFUS!

    SORRY!

    This line:
    Code:
        var sound = Math.floor( Math.random() * sounds.length );
    should be
    Code:
        var sound = sounds[ Math.floor( Math.random() * sounds.length ) ];
    DOH DOH DOH

    Heck, I don't know how you got any sound AT ALL!
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #9
    New Coder
    Join Date
    Jan 2009
    Location
    Bristol, England
    Posts
    43
    Thanks
    11
    Thanked 0 Times in 0 Posts
    @MattF This is a page for personal use, and not public.

    I am working on a personal project.

  • #10
    New Coder
    Join Date
    Jan 2009
    Location
    Bristol, England
    Posts
    43
    Thanks
    11
    Thanked 0 Times in 0 Posts
    Old Pedant

    Thank you for all your help also, I literally copied the entire code you gave me and saved it as an individual HTML file. I have made NO alternations apart from the file names, and removing the comma as requested.

  • #11
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    Catch up with my posts. I've given you one addendum and one correction now. Have you implemented them?

    But when in doubt, always re-post code. Sometimes a typo slips in from the original poster (and sometime a huge goof slips in...doh).
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #12
    New Coder
    Join Date
    Jan 2009
    Location
    Bristol, England
    Posts
    43
    Thanks
    11
    Thanked 0 Times in 0 Posts
    Hello, I am suffering the following problems:
    . No sound at all in any browser.
    . And once the link is clicked, it says it cannot find FILENAME.wav.wav, it has two .wav file extension tags.

    Haa ha, I'm amazed we got this far!

    My entire code is exactly as follows:

    <html>
    <head>
    <script type="text/javascript">
    function startSound( )
    {
    var sounds = [
    "badrat1.wav", "badrat2.wav", "test.wav"
    ];

    var sound = sounds[ Math.floor( Math.random() * sounds.length ) ];
    var where = document.getElementById("soundHolder");
    var name = document.getElementById("soundName");
    where.innerHTML =
    '<embed src="/loops/' + sound + '.wav" autostart="true" width="0" height="0" '
    + ' repeat="true" loop="true" enablejavascript="false" />';
    name.href = "/loops/" + sound + ".wav"
    name.innerHTML = sound;
    }
    </script>
    </head>
    <body onload="startSound( )">

    <span id="soundHolder" style="visibility: hidden;"></span>

    Now playing: <a id="soundName" href="#"></a>
    </body>
    </html>

  • #13
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    Next time, use [ code ] and [ /code ] around your coding. Or highlight the code in the text window and then click on the # symbol in the icons above the window.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #14
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    Yes, you will note that I *CAREFULLY* omitted the ".wav" from the name of my sound files. I did that on purpose. So I wouldn't have to strip off the ".wav" when displaying the name of the file in the browser.

    I'm looking to see if there's more.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #15
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    I don't see anything else.

    If you want to display "badrat1.wav" instead of just "badrat1" then you can leave the ".wav" on the ends of the file names and just remove that from the coding:
    Code:
    where.innerHTML =
        '<embed src="/loops/' + sound + '" autostart="true" width="0" height="0" '
        + ' repeat="true" loop="true" enablejavascript="false" />';
    name.href = "/loops/" + sound;
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •