diff --git a/src/ui/ChunkLoader2D.js b/src/ui/ChunkLoader2D.js index 7c94456..c50e11a 100644 --- a/src/ui/ChunkLoader2D.js +++ b/src/ui/ChunkLoader2D.js @@ -1,7 +1,5 @@ /* * Fetching and storing of 2D chunks - * - * @flow */ import ChunkRGB from './ChunkRGB'; @@ -25,12 +23,12 @@ import { class ChunkLoader { store = null; - canvasId: number; - canvasMaxTiledZoom: number; - historicalMaxTiledZooms: Array; + canvasId; + canvasMaxTiledZoom; + historicalMaxTiledZooms; palette; - canvasSize: number; - chunks: Map; + canvasSize; + chunks; constructor(store, canvasId, palette, canvasSize, historicalSizes) { this.store = store; @@ -56,10 +54,10 @@ class ChunkLoader { } getPixelUpdate( - cx: number, - cy: number, - offset: number, - color: number, + cx, + cy, + offset, + color, ) { const chunk = this.chunks.get(`${this.canvasMaxTiledZoom}:${cx}:${cy}`); if (chunk) { @@ -70,8 +68,8 @@ class ChunkLoader { } getColorIndexOfPixel( - x: number, - y: number, + x, + y, ) { const { canvasSize } = this; const [cx, cy] = getChunkOfPixel(canvasSize, x, y); @@ -92,11 +90,11 @@ class ChunkLoader { * @return ColorIndex or null if chunks not loaded or historical view not set */ getHistoricalIndexOfPixel( - x: number, - y: number, - historicalDate: string, - historicalTime: string, - historicalCanvasSize: number, + x, + y, + historicalDate, + historicalTime, + historicalCanvasSize, ) { if (!historicalDate) { return null; @@ -132,9 +130,9 @@ class ChunkLoader { * available lower zoomlevel chunks */ preLoadChunk( - zoom: number, - cx: number, - cy: number, + zoom, + cx, + cy, chunkRGB, ) { if (zoom <= 0) return null; @@ -174,12 +172,12 @@ class ChunkLoader { getChunk( - zoom: number, - cx: number, - cy: number, - fetch: boolean, - showLoadingTile: boolean = true, - chunkPreLoading: boolean = true, + zoom, + cx, + cy, + fetch = true, + showLoadingTile = true, + chunkPreLoading = true, ) { const chunkKey = `${zoom}:${cx}:${cy}`; let chunkRGB = this.chunks.get(chunkKey); @@ -244,10 +242,10 @@ class ChunkLoader { } async fetchHistoricalChunk( - cx: number, - cy: number, - historicalDate: string, - historicalTime: string, + cx, + cy, + historicalDate, + historicalTime, historicalCanvasMaxTiledZoom, chunkRGB, ) { @@ -278,7 +276,7 @@ class ChunkLoader { } } - async fetchBaseChunk(zoom, cx: number, cy: number, chunkRGB) { + async fetchBaseChunk(zoom, cx, cy, chunkRGB) { const center = [zoom, cx, cy]; this.store.dispatch(requestBigChunk(center)); chunkRGB.isBasechunk = true; @@ -303,7 +301,7 @@ class ChunkLoader { } } - async fetchTile(zoom, cx: number, cy: number, chunkRGB) { + async fetchTile(zoom, cx, cy, chunkRGB) { const center = [zoom, cx, cy]; this.store.dispatch(requestBigChunk(center)); try { diff --git a/src/ui/Renderer2D.js b/src/ui/Renderer2D.js index cb918b8..3a4a1b9 100644 --- a/src/ui/Renderer2D.js +++ b/src/ui/Renderer2D.js @@ -341,13 +341,12 @@ class Renderer { context.save(); context.fillStyle = '#C4C4C4'; context.scale(relScale, relScale); - // decide if we will fetch missing chunks - // and update the timestamps of accessed chunks + // decide if we update the timestamps of accessed chunks const curTime = Date.now(); - let fetch = false; + let touch = false; if (curTime > this.lastFetch + 150) { this.lastFetch = curTime; - fetch = true; + touch = true; } const xOffset = CANVAS_WIDTH / 2 / relScale - TILE_SIZE / 2; @@ -380,10 +379,10 @@ class Renderer { // if out of bounds context.fillRect(x, y, TILE_SIZE, TILE_SIZE); } else { - chunk = this.chunkLoader.getChunk(tiledZoom, cx, cy, fetch); + chunk = this.chunkLoader.getChunk(tiledZoom, cx, cy); if (chunk) { context.drawImage(chunk, x, y); - if (fetch) { + if (touch) { chunk.timestamp = curTime; } } else { @@ -580,13 +579,12 @@ class Renderer { } // scale context.scale(scale, scale); - // decide if we will fetch missing chunks - // and update the timestamps of accessed chunks + // decide if we update the timestamps of accessed chunks const curTime = Date.now(); - let fetch = false; + let touch = false; if (curTime > this.lastFetch + 150) { this.lastFetch = curTime; - fetch = true; + touch = true; } const xOffset = CANVAS_WIDTH / 2 / scale - TILE_SIZE / 2; @@ -618,10 +616,10 @@ class Renderer { } else { // full chunks chunk = this.chunkLoader - .getHistoricalChunk(cx, cy, fetch, historicalDate); + .getHistoricalChunk(cx, cy, true, historicalDate); if (chunk) { context.drawImage(chunk, x, y); - if (fetch) { + if (touch) { chunk.timestamp = curTime; } } else { @@ -630,11 +628,11 @@ class Renderer { // incremential chunks if (historicalTime === '0000') continue; chunk = this.chunkLoader - .getHistoricalChunk(cx, cy, fetch, historicalDate, historicalTime); + .getHistoricalChunk(cx, cy, true, historicalDate, historicalTime); if (chunk) { if (!chunk.isEmpty) { context.drawImage(chunk, x, y); - if (fetch) { + if (touch) { chunk.timestamp = curTime; } } @@ -649,7 +647,7 @@ class Renderer { ); if (chunk && !chunk.isEmpty) { context.drawImage(chunk, x, y); - if (fetch) { + if (touch) { chunk.timestamp = curTime; } }