?
Solved

Play different sound files sequential / in a row

Posted on 2004-08-14
23
Medium Priority
?
754 Views
Last Modified: 2012-06-27
Hey there!
I want to play different audiofiles (all waves / wav) on my webpage.
All the files are on http://www.somepage.com/somedirectory/
The amount of files, their name and their length is variable, meaning it changes whenever the user access the page.
I need the files to be played right after each other, through javascript or embedded objects.
Thanks a lot,
Consti
0
Comment
Question by:Consti
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 7
  • 7
  • 7
  • +1
23 Comments
 
LVL 1

Expert Comment

by:rockportmedia
ID: 11800547
Consti,

The one word answer is: FLASH (or SWISH).

Here's how: (If you mean just play a bunch of different files the same way every time somone accesses the page).
Make a FLASH movie 1x1 (1 = pixel).
Make the movie the necessary length to allow for sequencing.
Trigger the sound at the desired time within the time legend.

example flash layout
MOVIE START |  |  |  |  |  |  |  |  |  |  |  |O|  |  |  |  |  |  |  |  |  |  | X | MOVIE END

The movies starts far to the left of the time line. Then "O" represents where the sound starts playing in time. Then "X" is the "stop action" you add to the movie so that the sound does not repeat over and over again.

You can map multiple files out or make just one.

MORE THAN ONE SOUND IN ONE MOVIE
example flash layout
MOVIE START |  |  |  |O|  |  |  |  |  |  |  |X|O  |  |  |  |  |  |  |  |  |  | X | MOVIE END

TWO MOVIES
MOVIE START |  |  |  |O|  |  |  |  |  |  |  |X|  |  |  |  |  |  |  |  |  |  |  | MOVIE END
MOVIE START |  |  |  |  |  |  |  |  |  |  |  |  | O |  |  |  |  |  |  |  |  |  | X | MOVIE END

