Add method to update renderer settings at runtime

index.d.ts

@@ -293,6 +293,25 @@ declare module '@lightningjs/blits' {
     }
   }
 
+  type SettingsKey =
+  // Renderer specific settings keys
+  | "w"
+  | "h"
+  | "gpuMemory"
+  | "viewportMargin"
+  | "pixelRatio"
+  | "renderQuality"
+  | "canvasColor"
+  | "inspector"
+  | "fpsInterval"
+  | "textureProcessingTimeLimit"
+  | "maxFPS"
+  // Blits specific settings keys
+   | "debugLevel";
+
+
+  type SettingsValue<K extends SettingsKey> = Settings[K];
+
   export type ComponentBase = {
     /**
     * Indicates whether the component currently has focus
@@ -391,6 +410,11 @@ declare module '@lightningjs/blits' {
        */
       h: number
     }) => void
+
+    /**
+     * Update the renderer settings
+     */
+    $settings: <K extends SettingsKey>(key: K, value: SettingsValue<K>) => void
   }
 
   /**
@@ -798,6 +822,10 @@ declare module '@lightningjs/blits' {
      * Fonts to be used in the Application
      */
     fonts?: Font[],
+    /**
+     * Effects to be used by DynamicShader
+     */
+    effects?: ShaderEffect[],
     /**
      * Shaders to be used in the application
      */
@@ -930,6 +958,18 @@ declare module '@lightningjs/blits' {
      * Defaults to `0`
      */
     viewportMargin?: number | [number, number, number, number],
+    /**
+     * Threshold in `Megabytes` after which all the textures that are currently not visible
+     * within the configured viewport margin will be be freed and cleaned up
+     *
+     * When passed `0` the threshold is disabled and textures will not be actively freed
+     * and cleaned up
+     *
+     * Defaults to `200` (mb)
+     * @deprecated
+     * Deprecated:  use `gpuMemory` launch setting instead
+     */
+    gpuMemoryLimit?: number,
     /**
      * Configures the gpu memory settings used by the renderer
      */

src/component/base/methods.js

@@ -23,6 +23,20 @@ import { Log } from '../../lib/log.js'
 import { removeGlobalEffects } from '../../lib/reactivity/effect.js'
 import { renderer } from '../../launch.js'
 
+const rendererSettingsKeyMappings = {
+  w: 'appWidth',
+  h: 'appHeight',
+  gpuMemory: 'textureMemory',
+  viewportMargin: 'boundMargin',
+  pixelRatio: 'deviceLogicalPixelRatio',
+  renderQuality: 'devicePhysicalPixelRatio',
+  canvasColor: 'clearColor',
+  inspector: 'inspector',
+  fpsInterval: 'fpsUpdateInterval',
+  textureProcessingTimeLimit: 'textureProcessingTimeLimit',
+  maxFPS: 'targetFps',
+}
+
 export default {
   $focus: {
     /**
@@ -185,6 +199,27 @@ export default {
     enumerable: true,
     configurable: false,
   },
+  $settings: {
+    /**
+     * @this {import('../../component').BlitsComponent}
+     */
+    value: function (key, value) {
+      //TODO: Additional eligible blits related settings update goes here
+      if (key === 'debugLevel') {
+        // set app log level
+        this.$log.level = value
+
+        // set blits log level
+        Log.level = value
+        return
+      }
+      // Renderer related settings update
+      renderer.setOptions({ [rendererSettingsKeyMappings[key]]: value })
+    },
+    writable: false,
+    enumerable: true,
+    configurable: false,
+  },
 }
 
 /**

src/lib/log.js

@@ -38,13 +38,13 @@ const time = () => {
  * @returns {Object} Logger object with info, warn, debug, and error methods.
  */
 const logger = (context) => {
-  const level = Settings.get('debugLevel')
   const log = {}
+  log.level = Settings.get('debugLevel')
 
   Object.defineProperty(log, 'info', {
     get() {
       return (
-        ((level >= 1 || (Array.isArray(level) && level.indexOf('info') > -1)) &&
+        ((log.level >= 1 || (Array.isArray(log.level) && log.level.indexOf('info') > -1)) &&
           console.info.bind(
             window.console,
             `%c ⚡️ ${context} %c ${time()}`,
@@ -59,7 +59,7 @@ const logger = (context) => {
   Object.defineProperty(log, 'warn', {
     get() {
       return (
-        ((level >= 1 || (Array.isArray(level) && level.indexOf('warn') > -1)) &&
+        ((log.level >= 1 || (Array.isArray(log.level) && log.level.indexOf('warn') > -1)) &&
           console.warn.bind(
             window.console,
             `%c ⚡️ ${context} %c ${time()}`,
@@ -74,7 +74,7 @@ const logger = (context) => {
   Object.defineProperty(log, 'error', {
     get() {
       return (
-        ((level >= 1 || (Array.isArray(level) && level.indexOf('error') > -1)) &&
+        ((log.level >= 1 || (Array.isArray(log.level) && log.level.indexOf('error') > -1)) &&
           console.error.bind(
             window.console,
             `%c ⚡️ ${context} %c ${time()}`,
@@ -89,7 +89,7 @@ const logger = (context) => {
   Object.defineProperty(log, 'debug', {
     get() {
       return (
-        ((level >= 2 || (Array.isArray(level) && level.indexOf('debug') > -1)) &&
+        ((log.level >= 2 || (Array.isArray(log.level) && log.level.indexOf('debug') > -1)) &&
           console.debug.bind(
             window.console,
             `%c ⚡️ ${context} %c (${new Date().toLocaleTimeString([], {