How to easily compile a Java midi/wav Jukebox Applet - Jan. 2002

 

Credit: I just want to thank to all the helpful and hardworking guys & girls on the net for all the tips, for all the freewares, sharewares, and FAQs. At least/last there are still a lot good peoples among us :-). This documentation and the java code is dedicated for those. I wrote a little nice code supporting for playing the midi/wav files directly on your website. I am not a Java applet coder or a hard coder. I coder Java only when I am hungry :-).

No more talk, let me try it! yes Ma'am: Try the Java Jukebox live

Good, I want to download it: Download Java Jukebox

The following concentrates only for the Java and internet issues.

  1. How to compile my own Java Applet Jukebox? (for rookie)
  2. The PC locks everytime I visit one particular website. (using Internet explorer 5)

 

How to compile my own Java Applet Jukebox?

The following helps you to design a new layout and show you how Java works.

  1. To compile a java or java applet (applet is used by the browser) code you need to have a compile. It can be found in the Sun Java Developers Kit (JDK), which can be download from Sun’s website http://java.sun.com/products/jdk/1.2/ (20Mbytes). (OK you can use JDK1.3 too; Mar. 2002).
    The JDK is included the JRE, which used for running the applet on your browser.
  2. After installing the JDK, create a directory for example c:\java_code for your code.
  3. Activate a dos prompt (type: command at the Start/run), type the following two lines in the dos window. (hint: use copy/paste in dos window)

  4. SET PATH="%PATH%";G:\jdk122\bin
    SET CLASSPATH=G:\jdk122\lib

    Change g:\jdk122 with the path you use for installing at step 2 above. If you use spaces in your path you need to use the "" for the set commands. The set commands tell the system where the execute files are and the path for the prewritten java libraries.


    Figure 1: compile java at the dos prompt

  5. Now you need to have a code to compile. Copy the following code in notepad, save it as soundmidi.java . The code must have this name, since the name is defined as the class in the applet.
  6. soundmidi.java :

    //by Tuan Nguyen 2002 Denmark JDK


    import java.awt.*;
    import java.awt.event.*;
    import java.applet.*;
    public class soundmidi extends Applet {
    //declaring the buttons to control the audio
    Button button1;
    Button button2;
    Button button3;
    Button button4;
    Button button5;
    Button button6;
    Button stopButton;
    //declaring the audio clip
    AudioClip clip1;
    AudioClip clip2;
    AudioClip clip3;
    AudioClip clip4;
    AudioClip clip5;
    AudioClip clip6;
    AudioClip clip7;
    //declaring the background
    Image backg;
    public void init()
    {
    //set layout, using aliases c and gridbag
    GridBagConstraints c = new GridBagConstraints();
    GridBagLayout gridbag = new GridBagLayout();
    setLayout(gridbag);
    //set font
    Font font = new Font("TimesRoman", Font.BOLD, 11);
    setFont(font);
    //initializing the Buttons
    button1=new Button("Song 1");
    button2=new Button("Song 2");
    button3=new Button("Song 3");
    button4=new Button("Song 4");
    button5=new Button("Song 5");
    button6=new Button("Song 6");
    stopButton=new Button("STOP");
    //adding ActionListeners to the Buttons
    button1.addActionListener(new ButtonResponser());
    button2.addActionListener(new ButtonResponser());
    button3.addActionListener(new ButtonResponser());
    button4.addActionListener(new ButtonResponser());
    button5.addActionListener(new ButtonResponser());
    button6.addActionListener(new ButtonResponser());
    stopButton.addActionListener(new ButtonResponser());

    /*Adding the Buttons to the Applet. There will be 3 rows, the first 2 rows with 3 buttons each. The last row has only one button, which fills 3 times at the other buttons.

    Using GridBagConstraints together with GridBagLayout to manipulate the layout of the buttons on the applet-area. I could not move all the buttons to a predefine position (it might not be impossible at the moment in JDK1.2.2?). Read the GridBagLayout help for more information (jar xvf src.jar)

    There are 2 lines define for button3, "c.gridwidth = GridBagConstraints.REMAINDER" is a rule, which will place button3 as the last button in a row. "gridbag.setConstraints(button3, c)" tells Java that you want to implement that rule for button3.

    Button1 and button2 do not need any definitions since GridBagLayout will always place them in the center. Remember that constraint ("c.gridwidth = GridBagConstraints.REMAINDER") will also be valid for the other buttons (4,5,6,stopButton).

    One the next row, you need to go back where button1 is. The "c.gridwidth = 1" does it. This must implement to button4,5,6. Button6 is the last button in row2, therefore the constraint REMAINDER.

    The last row is the stopButton, I want to fill it out so it lays just below the previous two rows. As you see the c.fill is the syntax.

    I hope it will help you to place new buttons on your applet. I must confess that all the constraint options do not work the way I (used to) expect.

    */


    add(button1);
    add(button2);
    c.gridwidth = GridBagConstraints.REMAINDER;
    gridbag.setConstraints(button3, c);
    add(button3);
    //reset c.gridwidth
    c.gridwidth = 1;
    gridbag.setConstraints(button4, c);
    add(button4);
    gridbag.setConstraints(button5, c);
    add(button5);
    c.gridwidth = GridBagConstraints.REMAINDER;
    gridbag.setConstraints(button6, c);
    add(button6);
    c.fill = GridBagConstraints.BOTH;
    gridbag.setConstraints(stopButton, c);
    add(stopButton);
    /*
    initializing the audio clip, big advantage to use the variable (it then preloads the midi files into memory). The start/stop will be very fast, ok the startup is slow.
    */

    clip7=getAudioClip(getCodeBase(),"m7.mid");
    //play clip7 in the background, in the meantime load the other
    clip7.play();
    clip1=getAudioClip(getCodeBase(),"m1.mid");
    clip2=getAudioClip(getCodeBase(),"m2.mid");
    clip3=getAudioClip(getCodeBase(),"m3.mid");
    clip4=getAudioClip(getCodeBase(),"m4.mid");
    clip5=getAudioClip(getCodeBase(),"m5.mid");
    clip6=getAudioClip(getCodeBase(),"m6.mid");
    //declaring the background, you can replace it with your own
    backg=getImage(getCodeBase(), "jukebox.jpg");
    }
    //stop all the song, before starting a new one. Avoid the "composite" sound.
    public void stop_all()
    {
    clip1.stop();
    clip2.stop();
    clip3.stop();
    clip4.stop();
    clip5.stop();
    clip6.stop();
    clip7.stop();
    }
    public void destroy()
    {
    stop_all();
    }
    //The ButtonResponser handles the events generated through the Buttons
    class ButtonResponser implements ActionListener
    {
    public void actionPerformed(ActionEvent e)
    {
    String action=e.getActionCommand();
    if(action.equals("Song 1"))
    { stop_all();
    clip1.play();}
    else if(action.equals("Song 2"))
    { stop_all();
    clip2.play();}
    else if(action.equals("Song 3"))
    { stop_all();
    clip3.play();}
    else if(action.equals("Song 4"))
    { stop_all();
    clip4.play();}
    else if(action.equals("Song 5"))
    { stop_all();
    clip5.play();}
    else if(action.equals("Song 6"))
    { stop_all();
    clip6.play();}
    else if(action.equals("STOP"))
    stop_all();
    }
    }//end of ButtonResponder Class
    public void paint(Graphics g)
    {
    int width = backg.getWidth(this);
    int height = backg.getHeight(this);
    g.drawImage(backg, 0, 0, width, height, this);
    }
    }//end of audioApplet class
     

    This code uses seven midi files and one jpg file for the background (m7.mid is for the waiting/loading background music). You can change the midi/jpg file if you like.

    To easy some troublesome I use the name m1-m7 in the code for midi files (for wav file: you need to change the extension in the code (.wav in steady of .mid), be aware that wav files use a lot of your bandwidth).

    NB: the more midi files you want to add, the longer time the user need to wait before the applet is ready (it loads the midi files into memory). By loading the files into the memory I can achieved some "user friendly" for the Jukebox during stop/play session.

    The interface AudioClip does NOT automatically stop a progress song before it plays a next one (otherwise the sound will mixed together to produce a composite). To make sure all the sound is "dead", I need to stop each of them (because I did not know which song was playing just before you choose the next one), one after one. It is quite time consume, for 6 midis (it tooks about 20-30 seconds on the local PC).

    If you can find a way to "reset" the sound interface fast (please mail it to me), then you do not need to initial the clip, use "getAudioClip(getCodeBase(),"m1.mid").play();" in the actionPerformed function in steady of stop_all() and clipX.play()

    Now it is time to compile the code, type again in the dos window :
    javac soundmidi.java

    If it successes there will be no errors/warning on the screen. Javac is the java compiler, it creates two class files. (hint: use –verbose to see what is going behind)

    Javac creates the bytecode (the class files) which is platform independent. The Java virtual machine, which used by your browser, interprets those bytecode to the final bytecode suitable for your operative system. Meaning you can use the created class files in Unix system too.

  7. You can now test it by making a html file, copy the following in a file called jukebox.htm

