Panel Displays

Home >>> Custom >>> Panel Displays



Introduction


The ParaChat Java Client is capable of displaying GIF and JPEG banners in three areas on the chat panel.

  1. The "Upper Panel" on the top left (325x60 pixels or less)
  2. The "Lower Panel" on the bottom left (500x60 pixels or less)
  3. The "Logo Button" on the bottom right (88x31 pixels or less)

All three ad panels behave identically and are rendered and controlled by the same code.

These buttons are capable of displaying images in the GIF and JPEG format. When creating banner images it is best not to save them as dithered. Dithering might create a blinking effect in the image.

The panels are responsible for retrieving and displaying the image, directing click-through (if running within a browser), and performing a "special effect" when displaying the next image in a rotation. Each image can be displayed for a specified number of seconds and there is some degree of control over how that image should be displayed (e.g. whether or not to cache the image).

The panels are controlled by script files. Each script file is typically one line long (all later lines are currently ignored). The information on the one line gives the chat client the location of the image and the URL to go to upon clicking. The script file can also tell the panel how long to display an image, whether or not to flush the image cache, and what script to display subsequently.

ParaChat first looks for panel scripts specific to the chat room/channel provided in the applet parameters. If a room-specific script is not found, ParaChat looks for the default script.


Serving Images Server-Wide


Individual script files are responsible for calling different images, and for assigning rotation rates, click-through URL, etc. For example, the Lower Panel will first look to the

    "c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\RoomName\start_lp.ups"
file for an image and instructions on what to do with the image. If it doesn't find one, it looks for a default in "c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\default_lp.ups" file for an image and instructions (default_lp.ups stands for default_LowerPanel.ups). The same process exists for each of the 3 banner panels on the ParaChat interface.

To upload images to run in the Lower Panel of every room that you create on the server, follow these steps:

1. Place the image file (i.e. image.gif) you want to run in the Lower Panel (maximum pixel size 500x60) into the following directory:

    c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\images
2. Change the default_lp.ups file to look for this image, and set the instructions. A sample of the default_lp.ups script file might look like this:

    img images\image.gif ct http://www.parachat.com del 4 nxt scripts\demo_lp1.ups
You can break this script into 5 sections, or 5 different instructions:

Step 1. img

The URL of the image to display relative to the applet code base. To start from the server document base, begin the URL with a '\'.

Step 2. images\image.gif

The script file tells the applet to look for "image.gif" in the images directory (or c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\images).

Step 3. ct http://www.parachat.com

ct = click-through. This portion of the script assigns a click-through URL to "image.gif" of http://www.parachat.com

Step 4. del 4

The number of seconds to delay before showing the next image. (see "nxt")

Step 5. nxt scripts\demo_lp1.ups

The URL relative to the applet code base of the next image script. This is where the applet will look for the next script file that has instruction on what image to serve next (if any), click-through URL, rotation rate, etc. Demo_lp1.ups could also be called default_lp2.ups, or whatever name you would like to assign.

After image.gif, with a click-through address of http://www.parachat.com is served in the chat room for 4 seconds, the server will look to the next script file (default_lp2.ups) for the next set of instructions. For example, the default_lp2.ups script file might look like this:

    img images\image2.gif ct http://www.parachat.com/free del 4 nxt scripts\default_lp.ups
Now, the applet will search for the next image, image2.gif, with a click-through URL of http://www.parachat.com/free, which will be served for 4 seconds before going to the next script file, if there is one. The sample above points to the original script file. In this example, we have rotated 2 images (image.gif and image2.gif) each for 4 seconds, each with different URLs. If you have only one image to serve, you would simple remove this part of the script:
    nxt scripts\default_lp.ups

    ...since there is no next image.


Uploading Images to Individual Rooms


Log into the ParaChat Server Administration Pages using your server or room admin name and password. At the Main Menu, edit the ParaChat room name where you want to upload images. At the "Room Parameters" page, scroll down to the Upper Panel Graphic section. You may upload images to the ParaChat room's Upper Ad Panel (325x60 pixels or less). Input a valid image URL into the Image URL field, and an accompanying click-through URL for the image, and click the Update Panel Image button. ParaChat Server will download the image file and save it to the appropriate directory (c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\). Repeat the process to upload images to the Lower Ad Panel (500x60 pixels or less).


Panel Script Files


A panel script file consists of a single line comprised of key-value pairs separated by spaces. The only required key is ‘img.’

  Key  

Meaning

img

The URL of the image to display relative to the applet code base. To start from the server document base, begin the URL with a ‘/’ just as in an HTML document.

There are also several optional key words that you can use to control the behavior of the panels.

  Key  
Meaning

ct

The URL to click through to. (i.e. display upon clicking)

del

The number of seconds to delay before showing the next image. (see "nxt")

nxt

The URL relative to the applet code base of the next image script.

fl

Set to TRUE to flush the image before displaying and to force a new image download. Normally, images are cached.

ani

Set to TRUE if this is a multi-frame image you want displayed as a multi frame image. Normally, only the first frame is displayed. Note that the only browser that can display multi-frame images is Netscape 4.x and that image quality is poor.

trn

The image transition used to go to the next panel. Choose tear, column or fade or create your own using Java classes (see below).

