[client] Fix issues with fetching chunks

Nibriboard/ClientFiles/BoardWindow.js

@@ -96,6 +96,9 @@ class BoardWindow extends EventEmitter
 		    this.displayGrid = this.displayGrid ? false : true;
 			console.info(`[BoardWindow/KeyboardHandler] Grid display set to ${this.displayGrid ? "on" : "off"}`);
 		}).bind(this));
+		this.keyboard.on("keyup-x", (function(event) {
+			console.debug("Chunk Cache: ", this.chunkCache.cache);
+		}).bind(this));
 		this.keyboard.on("keyup-left", (function(event) {
 		    this.interface.seekColour("backwards");
 		}).bind(this));

Nibriboard/ClientFiles/ChunkCache.js

@@ -21,14 +21,22 @@ class ChunkCache
 	/**
 	 * Fetches the chunk with the specified chunk reference.
 	 * @param	{ChunkReference}	chunkRef	The chunk reference of the chunk to fetch.
+	 * @param	{bool}				quiet		Whether to be quiet if the chunk wasn't found.
 	 * @return	{Chunk|null}					The requested chunk, or null if it isn't present in the cache.
 	 */
-	fetchChunk(chunkRef)
+	fetchChunk(chunkRef, quiet)
 	{
+		// Return null if we don't currently have that chunk in storage
 		if(!this.cache.has(chunkRef.toString()))
 			return null;
 		
-		return this.cache.get(chunkRef.toString());
+		let requestedChunk = this.cache.get(chunkRef.toString());
+		if(!(requestedChunk instanceof Chunk)) {
+			if(!quiet)
+				console.warn(`Attempt to access a chunk at ${chunkRef} that's not loaded yet.`);
+			return null;
+		}
+		return requestedChunk;
 	}
 	
 	/**
@@ -71,7 +79,7 @@ class ChunkCache
 	add(chunkData, override = false)
 	{
 		var hasChunk = this.cache.has(chunkData.chunkRef.toString()) &&
-			this.cache.get(chunkData.chunkRef.toString()).requestedFromServer;
+			this.cache.get(chunkData.chunkRef.toString()) instanceof Chunk;
 		
 		if(!override && hasChunk)
 			throw new Error("Error: We already have a chunk at that location stored.");
@@ -81,6 +89,11 @@ class ChunkCache
 		return !hasChunk;
 	}
 	
+	/**
+	 * Updates the chunk cache ready for the next frame.
+	 * @param	{number}			dt			The amount of time, in milliseconds, since that last frame was rendered.
+	 * @param	{viewport_object}	visibleArea	The area that's currently visible on-screen.
+	 */
 	update(dt, visibleArea)
 	{
 		let chunkSize = this.boardWindow.gridSize;
@@ -140,8 +153,8 @@ class ChunkCache
 					cx / chunkSize, cy / chunkSize
 				);
 				
-				let chunk = this.cache.get(cChunk.toString());
+				let chunk = this.fetchChunk(cChunk, true);
-				if(typeof chunk != "undefined" && !chunk.requestedFromServer)
+				if(chunk != null)
 					chunk.render(canvas, context, this, chunkArea);
 				
 				if(this.showRenderedChunks) {

Nibriboard/ClientFiles/CursorSyncer.js

@@ -2,6 +2,8 @@
 
 import Vector from './Utilities/Vector.js';
 
+import ChunkReference from './ChunkReference.js';
+
 class CursorSyncer
 {
 	constructor(inBoardWindow, syncFrequency)
@@ -22,6 +24,15 @@ class CursorSyncer
 		this.absCursorPosition = new Vector(0, 0);
 	}
 	
+	get chunkRefUnderCursor()
+	{
+		return new ChunkReference(
+			this.boardWindow.currentPlaneName, 
+			Math.floor(locRef.x / this.boardWindow.gridSize),
+			Math.floor(locRef.y / this.boardWindow.gridSize)
+		);
+	}
+	
 	setup()
 	{
 		// The last time we sent a cursor update to the server.
@@ -31,8 +42,8 @@ class CursorSyncer
 			this.cursorPosition.x = event.clientX;
 			this.cursorPosition.y = event.clientY;
 			
-			this.absCursorPosition.x = this.boardWindow.viewport.x + this.cursorPosition.x;
+			this.absCursorPosition.x = this.boardWindow.viewport.x + this.cursorPosition.x * 1/this.boardWindow.viewport.zoomLevel;
-			this.absCursorPosition.y = this.boardWindow.viewport.y + this.cursorPosition.y;
+			this.absCursorPosition.y = this.boardWindow.viewport.y + this.cursorPosition.y * 1/this.boardWindow.viewport.zoomLevel;
 			
 			setTimeout((function() {
 			    // Throttle the cursor updates we send to the server - a high

Nibriboard/ClientFiles/Interface.js

@@ -219,8 +219,10 @@ class Interface extends EventEmitter
 	
 	updateDebugInfo(dt)
 	{
-		this.debugDisplay.querySelector("#debug-framespacing").value = `${dt}ms`;
 		this.debugDisplay.querySelector("#debug-viewport").value = this.boardWindow.viewport;
+		if(typeof this.boardWindow.cursorSyncer != "undefined")
+			this.debugDisplay.querySelector("#debug-cursor").value = `${this.boardWindow.cursorSyncer.cursorPosition} -> ${this.boardWindow.cursorSyncer.absCursorPosition}`;
+		this.debugDisplay.querySelector("#debug-framespacing").value = `${dt}ms`;
 	}
 }
 

Nibriboard/ClientFiles/Pencil.js

@@ -139,12 +139,8 @@ class Pencil
 				if(!this.pencilDown)
 					return; // Only erase when the pencil is down
 				
-				let locRef = this.boardWindow.cursorSyncer.absCursorPosition;
+				let cursorPos = this.boardWindow.cursorSyncer.absCursorPosition;
-				let hoverChunkRef = new ChunkReference(
+				let hoverChunkRef = this.boardWindow.cursorSyncer.chunkRefUnderCursor;
-					this.boardWindow.currentPlaneName, 
-					Math.floor(locRef.x / this.boardWindow.gridSize),
-					Math.floor(locRef.y / this.boardWindow.gridSize)
-				);
 				
 				let hoverChunk = this.boardWindow.chunkCache.fetchChunk(hoverChunkRef);
 				if(hoverChunk == null) {
@@ -152,7 +148,7 @@ class Pencil
 					break; // If it's null, then we haven't received it yet from the server
 				}
 				
-				let lineToErase = hoverChunk.getLineUnderPoint(locRef);
+				let lineToErase = hoverChunk.getLineUnderPoint(cursorPos);
 				if(lineToErase == null) {
 					console.debug(`No line found at abs ${locRef}.`);
 					break; // There's no line underneath the cursor atm

Nibriboard/ClientFiles/index.html

@@ -173,6 +173,8 @@
 		<aside id="debuginfo">
 			<label>Viewport:</label> <output id="debug-viewport" class="debug-value">?</output>
 			<br />
+			<label>Cursor:</label> <output id="debug-cursor" class="debug-value">?</output>
+			<br />
 			<label>Frame spacing:</label> <output id="debug-framespacing" class="debug-value">?</output>
 			<br />
 			<small><em><kbd>g</kbd>: toggle grid, <kbd>c</kbd>: toggle chunk higlighting</em></small>