From 33e982025604ea333183963966eb42ffa32ebd3f Mon Sep 17 00:00:00 2001
From: Matt Karl <matt@mattkarl.com>
Date: Sat, 5 Nov 2022 21:19:02 -0400
Subject: [PATCH] Dynamically set the resolution of Renderer

---
 packages/canvas-renderer/src/CanvasRenderer.ts | 17 ++++++++++++++++-
 packages/core/src/Renderer.ts                  | 17 ++++++++++++++++-
 packages/events/src/EventSystem.ts             |  9 +++++++++
 packages/events/test/EventSystem.tests.ts      | 15 +++++++++++++++
 4 files changed, 56 insertions(+), 2 deletions(-)

diff --git a/packages/canvas-renderer/src/CanvasRenderer.ts b/packages/canvas-renderer/src/CanvasRenderer.ts
index 547028fe9d..78cd9dd536 100644
--- a/packages/canvas-renderer/src/CanvasRenderer.ts
+++ b/packages/canvas-renderer/src/CanvasRenderer.ts
@@ -189,7 +189,17 @@ export class CanvasRenderer extends SystemManager<CanvasRenderer> implements IRe
         options = Object.assign({}, settings.RENDER_OPTIONS, options);
 
         const systemConfig = {
-            runners: ['init', 'destroy', 'contextChange', 'reset', 'update', 'postrender', 'prerender', 'resize'],
+            runners: [
+                'init',
+                'destroy',
+                'contextChange',
+                'resolutionChange',
+                'reset',
+                'update',
+                'postrender',
+                'prerender',
+                'resize'
+            ],
             systems: CanvasRenderer.__systems,
             priority: [
                 'textureGenerator',
@@ -325,6 +335,11 @@ export class CanvasRenderer extends SystemManager<CanvasRenderer> implements IRe
     {
         return this._view.resolution;
     }
+    set resolution(value: number)
+    {
+        this._view.resolution = value;
+        this.runners.resolutionChange.emit(value);
+    }
 
     /** Whether CSS dimensions of canvas view should be resized to screen dimensions automatically. */
     get autoDensity(): boolean
diff --git a/packages/core/src/Renderer.ts b/packages/core/src/Renderer.ts
index 7c7eff466b..621eaa0f51 100644
--- a/packages/core/src/Renderer.ts
+++ b/packages/core/src/Renderer.ts
@@ -326,7 +326,17 @@ export class Renderer extends SystemManager<Renderer> implements IRenderer
         }, true);
 
         const systemConfig = {
-            runners: ['init', 'destroy', 'contextChange', 'reset', 'update', 'postrender', 'prerender', 'resize'],
+            runners: [
+                'init',
+                'destroy',
+                'contextChange',
+                'resolutionChange',
+                'reset',
+                'update',
+                'postrender',
+                'prerender',
+                'resize'
+            ],
             systems: Renderer.__systems,
             priority: [
                 '_view',
@@ -482,6 +492,11 @@ export class Renderer extends SystemManager<Renderer> implements IRenderer
     {
         return this._view.resolution;
     }
+    set resolution(value: number)
+    {
+        this._view.resolution = value;
+        this.runners.resolutionChange.emit(value);
+    }
 
     /** Whether CSS dimensions of canvas view should be resized to screen dimensions automatically. */
     get autoDensity(): boolean
diff --git a/packages/events/src/EventSystem.ts b/packages/events/src/EventSystem.ts
index 3be142b3dc..63fc530743 100644
--- a/packages/events/src/EventSystem.ts
+++ b/packages/events/src/EventSystem.ts
@@ -130,6 +130,15 @@ export class EventSystem
         this.resolution = resolution;
     }
 
+    /**
+     * Handle changing resolution.
+     * @ignore
+     */
+    resolutionChange(resolution: number): void
+    {
+        this.resolution = resolution;
+    }
+
     /** Destroys all event listeners and detaches the renderer. */
     destroy(): void
     {
diff --git a/packages/events/test/EventSystem.tests.ts b/packages/events/test/EventSystem.tests.ts
index 67df38e42b..b2e795f9ff 100644
--- a/packages/events/test/EventSystem.tests.ts
+++ b/packages/events/test/EventSystem.tests.ts
@@ -365,4 +365,19 @@ describe('EventSystem', () =>
             done();
         }, 800);
     });
+
+    it('should inherit resolution changes', () =>
+    {
+        const renderer = createRenderer();
+
+        renderer.resolution = 2;
+
+        expect(renderer.resolution).toEqual(2);
+        expect(renderer.events.resolution).toEqual(2);
+
+        renderer.resolution = 1;
+
+        expect(renderer.resolution).toEqual(1);
+        expect(renderer.events.resolution).toEqual(1);
+    });
 });