First you'll insert some stuff into the HTML page where
you want this application to appear. Then you'll have
to copy over two .class files and a special menu.gif image.
Some of this horrible goo is needed because Netscape appears to be very
restrictive in what files can be read from where. If you can figure out
a better way, please let me know.
Here's a step by step description of what you need to do:
1. Read all the directions before you start.
2. Put the image you want to use as a source for colors in the
file "mypicture.gif" in your paint directory.
Make sure your image does not use transparency as these images
may not appear correctly in some JAVA browsers. Also, try to
make your source image as small as possible, so it will download
fast. Sometimes using fewer colors can actually make nicer paintings!
The resolution of the source image can be fairly low
and everything will work fine - most of my source images
are about 350 pixels across, and use 64 colors.
You can provide a JPEG image instead of a GIF image if you like. Make sure the name of the image ends in ".jpg" or ".jpeg".
3. Create an HTML page in the paint directory. Include the following segment of HTML code:
<applet code="Impression.class"
width=400 height=430>
<param name="source" value="mypicture.gif">
<blockquote>
Sorry! This application will only appear in browsers
that support JAVA!<br>Get the new version of
Netscape 2.0b3 when you can!
</blockquote>
</applet>
<br>
<br>
<a href="http://reality.sgi.com/grafica/impression/imphelp.html">
<font size="1">H E L P</font></a><br>
<br>
Specify the size of the painting window with the width
and height tags. The size of the painting window can
be larger or smaller than the source image you provide. The actual
height of the painting area will be 30 pixels less than the given
height, since a menu is drawn at the bottom of the window.
Be careful not to make the width less than 295 pixels, otherwise your users won't be able to change the brush shape.
More information on the applet tag shown above is available.
4. It you can read UNIX tar files, you can just download
this file, which
contains the two .class files and the gif image,
and put the three files into your paint directory.
Otherwise you'll have to try the following.
Below is the menu image. Press the right mouse button over it and use
the "Save this Image as..." selection on the menu to save it to a file
called menu.gif in your paint directory. You can also click on
this image and save it to menu.gif from your image viewer - it's your
choice.
And here are links to the two JAVA .class files. Click on each one of
these links, and then use the "File" menu on Netscape to select "Save As...".
Save them as Impression.class and MemoryImage.class in
the same directory as mypicture.gif
and menu.gif.
Impression.class
MemoryImage.class
Check the sizes of the .class files after transfer.
Impression.class
should have exactly 6575 bytes.
MemoryImage.class
should have exactly 1524 bytes.
5. Now try viewing your .html page by giving Netscape a URL that starts
with http: If it doesn't work, make darn sure that
Impression.class, MemoryImage.class, menu.gif, mypicture.gif,
and your .html file are all in the same directory.
Ok, That's it. If you get this working, and want to share a link to your page, email me a note, and perhaps I'll put up a list of user links!
NOTE 1: The best source images for this kind of painting technique have good composition and a simple structure. Try to use this on different types of images and see what works and what doesn't work!
NOTE 2: If you want additional control over the appearance of
this application on your
pages here are some additional tags you should know about.
You can set the RGB color of the initial canvas, the border
and the text, using these tags right after the
<param name="source" value="mypicture.gif">
tag shown above.
<param name="canvascolor" value="ffffff"> <param name="bordercolor" value="000000"> <param name="textcolor" value="008000">
These tags set the initial canvas color to white, the border color to black and the text color to green.
Good luck!