diff --git a/src/js/net/minecraft/client/GameWindow.js b/src/js/net/minecraft/client/GameWindow.js index dc4760b..2551e60 100644 --- a/src/js/net/minecraft/client/GameWindow.js +++ b/src/js/net/minecraft/client/GameWindow.js @@ -3,7 +3,6 @@ window.GameWindow = class { constructor(minecraft, canvasWrapperId) { this.minecraft = minecraft; this.canvasWrapperId = canvasWrapperId; - this.renderer = null; this.mouseMotionX = 0; this.mouseMotionY = 0; @@ -21,17 +20,26 @@ window.GameWindow = class { this.canvas2d = document.createElement('canvas'); this.wrapper.appendChild(this.canvas2d); + // Create screen item renderer + this.canvasItems = document.createElement('canvas'); + this.wrapper.appendChild(this.canvasItems); + // Stats this.stats = new Stats() this.stats.showPanel(0); this.wrapper.appendChild(this.stats.dom); - // Initialize window size - this.updateWindowSize(); - // On resize let scope = this; - window.addEventListener('resize', _ => scope.onResize(), false); + + // Request focus + document.onclick = function () { + if (scope.minecraft.currentScreen === null) { + scope.requestFocus(); + } + } + + window.addEventListener('resize', _ => scope.updateWindowSize(), false); // Focus listener document.addEventListener('pointerlockchange', _ => this.onFocusChanged(), false); @@ -97,22 +105,33 @@ window.GameWindow = class { document.body.style.cursor = 'default'; } - loadRenderer(renderer) { - this.renderer = renderer; + updateWindowSize() { + this.updateScaleFactor(); - // Initialize window size - this.onResize(); + let wrapperWidth = this.width * this.scaleFactor; + let wrapperHeight = this.height * this.scaleFactor; - // Request focus - let scope = this; - document.onclick = function () { - if (scope.minecraft.currentScreen === null) { - scope.requestFocus(); - } + let worldRenderer = this.minecraft.worldRenderer; + + // Update world renderer size and camera + worldRenderer.camera.aspect = this.width / this.height; + worldRenderer.camera.updateProjectionMatrix(); + worldRenderer.webRenderer.setSize(wrapperWidth, wrapperHeight); + + // Update canvas 2d size + this.canvas2d.style.width = wrapperWidth + "px"; + this.canvas2d.style.height = wrapperHeight + "px"; + + // Reinitialize gui + this.minecraft.screenRenderer.initialize(); + + // Reinitialize current screen + if (!(this.minecraft.currentScreen === null)) { + this.minecraft.currentScreen.setup(this.minecraft, this.width, this.height); } } - updateWindowSize() { + updateScaleFactor() { let wrapperWidth = this.wrapper.offsetWidth; let wrapperHeight = this.wrapper.offsetHeight; @@ -126,30 +145,6 @@ window.GameWindow = class { this.height = wrapperHeight / scale; } - onResize() { - this.updateWindowSize(); - - let wrapperWidth = this.width * this.scaleFactor; - let wrapperHeight = this.height * this.scaleFactor; - - // Update world renderer size and camera - this.renderer.camera.aspect = this.width / this.height; - this.renderer.camera.updateProjectionMatrix(); - this.renderer.webRenderer.setSize(wrapperWidth, wrapperHeight); - - // Update canvas 2d size - this.canvas2d.style.width = wrapperWidth + "px"; - this.canvas2d.style.height = wrapperHeight + "px"; - - // Reinitialize gui - this.renderer.initializeGui(); - - // Reinitialize current screen - if (!(this.minecraft.currentScreen === null)) { - this.minecraft.currentScreen.setup(this.minecraft, this.width, this.height); - } - } - onFocusChanged() { this.actualMouseLocked = document.pointerLockElement === this.canvas; } diff --git a/src/js/net/minecraft/client/Minecraft.js b/src/js/net/minecraft/client/Minecraft.js index 86a431e..d2279d8 100644 --- a/src/js/net/minecraft/client/Minecraft.js +++ b/src/js/net/minecraft/client/Minecraft.js @@ -12,9 +12,15 @@ window.Minecraft = class { this.worldRenderer = new WorldRenderer(this, this.window); this.timer = new Timer(20); + // Create screen renderer + this.screenRenderer = new ScreenRenderer(this, this.window); + // Create current screen and overlay this.ingameOverlay = new IngameOverlay(this, this.window); + // Update window size + this.window.updateWindowSize(); + // Display loading screen this.loadingScreen = new GuiLoadingScreen(); this.loadingScreen.setTitle("Building terrain..."); @@ -106,6 +112,7 @@ window.Minecraft = class { // Render the game this.worldRenderer.render(partialTicks); + this.screenRenderer.render(partialTicks); } displayScreen(screen) { diff --git a/src/js/net/minecraft/client/gui/IngameOverlay.js b/src/js/net/minecraft/client/gui/IngameOverlay.js index 7be9498..75bac8a 100644 --- a/src/js/net/minecraft/client/gui/IngameOverlay.js +++ b/src/js/net/minecraft/client/gui/IngameOverlay.js @@ -50,7 +50,7 @@ window.IngameOverlay = class extends Gui { let minU = (textureIndex % 16) / 16.0; let minV = Math.floor(textureIndex / 16) / 16.0; - this.drawSprite(stack, this.textureTerrain, minU * 256, minV, 16, 16, x + 3, y + 3, 16, 16) + this.drawSprite(stack, this.textureTerrain, minU * 256, minV, 16, 16, x + 3 + i * 20, y + 3, 16, 16) } } } diff --git a/src/js/net/minecraft/client/render/WorldRenderer.js b/src/js/net/minecraft/client/render/WorldRenderer.js index 0efd891..5be26dd 100644 --- a/src/js/net/minecraft/client/render/WorldRenderer.js +++ b/src/js/net/minecraft/client/render/WorldRenderer.js @@ -15,15 +15,6 @@ window.WorldRenderer = class { // Block Renderer this.blockRenderer = new BlockRenderer(this); - // Initialize renderers - this.initializeRenderer(); - this.initializeGui(); - - // Load renderer into window - this.window.loadRenderer(this); - } - - initializeRenderer() { // Create world camera this.camera = new THREE.PerspectiveCamera(0, 1, 0.001, 1000); this.camera.rotation.order = 'ZYX'; @@ -52,47 +43,6 @@ window.WorldRenderer = class { this.webRenderer.clear(); } - initializeGui() { - // Update camera size - this.window.canvas2d.width = this.window.width; - this.window.canvas2d.height = this.window.height; - - // Get context stack of 2d canvas - this.stack2d = this.window.canvas2d.getContext('2d'); - this.stack2d.webkitImageSmoothingEnabled = false; - this.stack2d.mozImageSmoothingEnabled = false; - this.stack2d.imageSmoothingEnabled = false; - - // Create texture from rendered graphics. - //this.frameBuffer = new THREE.Texture(this.canvas2d) - //this.frameBuffer.needsUpdate = true; - //this.frameBuffer.minFilter = THREE.LinearFilter; - //this.frameBuffer.maxFilter = THREE.LinearFilter; - - // Create HUD material. - //let material = new THREE.MeshBasicMaterial({ - // map: this.frameBuffer, - // transparent: true - //}); - - // Create plane to render the HUD. This plane fill the whole screen. - //let geometry = new THREE.PlaneGeometry(this.canvas2d.width, this.canvas2d.height); - //let plane = new THREE.Mesh(geometry, material); - - // Create also a custom scene for HUD. - //this.scene2d = new THREE.Scene(); - //this.scene2d.add(plane); - - // Create 2D camera - /*this.camera2d = new THREE.OrthographicCamera(0, 0, 0, 0, 0, 30); - this.camera2d.aspect = this.window.width / this.window.height; - this.camera2d.left = -this.window.width / 2; - this.camera2d.right = this.window.width / 2; - this.camera2d.top = this.window.height / 2; - this.camera2d.bottom = -this.window.height / 2; - this.camera2d.updateProjectionMatrix();*/ - } - render(partialTicks) { // Setup camera this.orientCamera(partialTicks); @@ -103,19 +53,6 @@ window.WorldRenderer = class { let cameraChunkZ = Math.floor(player.z >> 4); this.renderChunks(cameraChunkX, cameraChunkZ); - // Reset 2d canvas - this.stack2d.clearRect(0, 0, this.window.width, this.window.height); - - // Render in-game overlay - let mouseX = this.minecraft.window.mouseX; - let mouseY = this.minecraft.window.mouseY; - this.minecraft.ingameOverlay.render(this.stack2d, mouseX, mouseY, partialTicks); - - // Render current screen - if (!(this.minecraft.currentScreen === null)) { - this.minecraft.currentScreen.drawScreen(this.stack2d, mouseX, mouseY, partialTicks); - } - // Render actual scene and hud this.webRenderer.render(this.scene, this.camera); } diff --git a/src/js/net/minecraft/client/render/FontRenderer.js b/src/js/net/minecraft/client/render/gui/FontRenderer.js similarity index 100% rename from src/js/net/minecraft/client/render/FontRenderer.js rename to src/js/net/minecraft/client/render/gui/FontRenderer.js diff --git a/src/js/net/minecraft/client/render/gui/ScreenRenderer.js b/src/js/net/minecraft/client/render/gui/ScreenRenderer.js new file mode 100644 index 0000000..58a7247 --- /dev/null +++ b/src/js/net/minecraft/client/render/gui/ScreenRenderer.js @@ -0,0 +1,36 @@ +window.ScreenRenderer = class { + + constructor(minecraft, window) { + this.minecraft = minecraft; + this.window = window; + } + + initialize() { + // Update camera size + this.window.canvas2d.width = this.window.width; + this.window.canvas2d.height = this.window.height; + + // Get context stack of 2d canvas + this.stack2d = this.window.canvas2d.getContext('2d'); + this.stack2d.webkitImageSmoothingEnabled = false; + this.stack2d.mozImageSmoothingEnabled = false; + this.stack2d.imageSmoothingEnabled = false; + } + + render(partialTicks) { + let mouseX = this.minecraft.window.mouseX; + let mouseY = this.minecraft.window.mouseY; + + // Reset 2d canvas + this.stack2d.clearRect(0, 0, this.window.width, this.window.height); + + // Render in-game overlay + this.minecraft.ingameOverlay.render(this.stack2d, mouseX, mouseY, partialTicks); + + // Render current screen + if (!(this.minecraft.currentScreen === null)) { + this.minecraft.currentScreen.drawScreen(this.stack2d, mouseX, mouseY, partialTicks); + } + } + +} \ No newline at end of file diff --git a/src/start.js b/src/start.js index 5d1d6ee..94ef97c 100644 --- a/src/start.js +++ b/src/start.js @@ -89,7 +89,8 @@ loadScripts([ "src/js/net/minecraft/client/render/isometric/Point.js", "src/js/net/minecraft/client/render/isometric/TextCoord.js", "src/js/net/minecraft/client/render/isometric/Triangle.js", - "src/js/net/minecraft/client/render/FontRenderer.js", + "src/js/net/minecraft/client/render/gui/FontRenderer.js", + "src/js/net/minecraft/client/render/gui/ScreenRenderer.js", "src/js/net/minecraft/client/render/Tessellator.js", "src/js/net/minecraft/client/render/WorldRenderer.js", "src/js/net/minecraft/client/render/BlockRenderer.js"