jukebox.htm:


<HTML>
<BODY>
<OBJECT classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93"
width="505" height="105"
codebase=""http://java.sun.com/products/plugin/1.3/jinstall-13-win32.cab#version1,3,0,0">
<PARAM NAME="code" VALUE="soundmidi.class">
<PARAM NAME="type" VALUE="application/x-java-applet;version=1.3">
<COMMENT>
<EMBED type="application/x-java-applet;version=1.3" width="505"
height="105" code="soundmidi.class"
pluginspage="http://java.sun.com/products/plugin/1.3/plugin-install.html">
</COMMENT>
</EMBED>
</OBJECT>
</BODY>
</HTML>

I use JRE1.3 (remember the difference between JRE and JDK) and there are no nowadays browsers supports the JRE1.3 rendering yet, so I need to install the JRE1.3 plugin inside the user browser. It can be done by <OBJECT> tag for IE5 and <EMBED> tag for Netscape. The codebase/pluginspage takes care for download the plugin for the user browser. Adjust the width and height if you want to have another applet-area.

Turn on your speaker and enter the following at the dos prompt:
appletviewer jukebox.htm


Figure 2: test the applet in the dos window

Click the buttons in the center to hear the song, the other buttons is only for "decoration". Of course you can also test it by using your internet browser. Just activate the htm file.

Voilà

Hints: a good idea to see the different classes (and get to know the parameters for each class) is to unzip the src.jar file. Extract it by enter: jar xvf src.jar (just like Unix tar). The jar command is in the bin directory.

Joseph Weber’s "Special Edition Using Java, 2nd Edition" (a good book) can be found free on the net. Use http://www.google.com to localize it.

 

The PC locks everytime I visit one particular website. (IE5)

My IE5 could not handle this site http://www.iapso.org, but the Opera is OK.

It happens only for IE5. It will not help to reinstall IE5. You need to activate the "Get the ActiveX object". Open the browser preferences/security/use define. It can be a security leak so remember to flag it off afterwards. Another resolution is to use Netscape or Opera as your second browser.

 

 

------THE END Tuan Nguyen tng@ofir.dk