The Train Gif JavaScript Tutorial

Function Dictionary

Dynamic Element (train) functions

Function: createScene (basic version)
Example: createScene("demo");
Parameters:
  1. name
Description: In it's basic form, this function takes a single parameter, a string representing the function name. This name is used to link the scene object to the scene location. More information on scene location later. Specifying a unique name also allows you to include more than one scene per page.

Function: createScene (advanced version)
Example: createScene("demo", #CCCCCC);
Parameters:
  1. name
  2. background color
Description: This version takes two parameters, the first is the same as the basic form. The second is an HTML standard color definition. The background of the scene will be filled with this color. The background color will cover any background image, if you used locateSceneBG

Function: createConsist
Example: createConsist("MBTAdemo", "MBTAbombcoachright.gif,MBTAbombcoachright.gif,MBTAgp40mcright.gif");
Parameters:
  1. name
  2. image list
Description: Before you can create a train inside your scene, you must define a consist, which is the set of images that will make up the train. The "name" parameter is used to link consists to trains, and should be unique within a scene. The image list must be a comma-delimited list of gifs, without spaces. Each consist can be used several times within a scene.

Function: createTrack (basic version)
Example: createTrack("east", 0, 1);
Parameters:
  1. name
  2. y offset
  3. z level
Description: A track is a logical construct that represents the relative location of a group of trains. The "name" parameter is used primarily for debugging. The y offset defines the distance from the bottom of the scene "container" to the bottom of the "track". A value of 0 means that the track rests on the bottom of the scene. The z level defines which scene elements are drawn on top of others, thus appearing in closer to the viewer.

Function: createTrack (advanced version)
Example: createTrack("east", 0, 1, 8.5);
Parameters:
  1. name
  2. y offset (pixels)
  3. z level
  4. pre-delay
Description: This version adds a pre-delay parameter. This allows you to specify a delay in seconds before the first train enters the scene. Therefore, in scenes with a large number of tracks, you can set a different delay for each track. That way the first train on each track won't enter the scene at the same time.

Function: createTrain (basic version)
Example: createTrain("Commute1", "MBTAdemo", Right, 30, 2);
Parameters:
  1. name
  2. consist
  3. direction
  4. speed
  5. delay
Description: Again, the name parameter is used for debugging messages. The consist parameter must contain the name given in a createConsist call. The direction parameter should contain either the constant "Left" or "Right", and defines the side of the scene toward which the train will travel. Speed is the speed at which the train moves, and the units are miles per hour, at the train Gif scale of 1 pixel = 8.5". Delay is the number of seconds, from when this train exits the scene, until the next one enters.

Function: createTrain (advanced version)
Example: createTrain("Commute2", "MBTAdemo", Right, 30, 2, 15, 2.5);
Parameters:
  1. name
  2. consist
  3. direction
  4. speed
  5. delay
  6. target speed
  7. acceleration
Description: The first five parameters are identical to the basic version of this function, except that the speed parameter should be considered initial speed. The additional parameters allow a train to speed up or slow down as it moves across the screen. Units for acceleration is MPH/sec. The train will start at the initial speed and accelerate (or decelerate) until it reaches the target speed.

A special situation comes if the target speed=0. In that case, the train will decelerate to a stop, pause briefly, then accelerate again at the acceleration rate, until it reaches initial speed. If the initial speed is below 25 MPH, the train will reverse direction after it stops, otherwise it will continue in the same direction.

Static Element Functions

Function: placeStatic
Example: placeStatic("station.gif", 75, 3, Bottom, 2);
Parameters:
  1. file name
  2. x offset
  3. y offset
  4. y mode
  5. z level
Description: This function will take the image in the file name parameter and place it within the scene. The x offset equals the number of pixels from the left edge of the scene to the left edge of the image. The y offset defines the vertical placement of the image within the scene. For descriptions of the last two parameters, see the paragraphs on y mode and z level

Function: placeStaticRepeat
Example: placeStaticRepeat("catenary1.gif", 0, Bottom, 3);
Parameters:
  1. file name
  2. y offset
  3. y mode
  4. z level
Description: Like placeStatic, this function will take an image and put it into your scene. However, instead of putting a single instance of the image at a specific x offset, this function puts multiple copies of the image across the width of the scene. Parameters are the same as placeStatic, except for the absence of an x offset.

Scene Placement Functions

Function: locateScene (basic version)
Example: locateScene("demo1", 25);
Parameters:
  1. name
  2. height
Description: The name parameter must contain the name of a scene defined with createScene. The height parameter defines the height of the scene in pixels. The width of the scene will be equal to the window width.

Function: locateScene (advanced version)
Example: locateScene("demo2", 25, 350);
Parameters:
  1. name
  2. height
  3. width
Description: In this version, the width of the scene is set by the third parameter.

Function: locateSceneBG
Example: locateScene("demo3", "sceneBackground.gif");
Parameters:
  1. name
  2. image name
Description: In this function, the scene dimensions are automatically set to the size of a background image. The specified image is then loaded to form the background of the scene.

Previous * * * * * * * Next