// FILE: http://www.cprince.com/courses/cs3121/interaction/animated-cursor/glider-cursor.js

// Downloaded and modified from http://www.stateselectric.com/LS4a/
// Browser cursor trailer script By Brian Caputo (bcaputo@icdc.com)
// See also Dynamicdrive.com

// Requires: <script src="http://www.cprince.com/courses/cs3121/media/JavaScript/utils.js"> </script>
// Call StartGliderCursor() to initiate.

var GIFs=new Array(
		"glider.gif",38,30,
		"cloud.gif",12,16,
		"cloud.gif",10,11,
		"cloud.gif",12,21,
		"cloud.gif",17,19,
		"cloud.gif",16,14)

var numberOfGIFs = parseInt(GIFs.length/3) // ensure we get an integer
// Every 1/10 of a second, the object move operations are carried out.
var rate=100

// dynamically write an IMG tag to the document. These image tags will be referred to as
// trail0 through trail5. The index parameter gives the number appended to "trail"
function createObject(index) {
	var tagID = "trail" + index
	var Xp = index*10 // use the trail number (index) to generate initial position for IMG
	var Yp = index*10
	var imgTag = "<img id='" + tagID + 
			"' src='" + GIFs[index*3] + "' " +
			"style='position:absolute;left:" + Xp + "; top:" + Yp + ";'" +
			"width=" + GIFs[(index*3+1)] + " height=" + GIFs[(index*3+2)] + " border=0>" +
			"</img>"
	document.write(imgTag)
}

// used by moveObject() and mouseMoveHandler()
function moveObjectXY(destObjectIndex, X, Y) {
	var destID = "trail"+destObjectIndex
	var tag = document.getElementById(destID)
	var s = tag['style']
	s.left = X
	s.top = Y
}

// used by cycle()
function moveObject(destObjectIndex, sourceObjectIndex) {
	var sourceID = "trail"+sourceObjectIndex
	var tag = document.getElementById(sourceID)
	var s = tag['style']
	var newX = parseInt(s.left)
	var newY = parseInt(s.top)
	moveObjectXY(destObjectIndex, newX, newY)
}

function cycle(){
	for (var i=0; i < (numberOfGIFs-1); i++){
		// move container i to the position of container i+1
		moveObject(i, i+1)
	}
}

// Every time the mouse moves, we will move the last GIF; This is a cloud.
// event.clientX, event.clientY give the X, Y coords of the event, which in this
// case is the mouse movement.
// We move this last GIF to the position of the cursor.
function mouseMoveHandler(e) {
	e = getEvent(e)
	moveObjectXY(numberOfGIFs-1, e.clientX, e.clientY)
}

function StartGliderCursor() {
	// Generate the IMG tags for the glider (trail0) and clouds (trail1 through trail5)
	for (var i=0; i < numberOfGIFs; i++){
		createObject(i)
	}
	
	document.onmousemove = mouseMoveHandler
	setInterval("cycle()", rate)
}