/**** 
* Classes
****/
var GraphSegment = Container.expand(function () {
	var self = Container.call(this);
	self.index1 = null;
	self.stockValue1 = 0;
	self.stockValue2 = 0;
	self.x1 = 0;
	self.y1 = 0;
	self.x2 = 0;
	self.y2 = 0;
	self.isFinished = false;
	var verticalSlideRatio = 1;
	var interpolationSpeed = 0.5; // Adjust this value for speed
	self.updateSlide = function () {
		if (moveSegments) {
			self.x -= slideAmount * 1;
		}
		if (moveSegmentsVertically) {
			var currentDelta = horizontalAxis.y - game.height * 0.75;
			var targetY = game.height * 0.75 - dollarToYPixelRatio * self.stockValue1 + currentDelta;
			var deltaY = (targetY - self.y) * interpolationSpeed;
			self.y += deltaY;
			if (Math.abs(deltaY) <= 1) {
				self.y = targetY;
			}
		}
	};
	var segmentGraphics = self.attachAsset('segment', {
		anchorY: 0.5
	});
});
// Axis class to represent the graph axes
var Axis = Container.expand(function (isVertical) {
	var self = Container.call(this);
	var interpolationSpeed = 0.02; // Adjust this value for speed
	var lowerLimit = game.height * 0.75;
	self.isVertical = isVertical; // Property to determine if the axis is vertical
	self.yValue = 0; // Track the Y value of the axis for vertical movement
	self.updateSlide = function () {
		// Current stock value excedent over 100$ (ignore below 100$)
		var stockDelta = Math.max(0, stockValuesHistory[graphIndex] - 100);
		// Target = base axis + delta in pixels
		var targetY = lowerLimit + stockDelta * dollarToYPixelRatio;
		if (!self.isVertical) {
			// Smooth interpolation
			var deltaY = (targetY - self.y) * interpolationSpeed;
			self.y += deltaY;
			if (Math.abs(deltaY) < 1) {
				self.y = targetY;
			}
			if (moveSegmentsVertically && self.y <= lowerLimit) {
				self.y = lowerLimit;
				moveSegmentsVertically = false;
			}
		}
	};
	self.drawAxis = function () {
		var axisGraphics = self.addChild(LK.getAsset('axis', {
			height: 4 // Thin line for the axis
		}));
	};
});
// ValueIndicator class to represent the current value of the stock on the graph
// Player class to represent the player's portfolio
var Player = Container.expand(function () {
	var self = Container.call(this);
	self.balance = 100; // Start with $100
	self.stocks = {}; // Object to hold stocks and quantities
	self.buyStock = function (stock, quantity) {
		var cost = stock.getPrice() * quantity;
		if (self.balance >= cost) {
			self.balance -= cost;
			if (!self.stocks[stock]) {
				self.stocks[stock] = 0;
			}
			self.stocks[stock] += quantity;
		}
	};
	self.sellStock = function (stock, quantity) {
		if (self.stocks[stock] && self.stocks[stock] >= quantity) {
			self.balance += stock.getPrice() * quantity;
			self.stocks[stock] -= quantity;
			if (self.stocks[stock] === 0) {
				delete self.stocks[stock];
			}
		}
	};
	self.getBalance = function () {
		return self.balance;
	};
	self.getPortfolio = function () {
		return self.stocks;
	};
});
var BuyButton = Container.expand(function () {
	var self = Container.call(this);
	var buttonGraphics = self.attachAsset('bigButton', {
		anchorX: 0.5,
		anchorY: 0.5,
		tint: 0xFFA500
	});
	self.setText = function (text) {
		var buttonText = new Text2(text, {
			size: 250,
			fill: "#ffffff",
			font: "'Arial-BoldMT', 'Arial', sans-serif"
		});
		buttonText.anchor.set(0.5, 0.5);
		self.addChild(buttonText);
	};
	self.on('down', function () {
		if (currentStock) {
			buyStock(currentStock);
		}
	});
});
var SellButton = Container.expand(function () {
	var self = Container.call(this);
	var buttonGraphics = self.attachAsset('bigButton', {
		anchorX: 0.5,
		anchorY: 0.5,
		tint: 0x008000
	});
	self.setText = function (text) {
		var buttonText = new Text2(text, {
			size: 250,
			fill: "#ffffff",
			font: "'Arial-BoldMT', 'Arial', sans-serif"
		});
		buttonText.anchor.set(0.5, 0.5);
		self.addChild(buttonText);
	};
	self.on('down', function () {
		if (currentStock) {
			sellStock(currentStock);
		}
	});
});