msg

Text message to appear when user clicks a panel.
Example: img images/banner.gif msg "Thank you for visiting our sponsor." ct http://banner.advertiser.com

For most non-rotation applications, the script file is a single line:
img url-of-the-image-relative-to-applet-codebase ct url-to-click-thru-to

For rotating banner displays, add the del and nxt parameters on the same line (after the img and ct pairs) as follows:
del seconds-to-delay-before-showing-next nxt next-display-script

Note that the nxt and img urls are relative to the applet code base and are treated as if they were embedded in an HTML file in the applet codebase directory. If the webserver document base is in a directory called serverdocbase, and the applet codebase is in serverdocbase/pchat/classes and the image you want to display is called "banner01.gif" in the same classes directory, you would use "banner01.gif" as the relative URL. If instead, the banner is in serverdocbase/pchat/images directory, you need to specify the URL as "/pchat/images.banner01.gif"

You may need to contact your webserver administrator to determine the document base.


Search Order for Panel Script Files


When the applet is started, it runs the panel display managers as separate, lower-priority background threads (one thread per panel). The panels search for a script file to run relative to the ParaChat client applet code base.

The logo button looks for a script in a file called "scripts/button1.btn". The Upper Panel looks for a script in a file called "scripts/RoomName/start_up.ups." If it doesn’t find one, it looks for a default in "scripts/default_up.ups."

The Lower Panel looks for a script in a file called "scripts/RoomName/start_lp.ups." If it doesn’t find one, it looks for a default in "scripts/default_lp.ups".

For Lower and Upper Panels, RoomName is the name of the room that is passed to the applet as a parameter (called Channel). If the room name begins with #, the # sign is removed before looking for the script file.



Examples


Simple Example, no rotation

  • There is a button called b.gif and upper and lower gifs called u.gif and l.gif respectively.
  • The GIFs should be displayed in a room called #dogs.
  • The button should click through to http://www.mysponsor.com and the bottom URL to http://banner.advertiser.com.
  • The top panel should not be clickable at all.
  • There is a subdirectory of the classes directory called "images" that contain these three image files.

c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\button1.btn
    img images/b.gif ct http://www.mysponsor.com
c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\dogs\start_up.ups
    img images/u.gif
c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\dogs\start_lp.ups
    img images/l.gif ct http://banner.advertiser.com
Example using a 3-ad rotation

The name of the room is #Computers.
All rooms should display a default lower banner ad that rotates between three different images.
Each room should display its own top panel gif (located in a file called images/Computers.gif which is a subdirectory of the applet code base).
No logo button will be displayed.
There is no file called scripts/button1.btn.

To establish the top panel, create a directory called Computers in the scripts directory, and place in it the following file:

c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\Computers\start_up.ups
    img images/Computers.gif

 

Image

Click Thru URL

Display Time

Transition Effect

ad 1

images/ad1.gif

http://www.ad1.com

60 sec

Tear

ad 2

images/ad2.gif

http://www.ad2.com

60 sec

Column

ad 3

images/ad3.gif

http://www.ad3.com

30 sec

Fade

Create a file for each ad.

  1. default_lp.ups (for the first, default, ad)
  2. ad2.ups (for the second ad)
  3. ad3.ups (for the third ad)
c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\default_lp.ups
    img images/ad1.gif ct http://www.ad1.com del 60 nxt scripts/ad2.ups trn Tear
c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\ad2.ups
    img images/ad2.gif ct http://www.ad2.com del 30 nxt scripts/ad3.ups trn Column
c:\Program Files\ParaChat\ParaChat570\httpd\pchat\classes\scripts\ad3.ups
    img images/ad3.gif ct http://www.ad3.com del 30 nxt scripts/default_lp.ups trn Fade

Customizing Image Panels Using Your Browser


You can update the images and click-through locations for your image panels using the ParaChat Admin Pages for the upper and lower Panels.

  • The "Upper Panel" on the top left
  • The "Lower Panel" on the bottom left

Banner sizes:

    Upper Panel size: up to 325x60
    Lower Panel size: up to 500x60
    Logo Button size: up to 88x31
    Size Limit: under 15k


    Step 1.   Log into your ParaChat v5.7 Admin Pages.

    Step 2.   From the Groups settings page, select the room where want to edit the image panels, and click the 'Edit' button.

    Step 3.   You will be brought to a page that contains your room settings. To enter the image panel area, click on the 'Edit Ad Banner Panels' button. You will be brought to the Image Panel customization page.

    Step 4.   In the 'Image URL' field enter the URL of the image you wish to upload.

      Image URL Sample Format:  http://www.your_domain.com/images/logo.gif

    Step 5.   In the 'Click-Thru URL' field, enter the URL of the destination webpage for that image.

      Click-Through URL Sample Format:  http://www.your_domain.com

    Step 6.   Click on 'Update Panel Image', and your new image gets uploaded.

    Step 7.   Repeat Steps 4 and 5 to update the other banner image.

    Step 8.   Exit and navigate to the page which contains your chat room so you can see the banners in action.

    Remember to always refresh or exit/restart the browser after a banner change so you do not get a cached version and you are able to see the change!
©1996 - 2006   M Square, Inc. |  Privacy Policy