Here's how: (If you wish to play sounds randomly on entrance or refresh to your site.)
1. Go to you prefered web search engine (google.com if you don't have one yet).
2. Type in "Random Sounds Script"
3. Implement the script on your page using the script writer's instructions.

Basicially you'd be looking for a javascript. When searching, remember there is a big difference between Java and javascript. JAVA would be overkill by far in this scenario.
0
 

Author Comment

by:Consti
ID: 11800714
I think you got the question wrong.
I have several aduio files (all wav) which need to be played in a row.
Not random, but in a row :P right after each other with no pause if possible.
As if you would load a certain generated playlist... some how like this:

$tracks[] = "http://www.server.com/file1.wav";
$tracks[] = "http://www.server.com/file2.wav";
$tracks[] = "http://www.server.com/file3.wav";
$tracks[] = "http://www.server.com/file4.wav";

while ($i < count($tracks){
PLAY $tracks[$i]; // if $tracks[$i] has been played, continue
$i++;
}

Thats what I need! ;P
0
 
LVL 1

Expert Comment

by:rockportmedia
ID: 11800756
Conti,

The Flash Example, the javascript or merging the files together in a program (goldwave) would all work for what your trying to do. The only addition to this post is the merging of the files into one.

JD
0
WordPress Tutorial 2: Terminology

An important part of learning any new piece of software is understanding the terminology it uses. Thankfully WordPress uses fairly simple names for everything that make it easy to start using the software.

 
LVL 13

Expert Comment

by:davidlars99
ID: 11801999
hi,
here you go.... add as many <OBJECTS> as you wish and do not forget to chabge ID sequentually like ID="snd1" ID="snd2" ID="snd3" ID="snd" and ect. also <param name="FileName"  value="file3.mp3"> which is sound file. in this example sounds repeat in sequence after one another they never stop.

AUDIO WILL NOT START UNTIL IT'S LOADED OR ANOTHER AUDIO FILE IS PLAYING!


<html>
<head>

<script language=Javascript>

var current=1,tmr=null;

function Load_(){

   if(document.getElementById("snd"+current).ReadyState==4)  
        current++;  
   if(current==4){
        current=1;      
        document.getElementById("snd"+current).play();
        setTimeout('Play_()',10)
        return
   }
   setTimeout('Load_()',10);
}

function Play_(){

   if(current==4){
         current=1;
         Load_();
         return
   }  
   if(document.getElementById("snd"+current).PlayState==0){
         current++;  
         if(current==4){
               current=1;
               Load_();
               return
         }    
         document.getElementById("snd"+current).play();          
   }
   setTimeout('Play_()', 10)
}
</script>

</head>
<body topmargin="5" leftmargin="5" rightmargin="5" bottommargin="5" onload="Load_()">

<object ID="snd1" WIDTH=300 HEIGHT=26 CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" style="display:none">
   <param name="FileName"  value="file1.mp3">
   <param name="AutoStart"                 value="false">
   <param name="SendPlayStateChangeEvents" value="true">
   <param name="ShowAudioControls"         value="false">
   <param name="ShowTracker"               value="false">
   <param name="AutoSize"                  value="false">
   <param name="volume"                    value="0">
   <param name="loop"                      value="false">
   <param name="hidden"                    value="true">
</object>

<object ID="snd2" WIDTH=300 HEIGHT=26 CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" style="display:none">
   <param name="FileName"  value="file2.mp3">
   <param name="AutoStart"                 value="false">
   <param name="SendPlayStateChangeEvents" value="true">
   <param name="ShowAudioControls"         value="false">
   <param name="ShowTracker"               value="false">
   <param name="AutoSize"                  value="false">
   <param name="volume"                    value="0">
   <param name="loop"                      value="false">
   <param name="hidden"                    value="true">
</object>

<object ID="snd3" WIDTH=300 HEIGHT=26 CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" style="display:none">
   <param name="FileName"  value="file3.mp3">
   <param name="AutoStart"                 value="false">
   <param name="SendPlayStateChangeEvents" value="true">
   <param name="ShowAudioControls"         value="false">
   <param name="ShowTracker"               value="false">
   <param name="AutoSize"                  value="false">
   <param name="volume"                    value="0">
   <param name="loop"                      value="false">
   <param name="hidden"                    value="true">
</object>

</body>
</html>

cheers!
 dave
0
 
LVL 13

Expert Comment

by:davidlars99
ID: 11802048
I'm not sure, but there should be something else much better then this example without javascript, does CSS have something to replace this horrible javascrtip code? if I was inventing CSS I would do some kind of trick which playied all audios sequentially. Imagene css code like this:

#audio1 #audio2 #audio3 {
   
    play-mode:sequent;   // well you guess...
    play-brake:100;         // this would be brake between files

}

and many more, but well... it's only my dream...

0
 
LVL 10

Assisted Solution

by:avidya
avidya earned 450 total points
ID: 11803751
hi,

try this, but be sure to first edit the targets to existing files!
It will freeze up if you don't.

============

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html xmlns:t ="urn:schemas-microsoft-com:time">
<head>
<title>Timed Hyperlink Sample 3</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
 .time, t\:* { behavior:url(#default#time2); }
</style>
</head>
<body>
<t:seq repeatCount = "indefinite">
 <t:audio src = "audio/online.wav"></t:audio>
 <t:audio src = "audio/SOPHIETJE.mp3"></t:audio>
</t:seq>
</body>
</HTML>
0
 
LVL 13

Expert Comment

by:davidlars99
ID: 11804027


yeah that's great... good job avidya here I found some good examples of this at

www.w3schools.com
www.w3.org/TR/1998/REC-smil-19980615/

I could not find anything about its compatilbility with all major browser, do you know anything about it....?
0
 

Author Comment

by:Consti
ID: 11804054
Thanks, I will test the actual given answers and give out the points as soon as I figure out what works best etc.
Consti
0
 
LVL 10

Expert Comment

by:avidya
ID: 11804066
yep, it's compatile with SMIL 20, wich is compatible the most common browesers and apps, see http://www.w3.org/AudioVideo/ for more detailed info.

Consti, did you give it a try allready?

0
 

Author Comment

by:Consti
ID: 11804087
avidya, I tryed yours and it worked fine in IE 6.0 (as soon as you allow the page to run the scripts);
On Firefox (Mozilla.org/firefox) I was not able to get wanted outcome, no sound was played, no error message shown.
How could you modify the script to run in Firefox, and how may you play the audio files ONCE, and not in a loop?

davidlars99, I am sorry but I was not able to get your script to work, neither in IE nor in Firefox.

I apprechiate all your help,
Thanks,
Consti
0
 

Author Comment

by:Consti
ID: 11804115
Sorry, I did figure out how to play it only once:

<t:seq repeatCount = "indefinite">
--->
<t:seq repeatCount = "0">

Should have had a look on it before asking :)
Sorry, and thank you,
Consti
0
 
LVL 10

Expert Comment

by:avidya
ID: 11804127
doesn't matter.

I'm looking for the compatiblity of firefox now
0
 

Author Comment

by:Consti
ID: 11804218
Best solution would be embedded objects (as <embed src="audiofile.wav" name="audio1" visible="true">)
where the visitor could see the single files and a javascript should play them after each other; such as:

if (audio1 == played)
document.audio2.play();

etc.
Is this possible?
Thanks,
Consti
0
 
LVL 10

Expert Comment

by:avidya
ID: 11804565
Hi,

Been searching all afternoon and could'nt find an answer that will work in all browsertypes.
Can you tell me what you are trying to accomplish fo the visitor?
Maybe I get another idea that way.
BtW, why are you using the wav format, since it is a verry large format?
0
 

Author Comment

by:Consti
ID: 11805243
Thanks for doing that!
I am not able to change the format (I wish I was able to! ;P)
On my page (www.consti.de) visitors can click on a link under each of my posts to listen to it, being read TTS (Text to Speech). The text, the visitor wants to listen to, is send to another webpage, this page creates the wave files with the text. The page can only create tts-files with a text less then 200 characters.
Thats why I split the text into packages á 200 characters.
Now the page (PHP code) sends all those packages to the other webpage, retrieves the links to the wav files and starts loading them: Right now as single embedded objects, meaning the user has to click to play package one, package two etc.
I want this package one, two, three - clickthrough to be automatic.
Meaning the loaded audiofiles (wave) should be played after each other, for the visitors convinience
Consti
0
 
LVL 10

Accepted Solution

by:
avidya earned 450 total points
ID: 11805434
maybe this is an option, it doesn't cost much and it speaks german and English:
http://www.readplease.com/english/order/#att

here's a working demo, which does more then 200 characters



<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
<h2>Interactive Multi-Lingual Demo</h2>
<form method="post" name="demoForm" accept-charset="iso-8859-1" action="http://hegel.research.att.com/tts/cgi-bin/nph-talk">
<!-- ACTION="http://morrissey.naturalvoices.com/tts/cgi-bin/nph-talk" -->
<b>Text</b>: &nbsp; (Enter text, choose a voice, then click the "Speak" button.)
<textarea name="txt" rows="10" cols="60"></textarea>
<br /><br />

 <b>Voice</b>:
 <select name="voice" size="1">
 <option value="crystal">Crystal ... US English</option>
 <option value="mike">Mike ...... US English</option>
 <option value="rich">Rich ...... US English</option>
 <option value="lauren">Lauren .... US English</option>
 <option value="claire">Claire .... US English</option>
 <option value="rosa">Rosa ...... Latin Am. Spanish</option>
 <option value="klara">Klara ..... German</option>
 <option value="reiner">Reiner .... German</option>
 <option value="alain">Alain ..... French</option>
 <option value="juliette">Juliette .. French</option>
 <option value="charles">Charles ... UK English</option>
 <option value="audrey">Audrey .... UK English</option>
 </select>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 <input type="submit" name="speakButton" value="Speak">
</BODY>
</HTML>


0
 
LVL 13

Expert Comment

by:davidlars99
ID: 11806994
hi everybody, it sems weird to because on my PC this code works in all browsers..

try this: just replace the bottom section of the code I posted earlier

<object ID="snd1" CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95">
   <param name="FileName"  value="http://www.readplease.com/common/sounds/crystal.mp3">
   <param name="AutoStart"                 value="false">
   <param name="SendPlayStateChangeEvents" value="true">
   <param name="ShowAudioControls"         value="false">
   <param name="ShowTracker"               value="false">
   <param name="AutoSize"                  value="false">
   <param name="volume"                    value="0">
   <param name="loop"                      value="false">
   <param name="hidden"                    value="true">
</object>

<object ID="snd2" CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95">
   <param name="FileName"  value="http://www.readplease.com/common/sounds/julia.mp3">
   <param name="AutoStart"                 value="false">
   <param name="SendPlayStateChangeEvents" value="true">
   <param name="ShowAudioControls"         value="false">
   <param name="ShowTracker"               value="false">
   <param name="AutoSize"                  value="false">
   <param name="volume"                    value="0">
   <param name="loop"                      value="false">
   <param name="hidden"                    value="true">
</object>

<object ID="snd3" CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95">
   <param name="FileName"  value="http://www.readplease.com/common/sounds/lauren.mp3">
   <param name="AutoStart"                 value="false">
   <param name="SendPlayStateChangeEvents" value="true">
   <param name="ShowAudioControls"         value="false">
   <param name="ShowTracker"               value="false">
   <param name="AutoSize"                  value="false">
   <param name="volume"                    value="0">
   <param name="loop"                      value="false">
   <param name="hidden"                    value="true">
</object>
0
 
LVL 10

Expert Comment

by:avidya
ID: 12116234
Hi,

Would you be so kind respond to the suggestions?
0
 
LVL 13

Expert Comment

by:davidlars99
ID: 12119154
good job avidya, looks like you're doing inspection over everything today... :)
0
 
LVL 10

Expert Comment

by:avidya
ID: 12124578

Hi Davidlars,

Thaanks, I saw the ammount of open questions I participated in and got lost, there wher just too manny....
I thought, why not ask nicely... and I did... for 80 question or so....
So far it's working!
0
 

Author Comment

by:Consti
ID: 12147362
Excuse my late answer (been busy lately, evolved to Gentoo (out of Microsoft!));
Thanks for all your help!
I accept DavidLars99's answer as the correct answer; allthough I was looking for a all browser compatible solution.
50 Points go to avidya because of his IE compatible way.
Thanks to all of you who read and commented this post.
Hope to meet all of you here again sometime!
Consti
0
 
LVL 13

Expert Comment

by:davidlars99
ID: 12147490
> I accept DavidLars99's answer as the correct answer; allthough I was looking for a all browser compatible solution.

if you add <embed> tag it will be all browser compatible solution

BTW, did you accept my comment as a solutions or Avidia's...?
0

Featured Post

WordPress Tutorial 2: Terminology

An important part of learning any new piece of software is understanding the terminology it uses. Thankfully WordPress uses fairly simple names for everything that make it easy to start using the software.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

An enjoyable and seamless user experience can go a long way on an eCommerce site. While a cohesive layout and engaging copy play roles in creating a positive user experience, some sites neglect aspects that seem marginal but in actuality prove very …
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
This tutorial walks through the best practices in adding a local business to Google Maps including how to properly search for duplicates, marker placement, and inputing business details. Login to your Google Account, then search for "Google Mapmaker…
This video teaches users how to migrate an existing Wordpress website to a new domain.
Suggested Courses

777 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question