/**** 
* Initialize Game
****/
var game = new LK.Game({});

/**** 
* Game Code
****/
var slideAmount = 6.5;
var slideAmountVertical = 0.10; // Reduced speed for smoother vertical movement
var moveSegmentsVertically = false;
var verticalSlideThreshold = 500; // Define a global threshold for vertical sliding
var upperLimit = game.height * 0.35;
var lowerLimit = game.height * 0.75; // Define lowerLimit for use in segment positioning
var running = false;
var moveSegments = false;
var drawingInProgress = false;
// Initialize game elements
var player = new Player();
var stocks = [];
// Initialize stock values history with the first value of $10
var stockValuesHistory = [50];
// Define graphIndex and initialize to 0
var graphIndex = 0;
// Declare a global array to store graph segments
var graphSegments = [];
// Define a global variable for the current stock
var currentStock = null;
var graphPoints = [];
var graphWidth = game.width;
var segmentWidth = graphWidth / 5; //; / stockValuesHistory.length;
var dollarToYPixelRatio = game.height * 0.5 / 100;
var segmentDrawInterval = null;
var secondsPerSegment = 2.0;
var stockDisplay = []; // Array to hold stock display elements
/**** 
* UI Elements
****/
var background = game.addChild(LK.getAsset('background', {
	anchorX: 0.5,
	anchorY: 0.5
}));
background.x = 1024; // Center x position
background.y = 2732 * 0.80; // Center y position
// Create and draw horizontal axis
var horizontalAxis = game.addChild(new Axis(false)); // false indicates this is a horizontal axis
horizontalAxis.yValue = game.height * 0.75; // Initialize yValue for vertical movement
horizontalAxis.drawAxis();
horizontalAxis.y = horizontalAxis.yValue;
horizontalAxis.width = game.width;
horizontalAxis.height = 10;
horizontalAxis.x = 0; // Move axis to the left side of the screen
// Create and draw fixed horizontal Marker axis
var markerAxis = game.addChild(new Axis(false)); // false indicates this is a horizontal axis
markerAxis.drawAxis();
markerAxis.alpha = 0; // Set alpha to 0 to make the markerAxis transparent
markerAxis.y = game.height * 0.25; // Set y position for the marker axis
markerAxis.width = game.width;
markerAxis.height = 10;
markerAxis.x = 0; // Move axis to the left side of the screen
// Create and draw vertical axis
var verticalAxis = game.addChild(new Axis(true)); // true indicates this is a vertical axis
verticalAxis.drawAxis();
verticalAxis.rotation = Math.PI / 2; // Rotate to make it vertical
verticalAxis.x = 20; // Move axis to the left side of the screen
verticalAxis.width = game.height;
verticalAxis.height = 10;
verticalAxis.y = 0;
// Create buttons
var buyButton = game.addChild(new BuyButton());
buyButton.setText('Buy');
buyButton.x = game.width * 0.25;
buyButton.y = game.height - buyButton.height / 2 - 20;
var sellButton = game.addChild(new SellButton());
sellButton.setText('Sell');
sellButton.x = game.width * 0.75;
sellButton.y = game.height - sellButton.height / 2 - 20;
var balanceText = new Text2('Balance: $' + player.getBalance(), {
	size: 50,
	fill: "#ffffff"
});
// Create a text display for the verticalSlideAmount labeled VSA
var verticalSlideAmount = 0;
var vsaText = new Text2('VSA: ' + verticalSlideAmount.toFixed(0), {
	size: 50,
	fill: "#ffffff"
});
vsaText.anchor.set(0, 0);
LK.gui.topLeft.addChild(vsaText);
var stockValueText = new Text2('Stock Value: $' + stockValuesHistory[stockValuesHistory.length - 1].toFixed(2), {
	size: 50,
	fill: "#ffffff"
});
stockValueText.anchor.set(1, 0);
LK.gui.topRight.addChild(stockValueText);
function updateStockValueText() {
	if (graphIndex < stockValuesHistory.length) {
		stockValueText.setText('Stock Value: $' + stockValuesHistory[graphIndex + 1].toFixed(0));
	}
}
balanceText.anchor.set(0.5, 0);
LK.gui.top.addChild(balanceText);
/**** 
* Game Functions
****/
// Update the player's balance display
function updateBalanceDisplay() {
	balanceText.setText('Balance: $' + player.getBalance().toFixed(2));
}
// Function to handle buying stocks
function buyStock(stock) {
	player.buyStock(stock, 1); // Buy 1 stock for simplicity
	updateBalanceDisplay();
}
// Function to handle selling stocks
function sellStock(stock) {
	player.sellStock(stock, 1); // Sell 1 stock for simplicity
	updateBalanceDisplay();
}
function drawNextSegment() {
	//console.log("drawNextSegment " + graphIndex + ' isDrawing = ' + drawingInProgress);
	var hasFinished = graphIndex >= graphPoints.length - 1;
	if (hasFinished) {
		running = false;
		LK.showGameOver();
		return;
	}
	if (!drawingInProgress) {
		updateStockValueText();
		var pointA = graphPoints[graphIndex];
		var pointB = graphPoints[graphIndex + 1];
		var nextSegmentRotation = Math.atan2(pointB.y - pointA.y, pointB.x - pointA.x); // Calculate next segment rotation based on pointA and pointB coordinates
		var distance = Math.sqrt(Math.pow(pointB.x - pointA.x, 2) + Math.pow(pointB.y - pointA.y, 2)); // Calculate the distance between points A and B
		var lastSegment = graphSegments.length > 0 ? graphSegments[graphSegments.length - 1] : null;
		var lastSegmentEndX = lastSegment ? lastSegment.x + Math.cos(lastSegment.rotation) * lastSegment.width : graphPoints[graphIndex].x;
		var lastSegmentEndY = lastSegment ? lastSegment.y + Math.sin(lastSegment.rotation) * lastSegment.width : graphPoints[graphIndex].y;
		var pointAXMovement = lastSegmentEndX - pointA.x;
		var pointAYMovement = lastSegmentEndY - pointA.y;
		pointA.x = lastSegmentEndX;
		pointA.y = lastSegmentEndY > lowerLimit ? lowerLimit : lastSegmentEndY;
		var nextSegmentEndY = pointA.y + Math.sin(nextSegmentRotation) * distance;
		// Adjust distance to ensure segment's end doesn't exceed lowerLimit
		if (nextSegmentEndY > lowerLimit) {
			distance = (lowerLimit - pointA.y) / Math.sin(nextSegmentRotation);
		}
		if (nextSegmentEndY < upperLimit || nextSegmentEndY > upperLimit && stockValuesHistory[graphIndex + 1] >= 100) {
			moveSegmentsVertically = true;
		}
		var delay = 0.5; // Reduce delay to speed up the drawing of segments
		drawingInProgress = true;
		drawSegment(game, graphIndex, pointA.x, pointA.y, nextSegmentRotation, distance, delay);
	}
}
function drawSegment(gameRef, index, x1, y1, rotation, width, delay) {
	var segment = gameRef.addChild(new GraphSegment());
	segment.index1 = index;
	segment.stockValue1 = stockValuesHistory[index];
	segment.stockValue2 = stockValuesHistory[index + 1];
	segment.x1 = x1;
	segment.y1 = y1;
	segment.rotation = rotation;
	segment.width = 1; // Start with a width of 1 and animate to the target width
	segment.height = 20;
	// Add the new segment to the global graphSegments array
	graphSegments.push(segment);
	console.log('new segment index=' + index + '-' + (index + 1) + " " + stockValuesHistory[index] + "-" + stockValuesHistory[index + 1] + "$", Math.floor(x1), Math.floor(y1), 'rotation=' + (rotation * (180 / Math.PI)).toFixed(2) + ' degrees', 'width=' + width);
	segment.x = x1;
	segment.y = y1;
	var startTime = Date.now();
	var endTime = startTime + delay * 1000 * secondsPerSegment;
	var updateWidth = function updateWidth() {
		if (!running) {
			return;
		}
		var currentTime = Date.now();
		var timeElapsed = currentTime - startTime;
		var newWidth = Math.min(timeElapsed / (delay * 1000 * secondsPerSegment) * width, width);
		segment.width = newWidth;
		if (currentTime < endTime) {
			LK.setTimeout(updateWidth, 16);
		} else {
			if (!moveSegments && segment.x + segment.width / 2 >= game.width * 0.5) {
				moveSegments = true;
				console.log("Past center !");
			}
			segment.isFinished = true;
			graphIndex++;
			drawingInProgress = false;
		}
	};
	updateWidth();
}
function setDebugValues() {
	stockValuesHistory = [];
	var series = [0, 25, 50, 75, 100, 125, 150, 175, 200, 175, 150, 125, 100, 75, 50, 25, 0, 0, 0];
	//series = [0, 25, 50, 75, 100, 125, 125, 125, 125, 100, 75, 50, 25, 0, 0, 0];
	for (var i = 0; i < 1; i++) {
		stockValuesHistory = stockValuesHistory.concat(series);
	}
}
function startGame() {
	// Initialize
	// Generate random deltas and add to previous value for stockValuesHistory
	var previousValue = stockValuesHistory[stockValuesHistory.length - 1];
	for (var i = 0; i < 100; i++) {
		var delta = Math.floor((Math.random() - 0.5) * 100); // Generate a delta between -50 and 50
		var newValue = Math.max(0, previousValue + (previousValue == 0 ? Math.abs(delta) : delta));
		stockValuesHistory.push(newValue);
		previousValue = newValue;
	}
	//setDebugValues(); // DEBUG MODE
	var x, y;
	// Compute the coordinates for the graph based on stockValuesHistory
	for (var i = 0; i < stockValuesHistory.length; i++) {
		x = segmentWidth * i;
		y = game.height * 0.75 - stockValuesHistory[i] * dollarToYPixelRatio; // Calculate Y based on new mapping
		graphPoints.push({
			x: x,
			y: y
		});
	}
	running = true;
	// Set up a tick event to call drawNextSegment every second
	segmentDrawInterval = LK.setInterval(drawNextSegment, 20);
}
// Main game loop
LK.on('tick', function () {
	if (!running) {
		return;
	}
	// Update slide for each graph segment and the horizontal axis
	graphSegments.forEach(function (segment) {
		segment.updateSlide();
	});
	horizontalAxis.updateSlide(); // Slide the horizontal axis vertically
	// Update the vertical slide amount text periodically
	vsaText.setText(graphIndex + ' VSA: ' + verticalSlideAmount.toFixed(0) + " " + moveSegmentsVertically);
	// Check for game over conditions (e.g., player runs out of money)
	if (player.getBalance() <= 0) {
		LK.effects.flashScreen(0xff0000, 1000);
		LK.showGameOver();
	}
});
LK.setTimeout(function () {
	startGame();
}, 1000);

