/**** 
* Classes
****/
var StockIcon = Container.expand(function () {
	var self = Container.call(this);
	var iconGraphics = self.attachAsset('stockIcon', {
		anchorX: 0.5,
		anchorY: 0.5
	});
});
var BalanceIcon = Container.expand(function () {
	var self = Container.call(this);
});
var AxisLabel = Container.expand(function (value) {
	var self = Container.call(this);
	self.value = value;
	var label = new Text2('$' + value, {
		size: 50,
		fill: "#ffffff"
	});
	label.anchor.set(0.5, 0.5);
	self.addChild(label);
	self.alpha = 0;
	self.updatePosition = function (axisY) {
		var newY = axisY - self.value * dollarToYPixelRatio - axisLabelFontSize / 2;
		if (newY > game.height * 0.85) {
			self.value += (nbMarkers - 1) * 25;
			label.setText('$' + self.value);
		} else if (newY < game.height * 0.10) {
			self.value -= (nbMarkers - 1) * 25;
			label.setText('$' + self.value);
		}
		self.y = axisY - self.value * dollarToYPixelRatio - axisLabelFontSize / 2;
		// Set alpha based on y position
		//self.alpha = self.y > game.height * 0.85 ? 0 : 1;
		// CONTINUER ICI !!! : SI y > .... => value += 200 => y= ...
	};
});
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;
			}
			// Set alpha based on y position
			self.alpha = self.y > game.height * 0.85 ? 0 : 1;
		}
	};
	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 = 0; // Counter to hold stock quantity
	self.buyStock = function (quantity) {
		var price = stockValuesHistory[graphIndex];
		var cost = price * quantity;
		if (self.balance >= cost) {
			self.balance -= cost;
			self.stocks += 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);
	self.currentText = "ON";
	self.setText = function (text, isPressed) {
		self.currentText = text;
		var buttonTextSize = isPressed ? 230 : 250;
		var buttonText = new Text2(text, {
			size: buttonTextSize,
			fill: "#ffffff",
			font: "'Arial-BoldMT', 'Arial', sans-serif"
		});
		buttonText.anchor.set(0.5, 0.5);
		self.addChild(buttonText);
	};
	var buttonGraphics = self.attachAsset('bigButton', {
		anchorX: 0.5,
		anchorY: 0.5,
		tint: 0xFFA500
	});
	self.on('down', function () {
		buttonGraphics = self.attachAsset('bigButtonPressed', {
			anchorX: 0.5,
			anchorY: 0.5,
			tint: 0xFFA500
		});
		LK.effects.flashScreen(0xFFA500, 100);
		self.setText(self.currentText, true);
		buyStock(1);
	}).on('up', function () {
		buttonGraphics = self.attachAsset('bigButton', {
			anchorX: 0.5,
			anchorY: 0.5,
			tint: 0xFFA500
		});
		self.setText(self.currentText);
	});
});
var SellButton = Container.expand(function () {
	var self = Container.call(this);
	self.currentText = "ON";
	self.setText = function (text, isPressed) {
		self.currentText = text;
		var buttonTextSize = isPressed ? 230 : 250;
		var buttonText = new Text2(text, {
			size: buttonTextSize,
			fill: "#ffffff",
			font: "'Arial-BoldMT', 'Arial', sans-serif"
		});
		buttonText.anchor.set(0.5, 0.5);
		self.addChild(buttonText);
	};
	var buttonGraphics = self.attachAsset('bigButton', {
		anchorX: 0.5,
		anchorY: 0.5,
		tint: 0x008000
	});
	self.on('down', function () {
		buttonGraphics = self.attachAsset('bigButtonPressed', {
			anchorX: 0.5,
			anchorY: 0.5,
			tint: 0x008000
		});
		LK.effects.flashScreen(0x008000, 100);
		self.setText(self.currentText, true);
		if (currentStock) {
			sellStock(currentStock);
		}
	}).on('up', function () {
		buttonGraphics = self.attachAsset('bigButton', {
			anchorX: 0.5,
			anchorY: 0.5,
			tint: 0x008000
		});
		self.setText(self.currentText);
	});
});

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

