// JavaScript Document
var StartX = 350; // from left
var StartY = -55; // from top
var MaxTravelX = 190; // pixels from start point
var MaxTravelY = 20;

var RateOfChangeX = 1;
var RateOfChangeY = 0.5;

var aniBallonInterval = 0;
var CurrentX = 0;
var CurrentY = 0;
var TargetX = 0;
var TargetY = 0;
var AddOrSubX = true;
var AddOrSubY = true;

// var count = 0;

function animateBalloon() {
	/*
	if (count > 1000) {
		clearInterval(aniBallonInterval);
	}
	Math.abs(x) // returns absoluet num
	Math.random() // rand num between 0 and 1
	*/
	
	// X axis
	var numMaxX = Math.max(StartX,CurrentX);
	var numMinX = Math.min(StartX,CurrentX);
	
	if ((numMaxX - numMinX) > MaxTravelX) {
		// swap direction
		if (AddOrSubX) {
			AddOrSubX = false;
		} else {
			AddOrSubX = true;
		}
	}
	
	if (AddOrSubX) {
		var posLeft = CurrentX + RateOfChangeX;
		CurrentX = posLeft;
	} else {
		var posLeft = CurrentX - RateOfChangeX;
		CurrentX = posLeft;
	}

	// Y axis
	var numMaxY = Math.max(StartY,CurrentY);
	var numMinY = Math.min(StartY,CurrentY);
	
	if ((numMaxY - numMinY) > MaxTravelY) {
		// swap direction
		if (AddOrSubY) {
			AddOrSubY = false;
		} else {
			AddOrSubY = true;
		}
	}
	
	if (AddOrSubY) {
		var posTop = CurrentY + RateOfChangeY;
		CurrentY = posTop;
	} else {
		var posTop = CurrentY - RateOfChangeY;
		CurrentY = posTop;
	}

	document.getElementById('baloon').style.left = posLeft + 'px';
	document.getElementById('baloon').style.top = posTop + 'px';
	
	// count++;

}

function start() {
	
	// set Current X & Y
	CurrentX = StartX;
	CurrentY = StartY;
	// start animation
	aniBallonInterval = setInterval('animateBalloon()',50); // 75
}