===================================================================
--- original.js
+++ change.js
@@ -103,9 +103,10 @@
 	});
 	self.setText = function (text) {
 		var buttonText = new Text2(text, {
 			size: 250,
-			fill: "#ffffff"
+			fill: "#ffffff",
+			font: "'Arial-BoldMT', 'Arial', sans-serif"
 		});
 		buttonText.anchor.set(0.5, 0.5);
 		self.addChild(buttonText);
 	};
@@ -124,9 +125,10 @@
 	});
 	self.setText = function (text) {
 		var buttonText = new Text2(text, {
 			size: 250,
-			fill: "#ffffff"
+			fill: "#ffffff",
+			font: "'Arial-BoldMT', 'Arial', sans-serif"
 		});
 		buttonText.anchor.set(0.5, 0.5);
 		self.addChild(buttonText);
 	};
@@ -208,9 +210,9 @@
 // Create buttons
 var buyButton = game.addChild(new BuyButton());
 buyButton.setText('Buy');
 buyButton.x = game.width * 0.25;
-buyButton.y = game.height - buyButton.height / 2 - 20 + 200;
+buyButton.y = game.height - buyButton.height / 2 - 20;
 var sellButton = game.addChild(new SellButton());
 sellButton.setText('Sell');
 sellButton.x = game.width * 0.75;
 sellButton.y = game.height - sellButton.height / 2 - 20;