/**** 
* Game Code
****/
var debug = false;
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 axisLabelFontSize = 50;
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 farBackground = game.addChild(LK.getAsset('farBackground', {
	anchorX: 0.5,
	anchorY: 0.5,
	alpha: 0.25
}));
farBackground.x = game.width / 2;
farBackground.y = game.height / 2;
var boardBackground = game.addChild(LK.getAsset('board', {
	anchorX: 0.5,
	anchorY: 0.5
}));
boardBackground.x = game.width / 2;
boardBackground.y = game.height * 0.9;
var boardBorder = game.addChild(LK.getAsset('boardBorder', {
	anchorX: 0.5,
	anchorY: 0.5
}));
boardBorder.x = game.width / 2;
boardBorder.y = game.height * 0.85;
var background = game.addChild(LK.getAsset('background', {
	anchorX: 0.5,
	anchorY: 0.5
}));
background.x = 1024; // Center x position
background.y = 2732 * 0.71; // 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 vertical axis
var verticalAxis = 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;
// Instantiate axis labels separately
var axisLabels = [];
var nbMarkers = 7;
for (var i = 0; i < nbMarkers; i++) {
	var axisLabel = new AxisLabel(i * 25);
	axisLabel.x = verticalAxis.x + 60; // Position labels to the left of the vertical axis
	axisLabel.updatePosition(horizontalAxis.y);
	axisLabel.alpha = 1;
	axisLabels.push(axisLabel);
	game.addChild(axisLabel);
}
// 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 balanceIcon = game.addChild(new BalanceIcon());
balanceIcon.x = game.width * 0.5;
balanceIcon.y = game.height * 0.025;
var stockIcon = game.addChild(new StockIcon());
stockIcon.x = balanceIcon.x + balanceIcon.width + 10;
stockIcon.y = balanceIcon.y;
var balanceText = new Text2('$' + player.getBalance() + ' ', {
	size: 100,
	fill: "#ffffff",
	anchorX: 0.5
});
balanceText.anchor.set(0.5, -0.7);
LK.gui.top.addChild(balanceText);
// Create a text display for the verticalSlideAmount labeled VSA
var verticalSlideAmount = 0;
var vsaText = new Text2('', {
	size: 50,
	fill: "#ffffff"
});
vsaText.anchor.set(0, 0);
LK.gui.topLeft.addChild(vsaText);
var stockValueText = new Text2('Price\n$' + stockValuesHistory[stockValuesHistory.length - 1].toFixed(0), {
	size: 50,
	fill: "#ffffff"
});
stockValueText.anchor.set(1, 0);
LK.gui.topRight.addChild(stockValueText);
function updateStockValueText() {
	if (graphIndex < stockValuesHistory.length) {
		stockValueText.setText('Price\n\t$' + stockValuesHistory[graphIndex + 1].toFixed(0));
	}
}
/**** 
* Game Functions
****/
// Update the player's balance display
function updateBalanceDisplay() {
	balanceText.setText('$' + player.getBalance() + ' ');
}
// 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;
	}
	if (debug) {
		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 position of axis labels based on the y position of the horizontal axis
	axisLabels.forEach(function (label) {
		label.updatePosition(horizontalAxis.y);
	});
	if (debug) {
		// Update the vertical slide amount text periodically
		vsaText.setText(graphIndex + ' VSA: ' + verticalSlideAmount.toFixed(0) + " " + moveSegmentsVertically);
	}
});
LK.setTimeout(function () {
	startGame();
}, 1000);

===================================================================
--- original.js
+++ change.js
@@ -7,8 +7,11 @@
 		anchorX: 0.5,
 		anchorY: 0.5
 	});
 });
+var BalanceIcon = Container.expand(function () {
+	var self = Container.call(this);
+});
 var AxisLabel = Container.expand(function (value) {
 	var self = Container.call(this);
 	self.value = value;
 	var label = new Text2('$' + value, {